canina/docs/audit/frontend-route-map.md
2026-08-06 20:54:44 +03:30

2.5 KiB

Frontend & Admin Architecture Route Map Specification

  • Audit Artifact: Phase 3.2 / 3.3 — Frontend Architecture Specification
  • Repository HEAD: 715873b2ecc3a72ba974bb2a2be87c5ba82bd4e7
  • Architectural Architecture Split:
    1. Storefront (Customer-Facing): Next.js framework for server-side rendering (SSR), dynamic open-graph metadata, and maximum SEO performance.
    2. Admin Panel (Internal Application): Standalone, isolated React SPA. SEO is completely irrelevant; absolute priority is Security, Performance, Lazy Loading, and Type Safety.

Admin Panel React SPA Route Map (createBrowserRouter)

TASK-FE-001 targets the standalone Admin Panel React SPA using react-router-dom (createBrowserRouter) for chunk splitting and lazy-loaded admin modules:

Admin Route Path Target Lazy-Loaded Module Function / Sub-System Auth Boundary Performance & Code-Splitting Strategy Confirmation Status
/admin/login AdminLogin Admin OTP / Credential Authentication Public / Guest Eager load login view CONFIRMED
/admin/dashboard AdminDashboard Executive Overview & Metrics Widgets @Roles('Admin') lazy() chunk split CONFIRMED
/admin/settings AdminSettings System Branding & Global Config @Roles('Admin') lazy() chunk split CONFIRMED (ADM-001)
/admin/products/* AdminProductsManager Product Catalog, Prices & Scientific Terms @Roles('Admin') lazy() chunk split CONFIRMED
/admin/orders/* AdminOrdersManager Order Fulfillment & Decimal Financial Logs @Roles('Admin') lazy() chunk split CONFIRMED (BE-001)
/admin/users/* AdminUsersManager User Accounts & Address Management @Roles('Admin') lazy() chunk split CONFIRMED
/admin/pets/* AdminPetsManager Medical Profiles & Vet Consultation Logs @Roles('Admin') lazy() chunk split CONFIRMED

Router Implementation Requirements (TASK-FE-001)

  1. createBrowserRouter Setup:
    • Use react-router-dom createBrowserRouter([ ... ]) with React <Suspense> fallbacks for route-level code splitting.
  2. Type Safety & Nav Guards:
    • Use strict TypeScript route param schemas (AdminRouteParams).
    • Implement client-side route guards enforcing @Roles('Admin') session checks prior to rendering lazy chunks.
  3. SEO Non-Requirement:
    • Zero SEO logic in Admin Panel. Pure client-side SPA rendering with maximum bundle chunk isolation.