Refactor: User Profile Page to Match Figma (Admin and User Portal)

[palisadoes]

This will require someone with extensive proven expertise in the code base of this repo

Problem Definition

Is your feature request related to a problem? Please describe.

1. The User profile page for Administrators and Users:
   1. is completely different
   2. does not match the Figma design
      • https://docs.talawa.io/docs/design/ux-design-system#talawa-admin---figma-designs
2. The profile links on the Admin portal "People" page don't work correctly

Describe the solution you'd like

1. Refactor the user profile code to:
   1. match that of the Figma design
      1. https://docs.talawa.io/docs/design/ux-design-system#talawa-admin---figma-designs
      2. Propose an intuitive way to handle someone editing their profile:
         1. On the organizations screen,
         2. While visiting an organization
   2. exclusively use shared components and appropriate props for both the Admin and User portal. When in doubt, follow the guidance here:
      • https://docs-admin.talawa.io/docs/developer-resources/reusable-components
2. Update the test suite to achieve 100% code coverage for your patch.
3. Ensure all tests submitted are functional and valid
4. Fix the profile links and write tests to ensure this feature doesn't break.

Be aware of these related issues:

1. Refactor all search bars into reusable components #4674
2. Refactor: Select Organization Screen #4673
3. Refactor all reporting tables into modular components #4676
4. Refactor The Left Navigation Bar to Reusable Components #4735
5. Refactor: User Profile Page to Match Figma (Admin and User Portal) #4637

Layouts

This section defines the differences in the layouts

Figma Layouts

1. Default page view. (First Tab)

   

2. Organizations tab of profile

   

3. Events tab of profile

   

4. Tags tab of profile (ONLY ADMINISTRATORS MUST SEE THIS)

   

Existing Layouts

1. Existing Admin Portal Profile Page

   

2. Existing User Portal Profile Page

   

Other

Potential internship candidates

Please read this if you are planning to apply for a Palisadoes Foundation internship

• Student Internship Programs talawa#359

[jhaayushkumar]

@palisadoes please assign me i want approx 4-5 days to solve it.