Fightpandemics: Header: Update Profile to be logged in user (Individual or Organization)

[emtay]

As a user who has both an individual and an organization profile, I want to clearly know when I'm acting as myself or as an organization.

In header, the "Profile" link should be the Individual's name when the individual user is selected.

https://www.figma.com/file/4cV84H1jyMo0rJEAl3HNnJ/FightPandemics-landing-page?node-id=17466%3A91934

In header, the "Profile" link should be the organization's name when the user has selected the organization profile.

(I don't have an organization, but it would show up here if I did)

AC:
Given user only has individual profile,
When user is logged in
Then user's name should display in the upper right with down arrow to indicate they can modify their profile from this drop down.

Given user has an individual profile and an organization profile,
When user is logged in and has chosen individual profile
Then user's name should display in the upper right with down arrow to indicate they can modify their profile from this drop down.

Given user has an individual profile and an organization profile,
When user is logged in and has chosen organization profile
Then the organization's name should display in the upper right with down arrow to indicate they can modify their profile from this drop down.

[emtay]

@manualzuru @doheekim93 @tejasm2 i think this came up in one of our meetings. agree it is P1?

anyone have a screenshot of having an organization?

@dhruvdpatel @CamilaArias FYI

[doheekim93]

@emtay do we have the backend setup to handle likes and comments (and other tasks) done by organisations?

[manualzuru]

@emtay Yes, this is P1 and yes, the backend should allow to behave as an organization. Right @Naraujo13 @joaofnds?

[Naraujo13]

@manualzuru the data model treats org as another user and so does the backend I think, so I think it is covered up.
I think @joshmorel can confirm if this is the current state

[joshmorel]

This is why I created #1470

It would be like post as org but we'd need to handle it on every case with organisationId param. A plugin/middleware/decorator should be created to address this

To be more specific a user can only authenticate as themself via Auth0 jwt which can be used in any needed "individual user" situation. But they could be authorized to act for an organisation as an owner (or later some multi admin scenario). We just need to handle that in a consistent way that also avoids code duplication.

[emtay]

@joshmorel is 1470 required for this or an enhancement that can be done any time after this? anything else needed before this ticket can be played?

also, is this required for organizations to be able to send and receive messages?

[joshmorel]

@emtay this work can start in parallel.

What I would suggest for FE - we already have array of organizations user owns. We can keep track of the org they are acting as through a new state variable I guess.

Then pass organisationId to BE (as param or prop). The BE middleware or decorator I'm thinking of will confirm logged in users is authorized to act as the org then perform the action as the org.

[shalinidc]

@joshmorel @emtay : Tejas asked me to look into this and I am looking into the FE part of this. @joshmorel you are right, we already have an array of orgs the user owns. I can use the path to get the current organization and display the right organization name in the header. This is my first task, am I overlooking something here or will this fix work? Below is the snippet:

` let url = window.location.pathname.split("/");

if (user && url.length === 3 && url[1] === 'organisation') {
    const organisationId = url[url.length - 1];
    user.organisations.forEach((organisation) => {
        if (organisation._id === organisationId) {
            profileTitle = organisation.name;
        }
    });
}`

[joshmorel]

Hi @shalinidc the idea with this toggle is that it could be done from any path. So for example I could be on https://fightpandemics/feed and switch to an org, then when I, for example like a post, I am acting as that org instead of myself.

Does this sound right @davidoduk @emtay @tejasm2?

Anyways @shalinidc I'm still figuring out the backend but I'm pretty sure any applicable route where one might act as an organisation would take an optional organisationId argument (either query param or body property) and:

• If present it indicates the user wants to act as that organisation
• When it's absent it indicates the user wants to act as them self (the individual id is stored in the JWT token so nothing would be required)

Since this might apply to a lot of our routes and I'm also thinking of other ideas (including storing in cookie) BUT in any case the frontend approach will be mostly similar I think:

1. We are tracking the user here which includes the organisations array: https://github.com/FightPandemics/FightPandemics/blob/staging/client/src/reducers/sessionReducer.js.
2. The best I think would be to track the actual index to the organisation array let's say organisationIndex, null by default (initiateState).
3. We will have a redux action, something like SET_ORGANISATION_INDEX that will be dispatched when the user selects one of their organisations from the list with the index as the payload.
4. If they select their own user name then SET_ORGANISATION_INDEX will be dispatched with null as the payload
5. The display name will be from the user object, but the display would be based on organisatinIndex. So something like organisationIndex === null ?${user.firstName} ${user.lastName}: user.organisations[organisationIndex].name.
6. We'd also update the "Profile" link, e.g. organisationIndex === null ? user.id: user.organisations[organisationIndex]._id.

So if this sounds like something you want to take on assign yourself. If you can get all that working then we can put it together with the backend routes once I've figured out my part.

[joshmorel]

Wanted to confirm something else @tejasm2 , @emtay or @davidoduk about this feature.

Now we should edit/delete menu for any post created by yourself or an org you own. For future state will it only only show the menu for the selected user?

And if you're curious what will be easier - on the FE keeping everything specific to the selected user would be easier with the proposed toggle in header design. The backend can then check if the authenticated user is authorized.

[davidoduk]

Hey @joshmorel, to clarify, this is the easier scenario?
-User will only see a menu for the posts they are logged in as i.e. if logged in as "Josh", the will not see a menu for posts by "Josh's org"

[joshmorel]

User will only see a menu for the posts they are logged in as i.e. if logged in as "Josh", the will not see a menu for posts by "Josh's org"

@davidoduk Yes if we keep it consist across the features that only the "selected user" is shown options such as these it would be easier I believe. Not just here - but we'll also need to address showing Edit button or not in comment etc.

[davidoduk]

Agreed, that looks like the best way to implement this from a UX perspective as well

[emtay]

@davidoduk @joshmorel user should only edit or delete what is based on that profile- Indiv or org. If indiv, I can only edit or delete posts I made as an indiv.

If org, I can only edit or delete posts made by that org.

If user has more than one org, they have to be acting as same org that created post to edit or delete.

I think that’s what you have above but wanted to confirm