The Seamless Auth Dashboard is a React/Vite admin portal for operating a Seamless Auth deployment. It gives operators direct visibility into authentication activity and lets admins manage users, sessions, security signals, and system configuration from one place.
This app is intended to run alongside the Seamless Auth API as part of a self-hosted auth stack.
- browse and manage users
- inspect sessions and revoke them
- filter and investigate authentication events
- review suspicious activity and anomaly signals
- edit system configuration
- operate with runtime config injection in containerized environments
- React 19
- Vite
- TypeScript
- TanStack Query
- Tailwind CSS v4
- Recharts
- Vitest + Testing Library
This dashboard is built as static assets and served by nginx.
Runtime configuration is injected at container startup:
index.htmlloads/config.jsentrypoint.shwriteswindow.__SEAMLESS_CONFIG__src/lib/runtimeConfig.tsreads runtime config first, then falls back toimport.meta.env
That runtime-config flow is intentional. The dashboard is designed to be reconfigured per environment without rebuilding the frontend image.
- operator landing page with metrics, charts, and investigation entry points
- list, search, create, edit, and delete users
- drill into individual user detail
- inspect active sessions
- revoke individual sessions
- browse authentication events
- filter by grouped event type and time range
- deep-link into filtered views
- review anomaly and suspicious activity signals
- navigate from security context into event investigation
- manage available roles and auth settings
- multiple built-in themes
- light and dark modes
- appearance switching from the user menu
Install dependencies:
npm installStart the dev server:
npm run devThe app will be available at http://localhost:5173.
npm run dev
npm run lint
npm run format
npm run format:check
npm run typecheck
npm test
npm run coverage
npm run buildYou can provide config through Vite env vars for local development:
VITE_API_URL=http://localhost:5312In production-like deployments, prefer the runtime config.js injection flow instead.
The repo includes a frontend test setup using Vitest, Testing Library, and jsdom.
Useful commands:
npm test
npm run coverageCoverage is currently focused on shared components and src/lib helpers.
Build the container image locally:
npm run docker:buildRun it locally:
npm run docker:runThe production image serves the built frontend through nginx and includes a container health check.
src/
components/
hooks/
lib/
pages/
types/
components: shared UI primitives and app shellhooks: data fetching and mutationslib: helpers, config, and domain utilitiespages: top-level route screenstypes: shared frontend types
The dashboard is intentionally lightweight:
- explicit routes instead of heavy meta-framework conventions
- thin pages and focused hooks
- shared UI primitives over a component framework
- theme-aware styling through shared CSS tokens
- URL-driven filter state where it improves operator workflows
The app is functional and meant for real use. The current focus is on consistency, operator ergonomics, and tightening the remaining rough edges.
Known areas still worth attention:
AuthProviderauth mode wiring is not fully aligned with runtime config support- the unauthenticated
Sign Inbutton still has no wired action - a few query invalidation paths remain narrower than ideal
- chart components have lighter test coverage than the shared shell and utility layers
AGPL-3.0