Description
As a platform member with console access, I want to search and filter the Team Members list, so I can quickly find specific users or narrow down by role, organization, or scope.
Acceptance criteria
- There is a search bar that filters by user name and email.
- There are three filters: Organization, Role, and Scope.
- Organization: dropdown with a search bar, checkbox list, selected items pin to top, shows X of Y count. Loads up to 10 elements from the backend. If the results shown are fewer than the total, a "Search to show more" label is displayed.
- Role: dropdown with checkbox list, results grouped by global, course, and library. Shows all current available roles. No search bar. Supports multi-select.
- Scope: the dropdown loads 5 courses and 5 libraries from the backend. The frontend organizes results by courses and libraries. If there are no results under a category, that category is not shown. If the results shown are fewer than the total, a "Search to show more" label is displayed.
- Active filters change color and show a count badge with the number of selected options.
- Applied filters appear as tags below the filter row, up to a maximum of 10.
- A "clear all filters" button is available. Each tag has an X to remove it individually.
- When the user reaches the 10-filter limit, an alert appears below the filter tags explaining that the limit has been reached and that a filter must be removed before adding a new one.
- Columns that are being filtered show an icon in their header.
Test cases
Setup
- The platform has at least 11 organizations.
- Organization 1 has 2 courses and 1 library.
- Organization 2 has 1 course.
- User A has a Course Staff role in Course 1 (Organization 1) and a Library Author role in Library 1 (Organization 1).
- User B has a Course Admin role in Course 2 (Organization 1).
- User C has a Course Staff role in Course 1 (Organization 2).
- User D is Super Admin.
Scenarios
-
Search by name filters the table
Given: I type a name in the search bar
Then: the table updates to show only users matching that name
-
Search by email filters the table
Given: I type an email in the search bar
Then: the table updates to show only users matching that email
-
Organization filter loads up to 10 elements with search
Given: I open the Organization filter dropdown
Then: I see up to 10 organizations
And: there is a search bar to find more
When: I select an organization
Then: it pins to the top of the list
And: the filter badge shows a count of 1
And: a tag appears below the filter row
-
Role filter shows all roles grouped by type, no search bar
Given: I open the Role filter dropdown
Then: I see all available roles grouped by global, course, and library
And: there is no search bar
When: I select multiple roles
Then: the filter badge shows the count of selected roles
And: a tag appears per selected role below the filter row
-
Scope filter shows 5 courses and 5 libraries
Given: I open the Scope filter dropdown
Then: I see up to 5 courses and up to 5 libraries
And: results are organized by courses and libraries
And: categories with no results are not shown
When: I select a scope
Then: a tag appears below the filter row
-
Filtered columns show an icon in the header
Given: I have applied a filter on Organization
Then: the Organization column header shows a filter icon
-
Reaching the 10-filter limit shows an alert
Given: I have 10 filters applied
When: I try to add an eleventh filter
Then: an alert appears below the filter tags explaining the limit
And: I cannot add more filters until I remove one
-
Removing a tag removes that filter
Given: I have filters applied
When: I click the X on a filter tag
Then: that filter is removed
And: the table updates accordingly
-
Clear all removes all filters
Given: I have multiple filters applied
When: I click "clear all filters"
Then: all filters are removed
And: the table returns to its unfiltered state
Design
https://www.figma.com/design/onU2END2OXaF7RRLWEHsZI/AuthZ---v2?node-id=7639-23287&t=FLJ7Zz9Qhu9MtJVZ-4
Description
As a platform member with console access, I want to search and filter the Team Members list, so I can quickly find specific users or narrow down by role, organization, or scope.
Acceptance criteria
Test cases
Setup
Scenarios
Search by name filters the table
Given: I type a name in the search bar
Then: the table updates to show only users matching that name
Search by email filters the table
Given: I type an email in the search bar
Then: the table updates to show only users matching that email
Organization filter loads up to 10 elements with search
Given: I open the Organization filter dropdown
Then: I see up to 10 organizations
And: there is a search bar to find more
When: I select an organization
Then: it pins to the top of the list
And: the filter badge shows a count of 1
And: a tag appears below the filter row
Role filter shows all roles grouped by type, no search bar
Given: I open the Role filter dropdown
Then: I see all available roles grouped by global, course, and library
And: there is no search bar
When: I select multiple roles
Then: the filter badge shows the count of selected roles
And: a tag appears per selected role below the filter row
Scope filter shows 5 courses and 5 libraries
Given: I open the Scope filter dropdown
Then: I see up to 5 courses and up to 5 libraries
And: results are organized by courses and libraries
And: categories with no results are not shown
When: I select a scope
Then: a tag appears below the filter row
Filtered columns show an icon in the header
Given: I have applied a filter on Organization
Then: the Organization column header shows a filter icon
Reaching the 10-filter limit shows an alert
Given: I have 10 filters applied
When: I try to add an eleventh filter
Then: an alert appears below the filter tags explaining the limit
And: I cannot add more filters until I remove one
Removing a tag removes that filter
Given: I have filters applied
When: I click the X on a filter tag
Then: that filter is removed
And: the table updates accordingly
Clear all removes all filters
Given: I have multiple filters applied
When: I click "clear all filters"
Then: all filters are removed
And: the table returns to its unfiltered state
Design
https://www.figma.com/design/onU2END2OXaF7RRLWEHsZI/AuthZ---v2?node-id=7639-23287&t=FLJ7Zz9Qhu9MtJVZ-4