feat(api-docs): integrate OpenAPI specification directly into ApiDocs component and remove redundant route

app/api-docs/page.tsx

@@ -1,6 +1,178 @@
 import { ApiReferenceReact } from '@scalar/api-reference-react'
 import '@scalar/api-reference-react/style.css'
 
+const openApiSpec = {
+  openapi: '3.0.3',
+  info: {
+    title: 'Vtorio API',
+    version: '1.0.0',
+    description: 'File upload and management API for Vtorio application',
+  },
+  servers: [
+    {
+      url: 'http://localhost:3000',
+      description: 'Development server',
+    },
+  ],
+  components: {
+    schemas: {
+      File: {
+        type: 'object',
+        properties: {
+          id: { type: 'string' },
+          filename: { type: 'string' },
+          mimetype: { type: 'string' },
+          size: { type: 'number' },
+          createdAt: { type: 'string', format: 'date-time' },
+          updatedAt: { type: 'string', format: 'date-time' },
+        },
+        required: ['id', 'filename', 'mimetype', 'size', 'createdAt'],
+      },
+      Error: {
+        type: 'object',
+        properties: {
+          success: { type: 'boolean', example: false },
+          error: { type: 'string' },
+        },
+        required: ['success', 'error'],
+      },
+    },
+  },
+  paths: {
+    '/api/upload': {
+      post: {
+        summary: 'Upload a file',
+        description: 'Upload a file to the server and store it in the database',
+        tags: ['Files'],
+        requestBody: {
+          required: true,
+          content: {
+            'multipart/form-data': {
+              schema: {
+                type: 'object',
+                properties: {
+                  file: {
+                    type: 'string',
+                    format: 'binary',
+                    description: 'The file to upload',
+                  },
+                },
+                required: ['file'],
+              },
+            },
+          },
+        },
+        responses: {
+          '200': {
+            description: 'File uploaded successfully',
+            content: {
+              'application/json': {
+                schema: {
+                  type: 'object',
+                  properties: {
+                    success: { type: 'boolean', example: true },
+                    file: { $ref: '#/components/schemas/File' },
+                  },
+                },
+              },
+            },
+          },
+          '400': {
+            description: 'Bad request',
+            content: {
+              'application/json': {
+                schema: { $ref: '#/components/schemas/Error' },
+              },
+            },
+          },
+          '500': {
+            description: 'Internal server error',
+            content: {
+              'application/json': {
+                schema: { $ref: '#/components/schemas/Error' },
+              },
+            },
+          },
+        },
+      },
+    },
+    '/api/files': {
+      get: {
+        summary: 'List all files',
+        description: 'Get a list of all uploaded files with metadata',
+        tags: ['Files'],
+        responses: {
+          '200': {
+            description: 'List of files retrieved successfully',
+            content: {
+              'application/json': {
+                schema: {
+                  type: 'object',
+                  properties: {
+                    success: { type: 'boolean', example: true },
+                    files: {
+                      type: 'array',
+                      items: { $ref: '#/components/schemas/File' },
+                    },
+                  },
+                },
+              },
+            },
+          },
+        },
+      },
+    },
+    '/api/files/{id}': {
+      get: {
+        summary: 'Download a file',
+        description: 'Download a specific file by its ID',
+        tags: ['Files'],
+        parameters: [
+          {
+            name: 'id',
+            in: 'path',
+            required: true,
+            description: 'The ID of the file to download',
+            schema: {
+              type: 'string',
+              example: 'clh123abc456',
+            },
+          },
+        ],
+        responses: {
+          '200': {
+            description: 'File downloaded successfully',
+            content: {
+              'application/octet-stream': {
+                schema: {
+                  type: 'string',
+                  format: 'binary',
+                },
+              },
+            },
+          },
+          '404': {
+            description: 'File not found',
+            content: {
+              'application/json': {
+                schema: { $ref: '#/components/schemas/Error' },
+              },
+            },
+          },
+          '500': {
+            description: 'Internal server error',
+            content: {
+              'application/json': {
+                schema: { $ref: '#/components/schemas/Error' },
+              },
+            },
+          },
+        },
+      },
+    },
+  },
+}
+
 export default function ApiDocs() {
   return (
     <div className="min-h-screen bg-gray-50">
@@ -17,7 +189,8 @@ export default function ApiDocs() {
             </div>
             <ApiReferenceReact 
               configuration={{
-                url: '/api/openapi.json',
+                // url: '/api/openapi.json',
+                content: openApiSpec,
                 theme: 'default',
                 layout: 'modern'
               }}

app/api/openapi.json/route.ts

@@ -1,181 +0,0 @@
-import { NextResponse } from 'next/server';
-
-const openApiSpec = {
-  openapi: '3.0.3',
-  info: {
-    title: 'Vtorio API',
-    version: '1.0.0',
-    description: 'File upload and management API for Vtorio application',
-  },
-  servers: [
-    {
-      url: 'http://localhost:3000',
-      description: 'Development server',
-    },
-  ],
-  components: {
-    schemas: {
-      File: {
-        type: 'object',
-        properties: {
-          id: { type: 'string' },
-          filename: { type: 'string' },
-          mimetype: { type: 'string' },
-          size: { type: 'number' },
-          createdAt: { type: 'string', format: 'date-time' },
-          updatedAt: { type: 'string', format: 'date-time' },
-        },
-        required: ['id', 'filename', 'mimetype', 'size', 'createdAt'],
-      },
-      Error: {
-        type: 'object',
-        properties: {
-          success: { type: 'boolean', example: false },
-          error: { type: 'string' },
-        },
-        required: ['success', 'error'],
-      },
-    },
-  },
-  paths: {
-    '/api/upload': {
-      post: {
-        summary: 'Upload a file',
-        description: 'Upload a file to the server and store it in the database',
-        tags: ['Files'],
-        requestBody: {
-          required: true,
-          content: {
-            'multipart/form-data': {
-              schema: {
-                type: 'object',
-                properties: {
-                  file: {
-                    type: 'string',
-                    format: 'binary',
-                    description: 'The file to upload',
-                  },
-                },
-                required: ['file'],
-              },
-            },
-          },
-        },
-        responses: {
-          '200': {
-            description: 'File uploaded successfully',
-            content: {
-              'application/json': {
-                schema: {
-                  type: 'object',
-                  properties: {
-                    success: { type: 'boolean', example: true },
-                    file: { $ref: '#/components/schemas/File' },
-                  },
-                },
-              },
-            },
-          },
-          '400': {
-            description: 'Bad request',
-            content: {
-              'application/json': {
-                schema: { $ref: '#/components/schemas/Error' },
-              },
-            },
-          },
-          '500': {
-            description: 'Internal server error',
-            content: {
-              'application/json': {
-                schema: { $ref: '#/components/schemas/Error' },
-              },
-            },
-          },
-        },
-      },
-    },
-    '/api/files': {
-      get: {
-        summary: 'List all files',
-        description: 'Get a list of all uploaded files with metadata',
-        tags: ['Files'],
-        responses: {
-          '200': {
-            description: 'List of files retrieved successfully',
-            content: {
-              'application/json': {
-                schema: {
-                  type: 'object',
-                  properties: {
-                    success: { type: 'boolean', example: true },
-                    files: {
-                      type: 'array',
-                      items: { $ref: '#/components/schemas/File' },
-                    },
-                  },
-                },
-              },
-            },
-          },
-        },
-      },
-    },
-    '/api/files/{id}': {
-      get: {
-        summary: 'Download a file',
-        description: 'Download a specific file by its ID',
-        tags: ['Files'],
-        parameters: [
-          {
-            name: 'id',
-            in: 'path',
-            required: true,
-            description: 'The ID of the file to download',
-            schema: {
-              type: 'string',
-              example: 'clh123abc456',
-            },
-          },
-        ],
-        responses: {
-          '200': {
-            description: 'File downloaded successfully',
-            content: {
-              'application/octet-stream': {
-                schema: {
-                  type: 'string',
-                  format: 'binary',
-                },
-              },
-            },
-          },
-          '404': {
-            description: 'File not found',
-            content: {
-              'application/json': {
-                schema: { $ref: '#/components/schemas/Error' },
-              },
-            },
-          },
-          '500': {
-            description: 'Internal server error',
-            content: {
-              'application/json': {
-                schema: { $ref: '#/components/schemas/Error' },
-              },
-            },
-          },
-        },
-      },
-    },
-  },
-};
-
-export const GET = async () => {
-  return NextResponse.json(openApiSpec, {
-    headers: {
-      'Content-Type': 'application/json',
-    },
-  });
-};

app/components/header.tsx

@@ -14,7 +14,7 @@ import {
 } from "@/components/ui/navigation-menu";
 import { Button } from "@/components/ui/button";
 import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet";
-import { Menu, FileText, Upload, Home, Folder, Settings, User, LogOut, LogIn } from "lucide-react";
+import { Menu, FileText, Home, Folder, Settings, User, LogOut, LogIn } from "lucide-react";
 import { cn } from "@/lib/utils";
 import React from "react";
 
@@ -31,12 +31,6 @@ const navigationItems = [
     description: "View API documentation",
     icon: FileText,
   },
-  {
-    title: "API Docs2",
-    href: "/reference",
-    description: "View API documentation",
-    icon: FileText,
-  },
 ];
 
 const userMenuItems = [

app/reference/route.ts

@@ -1,8 +0,0 @@
-// app/reference/route.ts
-import { ApiReference } from '@scalar/nextjs-api-reference'
-
-const config = {
-  url: '/api/openapi.json',
-}
-
-export const GET = ApiReference(config)