perf: loading ui

labring · Nov 17, 2024 · 94baff5 · 94baff5
1 parent df10b07
commit 94baff5
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 6 deletions.
diff --git a/projects/app/src/components/core/chat/ChatContainer/ChatBox/index.tsx b/projects/app/src/components/core/chat/ChatContainer/ChatBox/index.tsx
@@ -66,6 +66,7 @@ import { ChatRecordContext } from '@/web/core/chat/context/chatRecordContext';
 import { ChatItemContext } from '@/web/core/chat/context/chatItemContext';
 import { useChatStore } from '@/web/core/chat/context/storeChat';
 import TimeBox from './components/TimeBox';
+import MyBox from '@fastgpt/web/components/common/MyBox';
 
 const ResponseTags = dynamic(() => import('./components/ResponseTags'));
 const FeedbackModal = dynamic(() => import('./components/FeedbackModal'));
@@ -112,14 +113,15 @@ const ChatBox = ({
   const router = useRouter();
   const { t } = useTranslation();
   const { toast } = useToast();
-  const { setLoading, feConfigs } = useSystemStore();
+  const { feConfigs } = useSystemStore();
   const { isPc } = useSystem();
   const TextareaDom = useRef<HTMLTextAreaElement>(null);
   const chatController = useRef(new AbortController());
   const questionGuideController = useRef(new AbortController());
   const pluginController = useRef(new AbortController());
   const isNewChatReplace = useRef(false);
 
+  const [isLoading, setIsLoading] = useState(false);
   const [feedbackId, setFeedbackId] = useState<string>();
   const [readFeedbackData, setReadFeedbackData] = useState<{
     dataId: string;
@@ -584,7 +586,7 @@ const ChatBox = ({
     if (!dataId || !onDelMessage) return;
 
     return async () => {
-      setLoading(true);
+      setIsLoading(true);
       const index = chatRecords.findIndex((item) => item.dataId === dataId);
       const delHistory = chatRecords.slice(index);
       try {
@@ -607,7 +609,7 @@ const ChatBox = ({
           title: getErrText(error, 'Retry failed')
         });
       }
-      setLoading(false);
+      setIsLoading(false);
     };
   });
   // delete one message(One human and the ai response)
@@ -1007,7 +1009,13 @@ const ChatBox = ({
   // }, [isAutoExecute, sendPrompt, chatStarted, autoExecute, chatHistories.length]);
 
   return (
-    <Flex flexDirection={'column'} h={'100%'} position={'relative'}>
+    <MyBox
+      isLoading={isLoading}
+      display={'flex'}
+      flexDirection={'column'}
+      h={'100%'}
+      position={'relative'}
+    >
       <Script src={getWebReqUrl('/js/html2pdf.bundle.min.js')} strategy="lazyOnload"></Script>
       {/* chat box container */}
       {RenderRecords}
@@ -1114,7 +1122,7 @@ const ChatBox = ({
           }}
         />
       )}
-    </Flex>
+    </MyBox>
   );
 };
 

diff --git a/projects/app/src/web/core/chat/context/chatContext.tsx b/projects/app/src/web/core/chat/context/chatContext.tsx
@@ -14,7 +14,6 @@ import { BoxProps, useDisclosure } from '@chakra-ui/react';
 import { useChatStore } from './storeChat';
 import { getNanoid } from '@fastgpt/global/common/string/tools';
 import { useScrollPagination } from '@fastgpt/web/hooks/useScrollPagination';
-import { OutLinkChatAuthProps } from '@fastgpt/global/support/permission/chat';
 
 type UpdateHistoryParams = {
   chatId: UpdateHistoryProps['chatId'];