From 11f4f20120b2466757ca0c237cf08bb4691abfb7 Mon Sep 17 00:00:00 2001
From: Louis <louis@jan.ai>
Date: Fri, 20 Dec 2024 16:34:54 +0700
Subject: [PATCH 01/17] fix: thread error handling

---
 web/containers/Providers/ModelHandler.tsx | 10 +++-------
 web/hooks/useDeleteThread.ts              |  7 +++++++
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/web/containers/Providers/ModelHandler.tsx b/web/containers/Providers/ModelHandler.tsx
index ad7f5c974f..3a6c19e0dd 100644
--- a/web/containers/Providers/ModelHandler.tsx
+++ b/web/containers/Providers/ModelHandler.tsx
@@ -302,15 +302,10 @@ export default function ModelHandler() {
 
   const generateThreadTitle = (message: ThreadMessage, thread: Thread) => {
     // If this is the first ever prompt in the thread
-    if (
-      (thread.title ?? thread.metadata?.title)?.trim() !== defaultThreadTitle
-    ) {
+    if ((thread.title ?? thread.metadata?.title)?.trim() !== defaultThreadTitle)
       return
-    }
 
-    if (!activeModelRef.current) {
-      return
-    }
+    if (!activeModelRef.current) return
 
     // Check model engine; we don't want to generate a title when it's not a local engine. remote model using first promp
     if (!isLocalEngine(activeModelRef.current?.engine as InferenceEngine)) {
@@ -332,6 +327,7 @@ export default function ModelHandler() {
             ...updatedThread,
           })
         })
+        .catch(console.error)
     }
 
     // This is the first time message comes in on a new thread
diff --git a/web/hooks/useDeleteThread.ts b/web/hooks/useDeleteThread.ts
index 7b98a4ea5c..f69ccd47ea 100644
--- a/web/hooks/useDeleteThread.ts
+++ b/web/hooks/useDeleteThread.ts
@@ -37,9 +37,16 @@ export default function useDeleteThread() {
     async (threadId: string) => {
       const thread = threads.find((c) => c.id === threadId)
       if (!thread) return
+      const availableThreads = threads.filter((c) => c.id !== threadId)
+      setThreads(availableThreads)
+
+      // delete the thread state
+      deleteThreadState(threadId)
+
       const assistantInfo = await extensionManager
         .get<ConversationalExtension>(ExtensionTypeEnum.Conversational)
         ?.getThreadAssistant(thread.id)
+        .catch(console.error)
 
       if (!assistantInfo) return
       const model = models.find((c) => c.id === assistantInfo?.model?.id)

From 4e43f9798d5415c9b1a9cdb5706300fa52cad844 Mon Sep 17 00:00:00 2001
From: Louis <louis@jan.ai>
Date: Fri, 20 Dec 2024 17:55:23 +0700
Subject: [PATCH 02/17] fix: fetch threads and messages without limiting
 (#4304)

* fix: threads and messages are cutoff

* fix: threads sorting

* chore: bump cortex latest release and app version
---
 extensions/conversational-extension/src/index.ts      | 6 +++---
 extensions/inference-cortex-extension/bin/version.txt | 2 +-
 extensions/model-extension/src/cortex.ts              | 2 +-
 web/containers/Providers/ModelHandler.tsx             | 1 +
 web/hooks/useCreateNewThread.ts                       | 1 +
 web/hooks/useThreads.ts                               | 7 ++++++-
 web/package.json                                      | 2 +-
 7 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/extensions/conversational-extension/src/index.ts b/extensions/conversational-extension/src/index.ts
index b3530e5d53..854773556f 100644
--- a/extensions/conversational-extension/src/index.ts
+++ b/extensions/conversational-extension/src/index.ts
@@ -40,7 +40,7 @@ export default class CortexConversationalExtension extends ConversationalExtensi
   async listThreads(): Promise<Thread[]> {
     return this.queue.add(() =>
       ky
-        .get(`${API_URL}/v1/threads`)
+        .get(`${API_URL}/v1/threads?limit=-1`)
         .json<ThreadList>()
         .then((e) => e.data)
     ) as Promise<Thread[]>
@@ -133,7 +133,7 @@ export default class CortexConversationalExtension extends ConversationalExtensi
   async listMessages(threadId: string): Promise<ThreadMessage[]> {
     return this.queue.add(() =>
       ky
-        .get(`${API_URL}/v1/threads/${threadId}/messages?order=asc`)
+        .get(`${API_URL}/v1/threads/${threadId}/messages?order=asc&limit=-1`)
         .json<MessageList>()
         .then((e) => e.data)
     ) as Promise<ThreadMessage[]>
@@ -147,7 +147,7 @@ export default class CortexConversationalExtension extends ConversationalExtensi
    */
   async getThreadAssistant(threadId: string): Promise<ThreadAssistantInfo> {
     return this.queue.add(() =>
-      ky.get(`${API_URL}/v1/assistants/${threadId}`).json<ThreadAssistantInfo>()
+      ky.get(`${API_URL}/v1/assistants/${threadId}?limit=-1`).json<ThreadAssistantInfo>()
     ) as Promise<ThreadAssistantInfo>
   }
   /**
diff --git a/extensions/inference-cortex-extension/bin/version.txt b/extensions/inference-cortex-extension/bin/version.txt
index cf13dd42bd..90a27f9cea 100644
--- a/extensions/inference-cortex-extension/bin/version.txt
+++ b/extensions/inference-cortex-extension/bin/version.txt
@@ -1 +1 @@
-1.0.5-rc2
+1.0.5
diff --git a/extensions/model-extension/src/cortex.ts b/extensions/model-extension/src/cortex.ts
index 26316fbbc0..ca5763962d 100644
--- a/extensions/model-extension/src/cortex.ts
+++ b/extensions/model-extension/src/cortex.ts
@@ -53,7 +53,7 @@ export class CortexAPI implements ICortexAPI {
    */
   getModels(): Promise<Model[]> {
     return this.queue
-      .add(() => ky.get(`${API_URL}/v1/models`).json<ModelList>())
+      .add(() => ky.get(`${API_URL}/v1/models?limit=-1`).json<ModelList>())
       .then((e) =>
         typeof e === 'object' ? e.data.map((e) => this.transformModel(e)) : []
       )
diff --git a/web/containers/Providers/ModelHandler.tsx b/web/containers/Providers/ModelHandler.tsx
index 3a6c19e0dd..d838df3246 100644
--- a/web/containers/Providers/ModelHandler.tsx
+++ b/web/containers/Providers/ModelHandler.tsx
@@ -244,6 +244,7 @@ export default function ModelHandler() {
       const metadata = {
         ...thread.metadata,
         ...(messageContent && { lastMessage: messageContent }),
+        updated_at: Date.now(),
       }
 
       updateThread({
diff --git a/web/hooks/useCreateNewThread.ts b/web/hooks/useCreateNewThread.ts
index c4c77d0a4f..1e1f7a8492 100644
--- a/web/hooks/useCreateNewThread.ts
+++ b/web/hooks/useCreateNewThread.ts
@@ -153,6 +153,7 @@ export const useCreateNewThread = () => {
       updated: createdAt,
       metadata: {
         title: 'New Thread',
+        updated_at: Date.now(),
       },
     }
 
diff --git a/web/hooks/useThreads.ts b/web/hooks/useThreads.ts
index 1e3b428a9f..00ad354571 100644
--- a/web/hooks/useThreads.ts
+++ b/web/hooks/useThreads.ts
@@ -26,7 +26,12 @@ const useThreads = () => {
 
   useEffect(() => {
     const getThreads = async () => {
-      const localThreads = await getLocalThreads()
+      const localThreads = (await getLocalThreads()).sort((a, b) => {
+        return ((a.metadata?.updated_at as number) ?? 0) >
+          ((b.metadata?.updated_at as number) ?? 0)
+          ? -1
+          : 1
+      })
       const localThreadStates: Record<string, ThreadState> = {}
       const threadModelParams: Record<string, ModelParams> = {}
 
diff --git a/web/package.json b/web/package.json
index db57facb51..b0411e7795 100644
--- a/web/package.json
+++ b/web/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@janhq/web",
-  "version": "0.5.11",
+  "version": "0.5.12",
   "private": true,
   "homepage": "./",
   "scripts": {

From af84a3a8d9e9ac031cb384194df68733e9e8a021 Mon Sep 17 00:00:00 2001
From: Faisal Amir <urmauur@gmail.com>
Date: Fri, 20 Dec 2024 23:39:08 +0800
Subject: [PATCH 03/17] fix: scroll bottom issue (#4308)

---
 web/containers/ModelDropdown/index.tsx        |  4 +-
 .../ChatBody/EmptyThread/index.tsx            |  4 +-
 .../ThreadCenterPanel/ChatBody/index.tsx      | 66 ++++++++++++-------
 3 files changed, 47 insertions(+), 27 deletions(-)

diff --git a/web/containers/ModelDropdown/index.tsx b/web/containers/ModelDropdown/index.tsx
index 09240845d3..f5ad55ad51 100644
--- a/web/containers/ModelDropdown/index.tsx
+++ b/web/containers/ModelDropdown/index.tsx
@@ -378,14 +378,14 @@ const ModelDropdown = ({
                 !selectedModel && 'text-[hsla(var(--text-tertiary))]'
               )}
             >
-              {selectedModel?.name || 'Select Model'}
+              {selectedModel?.name || 'Select a model'}
             </span>
           </Badge>
         ) : (
           <Input
             value={selectedModel?.name || ''}
             className="cursor-pointer"
-            placeholder="Select Model"
+            placeholder="Select a model"
             disabled={disabled}
             readOnly
             suffixIcon={
diff --git a/web/screens/Thread/ThreadCenterPanel/ChatBody/EmptyThread/index.tsx b/web/screens/Thread/ThreadCenterPanel/ChatBody/EmptyThread/index.tsx
index 403370ade3..57d9298e60 100644
--- a/web/screens/Thread/ThreadCenterPanel/ChatBody/EmptyThread/index.tsx
+++ b/web/screens/Thread/ThreadCenterPanel/ChatBody/EmptyThread/index.tsx
@@ -23,9 +23,7 @@ const EmptyThread = () => {
       <LogoMark className="mx-auto mb-2 animate-wave" width={32} height={32} />
       {showOnboardingStep ? (
         <>
-          <p className="mt-1 font-medium">
-            {`You don't have a local model yet.`}
-          </p>
+          <p className="mt-1 font-medium">{`You don't have any model`}</p>
           <Button
             onClick={() => setMainViewState(MainViewState.Hub)}
             variant="soft"
diff --git a/web/screens/Thread/ThreadCenterPanel/ChatBody/index.tsx b/web/screens/Thread/ThreadCenterPanel/ChatBody/index.tsx
index c2f7935f6b..29595f2491 100644
--- a/web/screens/Thread/ThreadCenterPanel/ChatBody/index.tsx
+++ b/web/screens/Thread/ThreadCenterPanel/ChatBody/index.tsx
@@ -14,7 +14,11 @@ import LoadModelError from '../LoadModelError'
 import EmptyThread from './EmptyThread'
 
 import { getCurrentChatMessagesAtom } from '@/helpers/atoms/ChatMessage.atom'
-import { activeThreadAtom } from '@/helpers/atoms/Thread.atom'
+import {
+  activeThreadAtom,
+  isGeneratingResponseAtom,
+  threadStatesAtom,
+} from '@/helpers/atoms/Thread.atom'
 
 const ChatConfigurator = memo(() => {
   const messages = useAtomValue(getCurrentChatMessagesAtom)
@@ -61,6 +65,12 @@ const ChatBody = memo(
     const prevScrollTop = useRef(0)
     const isUserManuallyScrollingUp = useRef(false)
     const currentThread = useAtomValue(activeThreadAtom)
+    const threadStates = useAtomValue(threadStatesAtom)
+    const isGeneratingResponse = useAtomValue(isGeneratingResponseAtom)
+
+    const isStreamingResponse = Object.values(threadStates).some(
+      (threadState) => threadState.waitingForResponse
+    )
 
     const count = useMemo(
       () => (messages?.length ?? 0) + (loadModelError ? 1 : 0),
@@ -76,15 +86,23 @@ const ChatBody = memo(
     })
 
     useEffect(() => {
-      // Delay the scroll until the DOM is updated
-      if (parentRef.current) {
+      if (parentRef.current && isGeneratingResponse) {
         requestAnimationFrame(() => {
           if (parentRef.current) {
             parentRef.current.scrollTo({ top: parentRef.current.scrollHeight })
-            virtualizer.scrollToIndex(count - 1)
           }
         })
       }
+    }, [count, virtualizer, isGeneratingResponse])
+
+    useEffect(() => {
+      isUserManuallyScrollingUp.current = false
+      requestAnimationFrame(() => {
+        if (parentRef.current) {
+          parentRef.current.scrollTo({ top: parentRef.current.scrollHeight })
+          virtualizer.scrollToIndex(count - 1)
+        }
+      })
     }, [count, currentThread?.id, virtualizer])
 
     const items = virtualizer.getVirtualItems()
@@ -94,34 +112,38 @@ const ChatBody = memo(
       _,
       instance
     ) => {
-      if (isUserManuallyScrollingUp.current === true) return false
+      if (isUserManuallyScrollingUp.current === true && isStreamingResponse)
+        return false
       return (
         // item.start < (instance.scrollOffset ?? 0) &&
         instance.scrollDirection !== 'backward'
       )
     }
 
-    const handleScroll = useCallback((event: React.UIEvent<HTMLElement>) => {
-      const currentScrollTop = event.currentTarget.scrollTop
-
-      if (prevScrollTop.current > currentScrollTop) {
-        isUserManuallyScrollingUp.current = true
-      } else {
+    const handleScroll = useCallback(
+      (event: React.UIEvent<HTMLElement>) => {
         const currentScrollTop = event.currentTarget.scrollTop
-        const scrollHeight = event.currentTarget.scrollHeight
-        const clientHeight = event.currentTarget.clientHeight
 
-        if (currentScrollTop + clientHeight >= scrollHeight) {
-          isUserManuallyScrollingUp.current = false
+        if (prevScrollTop.current > currentScrollTop && isStreamingResponse) {
+          isUserManuallyScrollingUp.current = true
+        } else {
+          const currentScrollTop = event.currentTarget.scrollTop
+          const scrollHeight = event.currentTarget.scrollHeight
+          const clientHeight = event.currentTarget.clientHeight
+
+          if (currentScrollTop + clientHeight >= scrollHeight) {
+            isUserManuallyScrollingUp.current = false
+          }
         }
-      }
 
-      if (isUserManuallyScrollingUp.current === true) {
-        event.preventDefault()
-        event.stopPropagation()
-      }
-      prevScrollTop.current = currentScrollTop
-    }, [])
+        if (isUserManuallyScrollingUp.current === true) {
+          event.preventDefault()
+          event.stopPropagation()
+        }
+        prevScrollTop.current = currentScrollTop
+      },
+      [isStreamingResponse]
+    )
 
     return (
       <div className="flex h-full w-full flex-col overflow-x-hidden">

From 8738421e7511ddfb4ace6f0d43972f6b154c8e57 Mon Sep 17 00:00:00 2001
From: Faisal Amir <urmauur@gmail.com>
Date: Sat, 21 Dec 2024 01:32:34 +0800
Subject: [PATCH 04/17] fix: overlap bottom system monitor (#4310)

---
 web/screens/LocalServer/LocalServerLeftPanel/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/screens/LocalServer/LocalServerLeftPanel/index.tsx b/web/screens/LocalServer/LocalServerLeftPanel/index.tsx
index 3438cac7a8..a5250b0130 100644
--- a/web/screens/LocalServer/LocalServerLeftPanel/index.tsx
+++ b/web/screens/LocalServer/LocalServerLeftPanel/index.tsx
@@ -176,7 +176,7 @@ const LocalServerLeftPanel = () => {
             />
           </div>
 
-          <div className="relative z-50 mt-2 block">
+          <div className="relative mt-2 block">
             <Input
               className={twMerge(
                 errorRangePort && 'border-[hsla(var(--destructive-bg))]'

From 5163e124d8e7223dc1370ba130349401b79dadc0 Mon Sep 17 00:00:00 2001
From: Louis <louis@jan.ai>
Date: Sat, 21 Dec 2024 20:01:04 +0700
Subject: [PATCH 05/17] chore: add OpenAI gpt-4o-mini and o1 models (#4311)

---
 .../resources/models.json                     | 57 +++++++++++++++++++
 1 file changed, 57 insertions(+)

diff --git a/extensions/inference-openai-extension/resources/models.json b/extensions/inference-openai-extension/resources/models.json
index fc68968821..0c822fde26 100644
--- a/extensions/inference-openai-extension/resources/models.json
+++ b/extensions/inference-openai-extension/resources/models.json
@@ -85,6 +85,63 @@
     },
     "engine": "openai"
   },
+  {
+    "sources": [
+      {
+        "url": "https://openai.com"
+      }
+    ],
+    "id": "gpt-4o-mini",
+    "object": "model",
+    "name": "OpenAI GPT 4o-mini",
+    "version": "1.1",
+    "description": "GPT-4o mini (“o” for “omni”) is a fast, affordable small model for focused tasks.",
+    "format": "api",
+    "settings": {
+      "vision_model": true
+    },
+    "parameters": {
+      "max_tokens": 16384,
+      "temperature": 0.7,
+      "top_p": 0.95,
+      "stream": true,
+      "stop": [],
+      "frequency_penalty": 0,
+      "presence_penalty": 0
+    },
+    "metadata": {
+      "author": "OpenAI",
+      "tags": ["General"]
+    },
+    "engine": "openai"
+  },
+  {
+    "sources": [
+      {
+        "url": "https://openai.com"
+      }
+    ],
+    "id": "o1",
+    "object": "model",
+    "name": "OpenAI o1",
+    "version": "1.0",
+    "description": "OpenAI o1 is a new model with complex reasoning",
+    "format": "api",
+    "settings": {},
+    "parameters": {
+      "max_tokens": 100000,
+      "temperature": 1,
+      "top_p": 1,
+      "stream": true,
+      "frequency_penalty": 0,
+      "presence_penalty": 0
+    },
+    "metadata": {
+      "author": "OpenAI",
+      "tags": ["General"]
+    },
+    "engine": "openai"
+  },
   {
     "sources": [
       {

From abb718c57f1b78797c5a830b087fdfbb57b7c979 Mon Sep 17 00:00:00 2001
From: Faisal Amir <urmauur@gmail.com>
Date: Mon, 23 Dec 2024 13:14:49 +0800
Subject: [PATCH 06/17] fix: width inputbox based on preference and remove
 tooltip image upload (#4315)

---
 .../ThreadCenterPanel/ChatInput/index.tsx     | 42 ++++++++-----------
 .../Thread/ThreadCenterPanel/index.tsx        | 11 ++++-
 2 files changed, 28 insertions(+), 25 deletions(-)

diff --git a/web/screens/Thread/ThreadCenterPanel/ChatInput/index.tsx b/web/screens/Thread/ThreadCenterPanel/ChatInput/index.tsx
index 1981964845..0ba50880b6 100644
--- a/web/screens/Thread/ThreadCenterPanel/ChatInput/index.tsx
+++ b/web/screens/Thread/ThreadCenterPanel/ChatInput/index.tsx
@@ -231,30 +231,24 @@ const ChatInput = () => {
             )}
           >
             <ul>
-              <Tooltip
-                trigger={
-                  <li
-                    className={twMerge(
-                      'text-[hsla(var(--text-secondary)] hover:bg-secondary flex w-full items-center space-x-2 px-4 py-2 hover:bg-[hsla(var(--dropdown-menu-hover-bg))]',
-                      activeAssistant?.model.settings?.vision_model ||
-                        isModelSupportRagAndTools
-                        ? 'cursor-pointer'
-                        : 'cursor-not-allowed opacity-50'
-                    )}
-                    onClick={() => {
-                      if (activeAssistant?.model.settings?.vision_model) {
-                        imageInputRef.current?.click()
-                        setShowAttacmentMenus(false)
-                      }
-                    }}
-                  >
-                    <ImageIcon size={16} />
-                    <span className="font-medium">Image</span>
-                  </li>
-                }
-                content="This feature only supports multimodal models."
-                disabled={activeAssistant?.model.settings?.vision_model}
-              />
+              <li
+                className={twMerge(
+                  'text-[hsla(var(--text-secondary)] hover:bg-secondary flex w-full items-center space-x-2 px-4 py-2 hover:bg-[hsla(var(--dropdown-menu-hover-bg))]',
+                  activeAssistant?.model.settings?.vision_model &&
+                    isModelSupportRagAndTools
+                    ? 'cursor-pointer'
+                    : 'cursor-not-allowed opacity-50'
+                )}
+                onClick={() => {
+                  if (activeAssistant?.model.settings?.vision_model) {
+                    imageInputRef.current?.click()
+                    setShowAttacmentMenus(false)
+                  }
+                }}
+              >
+                <ImageIcon size={16} />
+                <span className="font-medium">Image</span>
+              </li>
               <Tooltip
                 side="bottom"
                 trigger={
diff --git a/web/screens/Thread/ThreadCenterPanel/index.tsx b/web/screens/Thread/ThreadCenterPanel/index.tsx
index ca04f9e595..bd01365e49 100644
--- a/web/screens/Thread/ThreadCenterPanel/index.tsx
+++ b/web/screens/Thread/ThreadCenterPanel/index.tsx
@@ -30,6 +30,7 @@ import RequestDownloadModel from './RequestDownloadModel'
 import { showSystemMonitorPanelAtom } from '@/helpers/atoms/App.atom'
 import { experimentalFeatureEnabledAtom } from '@/helpers/atoms/AppConfig.atom'
 import { activeAssistantAtom } from '@/helpers/atoms/Assistant.atom'
+import { chatWidthAtom } from '@/helpers/atoms/Setting.atom'
 import { activeThreadAtom } from '@/helpers/atoms/Thread.atom'
 
 import {
@@ -59,6 +60,7 @@ const ThreadCenterPanel = () => {
   const experimentalFeature = useAtomValue(experimentalFeatureEnabledAtom)
   const activeThread = useAtomValue(activeThreadAtom)
   const activeAssistant = useAtomValue(activeAssistantAtom)
+  const chatWidth = useAtomValue(chatWidthAtom)
   const upload = uploader()
   const acceptedFormat: Accept = activeAssistant?.model.settings?.vision_model
     ? {
@@ -235,7 +237,14 @@ const ThreadCenterPanel = () => {
           {reloadModel && <ModelReload />}
 
           {activeModel && isGeneratingResponse && <GenerateResponse />}
-          <ChatInput />
+          <div
+            className={twMerge(
+              'mx-auto w-full',
+              chatWidth === 'compact' && 'max-w-[700px]'
+            )}
+          >
+            <ChatInput />
+          </div>
         </div>
       </div>
     </CenterPanelContainer>

From 24222679fbaeb6af40dd9b5747290bb1e220354b Mon Sep 17 00:00:00 2001
From: Louis <louis@jan.ai>
Date: Mon, 23 Dec 2024 12:35:30 +0700
Subject: [PATCH 07/17] fix: cleaning a thread should just clear out messages
 (#4316)

* fix: cleaning a thread should just clear out messages

* chore: clean up
---
 .../conversational-extension/src/index.ts     |  6 +-
 web/helpers/atoms/Thread.atom.ts              | 20 +++++
 web/hooks/useCreateNewThread.ts               | 19 +----
 web/hooks/useDeleteThread.test.ts             | 20 +++--
 web/hooks/useDeleteThread.ts                  | 73 ++++++++-----------
 5 files changed, 68 insertions(+), 70 deletions(-)

diff --git a/extensions/conversational-extension/src/index.ts b/extensions/conversational-extension/src/index.ts
index 854773556f..30766be45f 100644
--- a/extensions/conversational-extension/src/index.ts
+++ b/extensions/conversational-extension/src/index.ts
@@ -147,7 +147,9 @@ export default class CortexConversationalExtension extends ConversationalExtensi
    */
   async getThreadAssistant(threadId: string): Promise<ThreadAssistantInfo> {
     return this.queue.add(() =>
-      ky.get(`${API_URL}/v1/assistants/${threadId}?limit=-1`).json<ThreadAssistantInfo>()
+      ky
+        .get(`${API_URL}/v1/assistants/${threadId}?limit=-1`)
+        .json<ThreadAssistantInfo>()
     ) as Promise<ThreadAssistantInfo>
   }
   /**
@@ -188,7 +190,7 @@ export default class CortexConversationalExtension extends ConversationalExtensi
    * Do health check on cortex.cpp
    * @returns
    */
-  healthz(): Promise<void> {
+  async healthz(): Promise<void> {
     return ky
       .get(`${API_URL}/healthz`, {
         retry: { limit: 20, delay: () => 500, methods: ['get'] },
diff --git a/web/helpers/atoms/Thread.atom.ts b/web/helpers/atoms/Thread.atom.ts
index 7fb6f3c600..55527115fe 100644
--- a/web/helpers/atoms/Thread.atom.ts
+++ b/web/helpers/atoms/Thread.atom.ts
@@ -125,6 +125,26 @@ export const waitingToSendMessage = atom<boolean | undefined>(undefined)
  */
 export const isGeneratingResponseAtom = atom<boolean | undefined>(undefined)
 
+/**
+ * Create a new thread and add it to the thread list
+ */
+export const createNewThreadAtom = atom(null, (get, set, newThread: Thread) => {
+  // create thread state for this new thread
+  const currentState = { ...get(threadStatesAtom) }
+
+  const threadState: ThreadState = {
+    hasMore: false,
+    waitingForResponse: false,
+    lastMessage: undefined,
+  }
+  currentState[newThread.id] = threadState
+  set(threadStatesAtom, currentState)
+
+  // add the new thread on top of the thread list to the state
+  const threads = get(threadsAtom)
+  set(threadsAtom, [newThread, ...threads])
+})
+
 /**
  * Remove a thread state from the atom
  */
diff --git a/web/hooks/useCreateNewThread.ts b/web/hooks/useCreateNewThread.ts
index 1e1f7a8492..40e554945e 100644
--- a/web/hooks/useCreateNewThread.ts
+++ b/web/hooks/useCreateNewThread.ts
@@ -33,29 +33,12 @@ import { activeAssistantAtom } from '@/helpers/atoms/Assistant.atom'
 import { selectedModelAtom } from '@/helpers/atoms/Model.atom'
 import {
   threadsAtom,
-  threadStatesAtom,
   updateThreadAtom,
   setThreadModelParamsAtom,
   isGeneratingResponseAtom,
+  createNewThreadAtom,
 } from '@/helpers/atoms/Thread.atom'
 
-const createNewThreadAtom = atom(null, (get, set, newThread: Thread) => {
-  // create thread state for this new thread
-  const currentState = { ...get(threadStatesAtom) }
-
-  const threadState: ThreadState = {
-    hasMore: false,
-    waitingForResponse: false,
-    lastMessage: undefined,
-  }
-  currentState[newThread.id] = threadState
-  set(threadStatesAtom, currentState)
-
-  // add the new thread on top of the thread list to the state
-  const threads = get(threadsAtom)
-  set(threadsAtom, [newThread, ...threads])
-})
-
 export const useCreateNewThread = () => {
   const createNewThread = useSetAtom(createNewThreadAtom)
   const { setActiveThread } = useSetActiveThread()
diff --git a/web/hooks/useDeleteThread.test.ts b/web/hooks/useDeleteThread.test.ts
index 50b0c7511b..e9e4341648 100644
--- a/web/hooks/useDeleteThread.test.ts
+++ b/web/hooks/useDeleteThread.test.ts
@@ -55,17 +55,21 @@ describe('useDeleteThread', () => {
     const mockCleanMessages = jest.fn()
     ;(useSetAtom as jest.Mock).mockReturnValue(() => mockCleanMessages)
     ;(useAtomValue as jest.Mock).mockReturnValue(['thread 1'])
-    const mockCreateNewThread = jest.fn()
-    ;(useCreateNewThread as jest.Mock).mockReturnValue({
-      requestCreateNewThread: mockCreateNewThread,
-    })
 
     const mockSaveThread = jest.fn()
-    const mockDeleteThread = jest.fn().mockResolvedValue({})
+    const mockDeleteMessage = jest.fn().mockResolvedValue({})
+    const mockModifyThread = jest.fn().mockResolvedValue({})
     extensionManager.get = jest.fn().mockReturnValue({
       saveThread: mockSaveThread,
       getThreadAssistant: jest.fn().mockResolvedValue({}),
-      deleteThread: mockDeleteThread,
+      listMessages: jest.fn().mockResolvedValue([
+        {
+          id: 'message1',
+          text: 'Message 1',
+        },
+      ]),
+      deleteMessage: mockDeleteMessage,
+      modifyThread: mockModifyThread,
     })
 
     const { result } = renderHook(() => useDeleteThread())
@@ -74,8 +78,8 @@ describe('useDeleteThread', () => {
       await result.current.cleanThread('thread1')
     })
 
-    expect(mockDeleteThread).toHaveBeenCalled()
-    expect(mockCreateNewThread).toHaveBeenCalled()
+    expect(mockDeleteMessage).toHaveBeenCalled()
+    expect(mockModifyThread).toHaveBeenCalled()
   })
 
   it('should handle errors when deleting a thread', async () => {
diff --git a/web/hooks/useDeleteThread.ts b/web/hooks/useDeleteThread.ts
index f69ccd47ea..2d14460ffa 100644
--- a/web/hooks/useDeleteThread.ts
+++ b/web/hooks/useDeleteThread.ts
@@ -2,30 +2,25 @@ import { useCallback } from 'react'
 
 import { ExtensionTypeEnum, ConversationalExtension } from '@janhq/core'
 
-import { useAtom, useAtomValue, useSetAtom } from 'jotai'
+import { useAtom, useSetAtom } from 'jotai'
 
 import { currentPromptAtom } from '@/containers/Providers/Jotai'
 
 import { toaster } from '@/containers/Toast'
 
-import { useCreateNewThread } from './useCreateNewThread'
-
 import { extensionManager } from '@/extension/ExtensionManager'
 
-import { assistantsAtom } from '@/helpers/atoms/Assistant.atom'
 import { deleteChatMessageAtom as deleteChatMessagesAtom } from '@/helpers/atoms/ChatMessage.atom'
-import { downloadedModelsAtom } from '@/helpers/atoms/Model.atom'
 import {
   threadsAtom,
   setActiveThreadIdAtom,
   deleteThreadStateAtom,
+  updateThreadAtom,
 } from '@/helpers/atoms/Thread.atom'
 
 export default function useDeleteThread() {
   const [threads, setThreads] = useAtom(threadsAtom)
-  const { requestCreateNewThread } = useCreateNewThread()
-  const assistants = useAtomValue(assistantsAtom)
-  const models = useAtomValue(downloadedModelsAtom)
+  const updateThread = useSetAtom(updateThreadAtom)
 
   const setCurrentPrompt = useSetAtom(currentPromptAtom)
   const setActiveThreadId = useSetAtom(setActiveThreadIdAtom)
@@ -35,43 +30,37 @@ export default function useDeleteThread() {
 
   const cleanThread = useCallback(
     async (threadId: string) => {
-      const thread = threads.find((c) => c.id === threadId)
-      if (!thread) return
-      const availableThreads = threads.filter((c) => c.id !== threadId)
-      setThreads(availableThreads)
-
-      // delete the thread state
-      deleteThreadState(threadId)
-
-      const assistantInfo = await extensionManager
-        .get<ConversationalExtension>(ExtensionTypeEnum.Conversational)
-        ?.getThreadAssistant(thread.id)
-        .catch(console.error)
-
-      if (!assistantInfo) return
-      const model = models.find((c) => c.id === assistantInfo?.model?.id)
-
-      requestCreateNewThread(
-        {
-          ...assistantInfo,
-          id: assistants[0].id,
-          name: assistants[0].name,
-        },
-        model
-          ? {
-              ...model,
-              parameters: assistantInfo?.model?.parameters ?? {},
-              settings: assistantInfo?.model?.settings ?? {},
-            }
-          : undefined
-      )
-      // Delete this thread
-      await extensionManager
+      const messages = await extensionManager
         .get<ConversationalExtension>(ExtensionTypeEnum.Conversational)
-        ?.deleteThread(threadId)
+        ?.listMessages(threadId)
         .catch(console.error)
+      if (messages) {
+        messages.forEach((message) => {
+          extensionManager
+            .get<ConversationalExtension>(ExtensionTypeEnum.Conversational)
+            ?.deleteMessage(threadId, message.id)
+            .catch(console.error)
+        })
+        const thread = threads.find((e) => e.id === threadId)
+        if (thread) {
+          const updatedThread = {
+            ...thread,
+            metadata: {
+              ...thread.metadata,
+              title: 'New Thread',
+              lastMessage: '',
+            },
+          }
+          extensionManager
+            .get<ConversationalExtension>(ExtensionTypeEnum.Conversational)
+            ?.modifyThread(updatedThread)
+            .catch(console.error)
+          updateThread(updatedThread)
+        }
+      }
+      deleteMessages(threadId)
     },
-    [assistants, models, requestCreateNewThread, threads]
+    [deleteMessages, threads, updateThread]
   )
 
   const deleteThread = async (threadId: string) => {

From 1f4c00dc41d42093eb921f9477cdf03a00627c59 Mon Sep 17 00:00:00 2001
From: Louis <louis@jan.ai>
Date: Mon, 23 Dec 2024 13:09:26 +0700
Subject: [PATCH 08/17] fix: change theme settings do not work after relocated
 data folder (#4317)

---
 web/helpers/atoms/Setting.atom.ts         |  7 +----
 web/hooks/useLoadTheme.ts                 | 34 ++++++++++-------------
 web/screens/Settings/Appearance/index.tsx |  8 ++++--
 3 files changed, 21 insertions(+), 28 deletions(-)

diff --git a/web/helpers/atoms/Setting.atom.ts b/web/helpers/atoms/Setting.atom.ts
index 905c88d0f8..3568d87d0a 100644
--- a/web/helpers/atoms/Setting.atom.ts
+++ b/web/helpers/atoms/Setting.atom.ts
@@ -20,12 +20,7 @@ export const CHAT_WIDTH = 'chatWidth'
 export const themesOptionsAtom = atomWithStorage<
   { name: string; value: string }[]
 >(THEME_OPTIONS, [], undefined, { getOnInit: true })
-export const janThemesPathAtom = atomWithStorage<string | undefined>(
-  THEME_PATH,
-  undefined,
-  undefined,
-  { getOnInit: true }
-)
+
 export const selectedThemeIdAtom = atomWithStorage<string>(
   THEME,
   '',
diff --git a/web/hooks/useLoadTheme.ts b/web/hooks/useLoadTheme.ts
index 66915e6699..cbeb9e644f 100644
--- a/web/hooks/useLoadTheme.ts
+++ b/web/hooks/useLoadTheme.ts
@@ -10,7 +10,6 @@ import cssVars from '@/utils/jsonToCssVariables'
 
 import { janDataFolderPathAtom } from '@/helpers/atoms/AppConfig.atom'
 import {
-  janThemesPathAtom,
   selectedThemeIdAtom,
   themeDataAtom,
   themesOptionsAtom,
@@ -21,7 +20,6 @@ type NativeThemeProps = 'light' | 'dark'
 export const useLoadTheme = () => {
   const janDataFolderPath = useAtomValue(janDataFolderPathAtom)
   const [themeOptions, setThemeOptions] = useAtom(themesOptionsAtom)
-  const [themePath, setThemePath] = useAtom(janThemesPathAtom)
   const [themeData, setThemeData] = useAtom(themeDataAtom)
   const [selectedIdTheme, setSelectedIdTheme] = useAtom(selectedThemeIdAtom)
   const { setTheme } = useTheme()
@@ -41,6 +39,14 @@ export const useLoadTheme = () => {
     [setTheme]
   )
 
+  const applyTheme = (theme: Theme) => {
+    const variables = cssVars(theme.variables)
+    const headTag = document.getElementsByTagName('head')[0]
+    const styleTag = document.createElement('style')
+    styleTag.innerHTML = `:root {${variables}}`
+    headTag.appendChild(styleTag)
+  }
+
   const getThemes = useCallback(async () => {
     if (!janDataFolderPath.length) return
     const folderPath = await joinPath([janDataFolderPath, 'themes'])
@@ -59,7 +65,6 @@ export const useLoadTheme = () => {
 
     if (janDataFolderPath.length > 0) {
       if (!selectedIdTheme.length) return setSelectedIdTheme('joi-light')
-      setThemePath(folderPath)
       const filePath = await joinPath([
         `${folderPath}/${selectedIdTheme}`,
         `theme.json`,
@@ -68,11 +73,7 @@ export const useLoadTheme = () => {
 
       setThemeData(theme)
       setNativeTheme(theme.nativeTheme)
-      const variables = cssVars(theme.variables)
-      const headTag = document.getElementsByTagName('head')[0]
-      const styleTag = document.createElement('style')
-      styleTag.innerHTML = `:root {${variables}}`
-      headTag.appendChild(styleTag)
+      applyTheme(theme)
     }
   }, [
     janDataFolderPath,
@@ -81,26 +82,21 @@ export const useLoadTheme = () => {
     setSelectedIdTheme,
     setThemeData,
     setThemeOptions,
-    setThemePath,
   ])
 
-  const applyTheme = useCallback(async () => {
-    if (!themeData || !themeOptions || !themePath) {
+  const configureTheme = useCallback(async () => {
+    if (!themeData || !themeOptions) {
       await getThemes()
     } else {
-      const variables = cssVars(themeData.variables)
-      const headTag = document.getElementsByTagName('head')[0]
-      const styleTag = document.createElement('style')
-      styleTag.innerHTML = `:root {${variables}}`
-      headTag.appendChild(styleTag)
+      applyTheme(themeData)
     }
     setNativeTheme(themeData?.nativeTheme as NativeThemeProps)
-  }, [themeData, themeOptions, themePath, getThemes])
+  }, [themeData, themeOptions, getThemes, setNativeTheme])
 
   useEffect(() => {
-    applyTheme()
+    configureTheme()
   }, [
-    applyTheme,
+    configureTheme,
     selectedIdTheme,
     setNativeTheme,
     setSelectedIdTheme,
diff --git a/web/screens/Settings/Appearance/index.tsx b/web/screens/Settings/Appearance/index.tsx
index 606a697697..a136560521 100644
--- a/web/screens/Settings/Appearance/index.tsx
+++ b/web/screens/Settings/Appearance/index.tsx
@@ -8,9 +8,10 @@ import { useAtom, useAtomValue } from 'jotai'
 
 import { twMerge } from 'tailwind-merge'
 
+import { janDataFolderPathAtom } from '@/helpers/atoms/AppConfig.atom'
+
 import {
   chatWidthAtom,
-  janThemesPathAtom,
   reduceTransparentAtom,
   selectedThemeIdAtom,
   spellCheckAtom,
@@ -21,8 +22,8 @@ import {
 export default function AppearanceOptions() {
   const [selectedIdTheme, setSelectedIdTheme] = useAtom(selectedThemeIdAtom)
   const themeOptions = useAtomValue(themesOptionsAtom)
+  const janDataFolderPath = useAtomValue(janDataFolderPathAtom)
   const { setTheme, theme } = useTheme()
-  const janThemesPath = useAtomValue(janThemesPathAtom)
   const [themeData, setThemeData] = useAtom(themeDataAtom)
   const [reduceTransparent, setReduceTransparent] = useAtom(
     reduceTransparentAtom
@@ -48,6 +49,7 @@ export default function AppearanceOptions() {
   const handleClickTheme = useCallback(
     async (e: string) => {
       setSelectedIdTheme(e)
+      const janThemesPath = await joinPath([janDataFolderPath, 'themes'])
       const filePath = await joinPath([`${janThemesPath}/${e}`, `theme.json`])
       const theme: Theme = JSON.parse(await fs.readFileSync(filePath, 'utf-8'))
       setThemeData(theme)
@@ -59,7 +61,7 @@ export default function AppearanceOptions() {
       }
     },
     [
-      janThemesPath,
+      janDataFolderPath,
       reduceTransparent,
       setReduceTransparent,
       setSelectedIdTheme,

From 365cdfa333a42cd21d51a726e41c41252402b8a7 Mon Sep 17 00:00:00 2001
From: Louis <louis@jan.ai>
Date: Mon, 23 Dec 2024 14:09:02 +0700
Subject: [PATCH 09/17] fix: threads sorting order after updated (#4319)

---
 web/helpers/atoms/Thread.atom.ts | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/web/helpers/atoms/Thread.atom.ts b/web/helpers/atoms/Thread.atom.ts
index 55527115fe..c94d287b56 100644
--- a/web/helpers/atoms/Thread.atom.ts
+++ b/web/helpers/atoms/Thread.atom.ts
@@ -200,12 +200,12 @@ export const updateThreadAtom = atom(
     )
 
     // sort new threads based on updated at
-    threads.sort((thread1, thread2) => {
-      const aDate = new Date(thread1.updated ?? 0)
-      const bDate = new Date(thread2.updated ?? 0)
-      return bDate.getTime() - aDate.getTime()
+    threads.sort((a, b) => {
+      return ((a.metadata?.updated_at as number) ?? 0) >
+        ((b.metadata?.updated_at as number) ?? 0)
+        ? -1
+        : 1
     })
-
     set(threadsAtom, threads)
   }
 )

From 9c4dcd38a86823f73626f07804176b4a67a0b42f Mon Sep 17 00:00:00 2001
From: Louis <louis@jan.ai>
Date: Mon, 23 Dec 2024 15:24:02 +0700
Subject: [PATCH 10/17] fix: update thread's title edge cases (#4320)

---
 web/hooks/useCreateNewThread.ts | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/web/hooks/useCreateNewThread.ts b/web/hooks/useCreateNewThread.ts
index 40e554945e..1094ec621d 100644
--- a/web/hooks/useCreateNewThread.ts
+++ b/web/hooks/useCreateNewThread.ts
@@ -191,9 +191,11 @@ export const useCreateNewThread = () => {
     async (thread: Thread) => {
       updateThread(thread)
 
-      setActiveAssistant(thread.assistants[0])
       updateThreadCallback(thread)
-      updateAssistantCallback(thread.id, thread.assistants[0])
+      if (thread.assistants && thread.assistants?.length > 0) {
+        setActiveAssistant(thread.assistants[0])
+        updateAssistantCallback(thread.id, thread.assistants[0])
+      }
     },
     [
       updateThread,

From 171dad1eca84b7e13189fa6023c3687ee09b7af9 Mon Sep 17 00:00:00 2001
From: Louis <louis@jan.ai>
Date: Mon, 23 Dec 2024 15:27:02 +0700
Subject: [PATCH 11/17] fix: generating message is gone after switching to
 another thread (#4321)

---
 web/helpers/atoms/ChatMessage.atom.ts | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/web/helpers/atoms/ChatMessage.atom.ts b/web/helpers/atoms/ChatMessage.atom.ts
index 5df44e0312..7034396652 100644
--- a/web/helpers/atoms/ChatMessage.atom.ts
+++ b/web/helpers/atoms/ChatMessage.atom.ts
@@ -175,6 +175,17 @@ export const updateMessageAtom = atom(
       // Update thread last message
       if (text.length)
         set(updateThreadStateLastMessageAtom, conversationId, text)
+    } else {
+      set(addNewMessageAtom, {
+        id,
+        thread_id: conversationId,
+        content: text,
+        status,
+        role: ChatCompletionRole.Assistant,
+        created_at: Date.now() / 1000,
+        completed_at: Date.now() / 1000,
+        object: 'thread.message',
+      })
     }
   }
 )

From df1c465fd91d8f3081638ecfae5950fe4d3b6779 Mon Sep 17 00:00:00 2001
From: Louis <louis@jan.ai>
Date: Mon, 23 Dec 2024 15:52:18 +0700
Subject: [PATCH 12/17] fix: app picks model automatically edge cases (#4322)

---
 web/containers/ModelDropdown/index.tsx              | 5 +----
 web/hooks/useDeleteThread.ts                        | 5 ++++-
 web/screens/Thread/ThreadRightPanel/Tools/index.tsx | 5 +----
 3 files changed, 6 insertions(+), 9 deletions(-)

diff --git a/web/containers/ModelDropdown/index.tsx b/web/containers/ModelDropdown/index.tsx
index f5ad55ad51..b5abf89d7f 100644
--- a/web/containers/ModelDropdown/index.tsx
+++ b/web/containers/ModelDropdown/index.tsx
@@ -183,10 +183,7 @@ const ModelDropdown = ({
     if (!activeThread) return
     const modelId = activeAssistant?.model?.id
 
-    let model = downloadedModels.find((model) => model.id === modelId)
-    if (!model) {
-      model = undefined
-    }
+    const model = downloadedModels.find((model) => model.id === modelId)
     setSelectedModel(model)
   }, [
     recommendedModel,
diff --git a/web/hooks/useDeleteThread.ts b/web/hooks/useDeleteThread.ts
index 2d14460ffa..1ea6c75791 100644
--- a/web/hooks/useDeleteThread.ts
+++ b/web/hooks/useDeleteThread.ts
@@ -8,6 +8,8 @@ import { currentPromptAtom } from '@/containers/Providers/Jotai'
 
 import { toaster } from '@/containers/Toast'
 
+import useSetActiveThread from './useSetActiveThread'
+
 import { extensionManager } from '@/extension/ExtensionManager'
 
 import { deleteChatMessageAtom as deleteChatMessagesAtom } from '@/helpers/atoms/ChatMessage.atom'
@@ -27,6 +29,7 @@ export default function useDeleteThread() {
   const deleteMessages = useSetAtom(deleteChatMessagesAtom)
 
   const deleteThreadState = useSetAtom(deleteThreadStateAtom)
+  const { setActiveThread } = useSetActiveThread()
 
   const cleanThread = useCallback(
     async (threadId: string) => {
@@ -86,7 +89,7 @@ export default function useDeleteThread() {
       type: 'success',
     })
     if (availableThreads.length > 0) {
-      setActiveThreadId(availableThreads[0].id)
+      setActiveThread(availableThreads[0])
     } else {
       setActiveThreadId(undefined)
     }
diff --git a/web/screens/Thread/ThreadRightPanel/Tools/index.tsx b/web/screens/Thread/ThreadRightPanel/Tools/index.tsx
index e233bcd053..925eebe778 100644
--- a/web/screens/Thread/ThreadRightPanel/Tools/index.tsx
+++ b/web/screens/Thread/ThreadRightPanel/Tools/index.tsx
@@ -32,12 +32,9 @@ const Tools = () => {
 
   useEffect(() => {
     if (!activeThread) return
-    let model = downloadedModels.find(
+    const model = downloadedModels.find(
       (model) => model.id === activeAssistant?.model.id
     )
-    if (!model) {
-      model = recommendedModel
-    }
     setSelectedModel(model)
   }, [
     recommendedModel,

From 56d1ffa136443a69e7a11ebdb4701ac71775c7b6 Mon Sep 17 00:00:00 2001
From: Faisal Amir <urmauur@gmail.com>
Date: Mon, 23 Dec 2024 18:55:51 +0800
Subject: [PATCH 13/17] fix: scroll bottom when generation text (#4323)

* fix: scroll bottom when generation text

* chore: update logic when prepare generate

* chore: fix case no switch thread

* chore: remore dep thread id

* chore: handle fix generation without have dep thread id
---
 .../ThreadCenterPanel/ChatBody/index.tsx      | 31 ++++++++++++-------
 1 file changed, 20 insertions(+), 11 deletions(-)

diff --git a/web/screens/Thread/ThreadCenterPanel/ChatBody/index.tsx b/web/screens/Thread/ThreadCenterPanel/ChatBody/index.tsx
index 29595f2491..f384611c5e 100644
--- a/web/screens/Thread/ThreadCenterPanel/ChatBody/index.tsx
+++ b/web/screens/Thread/ThreadCenterPanel/ChatBody/index.tsx
@@ -85,24 +85,33 @@ const ChatBody = memo(
       overscan: 5,
     })
 
+    useEffect(() => {
+      if (parentRef.current) {
+        parentRef.current.scrollTo({ top: parentRef.current.scrollHeight })
+        virtualizer.scrollToIndex(count - 1)
+      }
+    }, [count, virtualizer])
+
     useEffect(() => {
       if (parentRef.current && isGeneratingResponse) {
-        requestAnimationFrame(() => {
-          if (parentRef.current) {
-            parentRef.current.scrollTo({ top: parentRef.current.scrollHeight })
-          }
-        })
+        parentRef.current.scrollTo({ top: parentRef.current.scrollHeight })
+        virtualizer.scrollToIndex(count - 1)
       }
     }, [count, virtualizer, isGeneratingResponse])
 
+    useEffect(() => {
+      if (parentRef.current && isGeneratingResponse) {
+        parentRef.current.scrollTo({ top: parentRef.current.scrollHeight })
+        virtualizer.scrollToIndex(count - 1)
+      }
+    }, [count, virtualizer, isGeneratingResponse, currentThread?.id])
+
     useEffect(() => {
       isUserManuallyScrollingUp.current = false
-      requestAnimationFrame(() => {
-        if (parentRef.current) {
-          parentRef.current.scrollTo({ top: parentRef.current.scrollHeight })
-          virtualizer.scrollToIndex(count - 1)
-        }
-      })
+      if (parentRef.current) {
+        parentRef.current.scrollTo({ top: parentRef.current.scrollHeight })
+        virtualizer.scrollToIndex(count - 1)
+      }
     }, [count, currentThread?.id, virtualizer])
 
     const items = virtualizer.getVirtualItems()

From e8e5c8c5f4080dc12ad2c1385ffcee387845eaf0 Mon Sep 17 00:00:00 2001
From: Faisal Amir <urmauur@gmail.com>
Date: Mon, 23 Dec 2024 21:39:22 +0800
Subject: [PATCH 14/17] fix: disabled native resize textarea when textarea
 autogrowing (#4326)

* fix: disabled native resize textarea when textarea autogrowing

* fix: disabled auto resize on instruction field
---
 joi/src/core/TextArea/index.tsx               | 6 +++++-
 web/screens/Thread/ThreadRightPanel/index.tsx | 2 +-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/joi/src/core/TextArea/index.tsx b/joi/src/core/TextArea/index.tsx
index 6807178fff..306e18d05e 100644
--- a/joi/src/core/TextArea/index.tsx
+++ b/joi/src/core/TextArea/index.tsx
@@ -34,7 +34,11 @@ const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(
     return (
       <div className="textarea__wrapper">
         <textarea
-          className={twMerge('textarea', className)}
+          className={twMerge(
+            'textarea',
+            className,
+            autoResize && 'resize-none'
+          )}
           ref={autoResize ? textareaRef : ref}
           {...props}
         />
diff --git a/web/screens/Thread/ThreadRightPanel/index.tsx b/web/screens/Thread/ThreadRightPanel/index.tsx
index dab50aba78..3257a194fd 100644
--- a/web/screens/Thread/ThreadRightPanel/index.tsx
+++ b/web/screens/Thread/ThreadRightPanel/index.tsx
@@ -257,7 +257,7 @@ const ThreadRightPanel = () => {
                 id="assistant-instructions"
                 placeholder="Eg. You are a helpful assistant."
                 value={activeAssistant?.instructions ?? ''}
-                autoResize
+                // autoResize
                 onChange={onAssistantInstructionChanged}
               />
             </div>

From b28cac70830c18ad9c968e04dd5092551001f892 Mon Sep 17 00:00:00 2001
From: Louis <louis@jan.ai>
Date: Mon, 23 Dec 2024 21:04:37 +0700
Subject: [PATCH 15/17] fix: render performance while generating messages
 (#4328)

---
 web/containers/Providers/ModelHandler.tsx     | 37 +++++++++++++++----
 web/helpers/atoms/ChatMessage.atom.ts         |  7 ++++
 web/hooks/useSetActiveThread.ts               | 21 ++++++++---
 .../ThreadCenterPanel/ChatItem/index.tsx      | 22 ++++++++++-
 4 files changed, 73 insertions(+), 14 deletions(-)

diff --git a/web/containers/Providers/ModelHandler.tsx b/web/containers/Providers/ModelHandler.tsx
index d838df3246..8c565bab11 100644
--- a/web/containers/Providers/ModelHandler.tsx
+++ b/web/containers/Providers/ModelHandler.tsx
@@ -18,7 +18,7 @@ import {
   extractInferenceParams,
   ModelExtension,
 } from '@janhq/core'
-import { useAtomValue, useSetAtom } from 'jotai'
+import { useAtom, useAtomValue, useSetAtom } from 'jotai'
 import { ulid } from 'ulidx'
 
 import { activeModelAtom, stateModelAtom } from '@/hooks/useActiveModel'
@@ -32,6 +32,7 @@ import {
   updateMessageAtom,
   tokenSpeedAtom,
   deleteMessageAtom,
+  subscribedGeneratingMessageAtom,
 } from '@/helpers/atoms/ChatMessage.atom'
 import { downloadedModelsAtom } from '@/helpers/atoms/Model.atom'
 import {
@@ -40,6 +41,7 @@ import {
   isGeneratingResponseAtom,
   updateThreadAtom,
   getActiveThreadModelParamsAtom,
+  activeThreadAtom,
 } from '@/helpers/atoms/Thread.atom'
 
 const maxWordForThreadTitle = 10
@@ -54,6 +56,10 @@ export default function ModelHandler() {
   const activeModel = useAtomValue(activeModelAtom)
   const setActiveModel = useSetAtom(activeModelAtom)
   const setStateModel = useSetAtom(stateModelAtom)
+  const [subscribedGeneratingMessage, setSubscribedGeneratingMessage] = useAtom(
+    subscribedGeneratingMessageAtom
+  )
+  const activeThread = useAtomValue(activeThreadAtom)
 
   const updateThreadWaiting = useSetAtom(updateThreadWaitingForResponseAtom)
   const threads = useAtomValue(threadsAtom)
@@ -62,11 +68,17 @@ export default function ModelHandler() {
   const setIsGeneratingResponse = useSetAtom(isGeneratingResponseAtom)
   const updateThread = useSetAtom(updateThreadAtom)
   const messagesRef = useRef(messages)
+  const messageGenerationSubscriber = useRef(subscribedGeneratingMessage)
   const activeModelRef = useRef(activeModel)
+  const activeThreadRef = useRef(activeThread)
   const activeModelParams = useAtomValue(getActiveThreadModelParamsAtom)
   const activeModelParamsRef = useRef(activeModelParams)
   const setTokenSpeed = useSetAtom(tokenSpeedAtom)
 
+  useEffect(() => {
+    activeThreadRef.current = activeThread
+  }, [activeThread])
+
   useEffect(() => {
     threadsRef.current = threads
   }, [threads])
@@ -87,6 +99,10 @@ export default function ModelHandler() {
     activeModelParamsRef.current = activeModelParams
   }, [activeModelParams])
 
+  useEffect(() => {
+    messageGenerationSubscriber.current = subscribedGeneratingMessage
+  }, [subscribedGeneratingMessage])
+
   const onNewMessageResponse = useCallback(
     async (message: ThreadMessage) => {
       if (message.type === MessageRequestType.Thread) {
@@ -179,12 +195,19 @@ export default function ModelHandler() {
 
   const updateThreadMessage = useCallback(
     (message: ThreadMessage) => {
-      updateMessage(
-        message.id,
-        message.thread_id,
-        message.content,
-        message.status
-      )
+      if (
+        messageGenerationSubscriber.current &&
+        message.thread_id === activeThreadRef.current?.id &&
+        !messageGenerationSubscriber.current!.thread_id
+      ) {
+        updateMessage(
+          message.id,
+          message.thread_id,
+          message.content,
+          message.status
+        )
+      }
+
       if (message.status === MessageStatus.Pending) {
         if (message.content.length) {
           setIsGeneratingResponse(false)
diff --git a/web/helpers/atoms/ChatMessage.atom.ts b/web/helpers/atoms/ChatMessage.atom.ts
index 7034396652..1847aa4224 100644
--- a/web/helpers/atoms/ChatMessage.atom.ts
+++ b/web/helpers/atoms/ChatMessage.atom.ts
@@ -35,6 +35,13 @@ export const chatMessages = atom(
   }
 )
 
+/**
+ * Store subscribed generating message thread
+ */
+export const subscribedGeneratingMessageAtom = atom<{
+  thread_id?: string
+}>({})
+
 /**
  * Stores the status of the messages load for each thread
  */
diff --git a/web/hooks/useSetActiveThread.ts b/web/hooks/useSetActiveThread.ts
index 8c7ed5361b..62baa4a870 100644
--- a/web/hooks/useSetActiveThread.ts
+++ b/web/hooks/useSetActiveThread.ts
@@ -1,11 +1,15 @@
 import { ExtensionTypeEnum, Thread, ConversationalExtension } from '@janhq/core'
 
-import { useSetAtom } from 'jotai'
+import { useAtom, useAtomValue, useSetAtom } from 'jotai'
 
 import { extensionManager } from '@/extension'
 import { activeAssistantAtom } from '@/helpers/atoms/Assistant.atom'
-import { setConvoMessagesAtom } from '@/helpers/atoms/ChatMessage.atom'
 import {
+  setConvoMessagesAtom,
+  subscribedGeneratingMessageAtom,
+} from '@/helpers/atoms/ChatMessage.atom'
+import {
+  getActiveThreadIdAtom,
   setActiveThreadIdAtom,
   setThreadModelParamsAtom,
 } from '@/helpers/atoms/Thread.atom'
@@ -13,14 +17,18 @@ import { ModelParams } from '@/types/model'
 
 export default function useSetActiveThread() {
   const setActiveThreadId = useSetAtom(setActiveThreadIdAtom)
-  const setThreadMessage = useSetAtom(setConvoMessagesAtom)
+  const activeThreadId = useAtomValue(getActiveThreadIdAtom)
+  const setThreadMessages = useSetAtom(setConvoMessagesAtom)
   const setThreadModelParams = useSetAtom(setThreadModelParamsAtom)
   const setActiveAssistant = useSetAtom(activeAssistantAtom)
+  const [messageSubscriber, setMessageSubscriber] = useAtom(
+    subscribedGeneratingMessageAtom
+  )
 
   const setActiveThread = async (thread: Thread) => {
-    if (!thread?.id) return
+    if (!thread?.id || activeThreadId === thread.id) return
 
-    setActiveThreadId(thread?.id)
+    setActiveThreadId(thread.id)
 
     try {
       const assistantInfo = await getThreadAssistant(thread.id)
@@ -32,7 +40,8 @@ export default function useSetActiveThread() {
         ...assistantInfo?.model?.settings,
       }
       setThreadModelParams(thread?.id, modelParams)
-      setThreadMessage(thread.id, messages)
+      setThreadMessages(thread.id, messages)
+      if (messageSubscriber.thread_id !== thread.id) setMessageSubscriber({})
     } catch (e) {
       console.error(e)
     }
diff --git a/web/screens/Thread/ThreadCenterPanel/ChatItem/index.tsx b/web/screens/Thread/ThreadCenterPanel/ChatItem/index.tsx
index 57876d0448..b1c7386331 100644
--- a/web/screens/Thread/ThreadCenterPanel/ChatItem/index.tsx
+++ b/web/screens/Thread/ThreadCenterPanel/ChatItem/index.tsx
@@ -1,4 +1,4 @@
-import React, { forwardRef, useEffect, useState } from 'react'
+import React, { forwardRef, useEffect, useRef, useState } from 'react'
 
 import {
   events,
@@ -8,10 +8,14 @@ import {
   ThreadMessage,
 } from '@janhq/core'
 
+import { useAtom } from 'jotai'
+
 import ErrorMessage from '@/containers/ErrorMessage'
 
 import MessageContainer from '../TextMessage'
 
+import { subscribedGeneratingMessageAtom } from '@/helpers/atoms/ChatMessage.atom'
+
 type Ref = HTMLDivElement
 
 type Props = {
@@ -22,9 +26,13 @@ type Props = {
 const ChatItem = forwardRef<Ref, Props>((message, ref) => {
   const [content, setContent] = useState<ThreadContent[]>(message.content)
   const [status, setStatus] = useState<MessageStatus>(message.status)
+  const [subscribedGeneratingMessage, setSubscribedGeneratingMessage] = useAtom(
+    subscribedGeneratingMessageAtom
+  )
   const [errorMessage, setErrorMessage] = useState<ThreadMessage | undefined>(
     message.isCurrentMessage && !!message?.metadata?.error ? message : undefined
   )
+  const subscribedGeneratingMessageRef = useRef(subscribedGeneratingMessage)
 
   function onMessageUpdate(data: ThreadMessage) {
     if (data.id === message.id) {
@@ -32,9 +40,21 @@ const ChatItem = forwardRef<Ref, Props>((message, ref) => {
       if (data.status !== status) setStatus(data.status)
       if (data.status === MessageStatus.Error && message.isCurrentMessage)
         setErrorMessage(data)
+
+      // Update subscriber if the message is generating
+      if (
+        subscribedGeneratingMessageRef.current?.thread_id !== message.thread_id
+      )
+        setSubscribedGeneratingMessage({
+          thread_id: message.thread_id,
+        })
     }
   }
 
+  useEffect(() => {
+    subscribedGeneratingMessageRef.current = subscribedGeneratingMessage
+  }, [subscribedGeneratingMessage])
+
   useEffect(() => {
     if (!message.isCurrentMessage && errorMessage) setErrorMessage(undefined)
   }, [message, errorMessage])

From dccd9dd77c92fcec1b6c179616f81c062cec2d61 Mon Sep 17 00:00:00 2001
From: Louis <louis@jan.ai>
Date: Tue, 24 Dec 2024 09:56:02 +0700
Subject: [PATCH 16/17] chore: bump cortex 1.0.6-rc (#4330)

---
 extensions/inference-cortex-extension/bin/version.txt | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/extensions/inference-cortex-extension/bin/version.txt b/extensions/inference-cortex-extension/bin/version.txt
index 90a27f9cea..d749db52d1 100644
--- a/extensions/inference-cortex-extension/bin/version.txt
+++ b/extensions/inference-cortex-extension/bin/version.txt
@@ -1 +1 @@
-1.0.5
+1.0.6-rc1

From 3cd4db0a92007b002116b63cd01302c7f7992e41 Mon Sep 17 00:00:00 2001
From: Louis <louis@jan.ai>
Date: Thu, 26 Dec 2024 10:52:16 +0700
Subject: [PATCH 17/17] chore: bump latest cortex stable release version
 (#4336)

---
 extensions/inference-cortex-extension/bin/version.txt | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/extensions/inference-cortex-extension/bin/version.txt b/extensions/inference-cortex-extension/bin/version.txt
index d749db52d1..af0b7ddbff 100644
--- a/extensions/inference-cortex-extension/bin/version.txt
+++ b/extensions/inference-cortex-extension/bin/version.txt
@@ -1 +1 @@
-1.0.6-rc1
+1.0.6