Frontend Review (June 2026)
The opus code-quality pass on apps/web — what it fixed and what stayed open
Condensed from the June 2026 "opus" review of apps/web (initial pass 2026-06-14, re-review 2026-06-15 after steps 1–8 were implemented). Full documents in git history. Kept here because its health snapshot is the best before/after record of the frontend cleanup, and two of its findings are still open.
Health snapshot
| Metric | 2026-06-14 (initial) | 2026-06-15 (after fixes) |
|---|---|---|
| Largest component | header.tsx — 452 lines | 108 lines (decomposed) ✅ |
| Hardcoded hex / rgba colors | 38 / 38 | 0 / 0 ✅ |
: any / as any | 4 | 0 ✅ (lint-enforced) |
| Toast systems | 2 in parallel | 1 (@marketplace/ui) ✅ |
| Error boundaries | 0 | root + segment boundaries ✅ |
| Env validation | none | lib/env.ts + .env.example ✅ |
| Token storage | JS-readable cookie | HttpOnly via route handlers ✅ |
| Effect-fetching | use-auth.tsx | 0 — auth backed by useQuery ✅ |
Arbitrary px [NNpx] | 1,687 | ~1,685 ⚠️ still open |
| Test files | 0 | 0 at the time (harness added later) |
What it established (now conventions)
The review's rules were absorbed into the frontend conventions: no effect-fetching, design tokens only, one toast/upload/API_URL source, ≤250-line components, no any, error boundaries per segment, qk query-key factory.
Its top post-fix finding — the HttpOnly cookie wouldn't reach the backend cross-origin — was resolved with the same-origin /api/proxy rewrite that the client transport uses today.
Still open from this review
Carried forward, deprioritized
These two items were real but did not make the cut into the current plan phases — they're recorded here so they aren't rediscovered as "new" findings:
-
Arbitrary pixel-value sweep (~1,750 occurrences today). Colors were fully migrated to tokens, but off-grid spacing/radius/typography literals (
text-[13px],rounded-[12px],px-[9px]) remain. The recipe: round to the nearest Tailwind scale token, keep intentional icon/hairline px, then add a CI grep guard:grep -rhoE "\[[0-9.]+px\]" apps/web --include="*.tsx" | wc -l # target: <100 -
A11y labels on icon-only controls. Most icon-only buttons lack
aria-label(hamburger, messages link, admin row actions). Triage:grep -rn "<button" apps/web/features apps/web/components --include="*.tsx" | grep -v "aria-label"
Everything else the review flagged is either done or tracked in plan phase 8.