feat(ui): admin console UX rework — foundation + worst screens#26
Open
bodaay wants to merge 1 commit into
Open
feat(ui): admin console UX rework — foundation + worst screens#26bodaay wants to merge 1 commit into
bodaay wants to merge 1 commit into
Conversation
Reworks the EXISTING admin console (no new pages yet — those come next) to fix the
structural issues a code+visual UX review surfaced, verified screen-by-screen in a
headless browser.
Foundation (benefits every screen):
- Accessible Modal: role/aria-modal, Escape-to-close, Tab focus-trap, focus
restore, autofocus the first field. Every dialog inherits it.
- Hardened api(): a mid-session 401 clears the key and bounces to login via a
global event instead of spraying red toasts; non-JSON (proxy 502) responses
surface a friendly message instead of a JSON parse crash.
- Reusable ConfirmModal + a useResource() hook for consistent loading/error.
Shell:
- Hash routing — refresh-safe, deep-linkable, Back/Forward work (was plain
useState, so refresh / idle-logout / 401 always dumped you on Dashboard).
- Sidebar nav grouped into Access / Directory / System sections.
- Theme toggle shows the CURRENT theme; theme applied before first paint (no FOUC).
Screens reworked:
- AppAuthzEditor (the marquee fix): replaced the raw role_permissions JSON
textarea + free-text roles with a structured editor — each role is a card with
permission chips (datalist of known perms); assignments pick from DEFINED roles
only (valid by construction); removing a role strips it from assignments;
dirty-guard prevents accidental discard.
- Apps: rotate-secret, delete, and ENABLING require_assignment now go through
ConfirmModal with blast-radius warnings; busy states + success toasts so toggles
aren't silent; loading/error/empty states.
- Users: wired the dead-end actions the backend already supported — Edit Profile
(PUT /users/{guid}), Unlock + a "Locked" status badge (PUT /unlock), richer
status, and loading/error states.
- style.css: defined --muted / --burgundy / --border, which app.js referenced
~30x but were never defined (latent bug — previously fell back to inherited
colors).
Deferred to a follow-up: user merge/unmerge (needs a multi-select), DB
backup/restore controls, and the new per-app-admins + app-local-users panels.
UI-only (ui/dist/*); no Go/API changes. go build / go vet clean.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Admin console UX rework (phase 1)
Reworks the existing admin console to fix the structural issues a code+visual UX review surfaced (78 findings; this PR tackles the foundation + the worst screens). No new pages — those are a deliberate follow-up. Every change was verified screen-by-screen by driving the live console in a headless browser.
Foundation (every screen benefits)
Modal—role="dialog"/aria-modal, Escape-to-close, Tab focus-trap, focus restore on close, autofocus first field. All dialogs inherit it.api()— a mid-session 401 clears the key and bounces to login (global event) instead of spraying red toasts; non-JSON (proxy 502/HTML) responses surface a friendly message instead of a JSON parse crash.ConfirmModal+ auseResource()hook (consistent loading/error).Shell
useState, so refresh/idle-logout/401 always dumped you on Dashboard).Screens
AppAuthzEditor(marquee fix) — the rawrole_permissionsJSON textarea + free-text roles → a structured editor: each role is a card with permission chips (datalist of known perms); assignments pick from defined roles only (valid by construction); removing a role strips it from assignments; dirty-guard on close.rotate-secret, delete, and enablingrequire_assignmentnow go throughConfirmModalwith blast-radius warnings; busy states + success toasts (no more silent toggles); loading/error/empty states.PUT /users/{guid}), Unlock + a "Locked" status badge (PUT /unlock), richer status, loading/error states.--muted/--burgundy/--border, referenced ~30× byapp.jsbut never defined (latent bug; previously inherited).Verified (headless-browser screenshots)
Structured Authz editor, rotate-secret confirm with warning, grouped nav + theme label, Users detail + Edit Profile modal, Roles/Dashboard unregressed.
Deferred (follow-up)
User merge/unmerge (needs multi-select), DB backup/restore controls, and the new per-app-admins + app-local-users panels.
UI-only (
ui/dist/*) — no Go/API changes;go build/go vetclean.🤖 Generated with Claude Code