fix: send message button state reset on stop

web/helpers/atoms/Thread.atom.ts

@@ -87,13 +87,13 @@
  * Get the active thread state
  */
 export const activeThreadStateAtom = atom<ThreadState | undefined>((get) => {
   const threadId = get(activeThreadIdAtom)
   if (!threadId) {
     console.debug('Active thread id is undefined')
     return undefined
   }
 
   return get(threadStatesAtom)[threadId]
 })
 
 /**
@@ -107,7 +107,7 @@
       return undefined
     }
 
     return get(threadModelParamsAtom)[threadId]
   }
 )
 /// End Active Thread Atom
@@ -130,19 +130,19 @@
  */
 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])
 })
 
 /**
@@ -163,16 +163,31 @@
 export const updateThreadWaitingForResponseAtom = atom(
   null,
   (get, set, threadId: string, waitingForResponse: boolean) => {
     const currentState = { ...get(threadStatesAtom) }
     currentState[threadId] = {
       ...currentState[threadId],
       waitingForResponse,
       error: undefined,
     }
     set(threadStatesAtom, currentState)
   }
 )
 
+/**
+ * Reset the thread waiting for response state
+ */
+export const resetThreadWaitingForResponseAtom = atom(null, (get, set) => {
+  const currentState = { ...get(threadStatesAtom) }
+  Object.keys(currentState).forEach((threadId) => {
+    currentState[threadId] = {
+      ...currentState[threadId],
+      waitingForResponse: false,
+      error: undefined,
+    }
+  })
+  set(threadStatesAtom, currentState)
+})
+
 /**
  * Update the thread last message
  */

web/hooks/useActiveModel.ts

@@ -10,6 +10,10 @@ import { LAST_USED_MODEL_ID } from './useRecommendedModel'
 import { vulkanEnabledAtom } from '@/helpers/atoms/AppConfig.atom'
 import { activeAssistantAtom } from '@/helpers/atoms/Assistant.atom'
 import { downloadedModelsAtom } from '@/helpers/atoms/Model.atom'
+import {
+  isGeneratingResponseAtom,
+  resetThreadWaitingForResponseAtom,
+} from '@/helpers/atoms/Thread.atom'
 
 export const activeModelAtom = atom<Model | undefined>(undefined)
 export const loadModelErrorAtom = atom<string | undefined>(undefined)
@@ -34,6 +38,10 @@ export function useActiveModel() {
   const pendingModelLoad = useRef(false)
   const isVulkanEnabled = useAtomValue(vulkanEnabledAtom)
   const activeAssistant = useAtomValue(activeAssistantAtom)
+  const setGeneratingResponse = useSetAtom(isGeneratingResponseAtom)
+  const resetThreadWaitingForResponseState = useSetAtom(
+    resetThreadWaitingForResponseAtom
+  )
 
   const downloadedModelsRef = useRef<Model[]>([])
 
@@ -139,6 +147,8 @@ export function useActiveModel() {
         return
 
       const engine = EngineManager.instance().get(stoppingModel.engine)
+      setGeneratingResponse(false)
+      resetThreadWaitingForResponseState()
       return engine
         ?.unloadModel(stoppingModel)
         .catch((e) => console.error(e))
@@ -148,7 +158,14 @@ export function useActiveModel() {
           pendingModelLoad.current = false
         })
     },
-    [activeModel, setStateModel, setActiveModel, stateModel]
+    [
+      activeModel,
+      setStateModel,
+      setActiveModel,
+      stateModel,
+      setGeneratingResponse,
+      resetThreadWaitingForResponseState,
+    ]
   )
 
   const stopInference = useCallback(async () => {

web/hooks/useDeleteThread.ts

@@ -48,6 +48,7 @@ export default function useDeleteThread() {
         if (thread) {
           const updatedThread = {
             ...thread,
+            title: 'New Thread',
             metadata: {
               ...thread.metadata,
               title: 'New Thread',

web/screens/Thread/ThreadCenterPanel/ChatInput/index.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { useEffect, useRef, useState } from 'react'
 
 import { InferenceEngine, MessageStatus } from '@janhq/core'
 
 import { TextArea, Button, Tooltip, useClickOutside, Badge } from '@janhq/joi'
 import { useAtom, useAtomValue } from 'jotai'
@@ -50,7 +50,7 @@
 const ChatInput = () => {
   const activeThread = useAtomValue(activeThreadAtom)
   const { stateModel } = useActiveModel()
   const messages = useAtomValue(getCurrentChatMessagesAtom)
   const spellCheck = useAtomValue(spellCheckAtom)
 
   const [currentPrompt, setCurrentPrompt] = useAtom(currentPromptAtom)
@@ -302,9 +302,7 @@
               </div>
             )}
 
-            {messages[messages.length - 1]?.status !== MessageStatus.Pending &&
-            !isGeneratingResponse &&
-            !isStreamingResponse ? (
+            {!isGeneratingResponse && !isStreamingResponse ? (
               <>
                 {currentPrompt.length !== 0 && (
                   <Button