From 022218d4251346d5392da65d612d5f5d61399b9b Mon Sep 17 00:00:00 2001
From: Rankin Zheng <runjin@merico.dev>
Date: Tue, 23 May 2023 21:13:49 +0800
Subject: [PATCH] Add error handling and regeneration button to ChatPanel

- Import IconRotateDot from @tabler/icons-react
- Add hasError state to track if an error occurred
- Update receiveMessage handler to set hasError state if message.isError is true
- Add regeneration button with IconRotateDot when hasError is true
- Add onClick handler for regeneration button to clear error and request regeneration
---
 src/views/ChatPanel/index.tsx | 40 +++++++++++++++++++++++++++++++++--
 1 file changed, 38 insertions(+), 2 deletions(-)

diff --git a/src/views/ChatPanel/index.tsx b/src/views/ChatPanel/index.tsx
index bdb8877..1e90726 100644
--- a/src/views/ChatPanel/index.tsx
+++ b/src/views/ChatPanel/index.tsx
@@ -7,7 +7,7 @@ import { createStyles, keyframes } from '@mantine/core';
 import { ActionIcon } from '@mantine/core';
 import { Button, Text } from '@mantine/core';
 import { useListState, useResizeObserver, useTimeout, useViewportSize } from '@mantine/hooks';
-import { IconBulb, IconCheck, IconColumnInsertRight, IconCopy, IconFileDiff, IconGitCommit, IconMessagePlus, IconPlayerStop, IconReplace, IconSend, IconSquareRoundedPlus, IconTerminal2, IconUserCircle, IconX } from '@tabler/icons-react';
+import { IconBulb, IconCheck, IconColumnInsertRight, IconCopy, IconFileDiff, IconGitCommit, IconMessagePlus, IconPlayerPlay, IconPlayerStop, IconReplace, IconRotateDot, IconSend, IconSquareRoundedPlus, IconTerminal2, IconUserCircle, IconX } from '@tabler/icons-react';
 import ReactMarkdown from 'react-markdown';
 import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
 import okaidia from 'react-syntax-highlighter/dist/esm/styles/prism/okaidia';
@@ -40,6 +40,7 @@ const chatPanel = () => {
     const [registed, setRegisted] = useState(false);
     const [input, setInput] = useState('');
     const [menuOpend, setMenuOpend] = useState(false);
+    const [hasError, setHasError] = useState(false);
     const [menuType, setMenuType] = useState(''); // contexts or commands
     const { height, width } = useViewportSize();
     const [inputRef, inputRect] = useResizeObserver();
@@ -154,10 +155,13 @@ const chatPanel = () => {
             setCurrentMessage(message.text);
             setResponsed(true);
         });
-        messageUtil.registerHandler('receiveMessage', (message: { text: string; }) => {
+        messageUtil.registerHandler('receiveMessage', (message: { text: string; isError: boolean }) => {
             setCurrentMessage(message.text);
             setGenerating(false);
             setResponsed(true);
+            if (message.isError) {
+                setHasError(true);
+            }
         });
         messageUtil.registerHandler('regCommandList', (message: { result: { pattern: string; description: string; name: string }[] }) => {
             commandMenusHandlers.append(...message.result);
@@ -676,6 +680,38 @@ const chatPanel = () => {
                         </Button>
                     </Center>
                 }
+                {hasError &&
+                    <Center>
+                        <Button
+                            size='xs'
+                            leftIcon={<IconRotateDot color='var(--vscode-button-foreground)' />}
+                            sx={{
+                                backgroundColor: 'var(--vscode-button-background)',
+                            }}
+                            styles={{
+                                icon: {
+                                    color: 'var(--vscode-button-foreground)'
+                                },
+                                label: {
+                                    color: 'var(--vscode-button-foreground)',
+                                    fontSize: 'var(--vscode-editor-font-size)',
+                                }
+                            }}
+                            variant="white"
+                            onClick={() => {
+                                messageUtil.sendMessage({
+                                    command: 'regeneration'
+                                });
+                                messageHandlers.pop();
+                                setHasError(false);
+                                setGenerating(true);
+                                setResponsed(false);
+                                setCurrentMessage('');
+                            }}>
+                            Regeneration
+                        </Button>
+                    </Center>
+                }
                 {contexts && contexts.length > 0 &&
                     <Accordion variant="contained" chevronPosition="left"
                         sx={{