[WIP]: UI chat db

refact-agent/gui/src/__fixtures__/chat_db_cmessages.ts

@@ -0,0 +1,227 @@
+import { CMessage, CMessageFromChatDB } from "../services/refact/types";
+export const CMESSAGES_STUB: CMessage[] = [
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 0,
+    cmessage_num: 0,
+    cmessage_prev_alt: -1,
+    cmessage_usage_model: "",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "system",
+      content: "You answer only with jokes.",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 0,
+    cmessage_num: 1,
+    cmessage_prev_alt: 0,
+    cmessage_usage_model: "",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "user",
+      content: "Hello mister assistant, I have a question for you",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 1,
+    cmessage_num: 1,
+    cmessage_prev_alt: 0,
+    cmessage_usage_model: "",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "user",
+      content: "Find Frog in this project",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 0,
+    cmessage_num: 2,
+    cmessage_prev_alt: 0,
+    cmessage_usage_model: "gpt-4o-mini",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "assistant",
+      content: "yes?.",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 1,
+    cmessage_num: 2,
+    cmessage_prev_alt: 1,
+    cmessage_usage_model: "gpt-4o-mini",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "assistant",
+      content: "Birds aren't real",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 0,
+    cmessage_num: 3,
+    cmessage_prev_alt: 0,
+    cmessage_usage_model: "gpt-4o-mini",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "user",
+      content: "Find Frog in this project",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 0,
+    cmessage_num: 4,
+    cmessage_prev_alt: 0,
+    cmessage_usage_model: "gpt-4o-mini",
+    cmessage_usage_prompt: 1210,
+    cmessage_usage_completion: 15,
+    cmessage_json: {
+      role: "assistant",
+      content: "",
+      tool_calls: [
+        {
+          index: 0,
+          id: "call_8PSEh32Hhivfdxc50XKNwW8y",
+          function: {
+            arguments: '{"symbol":"Frog"}',
+            name: "references",
+          },
+          type: "function",
+        },
+      ],
+      //   usage: {
+      //     prompt_tokens: 1210,
+      //     completion_tokens: 15,
+      //     total_tokens: 1225,
+      //   },
+    },
+  },
+];
+
+export const CSMESSAGES_NETWORK_STUB: CMessageFromChatDB[] = CMESSAGES_STUB.map(
+  (cmessage) => {
+    return {
+      ...cmessage,
+      cmessage_json: JSON.stringify(cmessage.cmessage_json),
+    };
+  },
+);
+
+export const CMESSAGES_WITH_NESTED_BRANCHES_STUB: CMessage[] = [
+  CMESSAGES_STUB[0],
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 0,
+    cmessage_num: 1,
+    cmessage_prev_alt: 0,
+    cmessage_usage_model: "",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "user",
+      content: "Hello",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 0,
+    cmessage_num: 2,
+    cmessage_prev_alt: 0,
+    cmessage_usage_model: "",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "assistant",
+      content: "Hello.",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 0,
+    cmessage_num: 3,
+    cmessage_prev_alt: 0,
+    cmessage_usage_model: "",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "user",
+      content: "1",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 1,
+    cmessage_num: 3,
+    cmessage_prev_alt: 0,
+    cmessage_usage_model: "",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "user",
+      content: "2",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 0,
+    cmessage_num: 4,
+    cmessage_prev_alt: 0,
+    cmessage_usage_model: "",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "assistant",
+      content: "1",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 1,
+    cmessage_num: 4,
+    cmessage_prev_alt: 1,
+    cmessage_usage_model: "",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "assistant",
+      content: "2",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 0,
+    cmessage_num: 5,
+    cmessage_prev_alt: 1,
+    cmessage_usage_model: "",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "user",
+      content: "4",
+    },
+  },
+  {
+    cmessage_belongs_to_cthread_id: "test13thread1739988322_2",
+    cmessage_alt: 0,
+    cmessage_num: 6,
+    cmessage_prev_alt: 0,
+    cmessage_usage_model: "",
+    cmessage_usage_prompt: 0,
+    cmessage_usage_completion: 0,
+    cmessage_json: {
+      role: "assistant",
+      content: "🏌️",
+    },
+  },
+];

refact-agent/gui/src/__fixtures__/index.ts

@@ -9,3 +9,4 @@ export * from "./chat_links_response";
 export * from "./chat_config_thread";
 export * from "./chat_textdoc";
 export * from "./markdown-issue";
+export * from "./chat_db_cmessages";

refact-agent/gui/src/app/store.ts

@@ -52,6 +52,8 @@ import { knowledgeSlice } from "../features/Knowledge/knowledgeSlice";
 import { checkpointsSlice } from "../features/Checkpoints/checkpointsSlice";
 import { checkpointsApi } from "../services/refact/checkpoints";
 import { patchesAndDiffsTrackerSlice } from "../features/PatchesAndDiffsTracker/patchesAndDiffsTrackerSlice";
+import { chatDbThreadsSlice } from "../features/ChatDB/chatDbSlice";
+import { chatDbMessageSlice } from "../features/ChatDB/chatDbMessagesSlice";
 
 const tipOfTheDayPersistConfig = {
   key: "totd",
@@ -115,6 +117,8 @@ const rootReducer = combineSlices(
   knowledgeSlice,
   checkpointsSlice,
   patchesAndDiffsTrackerSlice,
+  chatDbThreadsSlice,
+  chatDbMessageSlice,
 );
 
 const rootPersistConfig = {

refact-agent/gui/src/components/Chat/Chat.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useState } from "react";
-import { ChatForm, ChatFormProps } from "../ChatForm";
+import { ChatForm } from "../ChatForm";
 import { ChatContent } from "../ChatContent";
 import { Flex, Button, Text, Card } from "@radix-ui/themes";
 import {
@@ -11,7 +11,7 @@ import {
   useCapsForToolUse,
   useAgentUsage,
 } from "../../hooks";
-import { type Config } from "../../features/Config/configSlice";
+// import { type Config } from "../../features/Config/configSlice";
 import {
   enableSend,
   selectIsStreaming,
@@ -29,21 +29,18 @@ import { AgentUsage } from "../../features/AgentUsage";
 import { useCheckpoints } from "../../hooks/useCheckpoints";
 import { Checkpoints } from "../../features/Checkpoints";
 import { SuggestNewChat } from "../ChatForm/SuggestNewChat";
+import { useThreadMessageSubmit } from "../../hooks/useThreadMessageSubmit";
 
 export type ChatProps = {
-  host: Config["host"];
-  tabbed: Config["tabbed"];
-  backFromChat: () => void;
-  style?: React.CSSProperties;
-  unCalledTools: boolean;
-  maybeSendToSidebar: ChatFormProps["onClose"];
+  // host: Config["host"];
+  // tabbed: Config["tabbed"];
+  // backFromChat: () => void;
+  // style?: React.CSSProperties;
+  // unCalledTools: boolean;
+  // maybeSendToSidebar: ChatFormProps["onClose"];
 };
 
-export const Chat: React.FC<ChatProps> = ({
-  style,
-  unCalledTools,
-  maybeSendToSidebar,
-}) => {
+export const Chat: React.FC<ChatProps> = () => {
   const dispatch = useAppDispatch();
 
   const [isViewingRawJSON, setIsViewingRawJSON] = useState(false);
@@ -52,12 +49,29 @@ export const Chat: React.FC<ChatProps> = ({
   const caps = useGetCapsQuery();
 
   const chatId = useAppSelector(selectChatId);
-  const { submit, abort, retryFromIndex } = useSendChatRequest();
+  const {
+    // submit,
+    abort,
+    retryFromIndex,
+  } = useSendChatRequest();
 
   const chatToolUse = useAppSelector(getSelectedToolUse);
 
   const threadNewChatSuggested = useAppSelector(selectThreadNewChatSuggested);
   const messages = useAppSelector(selectMessages);
+
+  const { submit } = useThreadMessageSubmit();
+
+  // can be a selector
+  const unCalledTools = React.useMemo(() => {
+    if (messages.length === 0) return false;
+    const last = messages[messages.length - 1];
+    if (last.role !== "assistant") return false;
+    const maybeTools = last.tool_calls;
+    if (maybeTools && maybeTools.length > 0) return true;
+    return false;
+  }, [messages]);
+
   const capsForToolUse = useCapsForToolUse();
   const { disableInput } = useAgentUsage();
 
@@ -71,7 +85,7 @@ export const Chat: React.FC<ChatProps> = ({
 
   const handleSummit = useCallback(
     (value: string) => {
-      submit({ question: value });
+      void submit(value);
       if (isViewingRawJSON) {
         setIsViewingRawJSON(false);
       }
@@ -103,22 +117,21 @@ export const Chat: React.FC<ChatProps> = ({
   return (
     <DropzoneProvider asChild>
       <Flex
-        style={style}
         direction="column"
         flexGrow="1"
         width="100%"
         overflowY="auto"
         justify="between"
         px="1"
       >
+        {" "}
+        {/** change messages? */}
         <ChatContent
           key={`chat-content-${chatId}`}
           onRetry={retryFromIndex}
           onStopStreaming={abort}
         />
-
         {shouldCheckpointsPopupBeShown && <Checkpoints />}
-
         <AgentUsage />
         <SuggestNewChat
           shouldBeVisible={
@@ -138,14 +151,11 @@ export const Chat: React.FC<ChatProps> = ({
             </Card>
           </Flex>
         )}
-
         <ChatForm
           key={chatId} // TODO: think of how can we not trigger re-render on chatId change (checkboxes)
           onSubmit={handleSummit}
-          onClose={maybeSendToSidebar}
           unCalledTools={unCalledTools}
         />
-
         <Flex justify="between" pl="1" pr="1" pt="1">
           {/* Two flexboxes are left for the future UI element on the right side */}
           {messages.length > 0 && (