fix: reduce unnessary rerender due to current thread retrieval

web-app/src/hooks/useAssistant.ts

@@ -117,10 +117,12 @@ export const useAssistant = create<AssistantState>((set, get) => ({
     }
   },
   setCurrentAssistant: (assistant, saveToStorage = true) => {
+    if (assistant !== get().currentAssistant) {
       set({ currentAssistant: assistant })
       if (saveToStorage) {
         setLastUsedAssistantId(assistant.id)
       }
+    }
   },
   setAssistants: (assistants) => {
     set({ assistants })

web-app/src/hooks/useThreads.ts

@@ -46,7 +46,10 @@ export const useThreads = create<ThreadState>()((set, get) => ({
                 id:
                   thread.model.provider === 'llama.cpp' ||
                   thread.model.provider === 'llamacpp'
-                    ? thread.model?.id.split(':').slice(0, 2).join(getServiceHub().path().sep())
+                    ? thread.model?.id
+                        .split(':')
+                        .slice(0, 2)
+                        .join(getServiceHub().path().sep())
                     : thread.model?.id,
               }
             : undefined,
@@ -94,7 +97,9 @@ export const useThreads = create<ThreadState>()((set, get) => ({
   },
   toggleFavorite: (threadId) => {
     set((state) => {
-      getServiceHub().threads().updateThread({
+      getServiceHub()
+        .threads()
+        .updateThread({
           ...state.threads[threadId],
           isFavorite: !state.threads[threadId].isFavorite,
         })
@@ -168,7 +173,9 @@ export const useThreads = create<ThreadState>()((set, get) => ({
         {} as Record<string, Thread>
       )
       Object.values(updatedThreads).forEach((thread) => {
-        getServiceHub().threads().updateThread({ ...thread, isFavorite: false })
+        getServiceHub()
+          .threads()
+          .updateThread({ ...thread, isFavorite: false })
       })
       return { threads: updatedThreads }
     })
@@ -180,7 +187,7 @@ export const useThreads = create<ThreadState>()((set, get) => ({
     return get().threads[threadId]
   },
   setCurrentThreadId: (threadId) => {
-    set({ currentThreadId: threadId })
+    if (threadId !== get().currentThreadId) set({ currentThreadId: threadId })
   },
   createThread: async (model, title, assistant) => {
     const newThread: Thread = {
@@ -190,7 +197,10 @@ export const useThreads = create<ThreadState>()((set, get) => ({
       updated: Date.now() / 1000,
       assistants: assistant ? [assistant] : [],
     }
-    return await getServiceHub().threads().createThread(newThread).then((createdThread) => {
+    return await getServiceHub()
+      .threads()
+      .createThread(newThread)
+      .then((createdThread) => {
         set((state) => {
           // Get all existing threads as an array
           const existingThreads = Object.values(state.threads)
@@ -213,7 +223,9 @@ export const useThreads = create<ThreadState>()((set, get) => ({
       if (!state.currentThreadId) return { ...state }
       const currentThread = state.getCurrentThread()
       if (currentThread)
-        getServiceHub().threads().updateThread({
+        getServiceHub()
+          .threads()
+          .updateThread({
             ...currentThread,
             assistants: [{ ...assistant, model: currentThread.model }],
           })
@@ -233,7 +245,10 @@ export const useThreads = create<ThreadState>()((set, get) => ({
     set((state) => {
       if (!state.currentThreadId) return { ...state }
       const currentThread = state.getCurrentThread()
-      if (currentThread) getServiceHub().threads().updateThread({ ...currentThread, model })
+      if (currentThread)
+        getServiceHub()
+          .threads()
+          .updateThread({ ...currentThread, model })
       return {
         threads: {
           ...state.threads,

web-app/src/routes/threads/$threadId.tsx

@@ -30,7 +30,6 @@ function ThreadDetail() {
   const serviceHub = useServiceHub()
   const { threadId } = useParams({ from: Route.id })
   const setCurrentThreadId = useThreads((state) => state.setCurrentThreadId)
-  const currentThreadId = useThreads((state) => state.currentThreadId)
   const setCurrentAssistant = useAssistant((state) => state.setCurrentAssistant)
   const assistants = useAssistant((state) => state.assistants)
   const setMessages = useMessages((state) => state.setMessages)
@@ -49,16 +48,13 @@ function ThreadDetail() {
   const scrollContainerRef = useRef<HTMLDivElement>(null)
 
   useEffect(() => {
-    if (currentThreadId !== threadId) {
       setCurrentThreadId(threadId)
       const assistant = assistants.find(
         (assistant) => assistant.id === thread?.assistants?.[0]?.id
       )
       if (assistant) setCurrentAssistant(assistant)
-    }
-
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [threadId, currentThreadId, assistants])
+  }, [threadId,  assistants])
 
   useEffect(() => {
     serviceHub