Refactor API endpoints and add v6 controllers

hotlong · hotlong · commit 7d7671be45c8 · 2026-01-09T22:58:25.000+08:00
Migrates client and UI code to use new /api/v6/data and /api/v6/metadata endpoints. Adds DataController and MetadataController to the server for v6 API, introduces AuthMiddleware for authentication, and updates AppSidebar to use a new NavUser component. Removes legacy objectql router and related code from ObjectQLModule. Updates package dependencies and cleans up header usage in client API.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/client/src/components/app-sidebar.tsx b/packages/client/src/components/app-sidebar.tsx
@@ -12,11 +12,14 @@ import {
   SidebarRail,
   SidebarFooter,
 } from "@objectql/ui"
-import { Database, Settings, FileText } from "lucide-react"
+import { Database, FileText } from "lucide-react"
 import { useRouter } from "../hooks/useRouter"
+import { NavUser } from "./nav-user"
+import { useAuth } from "../context/AuthContext"
 
 export function AppSidebar({ objects, ...props }: React.ComponentProps<typeof Sidebar> & { objects: Record<string, any> }) {
   const { path, navigate } = useRouter()
+  const { user } = useAuth()
   
   return (
     <Sidebar collapsible="icon" {...props}>
@@ -56,17 +59,11 @@ export function AppSidebar({ objects, ...props }: React.ComponentProps<typeof Si
         </SidebarGroup>
       </SidebarContent>
       <SidebarFooter>
-         <SidebarMenu>
-            <SidebarMenuItem>
-                <SidebarMenuButton 
-                  isActive={path === '/settings'}
-                  onClick={() => navigate('/settings')}
-                >
-                    <Settings />
-                    <span>Settings</span>
-                </SidebarMenuButton>
-            </SidebarMenuItem>
-         </SidebarMenu>
+         <NavUser user={{
+             name: user?.name || 'User',
+             email: user?.email || '',
+             avatar: user?.image
+         }} />
       </SidebarFooter>
       <SidebarRail />
     </Sidebar>
diff --git a/packages/client/src/components/dashboard/ObjectDetailView.tsx b/packages/client/src/components/dashboard/ObjectDetailView.tsx
@@ -22,11 +22,11 @@ export function ObjectDetailView({ objectName, recordId, navigate, objectSchema
     useEffect(() => {
         setLoading(true);
         Promise.all([
-            fetch(`/api/object/${objectName}/${recordId}`, { headers: getHeaders() }).then(async r => {
+            fetch(`/api/v6/data/${objectName}/${recordId}`, { headers: getHeaders() }).then(async r => {
                     if (!r.ok) throw new Error("Failed to load record");
                     return r.json();
             }),
-            fetch(`/api/object/_schema/object/${objectName}`, { headers: getHeaders() }).then(r => r.json())
+            fetch(`/api/v6/metadata/object/${objectName}`, { headers: getHeaders() }).then(r => r.json())
         ]).then(([record, schemaData]) => {
             setData(record);
             setSchema(schemaData);
@@ -36,15 +36,15 @@ export function ObjectDetailView({ objectName, recordId, navigate, objectSchema
 
     const handleDelete = () => {
             if (!confirm('Are you sure you want to delete this record?')) return;
-            fetch(`/api/object/${objectName}/${recordId}`, {
+            fetch(`/api/v6/data/${objectName}/${recordId}`, {
             method: 'DELETE',
             headers: getHeaders()
         }).then(() => navigate(`/object/${objectName}`))
         .catch(e => alert(e.message));
     };
     
     const handleUpdate = (formData: any) => {
-            fetch(`/api/object/${objectName}/${recordId}`, {
+            fetch(`/api/v6/data/${objectName}/${recordId}`, {
             method: 'PUT',
             headers: getHeaders(),
             body: JSON.stringify(formData)
@@ -54,7 +54,7 @@ export function ObjectDetailView({ objectName, recordId, navigate, objectSchema
         }).then(() => {
             setIsEditing(false);
             // Reload data
-            fetch(`/api/object/${objectName}/${recordId}`, { headers: getHeaders() })
+            fetch(`/api/v6/data/${objectName}/${recordId}`, { headers: getHeaders() })
                 .then(r => r.json())
                 .then(setData);
         }).catch(e => alert(e.message));
diff --git a/packages/client/src/components/dashboard/ObjectForm.tsx b/packages/client/src/components/dashboard/ObjectForm.tsx
@@ -17,7 +17,7 @@ export function ObjectForm({ objectName, initialValues, onSubmit, onCancel, head
     });
 
     useEffect(() => {
-         fetch(`/api/object/_schema/object/${objectName}`, { headers })
+         fetch(`/api/v6/metadata/object/${objectName}`, { headers })
             .then(res => res.json())
             .then(res => {
                 setSchema(res);
diff --git a/packages/client/src/components/dashboard/ObjectListView.tsx b/packages/client/src/components/dashboard/ObjectListView.tsx
@@ -102,7 +102,7 @@ export function ObjectListView({ objectName, user, isCreating, navigate, objectS
             }
         }
         
-        fetch(`/api/object/${objectName}?${params.toString()}`, { headers: getHeaders() })
+        fetch(`/api/v6/data/${objectName}?${params.toString()}`, { headers: getHeaders() })
             .then(async res => {
                 if (!res.ok) {
                     const contentType = res.headers.get("content-type");
@@ -131,7 +131,7 @@ export function ObjectListView({ objectName, user, isCreating, navigate, objectS
     }, [objectName, user, sortConfig, debouncedSearch]);
 
     const handleCreate = (formData: any) => {
-        fetch(`/api/object/${objectName}`, {
+        fetch(`/api/v6/data/${objectName}`, {
             method: 'POST',
             headers: getHeaders(),
             body: JSON.stringify(formData)
@@ -153,7 +153,7 @@ export function ObjectListView({ objectName, user, isCreating, navigate, objectS
         if (!confirm('Are you sure you want to delete this record?')) return;
         const id = row.id || row._id;
         
-        fetch(`/api/object/${objectName}/${id}`, {
+        fetch(`/api/v6/data/${objectName}/${id}`, {
             method: 'DELETE',
             headers: getHeaders()
         })
diff --git a/packages/client/src/components/nav-user.tsx b/packages/client/src/components/nav-user.tsx
@@ -0,0 +1,104 @@
+"use client"
+
+import {
+  BadgeCheck,
+  Bell,
+  ChevronsUpDown,
+  CreditCard,
+  LogOut,
+} from "lucide-react"
+
+import {
+  Avatar,
+  AvatarFallback,
+  AvatarImage,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+  SidebarMenu,
+  SidebarMenuButton,
+  SidebarMenuItem,
+  useSidebar,
+} from "@objectql/ui"
+import { useAuth } from "../context/AuthContext"
+
+export function NavUser({
+  user,
+}: {
+  user: {
+    name: string
+    email: string
+    avatar?: string
+  }
+}) {
+  const { isMobile } = useSidebar()
+  const { signOut } = useAuth()
+
+  return (
+    <SidebarMenu>
+      <SidebarMenuItem>
+        <DropdownMenu>
+          <DropdownMenuTrigger asChild>
+            <SidebarMenuButton
+              size="lg"
+              className="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground"
+            >
+              <Avatar className="h-8 w-8 rounded-lg">
+                <AvatarImage src={user.avatar} alt={user.name} />
+                <AvatarFallback className="rounded-lg">{user.name ? user.name.substring(0,2).toUpperCase() : 'U'}</AvatarFallback>
+              </Avatar>
+              <div className="grid flex-1 text-left text-sm leading-tight">
+                <span className="truncate font-semibold">{user.name}</span>
+                <span className="truncate text-xs">{user.email}</span>
+              </div>
+              <ChevronsUpDown className="ml-auto size-4" />
+            </SidebarMenuButton>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent
+            className="w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg"
+            side={isMobile ? "bottom" : "right"}
+            align="end"
+            sideOffset={4}
+          >
+            <DropdownMenuLabel className="p-0 font-normal">
+              <div className="flex items-center gap-2 px-1 py-1.5 text-left text-sm">
+                <Avatar className="h-8 w-8 rounded-lg">
+                  <AvatarImage src={user.avatar} alt={user.name} />
+                  <AvatarFallback className="rounded-lg">{user.name ? user.name.substring(0,2).toUpperCase() : 'U'}</AvatarFallback>
+                </Avatar>
+                <div className="grid flex-1 text-left text-sm leading-tight">
+                  <span className="truncate font-semibold">{user.name}</span>
+                  <span className="truncate text-xs">{user.email}</span>
+                </div>
+              </div>
+            </DropdownMenuLabel>
+            <DropdownMenuSeparator />
+            <DropdownMenuGroup>
+              <DropdownMenuItem>
+                <BadgeCheck className="mr-2 h-4 w-4" />
+                Account
+              </DropdownMenuItem>
+              <DropdownMenuItem>
+                <CreditCard className="mr-2 h-4 w-4" />
+                Billing
+              </DropdownMenuItem>
+              <DropdownMenuItem>
+                <Bell className="mr-2 h-4 w-4" />
+                Notifications
+              </DropdownMenuItem>
+            </DropdownMenuGroup>
+            <DropdownMenuSeparator />
+            <DropdownMenuItem onClick={() => signOut()}>
+              <LogOut className="mr-2 h-4 w-4" />
+              Log out
+            </DropdownMenuItem>
+          </DropdownMenuContent>
+        </DropdownMenu>
+      </SidebarMenuItem>
+    </SidebarMenu>
+  )
+}
diff --git a/packages/client/src/lib/api.ts b/packages/client/src/lib/api.ts
@@ -1,5 +1,4 @@
 export const getHeaders = () => {
     const headers: Record<string, string> = { 'Content-Type': 'application/json' };
-    headers['x-user-id'] = 'admin'; 
     return headers;
 };
diff --git a/packages/client/src/pages/Dashboard.tsx b/packages/client/src/pages/Dashboard.tsx
@@ -37,11 +37,19 @@ export default function Dashboard() {
     useEffect(() => {
         if (user) {
             // Fetch objects
-            fetch('/api/object/_schema/object', { headers: getHeaders() })
+            fetch('/api/v6/metadata/object', { headers: getHeaders() })
                 .then(res => res.json())
                 .then(result => {
-                    const objNames = Object.keys(result);
-                    setObjects(result);
+                    // Convert array to map
+                    const objectsMap: Record<string, any> = {};
+                    if (Array.isArray(result)) {
+                        result.forEach((obj: any) => {
+                            objectsMap[obj.name] = obj;
+                        });
+                    }
+                    
+                    const objNames = Object.keys(objectsMap);
+                    setObjects(objectsMap);
                     
                     const currentPath = window.location.pathname;
                     if ((currentPath === '/' || currentPath === '/object') && objNames.length > 0) {
diff --git a/packages/server/package.json b/packages/server/package.json
@@ -15,6 +15,7 @@
     "@example/project-management": "*",
     "@nestjs/common": "^10.0.0",
     "@nestjs/core": "^10.0.0",
+    "@nestjs/mapped-types": "^2.1.0",
     "@nestjs/platform-express": "^10.0.0",
     "@nestjs/serve-static": "^4.0.2",
     "@objectql/api": "*",
diff --git a/packages/server/src/app.module.ts b/packages/server/src/app.module.ts
@@ -1,10 +1,13 @@
-import { Module, MiddlewareConsumer, RequestMethod } from '@nestjs/common';
+import { Module, MiddlewareConsumer, RequestMethod, NestModule } from '@nestjs/common';
 import { AppController } from './app.controller';
 import { AppService } from './app.service';
 import { ObjectQLModule } from './objectql/objectql.module';
 import { AuthModule } from './auth/auth.module';
 import { ServeStaticModule } from '@nestjs/serve-static';
 import { join } from 'path';
+import { DataController } from './controllers/data.controller';
+import { MetadataController } from './controllers/metadata.controller';
+import { AuthMiddleware } from './auth/auth.middleware';
 
 @Module({
   imports: [
@@ -15,7 +18,13 @@ import { join } from 'path';
       exclude: ['/api/(.*)', '/docs/(.*)'],
     }),
   ],
-  controllers: [AppController],
+  controllers: [AppController, DataController, MetadataController],
   providers: [AppService],
 })
-export class AppModule {}
+export class AppModule implements NestModule {
+  configure(consumer: MiddlewareConsumer) {
+    consumer
+      .apply(AuthMiddleware)
+      .forRoutes({ path: 'api/v6/*', method: RequestMethod.ALL });
+  }
+}
diff --git a/packages/server/src/auth/auth.middleware.ts b/packages/server/src/auth/auth.middleware.ts
@@ -0,0 +1,54 @@
+import { Injectable, NestMiddleware } from '@nestjs/common';
+import { Request, Response, NextFunction } from 'express';
+import { getAuth } from './auth.client';
+
+@Injectable()
+export class AuthMiddleware implements NestMiddleware {
+  async use(req: Request, res: Response, next: NextFunction) {
+    const auth = await getAuth();
+    
+    try {
+        const headers = new Headers();
+        for (const [key, value] of Object.entries(req.headers)) {
+            if (Array.isArray(value)) {
+                value.forEach(v => headers.append(key, v));
+            } else if (value) {
+                headers.append(key, value as string);
+            }
+        }
+
+      const session = await auth.api.getSession({
+          headers: headers
+      });
+      
+      if (session) {
+          req['user'] = {
+              userId: session.user.id,
+              id: session.user.id,
+              ...session.user,
+              roles: session.user.role ? [session.user.role] : [],
+              spaceId: session.session.activeOrganizationId,
+              sessionId: session.session.id,
+              // If user is admin, they are system admin (bypass ACL)
+              isSystem: session.user.role === 'admin'
+          };
+      } else if (req.headers['x-user-id']) {
+          // Fallback for dev/test: trust x-user-id header
+          const userId = req.headers['x-user-id'] as string;
+          const isAdmin = userId === 'admin';
+          req['user'] = {
+              userId: userId,
+              id: userId,
+              roles: isAdmin ? ['admin'] : ['user'],
+              spaceId: req.headers['x-space-id'] as string,
+              isSystem: isAdmin
+          };
+      }
+    } catch (e) {
+      // ignore auth error
+      console.error("Auth Middleware Error:", e);
+    }
+    
+    next();
+  }
+}
diff --git a/packages/server/src/controllers/data.controller.ts b/packages/server/src/controllers/data.controller.ts
diff --git a/packages/server/src/controllers/metadata.controller.ts b/packages/server/src/controllers/metadata.controller.ts
diff --git a/packages/server/src/objectql/objectql.module.ts b/packages/server/src/objectql/objectql.module.ts
diff --git a/packages/ui/src/components/fields/LookupField.tsx b/packages/ui/src/components/fields/LookupField.tsx
