Manage Profile Page - "Editable" view AND "true read only" view

[therealslimhsiehdy]

Issue description

Right now we have a Member page, but it doesn't allow you to edit or view more information on those members. Our goal is to fix that. With this ticket, we want to be able to go from the Member table and see a view that displays individual specific Member Information. Because we have some admins that will have View Only access and some that will have Member Management Access, we want to make sure that we support both a read only view and an editable view. There is a lot of functionality that we want on this page, so we're starting with the main pieces of displaying text and layout changes with some functionality reserved for later tickets.

Acceptance criteria

• Here is the Figma link for read only
• Here is the Figma link for editable view
• Clicking "gear icon Manage" on the Member Page will open to the Member Profile view
• Add the new Editable AND Read-Only Views for Member Profile with the exception of the buttons. The buttons DO NOT need to be operational but should be present (the 3 dots, edit, manage - and the buttons are hidden in view only mode as well)
• If user has View Only access, then the Ready Only View shows. Vice versa, if the user has Member Management access, then the Manage/Editable View shows and they should have the ability to edit things
• Supports display for INVITED users and EXISTING users
• Follow the Figma's annotations 1 - 10 with the exception of # 3 (vertical 3 dots/dropdown menu/ellipses vertical icon/kebab) as that is covered in a different ticket already Org Member Page - Three dots/ellipsis Buttons #2764
• In PortfolioInvitation rename portfolio_additional_permissions and portfolio_roles to be additional_permissions and roles respectively. (This should now match UserPortfolioPermissions)
• Where possible, any html or other files that is checking roles or additional_permissions in both PortfolioInvitation & UserPortfolioPermission should be refactored to remove an redundancy.

Additional context

Note: The edit view shows the example of a Existing User, and the Read Only View shows an example of a Invited User

Links to other issues

• Follow on for "More Options > Remove member" and blocks Org Member Page - Three dots/ellipsis Buttons #2764 ticket
• Follow on for "Edit" symbol functionality and blocks Member Profile page: Edit Member Access and Permissions #2765 ticket
• Blocks Org Member Page - Domain Assignment Page #2767
• Blocked by Member Management Page (part 1) #2725