Frontend Architecture Guide
Route vs feature ownership baseline:docs/architecture/frontend-ownership-matrix.md.
Current Runtime Layout
frontend/src/app/: route segments and page entrypoints.frontend/src/components/: shared and feature UI components.frontend/src/lib/,frontend/src/hooks/,frontend/src/contexts/: client-side utilities and state wiring.frontend/src/features/org-admin/: canonical org-admin feature lane.
Refactor Direction
- Organize by product feature ownership, not generic component buckets.
- Keep route segments aligned with product surfaces:
- user
- org admin
- super admin
- simulation admin
- Remove dead or duplicated surfaces only after validating the replacement route path.
Component Boundary Rules
- Large page components should be split into:
- container/orchestration component
- presentational sections
- feature-local hooks/helpers
- Keep cross-feature shared UI in
components/uiorcomponents/shared. - Current split increments completed:
ScenarioLabPanel.tsxdelegates derived-view logic toScenarioLabPanelSelectors.ts.PolicySettingsPanel.tsxdelegates parsing/normalization helpers topolicySettingsParsers.ts.
Test Placement Policy
- Frontend tests are colocated (
*.test.tsx,*.integration.test.tsx). frontend/src/**/__tests__/trees are disallowed.- Keep route smoke tests for critical user/admin flows.
Migration Safety
- Preserve existing routes and navigation behavior until replacement pages are verified.
- Prefer compatibility redirects over abrupt route removals.
- Validate role-based access and admin navigation after structural moves.