# S01: Admin Navigation Dropdown + Header Cleanup — UAT

**Milestone:** M006
**Written:** 2026-03-30T11:03:20.636Z

# S01 UAT: Admin Navigation Dropdown + Header Cleanup

## Preconditions
- Chrysopedia web UI running (http://ub01:8096 or local dev server)
- Browser with dev tools available

## Test Cases

### TC-1: Header shows correct flat navigation links
1. Navigate to the home page
2. **Expected:** Header contains three visible flat links: "Home", "Topics", "Creators"
3. **Expected:** No "Review Queue", "Reports", or "Pipeline" links visible in the flat nav area
4. **Expected:** No ModeToggle (sun/moon icon) visible in the header

### TC-2: Admin dropdown trigger is present
1. Look for an "Admin ▾" button/trigger in the header nav area (right side)
2. **Expected:** Trigger text reads "Admin ▾" (or similar with a caret indicator)
3. **Expected:** Dropdown menu is NOT visible by default

### TC-3: Clicking Admin opens dropdown with 3 links
1. Click the "Admin" trigger button
2. **Expected:** A dropdown menu appears below the trigger
3. **Expected:** Menu contains exactly 3 items: "Review Queue", "Reports", "Pipeline"
4. **Expected:** Each item is a clickable link

### TC-4: Dropdown links navigate correctly
1. Open the Admin dropdown
2. Click "Review Queue"
3. **Expected:** Navigates to /admin/review
4. **Expected:** Dropdown closes after navigation
5. Repeat for "Reports" → /admin/reports and "Pipeline" → /admin/pipeline

### TC-5: Click outside closes dropdown
1. Open the Admin dropdown
2. Click anywhere outside the dropdown (e.g., the page body)
3. **Expected:** Dropdown closes

### TC-6: Escape key closes dropdown
1. Open the Admin dropdown
2. Press the Escape key
3. **Expected:** Dropdown closes

### TC-7: ModeToggle still works on ReviewQueue page
1. Navigate to /admin/review (via Admin dropdown or direct URL)
2. **Expected:** ModeToggle component is visible on the ReviewQueue page itself
3. **Expected:** Toggling it changes the review mode (not broken by header removal)

### TC-8: ARIA accessibility attributes
1. Open browser dev tools, inspect the Admin trigger button
2. **Expected:** Button has `aria-haspopup="true"` attribute
3. **Expected:** When closed: `aria-expanded="false"`; when open: `aria-expanded="true"`
4. Inspect the dropdown menu container
5. **Expected:** Has `role="menu"` attribute
6. Inspect each menu item link
7. **Expected:** Each has `role="menuitem"` attribute

### TC-9: Dropdown styling uses theme tokens
1. Open the Admin dropdown
2. Inspect with dev tools
3. **Expected:** Dropdown background uses `var(--color-bg-surface)`, not a hardcoded hex value
4. **Expected:** Border uses `var(--color-border)`
5. **Expected:** Shadow uses `var(--color-shadow-heavy)`
6. Hover over a menu item
7. **Expected:** Hover background uses `var(--color-bg-surface-hover)`
