A visual interface for managing database schemas, migrations, connections, and data — built with NestJS + React. Part of the @sqlml/cli toolkit.

Quick Start

The easiest way to use @sqlml/ui is through the CLI:

npm install -g @sqlml/cli
sqlml ui

Opens at http://localhost:4200. Press Ctrl+C to stop.

Screenshots & Features

Dashboard

Project overview with ORM type indicator (TypeORM/Prisma), quick stats, and an organized command reference for the CLI.

Schema Editor

Full DBML schema editing powered by Monaco Editor (the same editor behind VS Code). Create, edit, and manage multiple .dbml schema files with syntax highlighting.

Schema Diff

Visual side-by-side comparison between schema snapshots. Auto-loads the latest vs previous snapshot. Color-coded additions, deletions, and changes.

Migrations

View all migration files and their status (pending, applied, reverted). Run and revert migrations directly from the UI. Manage migration templates.

Database

All-in-one database management page:

| Feature | Description | |---------|-------------| | Connection Manager | Add, edit, test, and delete database connections. Auto-creates from .config-sqlml | | Schema Browser | Expandable tree of schemas and tables with column details, types, primary keys, and row estimates | | Data Grid | Paginated table viewer with column sorting. Double-click to edit cells inline. Add and delete rows | | Query Editor | Write and execute SQL queries with Cmd/Ctrl+Enter. Results in a scrollable grid. Schema-aware search path |

Settings

Edit database connection, generation options, file paths, and other configuration — all persisted to .config-sqlml. Inline # comment annotations on values are preserved across save/reload (CASE_ENTITY=pascal # class Product parses cleanly to pascal).

Multi-schema workspace flags are surfaced in Settings:

• NAMESPACE_BY_SCHEMA — when enabled, the dashboard shows per-schema sections for entities, migrations, and snapshots
• MIGRATION_FORMAT — switch between split (.up.sql + .down.sql) and combined (single file with -- migrate:up / -- migrate:down markers)
• OFFLINE_GENERATION — when enabled, sqlml generate builds entities directly from DBML without contacting the database (Settings panel hides DB connection inputs)
• INDEX_FILE_MODE — overwrite (default) or cumulative (filesystem-scan barrel for multi-schema workspaces)
• .sqlml/decorators.json is recognised when present; the Settings panel shows an info banner listing the registered decorator names

  UI_PORT=4200
  UI_THEME=dark
  UI_OPEN_BROWSER=true

Links

• GitHub Repository
• Report Issues
• @sqlml/cli on npm

License

MIT