chat: static build

Author: hugodutka

chat/README.md

@@ -2,7 +2,7 @@
 
 A simple ChatGPT-like interface for AgentAPI. It's a demo showcasing how to use AgentAPI. 95% of the code was generated with Claude Code.
 
-## Setup
+## Development Setup
 
 1. Ensure the AgentAPI backend server is running on `localhost:3284`
 
@@ -19,3 +19,25 @@ A simple ChatGPT-like interface for AgentAPI. It's a demo showcasing how to use
    ```
 
 4. Open [http://localhost:3000](http://localhost:3000) in your browser
+
+## Static Build for Hosting
+
+This application can be built as a static site for deployment to any static web hosting service.
+
+### Building the Static Site
+
+```bash
+# Generate the static export
+npm run export
+```
+
+This will create a static build in the `out` directory, which can be deployed to any static hosting service.
+
+### Testing the Static Build Locally
+
+```bash
+# Serve the static files locally
+npm run serve-static
+```
+
+This will start a local server to test the static build.

chat/next.config.mjs

@@ -1,19 +1,14 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
-  async headers() {
-    return [
-      {
-        // matching all API routes
-        source: "/api/:path*",
-        headers: [
-          { key: "Access-Control-Allow-Credentials", value: "true" },
-          { key: "Access-Control-Allow-Origin", value: "*" },
-          { key: "Access-Control-Allow-Methods", value: "GET,DELETE,PATCH,POST,PUT" },
-          { key: "Access-Control-Allow-Headers", value: "X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version" },
-        ]
-      }
-    ];
-  }
+  // Enable static exports
+  output: 'export',
+  
+  // Disable image optimization since it's not supported in static exports
+  images: {
+    unoptimized: true,
+  },
+  
+  // Remove headers config for static export
 };
 
 export default nextConfig;

chat/package.json

@@ -6,7 +6,9 @@
     "dev": "next dev --turbopack",
     "build": "next build",
     "start": "next start",
-    "lint": "next lint"
+    "lint": "next lint",
+    "export": "next build",
+    "serve-static": "npx serve out"
   },
   "dependencies": {
     "react": "^19.0.0",

chat/src/app/page.tsx

@@ -1,11 +1,15 @@
+import { Suspense } from 'react';
 import ChatInterface from '@/components/ChatInterface';
 
 export default function Home() {
   return (
     <main className="flex min-h-screen flex-col items-center justify-between p-4 md:p-12">
       <div className="w-full max-w-5xl">
         <h1 className="text-3xl font-bold mb-6 text-center">AgentAPI Chat</h1>
-        <ChatInterface />
+        {/* Use Suspense boundary for useSearchParams in ChatInterface */}
+        <Suspense fallback={<div className="text-center p-4">Loading chat interface...</div>}>
+          <ChatInterface />
+        </Suspense>
       </div>
     </main>
   );