fix: bug related to chat history or continuity chat

apps/web/src/app/(app)/@user/card.tsx

@@ -35,6 +35,7 @@ export function ChatCard() {
           onFinish={() => utils.chat.get.invalidate()}
           initialMessages={initialMessages}
           placeholder={"/ : " + t("chooseTopic")}
+          id={data?.id}
         />
       </CardContent>
       <CardFooter>

apps/web/src/app/api/chat/route.ts

@@ -9,6 +9,8 @@ import { getLocale } from "next-intl/server";
 import { z } from "zod";
 import { fromZodError } from "zod-validation-error";
 
+import { generateId } from "@tanya.in/ui";
+
 // TODO: Remove this when backend has domain
 // export const runtime = "edge";
 
@@ -25,16 +27,16 @@ export async function POST(req: Request) {
     return new Response("Unauthorized", { status: 401 });
   }
 
-  const { success } = await ratelimit.limit(session.user.id);
-  if (!success) return new Response("Too many request", { status: 429 });
+  const limiter = await ratelimit.limit(session.user.id);
+  if (!limiter.success)
+    return new Response("Too many request", { status: 429 });
 
   const body = z
     .object({
       chatId: z.string(),
       messages: z
         .object({
           id: z.string(),
-          role: z.enum(["user", "assistant"] as const),
           content: z.string(),
         })
         .array(),
@@ -45,7 +47,11 @@ export async function POST(req: Request) {
     const error = fromZodError(body.error).toString();
     return new Response(error, { status: 400 });
   }
-  const lastMessage = body.data.messages.pop()?.content;
+  const lastMessage = body.data.messages.pop();
+
+  if (!lastMessage) {
+    return new Response("No message", { status: 400 });
+  }
 
   const isTesting = await get("testing");
   const res = await fetch(
@@ -58,7 +64,7 @@ export async function POST(req: Request) {
       },
       body: JSON.stringify({
         id: body.data.chatId,
-        question: lastMessage,
+        question: lastMessage.content,
         isBahasa: (await getLocale()) === "id",
       }),
     },
@@ -83,8 +89,9 @@ export async function POST(req: Request) {
     .returning({ id: chats.id });
 
   await db.insert(messages).values({
+    id: lastMessage.id,
     chatId: chatId[0]?.id ?? body.data.chatId,
-    content: lastMessage ?? "",
+    content: lastMessage.content,
   });
 
   const reader = res.body.getReader();
@@ -95,6 +102,7 @@ export async function POST(req: Request) {
         const { done, value } = await reader.read();
         if (done) {
           await db.insert(messages).values({
+            id: generateId(),
             chatId: chatId[0]?.id ?? body.data.chatId,
             content: data,
           });

apps/web/src/server/api/routers/chat/chat.procedure.ts

@@ -37,7 +37,11 @@ export const chatRouter = createTRPCRouter({
       return await ctx.db.query.chats.findFirst({
         where: (chat, { eq }) => eq(chat.id, input.id),
         with: {
-          messages: true,
+          messages: {
+            columns: {
+              chatId: false,
+            },
+          },
         },
       });
     }),

apps/web/src/server/db/schema.ts

@@ -38,9 +38,7 @@ export const chatRelations = relations(chats, ({ many }) => ({
 }));
 
 export const messages = createTable("message", {
-  id: text("id")
-    .primaryKey()
-    .$defaultFn(() => crypto.randomUUID()),
+  id: text("id").primaryKey(),
   content: text("content").notNull(),
   createdAt: timestamp("created_at", { mode: "date" }).defaultNow(),
   chatId: uuid("chat_id")

packages/ui/src/chat.tsx

@@ -48,8 +48,9 @@ export function Chat({
   onFinish,
   initialMessages,
   placeholder,
+  id,
 }: UseChatOptions & { placeholder?: string }) {
-  const chatId = React.useMemo(() => crypto.randomUUID(), []);
+  const chatId = React.useMemo(() => (id ? id : crypto.randomUUID()), [id]);
 
   const {
     messages,
@@ -62,6 +63,7 @@ export function Chat({
     sendExtraMessageFields: true,
     onFinish,
     initialMessages,
+    id,
   });
   const chatContainerRef = useChatScroll(messages);
 

packages/ui/src/index.ts

@@ -1,8 +1,9 @@
 import type { Message } from "ai";
 import { NextUIProvider } from "@nextui-org/system";
+import { generateId } from "ai";
 import { cx } from "class-variance-authority";
 import { twMerge } from "tailwind-merge";
 
 const cn = (...inputs: Parameters<typeof cx>) => twMerge(cx(inputs));
 
-export { cn, NextUIProvider, type Message };
+export { cn, NextUIProvider, type Message, generateId };