From a3149dc00eae4d03d4952100a72a92f6439adaad Mon Sep 17 00:00:00 2001
From: Jing Hua <tohjinghua123@gmail.com>
Date: Sat, 4 Mar 2023 20:23:27 +0800
Subject: [PATCH] feat: resubmit historical dialogues

fixes #4
---
 .../ChatContent/Message/MessageContent.tsx    | 43 ++++++++++++++++---
 src/components/PopupModal/index.ts            |  1 +
 tsconfig.json                                 |  3 +-
 vite.config.ts                                |  1 +
 4 files changed, 40 insertions(+), 8 deletions(-)
 create mode 100644 src/components/PopupModal/index.ts

diff --git a/src/components/Chat/ChatContent/Message/MessageContent.tsx b/src/components/Chat/ChatContent/Message/MessageContent.tsx
index d2cd654..95a7451 100644
--- a/src/components/Chat/ChatContent/Message/MessageContent.tsx
+++ b/src/components/Chat/ChatContent/Message/MessageContent.tsx
@@ -16,6 +16,8 @@ import useSubmit from '@hooks/useSubmit';
 
 import { MessageInterface } from '@type/chat';
 
+import PopupModal from '@components/PopupModal';
+
 const MessageContent = ({
   role,
   content,
@@ -286,6 +288,7 @@ const EditView = ({
   ]);
 
   const [_content, _setContent] = useState<string>(content);
+  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
   const textareaRef = React.createRef<HTMLTextAreaElement>();
 
   const handleInput = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
@@ -318,17 +321,22 @@ const EditView = ({
     setMessages(updatedMessages);
   };
 
-  // only for sticky forms
   const { handleSubmit } = useSubmit();
   const handleSaveAndSubmit = () => {
-    if (!sticky) return;
     if (_content == '') return;
     const updatedMessages: MessageInterface[] = JSON.parse(
       JSON.stringify(messages)
     );
-    updatedMessages.push({ role: inputRole, content: _content });
-    _setContent('');
-    setMessages(updatedMessages);
+    if (sticky) {
+      updatedMessages.push({ role: inputRole, content: _content });
+      _setContent('');
+      setMessages(updatedMessages);
+    } else {
+      updatedMessages[messageIndex].content = _content;
+      const _updatedMessages = updatedMessages.slice(0, messageIndex + 1);
+      setMessages(_updatedMessages);
+      setIsEdit(false);
+    }
     handleSubmit();
   };
 
@@ -357,11 +365,11 @@ const EditView = ({
       <div className='text-center mt-2 flex justify-center'>
         {sticky && (
           <button
-            className='btn relative btn-primary mr-2'
+            className='btn relative mr-2 btn-primary'
             onClick={handleSaveAndSubmit}
           >
             <div className='flex items-center justify-center gap-2'>
-              Save and Submit
+              Save & Submit
             </div>
           </button>
         )}
@@ -375,6 +383,19 @@ const EditView = ({
           <div className='flex items-center justify-center gap-2'>Save</div>
         </button>
 
+        {sticky || (
+          <button
+            className='btn relative mr-2 btn-neutral'
+            onClick={() => {
+              setIsModalOpen(true);
+            }}
+          >
+            <div className='flex items-center justify-center gap-2'>
+              Save & Submit
+            </div>
+          </button>
+        )}
+
         {sticky || (
           <button
             className='btn relative btn-neutral'
@@ -384,6 +405,14 @@ const EditView = ({
           </button>
         )}
       </div>
+      {isModalOpen && (
+        <PopupModal
+          setIsModalOpen={setIsModalOpen}
+          title='Warning'
+          message='Please be advised that by submitting this message, all subsequent messages will be deleted!'
+          handleConfirm={handleSaveAndSubmit}
+        />
+      )}
     </>
   );
 };
diff --git a/src/components/PopupModal/index.ts b/src/components/PopupModal/index.ts
new file mode 100644
index 0000000..2f71a63
--- /dev/null
+++ b/src/components/PopupModal/index.ts
@@ -0,0 +1 @@
+export { default } from './PopupModal';
diff --git a/tsconfig.json b/tsconfig.json
index 8e3a564..1932a6d 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -22,7 +22,8 @@
       "@store/*": ["./src/store/*"],
       "@hooks/*": ["./src/hooks/*"],
       "@constants/*": ["./src/constants/*"],
-      "@api/*": ["./src/api/*"]
+      "@api/*": ["./src/api/*"],
+      "@components/*": ["./src/components/*"]
     }
   },
   "include": ["src"],
diff --git a/vite.config.ts b/vite.config.ts
index 6741cd2..02fb56e 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -12,6 +12,7 @@ export default defineConfig({
       '@hooks/': new URL('./src/hooks/', import.meta.url).pathname,
       '@constants/': new URL('./src/constants/', import.meta.url).pathname,
       '@api/': new URL('./src/api/', import.meta.url).pathname,
+      '@components/': new URL('./src/components/', import.meta.url).pathname,
     },
   },
 });