Architecture overview
Route composition, module boundaries, workspace data flow, and the CashLift technology stack.
CashLift separates public marketing, public demo, and authenticated workspace concerns.
Marketing routes
Product information, pricing, use cases, and legal pages.
Fixture tour
A static, read-only Studio Nova workspace experience.
Dashboard routes
A Clerk-authenticated workspace for a company and its members.
Server repository
Resolves the current session and loads company-scoped financial data.
Source ownership
- src/
- app/
- Route groups, layouts, metadata, API handlers, auth gates, and route composition.
- (marketing)/ — public product, legal, and demo-entry pages.
- (public-demo)/ — static read-only workspace tour.
- (workspace)/ — Clerk-protected dashboard pages.
- api/ — server-only HTTP boundaries for workspace operations.
- modules/
- Product capabilities, schemas, repository contracts, and feature-specific UI.
- workspace/, dashboard/, spend-requests/, invoices/, vendors/, budgets/, cash-actions/, and subscriptions/.
- ui/
- Generic reusable UI primitives, controlled fields, stories, and styling utilities.
- services/
- Clerk, Supabase, Sentry, React Query, environment configuration, i18n, and platform integrations.
- utilities/
- Domain-agnostic helpers.
- test/
- Shared test setup and feature fixtures.
- app/
- supabase/
- Schema and row-level security policies.
- e2e/
- Playwright journeys for demo and production behavior.
- .storybook/
- Storybook configuration.
- docs/
- Blume documentation source.
- public/
- Static product, marketing, and brand assets.
- scripts/
- Repository automation and security checks.
- .github/workflows/
- CI checks and scheduled repository automation.
Business modules should not casually import other business modules. Routes compose them, while explicit composition modules such as dashboard, workspace, and page-shell own their documented cross-module relationships.
Data boundary
Workspace pages resolve data on the server. In demo mode, the resolver returns the typed Studio Nova fixture. In production, it requires Clerk and Supabase configuration, authenticates the user, and uses company-scoped row-level security. Browser code does not query finance tables directly.
Route groups
(marketing)contains public marketing, use-case, legal, and demo-entry routes.(public-demo)contains the public read-only workspace tour.(workspace)contains authenticated dashboard routes for overview, approvals, budgets, cash, invoices, vendors, team, and settings.(auth)contains sign-in and sign-up routes.
Technology stack
| Area | Tools and documentation |
|---|---|
| RuntimeLanguage and framework | Node.jspnpmReactNext.jsTypeScript |
| InterfaceUI, motion, and data display | Tailwind CSSReact AriaLucideMotionSonnerRechartsdate-fnscnfast |
| FormsInput and validation | React Hook FormResolversZodInternationalized Date |
| DataIdentity, database, and cache | ClerkSupabaseTanStack Query |
| OperationsObservability and product insight | Sentry for Next.jsVercel AnalyticsSpeed Insightsnext-intl |
| DocumentationAuthoring and rendering | BlumeAstroMDXAstro ReactTailwind ViteShiki Twoslash |
| QualityTesting and code health | VitestTesting LibraryPlaywrightaxe-coreMSWBiomeFallowReact DoctorLefthook |
| WorkbenchComponent development | StorybookNext.js frameworkDocs addonMCP addon |
For exact versions and the full direct dependency manifest, see package.json.
Storybook
Storybook is the component workbench for reusable UI states and generated component documentation.
- Open the deployed Storybook
- Run
pnpm storybookfor local development on port 6006. - Run
pnpm build-storybookto produce the static site.