fix: not update active model when using resend button

Signed-off-by: James <[email protected]>
janhq · Dec 4, 2023 · 67065d0 · 67065d0
1 parent 424b003
commit 67065d0
Show file tree

Hide file tree

Showing 2 changed files with 61 additions and 33 deletions.
diff --git a/web/hooks/useSendChatMessage.ts b/web/hooks/useSendChatMessage.ts
@@ -48,6 +48,47 @@ export default function useSendChatMessage() {
  const { startModel } = useActiveModel()
  const [queuedMessage, setQueuedMessage] = useState(false)
 
+ const resendChatMessage = async () => {
+ if (!activeThread) {
+ console.error('No active thread')
+ return
+ }
+
+ updateThreadWaiting(activeThread.id, true)
+
+ const messages: ChatCompletionMessage[] = [
+ activeThread.assistants[0]?.instructions,
+ ]
+ .map<ChatCompletionMessage>((instructions) => {
+ const systemMessage: ChatCompletionMessage = {
+ role: ChatCompletionRole.System,
+ content: instructions,
+ }
+ return systemMessage
+ })
+ .concat(
+ currentMessages.map<ChatCompletionMessage>((msg) => ({
+ role: msg.role,
+ content: msg.content[0]?.text.value ?? '',
+ }))
+ )
+
+ const messageRequest: MessageRequest = {
+ id: ulid(),
+ messages: messages,
+ threadId: activeThread.id,
+ }
+
+ const modelId = selectedModel?.id ?? activeThread.assistants[0].model.id
+
+ if (activeModel?.id !== modelId) {
+ setQueuedMessage(true)
+ await startModel(modelId)
+ setQueuedMessage(false)
+ }
+ events.emit(EventName.OnMessageSent, messageRequest)
+ }
+
  const sendChatMessage = async () => {
  if (!currentPrompt || currentPrompt.trim().length === 0) {
  return
@@ -162,6 +203,7 @@ export default function useSendChatMessage() {
 
  return {
  sendChatMessage,
+ resendChatMessage,
  queuedMessage,
  }
 }
diff --git a/web/screens/Chat/MessageToolbar/index.tsx b/web/screens/Chat/MessageToolbar/index.tsx
@@ -1,7 +1,5 @@
 import {
- ChatCompletionMessage,
  EventName,
- MessageRequest,
  MessageStatus,
  ExtensionType,
  ThreadMessage,
@@ -21,17 +19,15 @@ import {
  getCurrentChatMessagesAtom,
 } from '@/helpers/atoms/ChatMessage.atom'
 import { activeThreadAtom } from '@/helpers/atoms/Conversation.atom'
+import useSendChatMessage from '@/hooks/useSendChatMessage'
 
 const MessageToolbar = ({ message }: { message: ThreadMessage }) => {
  const deleteMessage = useSetAtom(deleteMessageAtom)
  const thread = useAtomValue(activeThreadAtom)
  const messages = useAtomValue(getCurrentChatMessagesAtom)
- // const threadStateAtom = useMemo(
- // () => atom((get) => get(threadStatesAtom)[thread?.id ?? '']),
- // [thread?.id]
- // )
- // const threadState = useAtomValue(threadStateAtom)
- const stopInference = async () => {
+ const { resendChatMessage } = useSendChatMessage()
+
+ const onStopInferenceClick = async () => {
  await extensionManager
  .get<InferenceExtension>(ExtensionType.Inference)
  ?.stopInference()
@@ -43,13 +39,25 @@ const MessageToolbar = ({ message }: { message: ThreadMessage }) => {
  }, 300)
  }
 
+ const onDeleteClick = async () => {
+ deleteMessage(message.id ?? '')
+ if (thread) {
+ await extensionManager
+ .get<ConversationalExtension>(ExtensionType.Conversational)
+ ?.writeMessages(
+ thread.id,
+ messages.filter((msg) => msg.id !== message.id)
+ )
+ }
+ }
+
  return (
  <div className={twMerge('flex flex-row items-center')}>
  <div className="flex overflow-hidden rounded-md border border-border bg-background/20">
  {message.status === MessageStatus.Pending && (
  <div
  className="cursor-pointer border-r border-border px-2 py-2 hover:bg-background/80"
- onClick={() => stopInference()}
+ onClick={onStopInferenceClick}
  >
  <StopCircle size={14} />
  </div>
@@ -58,20 +66,7 @@ const MessageToolbar = ({ message }: { message: ThreadMessage }) => {
  message.id === messages[messages.length - 1]?.id && (
  <div
  className="cursor-pointer border-r border-border px-2 py-2 hover:bg-background/80"
- onClick={() => {
- const messageRequest: MessageRequest = {
- id: message.id ?? '',
- messages: messages.slice(0, -1).map((e) => {
- const msg: ChatCompletionMessage = {
- role: e.role,
- content: e.content[0].text.value,
- }
- return msg
- }),
- threadId: message.thread_id ?? '',
- }
- events.emit(EventName.OnMessageSent, messageRequest)
- }}
+ onClick={resendChatMessage}
  >
  <RefreshCcw size={14} />
  </div>
@@ -89,16 +84,7 @@ const MessageToolbar = ({ message }: { message: ThreadMessage }) => {
  </div>
  <div
  className="cursor-pointer px-2 py-2 hover:bg-background/80"
- onClick={async () => {
- deleteMessage(message.id ?? '')
- if (thread)
- await extensionManager
- .get<ConversationalExtension>(ExtensionType.Conversational)
- ?.writeMessages(
- thread.id,
- messages.filter((msg) => msg.id !== message.id)
- )
- }}
+ onClick={onDeleteClick}
  >
  <Trash2Icon size={14} />
  </div>