fix(settings): render profile email outside form field

[zacjones93]

Summary

• render immutable profile email with the shared Label and disabled Input outside React Hook Form field context
• preserve accessible label/description associations and exclude email from the update payload
• add focused route tests for loaded rendering, payload shape, controlled editable fields, and the no-user skeleton
• document the profile-settings contract and refresh the generated UI inventory

Verification

• vitest run test/routes/settings/profile.test.tsx --testTimeout=15000 (3/3)
• full WODsmith Start suite (139 files, 2938 tests)
• tsgo --noEmit
• Biome on the touched route/test
• page-coverage and UI-inventory freshness checks
• lat check
• git diff --check
• GitNexus exact-worktree index + detect-changes: 5 changed symbols, 0 affected processes, low risk

Evidence recapture blocker

The parent coverage PR preserves the original pre-fix profile and athlete error-state evidence. A disposable MySQL fixture was guarded to 127.0.0.1:33317/wodsmith_e2e, pushed, and seeded successfully. The bounded post-fix profile recapture was stopped without overwriting evidence because the cold Node 24 runtime failed before sign-in with TypeError: entries.routerEntry.getRouter is not a function in @tanstack/start-server-core@1.145.0. Browser/runtime/database state was cleaned up. Athlete evidence remains unchanged and error-state.

Stack

Base: #625 (codex/ui-protected-athlete-coverage).

• main
  • feat(ui): consolidate Storybook and shared UI library #615
    • feat(ui): add shared package foundation #616
      • feat(ui): extract shared form and overlay primitives #617
        • Fix semantic contrast and Storybook Canvas themes #618
          • UI library: add exhaustive page coverage contract #619
            • UI Library Stack 06 — Public Entry Browser Evidence #620
              • Fix dark button hover contrast #621
                • Extract shared feedback and navigation primitives #622
                  • UI Library Stack 08 — Docs and Auxiliary App Evidence #623
                  • feat(ui): add auth entry composition #624
                  • docs(ui): capture protected athlete coverage #625
                  • fix(settings): render profile email outside form field 👈
                  • fix(settings): render athlete stats outside form fields #627
                  • fix(series): render movement collection heading #628
                  • feat(ui): add field composition primitives #629
                  • docs(ui): capture Crew organizer coverage #630
                  • refactor(settings): adopt shared field composition #631
                  • fix(crew): contain mobile route layouts #632
                  • fix(judges): compose rotation collection field group #633
                  • docs(ui): capture Crew admin coverage #634
                  • fix(scaling): compose levels field groups #635
                  • fix(registration): compose option field groups #636
                  • feat(ui): add empty state composition #637
                  • fix(crew): align token route accessibility #639
                  • docs(ui): capture Crew token and series coverage #638
                  • fix(start): correct organizer panel semantics #640
                  • refactor(ui): adapt organizer empty states #641
                  • fix(start): stabilize admin sidebar hydration #642
                  • fix(start): add admin dashboard heading hierarchy #643
                  • fix(start): correct demo competition semantics #644
                  • docs(ui): capture Start admin coverage #645
                  • refactor(ui): compose organizer empty states directly #646
                  • feat(ui): add metric composition #647
                  • refactor(crew): adopt shared Metric summaries #648
                  • refactor(ui): compose Crew preview metrics #649

---

Summary by cubic

Prevents the profile email from being submitted by rendering it outside the form. Adopts shared @repo/ui Field, EmptyState, and Metric primitives to improve semantics, accessibility, and layout across settings, organizer, and admin.

• New Features

  • Add @repo/ui/field, @repo/ui/empty-state, and @repo/ui/metric; adopt them in settings, organizer empty states, and import/heat summary metrics.
  • Introduce semantic organizer panels for check-in instructions and results load errors.

• Bug Fixes

  • Render profile email and athlete stats outside form fields; keep email read-only and out of updateUserProfileFn.
  • Harden semantics: add FieldGroup legends, preserve movement heading levels, name primary navigation, and fix admin headings/link state and sidebar hydration.
  • Contain mobile header nav, derive Crew demo dates in the event timezone, and polish table/section layouts for exports and results.
  • Add focused tests for settings, judges, organizer/admin semantics, and responsive nav; refresh the UI library inventory and captured evidence.

^{Written for commit d6316c1. Summary will update on new commits.}

[zacjones93]

@coderabbitai review

[coderabbitai]

✅ Action performed

Review finished.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

[coderabbitai]

Important

Review skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: b467d98d-b3c7-4343-b32c-0897c5871bee

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch codex/settings-profile-form-context-fix

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[zacjones93]

Independent review receipt

Findings: no actionable findings. The stacked diff is clean and low risk.

Reviewed the exact four-file change:

• apps/wodsmith-start/src/routes/_protected/settings/profile/index.tsx
• apps/wodsmith-start/test/routes/settings/profile.test.tsx
• apps/wodsmith-start/docs/ui-library-inventory.md
• lat.md/auth.md

Checks performed:

• confirmed the immutable email display no longer consumes FormLabel/FormControl/FormMessage outside a FormField context
• confirmed native Label + htmlFor, input id, and aria-describedby preserve accessible name and description
• confirmed email remains excluded from the profile update payload while first name, last name, and avatar remain controlled
• confirmed focused tests cover loaded rendering, accessibility, controlled fields, submission payload, router invalidation, and skeleton state
• confirmed the LAT contract and generated inventory delta match the implementation
• confirmed the PR body accurately reports the failed post-fix recapture and does not claim new browser evidence

Residual risks: post-fix browser evidence remains unavailable because the bounded Node 24 capture runtime failed in TanStack Start before sign-in; CI was still running when this independent review completed.