Project Structure

Asset-Management/
├── documentation/              # Docusaurus documentation site
│   ├── docs/                   # Markdown documentation pages
│   ├── src/css/                # Doc site styles
│   ├── docusaurus.config.js
│   └── sidebars.js
├── public/                     # Static assets (favicon, PDFs)
├── src/
│   ├── main.tsx                # App entry point
│   ├── App.tsx                 # Routes & theme
│   ├── firebase.ts             # Firebase initialization
│   ├── config/                 # Default configs
│   ├── pages/                  # Route-level pages
│   │   ├── Assets.tsx
│   │   ├── LocationMapPage.tsx
│   │   ├── Settings.tsx
│   │   └── ...
│   ├── components/             # Reusable UI
│   │   ├── Layout.tsx          # App shell & sidebar
│   │   ├── ProtectedRoute.tsx
│   │   ├── location-map/       # Site map components
│   │   └── settings/           # Settings cards
│   ├── context/                # React contexts
│   │   ├── AuthContext.tsx
│   │   └── RolePermissionsContext.tsx
│   ├── services/               # Business logic & Firebase
│   │   ├── siteMapService.ts
│   │   ├── rolePermissionSettingsService.ts
│   │   └── ...
│   ├── utils/                  # Helpers
│   │   ├── rbac.ts             # Roles & permissions
│   │   └── auditLog.ts
│   └── types/                  # TypeScript interfaces
│       ├── index.ts
│       └── siteMap.ts
├── firestore.rules             # Security rules
├── firestore.indexes.json      # Composite indexes
├── firebase.json               # Firebase deploy config
├── vite.config.ts              # Vite + dev server
├── tsconfig.json               # TypeScript config
├── package.json
├── .env.example
└── README.md

Key files

File	Responsibility
src/App.tsx	Route definitions, MUI theme, providers
src/components/Layout.tsx	Sidebar navigation, permission filtering
src/context/AuthContext.tsx	Login, profile, hasPermission()
src/utils/rbac.ts	Default role permissions, permission groups
src/services/*.ts	Firestore CRUD and business rules
firestore.rules	Server-side access control

Routing

All authenticated routes wrap in <Layout> and <ProtectedRoute> with optional requiredPermissions.

Public routes: /login, /forgot-password, /mobile-sign, asset sign/review links.

Styling

• MUI theme defined in App.tsx
• Dashboard color tokens in src/components/dashboard/dashboardTheme.ts
• Inter font loaded in index.html

Adding a new page

1. Create src/pages/MyPage.tsx
2. Add route in App.tsx with ProtectedRoute
3. Add nav item in Layout.tsx with permissions array
4. Add permission keys to src/utils/rbac.ts if new
5. Document in this docs site