@sqlml/ui 0.3.4 → 0.3.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/README.md +60 -22
  2. package/package.json +16 -2
  3. package/server/dist/main.js +0 -14
  4. package/server/dist/main.js.map +1 -1
  5. package/server/dist/tsconfig.tsbuildinfo +1 -1
package/README.md CHANGED
@@ -1,36 +1,74 @@
1
- # @sqlml/ui
1
+ <p align="center">
2
+ <h1 align="center">@sqlml/ui</h1>
3
+ <p align="center">Web-based database management GUI for SQLML</p>
4
+ </p>
2
5
 
3
- SQLML Web UI — Visual database management interface for the SQLML project.
6
+ <p align="center">
7
+ <a href="https://www.npmjs.com/package/@sqlml/ui"><img src="https://img.shields.io/npm/v/@sqlml/ui.svg" alt="npm version"></a>
8
+ <a href="https://www.npmjs.com/package/@sqlml/ui"><img src="https://img.shields.io/npm/dm/@sqlml/ui.svg" alt="npm downloads"></a>
9
+ <a href="https://github.com/Ruffiano/sqlml/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/@sqlml/ui.svg" alt="license"></a>
10
+ <a href="https://github.com/Ruffiano/sqlml"><img src="https://img.shields.io/badge/node-%3E%3D20.0.0-brightgreen.svg" alt="node version"></a>
11
+ </p>
4
12
 
5
- ## Structure
13
+ ---
6
14
 
7
- - `server/` — NestJS backend API (port 4200)
8
- - `client/` — React + Vite + Tailwind frontend (port 5173)
9
- - `docker/` — Docker setup for development databases
15
+ A visual interface for managing database schemas, migrations, connections, and data — built with NestJS + React. Part of the [@sqlml/cli](https://www.npmjs.com/package/@sqlml/cli) toolkit.
10
16
 
11
17
  ## Quick Start
12
18
 
19
+ The easiest way to use `@sqlml/ui` is through the CLI:
20
+
13
21
  ```bash
14
- # Install dependencies
15
- npm run install:all
22
+ npm install -g @sqlml/cli
23
+ sqlml ui
24
+ ```
25
+
26
+ Opens at **http://localhost:4200**. Press `Ctrl+C` to stop.
27
+
28
+ ## Screenshots & Features
29
+
30
+ ### Dashboard
31
+
32
+ Project overview with ORM type indicator (TypeORM/Prisma), quick stats, and an organized command reference for the CLI.
33
+
34
+ ### Schema Editor
35
+
36
+ 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.
16
37
 
17
- # Start both servers
18
- npm run dev:server # Backend on :4200
19
- npm run dev:client # Frontend on :5173
38
+ ### Schema Diff
20
39
 
21
- # Build for production
22
- npm run build
40
+ Visual side-by-side comparison between schema snapshots. Auto-loads the latest vs previous snapshot. Color-coded additions, deletions, and changes.
41
+
42
+ ### Migrations
43
+
44
+ View all migration files and their status (pending, applied, reverted). Run and revert migrations directly from the UI. Manage migration templates.
45
+
46
+ ### Database
47
+
48
+ All-in-one database management page:
49
+
50
+ | Feature | Description |
51
+ |---------|-------------|
52
+ | **Connection Manager** | Add, edit, test, and delete database connections. Auto-creates from `.config-sqlml` |
53
+ | **Schema Browser** | Expandable tree of schemas and tables with column details, types, primary keys, and row estimates |
54
+ | **Data Grid** | Paginated table viewer with column sorting. Double-click to edit cells inline. Add and delete rows |
55
+ | **Query Editor** | Write and execute SQL queries with Cmd/Ctrl+Enter. Results in a scrollable grid. Schema-aware search path |
56
+
57
+ ### Settings
58
+
59
+ Edit database connection, generation options, file paths, and other configuration — all persisted to `.config-sqlml`.
60
+ ```
61
+ UI_PORT=4200
62
+ UI_THEME=dark
63
+ UI_OPEN_BROWSER=true
23
64
  ```
24
65
 
25
- ## Features
66
+ ## Links
26
67
 
27
- - Dashboard — Overview of database and migrations
28
- - Schema Editor — Visual DBML editing with Monaco Editor
29
- - Migrations — View and manage database migrations
30
- - Database — Connection management
31
- - Settings — Configuration options
68
+ - [GitHub Repository](https://github.com/Ruffiano/sqlml)
69
+ - [Report Issues](https://github.com/Ruffiano/sqlml/issues)
70
+ - [@sqlml/cli on npm](https://www.npmjs.com/package/@sqlml/cli)
32
71
 
33
- ## Data Storage
72
+ ## License
34
73
 
35
- The UI stores metadata in a local SQLite database at `.sqlml/metadata.db`.
36
- No external database server is required for the UI itself.
74
+ MIT
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sqlml/ui",
3
- "version": "0.3.4",
3
+ "version": "0.3.6",
4
4
  "description": "SQLML Web UI - Visual database management interface",
5
5
  "type": "commonjs",
6
6
  "main": "./server/dist/main.js",
@@ -57,7 +57,21 @@
57
57
  "author": "Ruffiano",
58
58
  "license": "MIT",
59
59
  "dependencies": {
60
- "tslib": "^2.3.0"
60
+ "@nestjs/common": "10.4.22",
61
+ "@nestjs/core": "10.4.22",
62
+ "@nestjs/platform-express": "10.4.22",
63
+ "@nestjs/platform-socket.io": "10.4.22",
64
+ "@nestjs/serve-static": "4.0.2",
65
+ "@nestjs/swagger": "7.4.2",
66
+ "@nestjs/typeorm": "10.0.2",
67
+ "@nestjs/websockets": "10.4.22",
68
+ "class-transformer": "^0.5.1",
69
+ "class-validator": "^0.14.1",
70
+ "reflect-metadata": "^0.2.1",
71
+ "rxjs": "^7.8.1",
72
+ "sqlite3": "^5.1.7",
73
+ "tslib": "^2.3.0",
74
+ "typeorm": "^0.3.19"
61
75
  },
62
76
  "devDependencies": {
63
77
  "rimraf": "^6.1.0",
package/server/dist/main.js CHANGED
@@ -2,7 +2,6 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const core_1 = require("@nestjs/core");
4
4
  const common_1 = require("@nestjs/common");
5
- const swagger_1 = require("@nestjs/swagger");
6
5
  const app_module_1 = require("./app.module");
7
6
  async function bootstrap() {
8
7
  const app = await core_1.NestFactory.create(app_module_1.AppModule);
@@ -24,22 +23,9 @@ async function bootstrap() {
24
23
  app.setGlobalPrefix('api', {
25
24
  exclude: ['/'],
26
25
  });
27
- const config = new swagger_1.DocumentBuilder()
28
- .setTitle('SQLML UI API')
29
- .setDescription('SQLML UI Backend API Documentation')
30
- .setVersion('1.0')
31
- .addTag('workspace', 'Workspace management')
32
- .addTag('migration', 'Migration operations')
33
- .addTag('schema', 'Schema operations')
34
- .addTag('database', 'Database operations')
35
- .addTag('config', 'Configuration management')
36
- .build();
37
- const document = swagger_1.SwaggerModule.createDocument(app, config);
38
- swagger_1.SwaggerModule.setup('api/docs', app, document);
39
26
  const port = process.env.PORT || 4200;
40
27
  await app.listen(port);
41
28
  console.log(`SQLML UI Server running on http://localhost:${port}`);
42
- console.log(`API Documentation: http://localhost:${port}/api/docs`);
43
29
  }
44
30
  bootstrap();
45
31
  //# sourceMappingURL=main.js.map
package/server/dist/main.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"main.js","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":";;AAAA,uCAA2C;AAC3C,2CAAgD;AAChD,6CAAiE;AACjE,6CAAyC;AAEzC,KAAK,UAAU,SAAS;IACtB,MAAM,GAAG,GAAG,MAAM,kBAAW,CAAC,MAAM,CAAC,sBAAS,CAAC,CAAC;IAGhD,GAAG,CAAC,cAAc,CAChB,IAAI,uBAAc,CAAC;QACjB,SAAS,EAAE,IAAI;QACf,SAAS,EAAE,IAAI;QACf,oBAAoB,EAAE,IAAI;KAC3B,CAAC,CACH,CAAC;IAGF,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC;IAC3C,GAAG,CAAC,UAAU,CAAC;QACb,MAAM,EAAE,UAAU;YAChB,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;YAC1C,CAAC,CAAC;gBACE,oBAAoB,OAAO,CAAC,GAAG,CAAC,IAAI,IAAI,IAAI,EAAE;gBAC9C,oBAAoB,OAAO,CAAC,GAAG,CAAC,WAAW,IAAI,IAAI,EAAE;aACtD;QACL,WAAW,EAAE,IAAI;KAClB,CAAC,CAAC;IAGH,GAAG,CAAC,eAAe,CAAC,KAAK,EAAE;QACzB,OAAO,EAAE,CAAC,GAAG,CAAC;KACf,CAAC,CAAC;IAGH,MAAM,MAAM,GAAG,IAAI,yBAAe,EAAE;SACjC,QAAQ,CAAC,cAAc,CAAC;SACxB,cAAc,CAAC,oCAAoC,CAAC;SACpD,UAAU,CAAC,KAAK,CAAC;SACjB,MAAM,CAAC,WAAW,EAAE,sBAAsB,CAAC;SAC3C,MAAM,CAAC,WAAW,EAAE,sBAAsB,CAAC;SAC3C,MAAM,CAAC,QAAQ,EAAE,mBAAmB,CAAC;SACrC,MAAM,CAAC,UAAU,EAAE,qBAAqB,CAAC;SACzC,MAAM,CAAC,QAAQ,EAAE,0BAA0B,CAAC;SAC5C,KAAK,EAAE,CAAC;IAEX,MAAM,QAAQ,GAAG,uBAAa,CAAC,cAAc,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;IAC3D,uBAAa,CAAC,KAAK,CAAC,UAAU,EAAE,GAAG,EAAE,QAAQ,CAAC,CAAC;IAE/C,MAAM,IAAI,GAAG,OAAO,CAAC,GAAG,CAAC,IAAI,IAAI,IAAI,CAAC;IACtC,MAAM,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAEvB,OAAO,CAAC,GAAG,CAAC,+CAA+C,IAAI,EAAE,CAAC,CAAC;IACnE,OAAO,CAAC,GAAG,CAAC,uCAAuC,IAAI,WAAW,CAAC,CAAC;AACtE,CAAC;AAED,SAAS,EAAE,CAAC"}
1
+ {"version":3,"file":"main.js","sourceRoot":"","sources":["../src/main.ts"],"names":[],"mappings":";;AAAA,uCAA2C;AAC3C,2CAAgD;AAEhD,6CAAyC;AAEzC,KAAK,UAAU,SAAS;IACtB,MAAM,GAAG,GAAG,MAAM,kBAAW,CAAC,MAAM,CAAC,sBAAS,CAAC,CAAC;IAGhD,GAAG,CAAC,cAAc,CAChB,IAAI,uBAAc,CAAC;QACjB,SAAS,EAAE,IAAI;QACf,SAAS,EAAE,IAAI;QACf,oBAAoB,EAAE,IAAI;KAC3B,CAAC,CACH,CAAC;IAGF,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC;IAC3C,GAAG,CAAC,UAAU,CAAC;QACb,MAAM,EAAE,UAAU;YAChB,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;YAC1C,CAAC,CAAC;gBACE,oBAAoB,OAAO,CAAC,GAAG,CAAC,IAAI,IAAI,IAAI,EAAE;gBAC9C,oBAAoB,OAAO,CAAC,GAAG,CAAC,WAAW,IAAI,IAAI,EAAE;aACtD;QACL,WAAW,EAAE,IAAI;KAClB,CAAC,CAAC;IAGH,GAAG,CAAC,eAAe,CAAC,KAAK,EAAE;QACzB,OAAO,EAAE,CAAC,GAAG,CAAC;KACf,CAAC,CAAC;IAEH,MAAM,IAAI,GAAG,OAAO,CAAC,GAAG,CAAC,IAAI,IAAI,IAAI,CAAC;IACtC,MAAM,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAEvB,OAAO,CAAC,GAAG,CAAC,+CAA+C,IAAI,EAAE,CAAC,CAAC;AACrE,CAAC;AAED,SAAS,EAAE,CAAC"}