cr

Author: bracesproul

frontend/app/components/Primitives.tsx

@@ -71,11 +71,17 @@ export const MyThread: FC<MyThreadProps> = (props: MyThreadProps) => {
             <div className="md:mb-8 mb-4">
               <SuggestedQuestions />
             </div>
-            <MyComposer messages={props.messages} />
+            <MyComposer
+              submitDisabled={props.submitDisabled}
+              messages={props.messages}
+            />
           </div>
         </div>
       ) : (
-        <MyComposer messages={props.messages} />
+        <MyComposer
+          submitDisabled={props.submitDisabled}
+          messages={props.messages}
+        />
       )}
     </ThreadPrimitive.Root>
   );

frontend/app/components/ThreadHistory.tsx

@@ -15,6 +15,7 @@ interface ThreadHistoryProps {
   createThread: (id: string) => Promise<any>;
   assistantId: string | undefined;
   switchSelectedThread: (thread: ThreadActual) => void;
+  getUserThreads: (id: string) => Promise<void>;
 }
 
 interface ThreadProps {
@@ -159,6 +160,8 @@ export function ThreadHistory(props: ThreadHistoryProps) {
       return;
     }
     await props.createThread(props.userId);
+    // Re-fetch threads so that the new thread shows up.
+    await props.getUserThreads(props.userId);
   };
 
   return (

frontend/app/hooks/useGraph.tsx

@@ -53,7 +53,7 @@ export interface GraphInput {
 
 export function useGraph(userId: string | undefined) {
   const { toast } = useToast();
-  const { getThreadById } = useThreads(userId);
+  const { getThreadById, getUserThreads } = useThreads(userId);
   const [messages, setMessages] = useState<BaseMessage[]>([]);
   const [assistantId, setAssistantId] = useState<string>();
   const [threadId, setThreadId] = useState<string>();
@@ -596,7 +596,7 @@ export function useGraph(userId: string | undefined) {
     }
   };
 
-  const switchSelectedThread = (thread: ThreadActual) => {
+  const switchSelectedThread = async (thread: ThreadActual) => {
     setThreadId(thread.thread_id);
     if (!thread.values) {
       setMessages([]);

frontend/app/hooks/useThreads.tsx

@@ -51,5 +51,6 @@ export function useThreads(userId: string | undefined) {
   return {
     userThreads,
     getThreadById,
+    getUserThreads,
   };
 }

frontend/app/new/page.tsx

@@ -33,7 +33,7 @@ export default function ContentComposerChatInterface(): React.ReactElement {
     threadId: currentThread,
     switchSelectedThread,
   } = useGraph(userId);
-  const { userThreads } = useThreads(userId);
+  const { userThreads, getUserThreads } = useThreads(userId);
   const [isRunning, setIsRunning] = useState(false);
 
   const isSubmitDisabled = !userId || !assistantId || !currentThread;
@@ -73,6 +73,8 @@ export default function ContentComposerChatInterface(): React.ReactElement {
       });
     } finally {
       setIsRunning(false);
+      // Re-fetch threads so that the current thread's title is updated.
+      await getUserThreads(userId);
     }
   }
 
@@ -92,6 +94,7 @@ export default function ContentComposerChatInterface(): React.ReactElement {
     <div className="overflow-hidden w-full flex md:flex-row flex-col">
       <div>
         <ThreadHistory
+          getUserThreads={getUserThreads}
           isEmpty={messages.length === 0}
           switchSelectedThread={switchSelectedThread}
           currentThread={currentThread}