Wire orphan routes into hub tabs, group Radio into primary/tools rows, show theme/language once on desktop, and remove duplicate page titles under AdminHubChrome. Co-authored-by: Cursor <[email protected]>
3.6 KiB
Admin UX Cleanup Phase 1 — Implementation Plan
For agentic workers: Execute task-by-task. Steps use checkbox (
- [ ]) syntax for tracking.
Goal: Remove double hub headers, wire orphan routes into tabs, dedupe theme/language controls, group Radio tabs, and differentiate Access vs Moderation icons.
Architecture: Config-driven hubs in src/lib/admin-nav.ts; chrome in AdminHubChrome / AdminSectionTabs; layout controls in src/app/admin/layout.tsx. No new routes — only navigation and presentation.
Tech Stack: Next.js App Router, React, Tailwind, Lucide, existing admin CSS tokens.
Spec: docs/superpowers/specs/2026-07-17-admin-ux-cleanup-design.md
File map
| File | Role |
|---|---|
src/lib/admin-nav.ts |
Hub tabs, Radio group, icon imports |
src/components/admin/admin-section-tabs.tsx |
Optional grouped tab rows |
src/components/admin/admin-hub-chrome.tsx |
Pass tabs through (no API change if tabs shape extends) |
src/app/admin/layout.tsx |
Theme/lang: sidebar always; topbar lg:hidden only |
src/app/admin/**/page.tsx (hub lists) |
Strip redundant h1 + duplicate intro blocks |
Task 1: Extend tab type + Radio groups + orphan tabs + icons
Files:
-
Modify:
src/lib/admin-nav.ts -
Modify:
src/components/admin/admin-section-tabs.tsx -
Add optional
group?: stringtoAdminHubTab/AdminTab -
Users: add Multi-accounts tab
-
Engagement: add Event types + Templates tabs
-
Observability: add Chat, Commands, Trades, Activity, Economy, Errors; tighten Logs
matchto exact index only via scorer (href-only is enough if subpaths are longer) -
Radio: set
group: "primary"/group: "tools"on tabs -
Moderation nav icon →
Gavel(orShieldAlert); keep Access asBan -
Render grouped tabs: if any tab has
group, render one nav per distinct group (label Primary / Tools only for radio tools group — use human labels from group id:primaryunlabeled or “Main”,tools→ “Tools”)
Task 2: Theme / language placement
Files:
-
Modify:
src/app/admin/layout.tsx -
Keep switchers in sidebar
-
Wrap topbar switchers in
className="flex … lg:hidden"so desktop shows them once
Task 3: Strip redundant hub list headers
Files: Hub list/overview pages that duplicate shell title (not entity detail/create):
Strip the page-level title row (h1 / icon header duplicating hub), keep filters and action buttons.
Remove duplicate title on (list/tab pages):
banners, users, users/multi-accounts, rooms, prefixes, sounds, tickets, tickets/templates, polls, online, moderation, moderation/actions, moderation/cfh, moderation/team, logs (if present), logs/audit, logs/chat, logs/commands, logs/trades, events, events/types, devops, devops/errors, analytics, analytics/activity, analytics/economy, catalog (list chrome only)
Keep title on:
polls/create, polls/[id], events/create, events/[id], catalog/[id], and any show/edit/new entity pages
Also strip duplicate headers on other hub tab roots that use different class patterns (articles, photos, ads, radio overview, settings, etc.) if they repeat hub title — grep for similar patterns.
Task 4: Verify + commit
- Spot-check tab active states:
/admin/usersvs/admin/users/multi-accounts,/admin/logsvs/admin/logs/chat,/admin/eventsvs/admin/events/types - Commit + push
Spec coverage
| Spec item | Task |
|---|---|
| 1.1 Single hub header | Task 3 |
| 1.2 Orphan routes | Task 1 |
| 1.3 Theme/lang | Task 2 |
| 1.4 Radio groups | Task 1 |
| 1.5 Icons | Task 1 |