FerryDocs
ContributingWeb client

Code layout

The code of the dashboard is in web/src. It has pages, components, stores and the API client.

Edit on GitHub
routes.tsxpages/components/the shared UIstores/Zustandlib/api/calls the server
A page uses the components, the stores and the API client

The folders

main.tsx, App.tsx (providers), routes.tsx, RequireAuth.tsx
styles/tokens.css — design tokens shared with the docs
styles/globals.css — tokens mapped to shadcn variables
api/ — client, types, endpoints, keys, sse, events, queries, useLogStream
format.ts, dotenv.ts, logs.ts — pure helpers with tests
stores/ — auth.ts, ui.ts (Zustand)
components/ui/ — shadcn primitives (customized)
components/shell/ — AppShell, TopBar, IconRail, InnerMenu, CommandMenu, ConnectPopover
components/patterns/ — PageHeader, FormCard, InfoTile, MetricCard, EmptyState, LogViewer…
pages/ — routed pages, one named XxxPage export per file

Each file in pages/ has one named export, for example LoginPage. routes.tsx gives a URL to each page.

The stack

The dashboard uses React and TypeScript. Each library has one job.

Add an endpoint

The TypeScript types copy the Rust types by hand. When the API changes, update four files in order.

On this page

The folders