# 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?: string` to `AdminHubTab` / `AdminTab`
- [ ] Users: add Multi-accounts tab
- [ ] Engagement: add Event types + Templates tabs
- [ ] Observability: add Chat, Commands, Trades, Activity, Economy, Errors; tighten Logs `match` to 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` (or `ShieldAlert`); keep Access as `Ban`
- [ ] 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: `primary` unlabeled 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/users` vs `/admin/users/multi-accounts`, `/admin/logs` vs `/admin/logs/chat`, `/admin/events` vs `/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 |