feat: ditch triplit, move to postgresql + drizzle orm

app/pages/agent/[id]/index.vue

@@ -2,16 +2,14 @@
 import type { BaseMessage } from '~/composables/useChat';
 import type { ModelWithProvider } from '~/composables/useModels';
 
-const triplit = useTriplitClient();
-
 const route = useRoute();
 const inputValue = ref<BaseMessage>({ content: '', fileIds: [] });
 const pendingMessage = ref<Message | null>(null);
 
 const { open: sidebarOpen, openSidebar } = useSidebar();
-const { createTopic, sendMessage, autoRename } = useChat(route.params.id as string);
-const { getAgent } = useAgents();
-const { providers } = useModels();
+const { autoRename: autoRenameTopic } = useTopic();
+const { getAgent, createTopic } = await useAgents();
+const { providers } = await useModels();
 
 const agent = getAgent(route.params.id as string);
 
@@ -31,10 +29,13 @@ const handleSubmit = async (message: BaseMessage, model: ModelWithProvider | nul
         return;
     }
 
+    console.log("handleSubmit", message);
+    if (!message.content) return;
+
     pendingMessage.value = {
         id: '',
         userId: user.value!.id,
-        topicId: null,
+        topicId: '',
         content: message.content,
         role: 'user',
         parts: [],
@@ -46,37 +47,33 @@ const handleSubmit = async (message: BaseMessage, model: ModelWithProvider | nul
         attachments: [],
         deleted: false,
         createdAt: new Date(),
+        updatedAt: new Date(),
     }
 
-    const topic = await createTopic();
+    const topic = await createTopic(agent.value!.id);
     if (!topic) throw new Error('Failed to create topic');
 
-    autoRename(topic.id, message.content);
+    const { sendMessage, startGeneration } = await useChat(topic.id, false);
 
-    await navigateTo(`/agent/${route.params.id}/topic/${topic.id}`);
-
-    return sendMessage(message, topic, [], agent.value!, model.provider, model).then(async res => {
+    sendMessage(message).then(async res => {
         if (res.ok === false) {
             console.error('Failed to send message:', res.error);
 
             pendingMessage.value = null;
 
             await navigateTo(`/agent/${route.params.id}`);
-            await triplit.delete('topics', topic.id);
 
-            // const chatInput = document.getElementById('chat') as HTMLInputElement;
-            // if (chatInput) {
-            //     chatInput.value = message;
-            //     chatInput.dispatchEvent(new Event('input'));
-            //     nextTick(() => {
-            //         chatInput.focus();
-            //     });
-            // }
             nextTick(() => {
                 inputValue.value = message;
             });
         }
     });
+
+    await navigateTo(`/agent/${route.params.id}/topic/${topic.id}`);
+
+    autoRenameTopic(topic.id);
+
+    return startGeneration(model);
 };
 </script>
 
@@ -86,10 +83,10 @@ const handleSubmit = async (message: BaseMessage, model: ModelWithProvider | nul
         <div class="h-14 flex items-center justify-between px-4 border-b border-[var(--color-border)]">
             <div class="flex items-center gap-2 max-w-full">
                 <button v-if="!sidebarOpen" @click="openSidebar"
-                    class="flex p-2 rounded-lg text-[var(--text-primary)] bg-transparent hover:bg-[var(--color-hover)] transition-colors">
+                    class="flex p-2 rounded-lg text-[var(--text-primary)] bg-transparent @hover:bg-[var(--color-hover)] transition-colors">
                     <span class="i-mynaui-panel-left-open text-5"></span>
                 </button>
-                <h4 class="text-lg text-ellipsis overflow-hidden whitespace-nowrap">
+                <h4 class="text-lg truncate">
                     {{ agent?.name }}
                 </h4>
             </div>