Refactor user list and user management pages

[sainak]

Note

Create wireframes for the new user list and details page before asking for the issue to be assigned

Current user list page:

Required changes:

• Extract user cards as a separate component

• Clicking the user card should bring up the user detail page

• Move the action buttons like delete, manage linked facilities/skills, set working hours to the user detail page

• Add user avatars to user cards, similar to user card from personal details page of the logged-in user
  

• Fix the alignment of the search bar and action buttons in desktop mode

New User detail page:

TODO: add wireframes

Required changes:

• Convert linked facility/skills management to a dropdown within the details page
  

[Rishith25]

@sainak Can I work on this?

[sainak]

Create wireframes for the new user list and details page before asking for the issue to be assigned

[Jacobjeevan]

@sainak I was thinking something like this 🤔

With the cards being clickable, but we should probably add a "view user" button similar to what we have for facilities.

[sainak]

@Jacobjeevan that looks good
some suggestions:

• we should move delete inside the details page as well, it should not be a quick action
• the online indicator after the name looks redundant
• the details page is missing username chip
• share sketches for list view in mobile as well

[Jacobjeevan]

@sainak I was thinking of using clickable pills for the facilities and skills, though it might not look good when there are lot of linked facilities, like with district admin.

Multi-select for the dropdowns

Clicking on the pill would trigger a popup with manage options; open additional dialog only when replacing existing home facility, like what we have now.

[vinutv]

@Jacobjeevan Here is the design for the users page and user details page. Let me know your thoughts.
https://www.figma.com/design/Z93EYKSa1MdBmXndsMBJSQ/Care?node-id=1285-2299
cc @bodhish