Summary
Create two main pages within the ui-staff user management section:
- Staff Users page
- Staff Roles page
Use the VerticalTabs component for the rendering the navigation for these pages within the /staff/user-management/ route section.
Staff Users Page
- Renders as a vertical tab in the user management section, similar to member management in ui-community.
- Paginated table listing all staff users in the system.
- Columns: Display Name, Email, Role, CreatedAt, Edit button.
- Edit button opens a staff user details page.
- Details page is read-only (data from JWT token, cannot be edited).
- Dropdown for assigned staff user's role (default: current role), editable only for users with
canAssignStaffUserRoles permission.
Staff Roles Page
- Paginated table of staff roles.
- Columns: Role Name, enterpriseAppRole, CreatedAt, UpdatedAt, Edit button.
- Button above table: "Create Staff Role" (right side).
- Navigates to create staff role page.
- Staff Role Creation page:
- Input for roleName, enterpriseAppRole.
- Permission fields displayed as checkboxes (true/false for each).
Expectations
- Pages are rendered as vertical tabs in user management.
- All tables paginated.
- Actions (edit/create) show expected forms and controls.
- Storybook files must be included for all UI pages/components built.
Implementation References
- For vertical tabs structure, see member management in ui-community for an example.
Acceptance Criteria
- UI matches described structure and layout
- All main features (tables, edit, create, dropdowns, checkboxes) work as specified
- Storybook files provided for review
Note: Backend functionality for staff user queries and mutations, and staff role queries and mutations need to be implemented as part of this effort, and then the frontend will wire into the new graphql API to fully implement the expected functionality.
If there are any questions, refer to the ui-community member management implementation as a baseline for expected implementation structure.
Summary
Create two main pages within the ui-staff user management section:
Use the
VerticalTabscomponent for the rendering the navigation for these pages within the/staff/user-management/route section.Staff Users Page
canAssignStaffUserRolespermission.Staff Roles Page
Expectations
Implementation References
Acceptance Criteria
Note: Backend functionality for staff user queries and mutations, and staff role queries and mutations need to be implemented as part of this effort, and then the frontend will wire into the new graphql API to fully implement the expected functionality.
If there are any questions, refer to the ui-community member management implementation as a baseline for expected implementation structure.