From 5eefb6b32c1f261202ce5a624d94b34d9c5ee9bd Mon Sep 17 00:00:00 2001
From: Rankin Zheng <runjin@merico.dev>
Date: Fri, 18 Aug 2023 12:11:12 +0800
Subject: [PATCH] Refactor CurrentMessage component and ChatStore

- Updated the CurrentMessage component to use the Message model from ChatStore.
- Replaced chat.lastMessage with the last message in the chat.messages array.
- Updated the useEffect hooks to create a new Message object and pass it to the newMessage and updateLastMessage actions.
- Updated the chatPanel function in ChatPanel.tsx to create a new Message object before calling the newMessage action.
- Removed the lastMessage field from the ChatStore model.
- Updated the startResponsing action to accept a string parameter.
- Updated the updateLastMessage action to accept a string parameter and update the message field of the last message in the chat.messages array.
---
 src/views/components/CurrentMessage/index.tsx |  8 +++++---
 src/views/pages/ChatPanel.tsx                 |  5 +++--
 src/views/stores/ChatStore.ts                 | 13 ++++++-------
 3 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/src/views/components/CurrentMessage/index.tsx b/src/views/components/CurrentMessage/index.tsx
index 0aee96a..863fcb8 100644
--- a/src/views/components/CurrentMessage/index.tsx
+++ b/src/views/components/CurrentMessage/index.tsx
@@ -5,6 +5,7 @@ import { Container, Text } from "@mantine/core";
 import CodeBlock from "@/views/components/CodeBlock";
 import { observer } from "mobx-react-lite";
 import { useMst } from "@/views/stores/RootStore";
+import { Message } from "@/views/stores/ChatStore";
 
 
 const MessageBlink = observer(() => {
@@ -50,7 +51,7 @@ const CurrentMessage = observer((props: any) => {
 
     // split blocks
     const messageBlocks = getBlocks(chat.currentMessage);
-    const lastMessageBlocks = getBlocks(chat.lastMessage?.message);
+    const lastMessageBlocks = getBlocks(chat.messages[chat.messages.length - 1]?.message);
     const fixedCount = lastMessageBlocks.length;
     const receivedCount = messageBlocks.length;
     const renderBlocks = messageBlocks.splice(-1);
@@ -58,13 +59,14 @@ const CurrentMessage = observer((props: any) => {
     useEffect(() => {
         if (chat.generating) {
             // new a bot message
-            chat.newMessage({ type: 'bot', message: chat.currentMessage });
+            const messageItem = Message.create({ type: 'bot', message: chat.currentMessage });
+            chat.newMessage(messageItem);
         }
     }, [chat.generating]);
 
     useEffect(() => {
         if (receivedCount - fixedCount >= 1 || !chat.responsed) {
-            chat.updateLastMessage({ type: 'bot', message: chat.currentMessage });
+            chat.updateLastMessage(chat.currentMessage);
         }
     }, [chat.currentMessage, chat.responsed]);
 
diff --git a/src/views/pages/ChatPanel.tsx b/src/views/pages/ChatPanel.tsx
index 046661a..c7b2ff4 100644
--- a/src/views/pages/ChatPanel.tsx
+++ b/src/views/pages/ChatPanel.tsx
@@ -60,7 +60,7 @@ const chatPanel = observer(() => {
             timer.start();
         });
         messageUtil.registerHandler('receiveMessage', (message: { text: string; isError: boolean, hash }) => {
-            const messageItem = Message.create({ message: message.text, hash: message.hash });
+            const messageItem = Message.create({ type: 'bot', message: message.text, hash: message.hash });
             chat.stopGenerating(true, messageItem);
             if (message.isError) {
                 chat.happendError(message.text);
@@ -68,7 +68,8 @@ const chatPanel = observer(() => {
         });
 
         messageUtil.registerHandler('systemMessage', (message: { text: string }) => {
-            chat.newMessage({ type: 'system', message: message.text });
+            const messageItem = Message.create({ type: 'system', message: message.text });
+            chat.newMessage(messageItem);
             // start generating
             chat.startSystemMessage();
             // Clear the input field
diff --git a/src/views/stores/ChatStore.ts b/src/views/stores/ChatStore.ts
index d4d5c64..87b0055 100644
--- a/src/views/stores/ChatStore.ts
+++ b/src/views/stores/ChatStore.ts
@@ -66,7 +66,6 @@ export const Message = types.model({
 export const ChatStore = types.model('Chat', {
     generating: false,
     responsed: false,
-    lastMessage: types.maybe(Message),
     currentMessage: '',
     hasDone: false,
     errorMessage: '',
@@ -131,17 +130,17 @@ export const ChatStore = types.model('Chat', {
                 }
             }
         },
-        startResponsing: (action) => {
+        startResponsing: (message: string) => {
             self.responsed = true;
-            self.currentMessage = action.payload;
+            self.currentMessage = message;
         },
         newMessage: (message: IMessage) => {
             self.messages.push(message);
-            self.lastMessage = message;
         },
-        updateLastMessage: (message: IMessage) => {
-            self.messages[self.messages.length - 1] = message;
-            self.lastMessage = message;
+        updateLastMessage: (message: string) => {
+            if (self.messages.length > 0) {
+                self.messages[self.messages.length - 1].message = message;
+            }
         },
         shiftMessage: () => {
             self.messages.splice(0, 1);