-
Notifications
You must be signed in to change notification settings - Fork 0
Labels
frontendthis ticket is part of the frontendthis ticket is part of the frontend
Milestone
Description
Create the account management settings page UI following the provided design. This includes the admin settings page shell with sidebar navigation, the manage staff table, edit mode for member types, and the "+ New User" button. Here are some resources:
Notes:
- Reuse existing layout, navigation, and table components where possible
- Follow existing styling patterns and design tokens (purple accent for active sidebar items, consistent fonts and spacing)
- Ensure responsive layout for mobile and desktop
- The sidebar should highlight the currently active section ("Manage Staff")
- Use placeholder/mock data for the staff table rows
- No API integration in this ticket
- Include a description of the ticket and the implementation in the PR (with screenshots showing default view, edit mode, and new user flow!)
The goal is to:
- Create the Admin Settings page shell with sidebar navigation ("Account Information" and "Manage Staff") and main content area
- Add a "Back to dashboard" button at the bottom of the sidebar linking back to the main dashboard
- Set up routing so each sidebar item renders its respective content panel
- Create the Manage Staff table with columns: Name, Email, Password, and Member Type
- Display the "Member Type" column as a dropdown selector showing the current role (e.g., "Admin")
- Add a "+ New User" button in the top-right corner above the table
- Add an "Edit member type" button that enables edit mode for the table
In edit mode, make the "Member Type" dropdown selectable/editable for each staff row - Display "Cancel" and "Save" buttons at the bottom-right in edit mode
- Include input fields for Name, Email, Password, and Member Type for new users, with validation
- Add a delete/remove action for each staff row
- Show a confirmation dialog before deleting a user
Reactions are currently unavailable
Sub-issues
Metadata
Metadata
Assignees
Labels
frontendthis ticket is part of the frontendthis ticket is part of the frontend