Filtered permissions data comp

[jng34]

Fixes #1752

What changes did you make and why did you make them ?

• Created "User Permission Search" page to replace "User Management" page
• Created new permission search feature allowing users to search for Admins or Project Leads
• Created two new slugs /users/permission-search/admin and /users/permission-search/projects corresponding to each search tab
• By default, Admins will be filtered alphabetically by first name and Project Leads will be filtered alphabetically by Project name and by then first name
• WHY: As per the overview in Create the "User Permission Search" screen #1752, there is no way for admins to see a list of other admins on the VRMS app, or a list of users with Project Managment (PM) access to specific projects.

Screenshots of Proposed Changes Of The Website

Visuals before changes are applied

Visuals after changes are applied

[github-actions]

Want to review this pull request? Take a look at this documentation for a step by step guide!

From your project repository, check out a new branch and test the changes.

git checkout -b jng34-filteredPermissionsDataComp development
git pull https://github.com/jng34/VRMS.git filteredPermissionsDataComp

[vorleakyek]

@jng34, the functionality of the "User Permission Search" page seems fine. The overall code looks good as well. I just added a few comments.

[vorleakyek]

From my understanding, there shouldn't be any changes to the "UserAdmin.jsx" file. Refer to the mockup Low-fi mockups created by Bonnie / Jack - see page 1.

So, the "UserPermissionSearch" component should render when clicking on the "User Permission Search" button on the "Users" page.

But, it looks like we do need the useState hooks and functions in the UserAdmin page (or a similar structure) to handle the User Permission Search. Not sure if creating a new page with the same code structure would be a good approach. But, that code is probably needed to handle the filter and make each data element renders a link to the associated user profile, which is part of #1754.

[jng34]

Forgot to change it back to UserManagement when testing the code earlier, so thank you for catching that.

I left the props users and setUserToEdit in the UserPermissionSearch component as placeholders for now so they can be used for integration with the filter permissions data component (#1754).

If there should be changes in the props that are appropriate for the filter component, just let me know.

[vorleakyek]

@trillium, can you confirm that the accessLevel in the dummy data object should be "admin" or "projectLead"?

const user = {
     _id: 1,
     name: {
         firstName: "John",
         lastName: "Doe"
     },
     accessLevel: "projectLead", // or "admin"
     email: "[email protected]",
     projects: ["Home Unite Us, VRMS"] 
}

From the user.model.js, the value "projectLead" is not in the enum.

accessLevel: { 
    type: String, 
    enum: ["user", "admin", "superadmin"], // restricts values to "user", "admin" and "superadmin"
    default: "user" 
  },

It looks like we have this roleOnProject property under the ProjectTeamMemberSchema.

const projectTeamMemberSchema = mongoose.Schema({
    userId: { type: String },                       // id of the user
    projectId: { type: String },                    // id of the project
    teamMemberStatus: { type: String },             // Active or Inactive
    vrmsProjectAdmin: { type: Boolean },            // does this team member have admin rights to the project in VRMS?
    roleOnProject: { type: String },                // Developer, Project Manager, UX, Data Science
...}) 

cc: @jng34, @JackHaeg

[JackHaeg]

Per @trillium recommend leaving values discussed above as-is, and making necessary adjustments in: #1801

[vorleakyek]

@trillium, can you confirm this is okay, or should this PR include the changes in #1798?
It should link to "/users". But, for the purpose of testing without the changes in the other PR, it uses "/users/permission-search" instead.

cc: @JackHaeg, @jng34