setup postgres and kyseley for most data instead of milvus

pages/chat/@id/+Page.tsx

@@ -0,0 +1,142 @@
+import { JsonInput, Tabs, Textarea } from "@mantine/core";
+import { trpc } from "../../../trpc/client";
+import type { Message as UIMessage } from "ai";
+import { useEffect } from "react";
+import {
+  defaultParameters,
+  defaultSystemPrompt,
+  useStore,
+} from "../../../state";
+import { usePageContext } from "vike-react/usePageContext";
+import { useData } from "vike-react/useData";
+import type { Data } from "./+data";
+import type { ConversationsId } from "../../../database/generated/public/Conversations";
+
+export default function ChatPage() {
+  const pageContext = usePageContext();
+  const conversationId = Number(pageContext.routeParams.id) as ConversationsId;
+  const conversationTitle = useStore((state) => state.conversationTitle);
+  const messages = useStore((state) => state.messages);
+  const message = useStore((state) => state.message);
+  const systemPrompt = useStore((state) => state.systemPrompt);
+  const parameters = useStore((state) => state.parameters);
+  const loading = useStore((state) => state.loading);
+  const setConversationId = useStore((state) => state.setConversationId);
+  const setConversationTitle = useStore((state) => state.setConversationTitle);
+  const setMessages = useStore((state) => state.setMessages);
+  const setMessage = useStore((state) => state.setMessage);
+  const setSystemPrompt = useStore((state) => state.setSystemPrompt);
+  const setParameters = useStore((state) => state.setParameters);
+  const setLoading = useStore((state) => state.setLoading);
+
+  const conversation = useData<Data>();
+
+  useEffect(() => {
+    setConversationId(conversationId);
+  }, [conversationId, setConversationId]);
+
+  useEffect(() => {
+    if (conversation?.id && conversation?.title) {
+      setConversationId(conversation.id);
+      setConversationTitle(conversation.title);
+    }
+  }, [
+    conversation?.id,
+    conversation?.title,
+    setConversationId,
+    setConversationTitle,
+  ]);
+
+  return (
+    <>
+      <div>
+        <span>Conversation #{conversationId} - </span>
+        <input
+          type="text"
+          value={conversationTitle}
+          onChange={(e) => {
+            setConversationTitle(e.target.value);
+          }}
+          onBlur={(e) => {
+            trpc.chat.updateConversationTitle.mutate({
+              id: conversationId,
+              title: e.target.value,
+            });
+          }}
+        />
+      </div>
+      <Tabs defaultValue="message">
+        <Tabs.List>
+          <Tabs.Tab value="message">Message</Tabs.Tab>
+          <Tabs.Tab value="system-prompt">System Prompt</Tabs.Tab>
+          <Tabs.Tab value="parameters">Parameters</Tabs.Tab>
+        </Tabs.List>
+        <Tabs.Panel value="message">
+          <Messages messages={messages} />
+          <Textarea
+            resize="vertical"
+            placeholder="Type your message here..."
+            value={message}
+            disabled={loading}
+            onChange={(e) => setMessage(e.target.value)}
+            onKeyDown={async (e) => {
+              if (e.key === "Enter") {
+                e.preventDefault();
+                const messagesWithNewUserMessage = [
+                  ...messages,
+                  { role: "user" as const, content: message } as UIMessage,
+                ];
+                setMessages(messagesWithNewUserMessage);
+                setLoading(true);
+                const response = await trpc.chat.sendMessage.query({
+                  messages: messagesWithNewUserMessage,
+                  systemPrompt,
+                  parameters,
+                });
+                const messagesWithAssistantMessage = [
+                  ...messagesWithNewUserMessage,
+                  { role: "assistant", content: response.text } as UIMessage,
+                ];
+                setMessages(messagesWithAssistantMessage);
+                setMessage("");
+                setLoading(false);
+              }
+            }}
+          />
+        </Tabs.Panel>
+        <Tabs.Panel value="system-prompt">
+          <Textarea
+            resize="vertical"
+            placeholder={defaultSystemPrompt}
+            value={systemPrompt}
+            onChange={(e) => setSystemPrompt(e.target.value)}
+          />
+        </Tabs.Panel>
+        <Tabs.Panel value="parameters">
+          <JsonInput
+            resize="vertical"
+            formatOnBlur
+            placeholder={JSON.stringify(defaultParameters)}
+            value={JSON.stringify(parameters)}
+            onChange={(value) => setParameters(JSON.parse(value))}
+          />
+        </Tabs.Panel>
+      </Tabs>
+    </>
+  );
+}
+
+function Messages({
+  messages,
+}: {
+  messages: Array<UIMessage>;
+}) {
+  return (
+    <div>
+      {messages.map((message, index) => (
+        // biome-ignore lint/suspicious/noArrayIndexKey: <explanation>
+        <div key={index}>{message.content}</div>
+      ))}
+    </div>
+  );
+}

pages/chat/@id/+data.ts

@@ -0,0 +1,13 @@
+import type { PageContextServer } from "vike/types";
+import { createCaller } from "../trpc.js";
+
+export type Data = Awaited<ReturnType<typeof data>>;
+
+export const data = async (pageContext: PageContextServer) => {
+  const { id } = pageContext.routeParams;
+  const caller = createCaller({});
+  const conversation = await caller.fetchConversation({
+    id: Number(id),
+  });
+  return conversation;
+};