feat: Implement message saving functionality with debouncing in Chat component

app/api/chats/[id]/messages/route.ts

@@ -0,0 +1,39 @@
+import { NextResponse } from "next/server";
+import { saveMessages, convertToDBMessages } from "@/lib/chat-store";
+
+interface Params {
+  params: {
+    id: string;
+  };
+}
+
+export async function POST(request: Request, { params }: Params) {
+  try {
+    const userId = request.headers.get('x-user-id');
+    
+    if (!userId) {
+      return NextResponse.json({ error: "User ID is required" }, { status: 400 });
+    }
+    
+    const { id } = await params;
+    const { messages } = await request.json();
+    
+    if (!messages || !Array.isArray(messages)) {
+      return NextResponse.json({ error: "Messages array is required" }, { status: 400 });
+    }
+    
+    // Convert messages to DB format
+    const dbMessages = convertToDBMessages(messages, id);
+    
+    // Save messages to database
+    await saveMessages({ messages: dbMessages });
+    
+    return NextResponse.json({ success: true });
+  } catch (error) {
+    console.error("Error saving messages:", error);
+    return NextResponse.json(
+      { error: "Failed to save messages" },
+      { status: 500 }
+    );
+  }
+}

components/chat.tsx

@@ -134,7 +134,7 @@ export default function Chat() {
         toast.error(
           error.message.length > 0
             ? error.message
-            : "An error occured, please try again later.",
+            : "An error occurred, please try again later.",
           { position: "top-center", richColors: true },
         );
       },
@@ -159,6 +159,37 @@ export default function Chat() {
     }
   }, [chatId, generatedChatId, input, handleSubmit, router]);
 
+  // Save messages whenever they change (with debouncing)
+  useEffect(() => {
+    const effectiveChatId = chatId || generatedChatId;
+    
+    if (!userId || !effectiveChatId || messages.length === 0) {
+      return;
+    }
+    
+    // Debounce message saving to avoid too many requests
+    const timeoutId = setTimeout(async () => {
+      try {
+        const response = await fetch(`/api/chats/${effectiveChatId}/messages`, {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+            'x-user-id': userId,
+          },
+          body: JSON.stringify({ messages }),
+        });
+        
+        if (!response.ok) {
+          console.error('Failed to save messages:', await response.text());
+        }
+      } catch (error) {
+        console.error('Failed to save messages:', error);
+      }
+    }, 1000); // Save after 1 second of no changes
+    
+    return () => clearTimeout(timeoutId);
+  }, [messages, chatId, generatedChatId, userId]);
+
   const isLoading = status === "streaming" || status === "submitted" || isLoadingChat;
 
   return (

lib/models.ts

@@ -10,22 +10,11 @@ export async function getModels(): Promise<string[]> {
   if (modelsCache) {
     return modelsCache;
   }
-  try {
-    const response = await fetch("https://router.huggingface.co/v1/models");
-    const data = await response.json();
-    const modelIds = data.data
-      .filter((model: any) => model.id !== "THUDM/GLM-4.1V-9B-Thinking")
-      .slice(0, 5)
-      .map((model: any) => model.id);
-    modelsCache = modelIds;
-    return modelIds;
-  } catch (e) {
-    console.error(e);
-    return [];
-  }
+  // Hardcoded to use only SmolLM3-3B model
+  modelsCache = ["HuggingFaceTB/SmolLM3-3B"];
+  return modelsCache;
 }
 
 export async function getDefaultModel(): Promise<ModelID> {
-  const models = await getModels();
-  return models[0] ?? "";
+  return "HuggingFaceTB/SmolLM3-3B";
 }