Merge pull request #31 from ikuzweelisa/new-ui

Improvements

Author: shemaikuzwe

.eslintrc.json

@@ -1,3 +1,4 @@
 {
-    "typescript.tsdk": "node_modules/typescript/lib"
+    "typescript.tsdk": "node_modules/typescript/lib",
+    "typescript.experimental.useTsgo": true
 }

.vscode/settings.json

@@ -4,7 +4,7 @@
 
 This is a Next.js application that provides a chat interface for interacting with an AI. It uses a variety of modern web technologies to provide a feature-rich experience.
 
-The project is a "Code Copilot" chat bot. It allows users to generate responses, copy messages, regenerate messages, save and retrieve chats from a database, and upload attachments.
+The project is a " Chat" chat bot. It allows users to generate responses, copy messages, regenerate messages, save and retrieve chats from a database, and upload attachments.
 
 ## Building and Running
 
@@ -38,7 +38,7 @@ To get started with this project, you'll need to have Node.js and pnpm installed
 
 ### Other useful commands:
 
-*   `pnpm run lint`: Lint the code.
+*   `pnpm run lint`: Lint the .
 *   `pnpm run typecheck`: Run the TypeScript compiler to check for type errors.
 *   `pnpm run db:push`: Push database schema changes.
 *   `pnpm run db:generate`: Generate database migration files.
@@ -52,5 +52,5 @@ To get started with this project, you'll need to have Node.js and pnpm installed
 *   **Database:** The project uses a PostgreSQL database with [Drizzle ORM](https://orm.drizzle.team/). The database schema is defined in `lib/drizzle/schema.ts`.
 *   **Styling:** The project uses [Tailwind CSS](https://tailwindcss.com/) for styling.
 *   **UI Components:** The project uses [Radix UI](https://www.radix-ui.com/) and custom components for the user interface.
-*   **Linting and Formatting:** The project uses [ESLint](https://eslint.org/) for linting and [Prettier](https://prettier.io/) for code formatting.
+*   **Linting and Formatting:** The project uses [ESLint](https://eslint.org/) for linting and [Prettier](https://prettier.io/) for  formatting.
 *   **Type Checking:** The project uses [TypeScript](https://www.typescriptlang.org/) for static type checking.

GEMINI.md

@@ -1,6 +1,6 @@
-## Code Copilot
+##  
 
-Code Copilot Chat bot
+ Chat Chat bot
 
 > Some Features may not work or Contain bugs.
 >
@@ -19,7 +19,7 @@ Code Copilot Chat bot
 - [x] Update Chat from database
 - [x] Show Chat History
 - [ ] Canvas Feature
-- [ ] Run code using web container
+- [ ] Run  using web container
 
 ## Technologies
 

README.md

@@ -5,7 +5,7 @@ import { SidebarProvider, SidebarTrigger } from "~/components/ui/sidebar";
 export default function Layout({ children }: { children: React.ReactNode }) {
   return (
     <div className="h-0">
-      <SidebarProvider defaultOpen={false}>
+      <SidebarProvider>
         <Navbar />
         <main className=" w-full h-screen overflow-hidden bg-muted/50">
           <SidebarTrigger />

app/(home)/layout.tsx

@@ -0,0 +1,6 @@
+import React from "react";
+import { Settings } from "~/components/settings";
+
+export default function page() {
+  return <Settings />;
+}

app/(home)/settings/page.tsx

@@ -0,0 +1,4 @@
+import { toNextJsHandler } from "better-auth/next-js";
+import { auth } from "~/lib/auth";
+
+export const { POST, GET } = toNextJsHandler(auth);

app/api/auth/[...auth]/route.ts

@@ -0,0 +1,24 @@
+import { UI_MESSAGE_STREAM_HEADERS } from "ai";
+import { after } from "next/server";
+import { createResumableStreamContext } from "resumable-stream/ioredis";
+import { getChatById } from "~/lib/server";
+
+export async function GET(
+  _: Request,
+  { params }: { params: Promise<{ id: string }> }
+) {
+  const { id } = await params;
+  const chat = await getChatById(id);
+  if (!chat || chat.activeStreamId == null) {
+    // no content response when there is no active stream
+    return new Response(null, { status: 204 });
+  }
+  const streamContext = createResumableStreamContext({
+    waitUntil: after,
+  });
+
+  return new Response(
+    await streamContext.resumeExistingStream(chat.activeStreamId),
+    { headers: UI_MESSAGE_STREAM_HEADERS }
+  );
+}

app/api/auth/[...nextauth]/route.ts

@@ -1,26 +1,84 @@
-import { NextRequest } from "next/server";
+import type { NextRequest } from "next/server";
 import { systemPrompt } from "~/lib/ai/prompt";
 import { chatSchema } from "./schema";
 import { models } from "~/lib/ai/models";
-import { convertToModelMessages, streamText } from "ai";
-import { saveChatData } from "~/lib/server";
+import { convertToModelMessages, generateId, streamText } from "ai";
+import { getChatById, saveChatData } from "~/lib/server";
 import { cookies } from "next/headers";
+import { after } from "next/server";
+import { createResumableStreamContext } from "resumable-stream/ioredis";
+import { generateMessageId } from "~/lib/ai/utis";
 
 export async function POST(request: NextRequest) {
-  const parsedBody = chatSchema.parse(await request.json());
-  const { id, messages } = parsedBody;
+  const body = await request.json();
+  const parsedBody = chatSchema.parse(body);
+
+  const { id, message, trigger, messageId } = parsedBody;
   const cookieStore = await cookies();
   const modelId = cookieStore.get("model.id")?.value;
-  const model = models.find((m) => m.id === Number(modelId)) ?? models[0];
+  const model = models.find((m) => m.id === modelId) ?? models[0];
+  const chat = await getChatById(id);
+  let messages = chat?.messages ?? [];
+  if (trigger === "submit-message") {
+    messages = [...messages, message];
+  }
+  if (trigger === "regenerate-message") {
+    const messageIndex =
+      messageId == null
+        ? messages.length - 1
+        : messages.findIndex((message) => message.id === messageId);
+
+    if (messageIndex === -1) {
+      throw new Error(`message ${messageId} not found`);
+    }
+
+    // set the messages to the message before the assistant message
+    messages = messages.slice(
+      0,
+      messages[messageIndex].role === "assistant"
+        ? messageIndex
+        : messageIndex + 1
+    );
+  }
   const coreMessage = convertToModelMessages(messages);
+
+  await saveChatData({
+    id: id,
+    messages: messages,
+    streamId: null,
+  });
   const result = streamText({
     model: model.model,
     messages: coreMessage,
     system: systemPrompt,
   });
+
   return result.toUIMessageStreamResponse({
-    async onFinish({ messages, responseMessage }) {
-      await saveChatData(id, [...messages, responseMessage]);
+    generateMessageId: generateMessageId,
+    originalMessages: messages,
+    messageMetadata: ({ part }) => {
+      if (part.type === "start") {
+        return {
+          createdAt: Date.now(),
+          model: model.name,
+        };
+      }
+      if (part.type === "finish") {
+        return {
+          totalTokens: part.totalUsage.totalTokens,
+        };
+      }
+    },
+    onFinish: async ({ messages }) => {
+      //generete title when model is done
+      await saveChatData({ id, messages, streamId: null, genTittle: true });
+    },
+    async consumeSseStream({ stream }) {
+      const streamId = generateId();
+      const streamContext = createResumableStreamContext({ waitUntil: after });
+      await streamContext.createNewResumableStream(streamId, () => stream);
+      // Update the chat with the active stream ID
+      await saveChatData({ id, streamId: streamId });
     },
   });
 }