US: Filter and sort team members

[MaferMazu]

As a Library Member, I want to filter and sort the team list, so that I can quickly find specific users.

Figma: https://www.figma.com/design/q3Knq0BKoVTBbtaxb81n9R/RBAC---Console---Wireframes?node-id=2750-10589&t=71PeX22gyABqxnHu-4
https://www.figma.com/design/q3Knq0BKoVTBbtaxb81n9R/RBAC---Console---Wireframes?node-id=2888-7209&t=71PeX22gyABqxnHu-4

Acceptance criteria

• Placement
  Controls appear above the table in the Team Members tab.

• Filters
  Text filter for Name or Email.
  Role filter is a Multi Select dropdown that shows role name and the number of users for each role.

• Sorting
  Sort by Name.
  Sort by Date added.
  Sorting works together with filters.

• Behavior
  Filtering and sorting are server side.
  A Clear filters control resets the table view.

Notes, out of scope for this card

• API and error views are defined in a separate card. 401 and 403 use the same auth error view. 404 and general server errors use a not found or generic error view with a Retry.

[dcoa]

@gviedma-aulasneo just a small question here, I was reviewing the behavior of the filter here

As a multiselect, if more than 1 option is selected, how should be displayed the selected options?

At least for now, I would like to use the default Paragon behavior if that is okay https://paragon-openedx.netlify.app/components/datatable/tablefilters/#textfilter-multiselectdropdownfilter-checkboxfilter

[gviedma-aulasneo]

@dcoa sounds ok

[dcoa]

@gviedma-aulasneo I was validating the sorting as well, the alphabetic order is okay, but I double check with the backend team and they say that information about the creation date is not saved by the moment, it is okay for the MVP scope manage only the sorting by Name?

[gviedma-aulasneo]

@MaferMazu

Test Cases

Setup

• I am a member of the target library and can open Libraries → Library Team Management → Team Members.
• The team list includes enough members to exercise filtering and sorting, for example multiple distinct names, emails, roles, and a range of Date added.

Scenarios

• 1) Controls are visible above the table
  Given: I am on the Team Members tab
  When: the page renders
  Then: I see a Text filter for Name or Email, a Role filter multi select, and a Clear filters control above the table

• 2) Text filter by Name narrows the results
  Given: I am on the Team Members tab with the full list visible
  When: I type a partial Name in the Text filter
  Then: the table updates server side to show only members whose Name matches the text

• 3) Text filter by Email narrows the results
  Given: I am on the Team Members tab with the full list visible
  When: I type a partial Email in the Text filter
  Then: the table updates server side to show only members whose Email matches the text

• 4) Role filter with a single role shows only members on that role
  Given: I am on the Team Members tab
  When: I open the Role filter and select one role
  Then: the table updates server side to show only members who have that role

• 5) Role filter with multiple roles expands the result set
  Given: I have the Role filter open
  When: I select additional roles
  Then: the table updates server side to show members who have any of the selected roles

• 6) Combine Text filter and Role filter
  Given: I have selected one or more roles in the Role filter
  When: I type in the Text filter
  Then: the table updates server side to show only members that match the text and also match the selected roles

• 7) Sort by Name works and respects current filters
  Given: I have one or more filters applied
  When: I sort by Name ascending
  Then: the table updates server side and the ordering changes by Name
  And: when I switch to descending
  Then: the ordering flips and the filters remain applied

• 8) Sort by Date added works and respects current filters
  Given: I have one or more filters applied
  When: I sort by Date added ascending
  Then: the table updates server side and the ordering changes by Date added
  And: when I switch to descending
  Then: the ordering flips and the filters remain applied

• 9) Clear filters resets the table view
  Given: I have a Text filter and one or more roles selected, and a sort applied
  When: I click Clear filters
  Then: the Text filter is cleared, the Role filter selections are cleared, the table updates server side, and I see the default unfiltered view

• 10) Role filter shows role names and user counts
  Given: I am on the Team Members tab
  When: I open the Role filter multi select dropdown
  Then: each option shows the role name and the number of users on that role

[gviedma-aulasneo]

@gviedma-aulasneo I was validating the sorting as well, the alphabetic order is okay, but I double check with the backend team and they say that information about the creation date is not saved by the moment, it is okay for the MVP scope manage only the sorting by Name?

Yes, let me update based on that

[dcoa]

Evidence

2025-10-14.12-57-55.mp4

@gviedma-aulasneo @jmakowski1123