add "Fact Triggers" tab in UI

pages/chat/@id/+Page.tsx

@@ -35,6 +35,7 @@ export default function ChatPage() {
   const systemPrompt = useStore((state) => state.systemPrompt);
   const parameters = useStore((state) => state.parameters);
   const facts = useStore((state) => state.facts);
+  const factTriggers = useStore((state) => state.factTriggers);
   const loading = useStore((state) => state.loading);
   const setConversationId = useStore((state) => state.setConversationId);
   const setConversationTitle = useStore((state) => state.setConversationTitle);
@@ -43,13 +44,16 @@ export default function ChatPage() {
   const setSystemPrompt = useStore((state) => state.setSystemPrompt);
   const setParameters = useStore((state) => state.setParameters);
   const setFacts = useStore((state) => state.setFacts);
+  const setFactTriggers = useStore((state) => state.setFactTriggers);
   const removeFact = useStore((state) => state.removeFact);
+  const removeFactTrigger = useStore((state) => state.removeFactTrigger);
   const setLoading = useStore((state) => state.setLoading);
 
   const {
     conversation,
     messages: initialMessages,
     facts: initialFacts,
+    factTriggers: initialFactTriggers,
   } = useData<Data>();
 
   useEffect(() => {
@@ -76,11 +80,20 @@ export default function ChatPage() {
     setFacts(initialFacts);
   }, [initialFacts, setFacts]);
 
+  useEffect(() => {
+    setFactTriggers(initialFactTriggers);
+  }, [initialFactTriggers, setFactTriggers]);
+
   async function handleDeleteFact(factId: string) {
     removeFact(factId);
     await trpc.chat.facts.deleteOne.mutate({ factId });
   }
 
+  async function handleDeleteFactTrigger(factTriggerId: string) {
+    removeFactTrigger(factTriggerId);
+    await trpc.chat.factTriggers.deleteOne.mutate({ factTriggerId });
+  }
+
   return (
     <>
       <div>
@@ -105,6 +118,7 @@ export default function ChatPage() {
           <Tabs.Tab value="system-prompt">System Prompt</Tabs.Tab>
           <Tabs.Tab value="parameters">Parameters</Tabs.Tab>
           <Tabs.Tab value="facts">Facts</Tabs.Tab>
+          <Tabs.Tab value="fact-triggers">Fact Triggers</Tabs.Tab>
         </Tabs.List>
         <Tabs.Panel value="message">
           <Messages messages={messages} />
@@ -193,6 +207,24 @@ export default function ChatPage() {
             ))}
           </List>
         </Tabs.Panel>
+        <Tabs.Panel value="fact-triggers">
+          <List>
+            {factTriggers.map((factTrigger) => (
+              <List.Item key={factTrigger.id}>
+                {factTrigger.content}{" "}
+                <IconTrash
+                  size={16}
+                  stroke={1.5}
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    e.preventDefault();
+                    handleDeleteFactTrigger(factTrigger.id);
+                  }}
+                />
+              </List.Item>
+            ))}
+          </List>
+        </Tabs.Panel>
       </Tabs>
     </>
   );

pages/chat/@id/+data.ts

@@ -15,5 +15,13 @@ export const data = async (pageContext: PageContextServer) => {
   const facts = await caller.facts.fetchByConversationId({
     conversationId: id,
   });
-  return { conversation, messages, facts };
+  
+  // Fetch all fact triggers for the conversation's facts
+  const factTriggerPromises = facts.map(fact => 
+    caller.factTriggers.fetchByFactId({ factId: fact.id })
+  );
+  const factTriggersArrays = await Promise.all(factTriggerPromises);
+  const factTriggers = factTriggersArrays.flat();
+  
+  return { conversation, messages, facts, factTriggers };
 };

pages/chat/fact-triggers.ts

@@ -70,12 +70,12 @@ export const factTriggers = router({
         },
     )
     .mutation(async ({ input: { factTriggerId } }) => {
-      const deletedFactTriggerIndex = db.data.facts.findIndex(
-        (fact) => fact.id === factTriggerId,
+      const deletedFactTriggerIndex = db.data.factTriggers.findIndex(
+        (factTrigger) => factTrigger.id === factTriggerId,
       );
-      if (deletedFactTriggerIndex === -1) throw new Error("Fact not found");
+      if (deletedFactTriggerIndex === -1) throw new Error("Fact trigger not found");
       db.data.factTriggers.splice(deletedFactTriggerIndex, 1);
-      db.write();
+      await db.write();
       return { ok: true };
     }),
   generateFromFact: publicProcedure

pages/chat/trpc.ts

@@ -21,6 +21,7 @@ import { messages } from "./messages.js";
 import { facts, createCaller as createCallerFacts } from "./facts.js";
 import { createCaller as createCallerMessages } from "./messages.js";
 import { createCaller as createCallerFactTriggers } from "./fact-triggers.js";
+import { factTriggers } from "./fact-triggers.js";
 import { openrouter } from "./provider.js";
 
 const factsCaller = createCallerFacts({});
@@ -42,6 +43,7 @@ export const chat = router({
   conversations,
   messages,
   facts,
+  factTriggers,
   sendMessage: publicProcedure
     .input(
       (x) =>