Get Access
Docs/Structure

Structure

Where the routes, components, providers and data live, so you know which file to open for any change.

Folders

src/
src/
├─ app/            Routes, root layout, fonts and globals.css (design tokens)
├─ components/     One folder per module: customers/, contracts/, messages/, …
│  ├─ ui/          shadcn/ui primitives
│  ├─ shell/       Sidebar, header, workspace switcher
│  └─ providers/   React context for each module's state
├─ hooks/          useIsMobile, usePointerDrag, useFlip
└─ lib/
   ├─ data/        All demo content (edit to rebrand)
   ├─ auth.ts      Demo sign-in, sign-up and password reset
   └─ storage.ts   Safe localStorage helpers

Routes

Pages live under src/app. The app screens share one shell through the (crm) route group; sign-in screens share the (auth) group.

RouteScreen
/Agents
/customers, /customers/[id]Customer table, list, kanban and profile
/contracts, /contracts/[id]Contracts by status and the contract page
/messagesInbox and threads
/balances, /transactionsReceivables and payments
/workflows/[id]Workflow builder
/login, /register, /forgotSign in, sign up and password reset

State and data

Seed data lives in src/lib/data. Each module has a provider in components/providers that holds its records and exposes actions like reply, createContract or updateProfile. Components only read from providers, which makes them the one place to call your API.