Display multiple roles in drawer pattern

Problem

In #426964 (closed), we updated the members list to display only one entry for each member, and display additional sources in the source column in case they had been added multiple times. This issue focuses on enhancing this view, simplifying the row representation for each member, displaying the max role in the list view, and adding all roles to the right-hand drawer to display additional roles for each each member.

UX Designs

Figma file

UX Designs	Design
Member row In member page, show one entry per member and replace "Max Role" heading with "Role", member details include: Account = with relevant badges Source = membership typed determining user's role in the group/project Role = user's role in group/project Activity = List out Additional: Remove three dot menu Row highlights on hover to indicate it's selectable
Admin view Clicking on member row brings up member detail drawer and includes the following: Actions to "Follow" and "More Actions" More actions will show dropdown to "Ban Member" and "Remove member" Date form input field for access expiration moves to drawer Role source that determines user's role is placed below role dropdown Keep description and permissions closely related to role Add in "Additional Membership" to list out other sources Added an information icon to contain tooltip to explain additional membership implication, @mnichols1 do you think our users will benefit from this?	#444213[Admin_View_-_Direct.png]
Admin View for Indirect/Inherited members For members who have indirect or inherited memberships: Access expiration and role dropdown is disabled and locked for updates Popover with more information on how to make changes displays source group.
Non admin view Actions limited to "Follow" All other information is read-only	#444213[Non_Admin_View.png]

Cleaning up the list and adding a drawer pattern has a number of benefits, but would also give us the space to list out sources. More benefits and exploration here in Figma.

To Do

• Define how members that were added multiple times will be displayed using the drawer. How would multiple roles be displayed there? What UI changes are necessary?
• Add source to drawer view
• Define how private groups should be displayed as part of the drawer
• Create follow-up issues for additional elements that should be migrated from the list to the drawer view

This page may contain information related to upcoming products, features and functionality. It is important to note that the information presented is for informational purposes only, so please do not rely on the information for purchasing or planning purposes. Just like with all projects, the items mentioned on the page are subject to change or delay, and the development, release, and timing of any products, features, or functionality remain at the sole discretion of GitLab Inc.