Add @objectql/admin package and integrate admin UI

Introduced a new @objectql/admin package with its own build setup and static admin UI. Updated the express app to use createObjectQLAdmin middleware for serving the admin interface, and moved the admin HTML to the new package.

Author: hotlong

examples/apps/express/package.json

@@ -12,6 +12,7 @@
     "@objectql/driver-knex": "^0.1.0",
     "@objectql/driver-mongo": "^0.1.0",
     "@objectql/express": "^0.1.0",
+    "@objectql/admin": "*",
     "@example/project-management": "*",
     "cors": "^2.8.5",
     "express": "^4.18.2"

examples/apps/express/src/index.ts

@@ -1,5 +1,6 @@
 import { ObjectQL, ObjectConfig, UnifiedQuery } from '@objectql/core';
 import { createObjectQLRouter } from '@objectql/express';
+import { createObjectQLAdmin } from '@objectql/admin';
 import express from 'express';
 import cors from 'cors';
 import * as path from 'path';
@@ -25,8 +26,8 @@ console.log(`ObjectQL Server started with ${config.packages.length} packages.`);
         server.use(cors());
         server.use(express.json());
 
-        // Serve static files
-        server.use(express.static(path.join(__dirname, '../public')));
+        // Serve Admin UI
+        server.use(createObjectQLAdmin());
 
         // Mount ObjectQL API
         // Example: /api/projects

packages/admin/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "@objectql/admin",
+  "version": "0.1.0",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsc && cp -r public dist/"
+  },
+  "dependencies": {
+    "express": "^4.18.2"
+  },
+  "devDependencies": {
+    "@types/express": "^4.17.17",
+    "typescript": "^5.3.0"
+  }
+}

examples/apps/express/public/index.html packages/admin/public/index.htmlexamples/apps/express/public/index.html renamed to packages/admin/public/index.html

@@ -5,8 +5,6 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
     <title>ObjectQL Admin</title>
 
-    <!-- SF Pro Font look-alike -->
-    <link rel="stylesheet" href="https://rsms.me/inter/inter.css">
     <link href="https://cdn.jsdelivr.net/npm/remixicon@4.1.0/fonts/remixicon.css" rel="stylesheet">
     <script src="https://cdn.tailwindcss.com"></script>
     <script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.14.8/dist/cdn.min.js"></script>

packages/admin/src/index.ts

@@ -0,0 +1,13 @@
+import express, { Router } from 'express';
+import * as path from 'path';
+
+export function createObjectQLAdmin(): Router {
+    const router = express.Router();
+    // Assuming 'public' is copied to 'dist/public' during build
+    // And this file is compiled to 'dist/index.js'
+    const publicPath = path.join(__dirname, 'public');
+    
+    router.use(express.static(publicPath));
+    
+    return router;
+}

packages/admin/tsconfig.json

@@ -0,0 +1,8 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "./dist",
+    "rootDir": "./src"
+  },
+  "include": ["src/**/*"]
+}