perf: quote response

client/src/pages/chat/components/QuoteModal.tsx

@@ -1,177 +0,0 @@
-import React, { useCallback, useState } from 'react';
-import {
-  Modal,
-  ModalOverlay,
-  ModalContent,
-  ModalBody,
-  ModalCloseButton,
-  ModalHeader,
-  Box,
-  useTheme
-} from '@chakra-ui/react';
-import MyIcon from '@/components/Icon';
-import InputDataModal from '@/pages/kb/detail/components/InputDataModal';
-import { getKbDataItemById } from '@/api/plugins/kb';
-import { useLoading } from '@/hooks/useLoading';
-import { useQuery } from '@tanstack/react-query';
-import { getHistoryQuote, updateHistoryQuote } from '@/api/chat';
-import { useToast } from '@/hooks/useToast';
-import { getErrText } from '@/utils/tools';
-
-const QuoteModal = ({
-  historyId,
-  contentId,
-  onClose
-}: {
-  historyId: string;
-  contentId: string;
-  onClose: () => void;
-}) => {
-  const theme = useTheme();
-  const { toast } = useToast();
-  const { setIsLoading, Loading } = useLoading();
-  const [editDataItem, setEditDataItem] = useState<{
-    dataId: string;
-    a: string;
-    q: string;
-  }>();
-
-  const {
-    data: quote = [],
-    refetch,
-    isLoading
-  } = useQuery(['getHistoryQuote'], () => getHistoryQuote({ historyId, contentId }));
-
-  /**
-   * update kbData, update mongo status and reload quotes
-   */
-  const updateQuoteStatus = useCallback(
-    async (quoteId: string, sourceText: string) => {
-      setIsLoading(true);
-      try {
-        await updateHistoryQuote({
-          contentId,
-          historyId,
-          quoteId,
-          sourceText
-        });
-        // reload quote
-        refetch();
-      } catch (err) {
-        toast({
-          status: 'warning',
-          title: getErrText(err)
-        });
-      }
-      setIsLoading(false);
-    },
-    [contentId, historyId, refetch, setIsLoading, toast]
-  );
-
-  /**
-   * click edit, get new kbDataItem
-   */
-  const onclickEdit = useCallback(
-    async (item: QuoteItemType) => {
-      try {
-        setIsLoading(true);
-        const data = (await getKbDataItemById(item.id)) as QuoteItemType;
-
-        if (!data) {
-          updateQuoteStatus(item.id, '已删除');
-          throw new Error('该数据已被删除');
-        }
-
-        setEditDataItem({
-          dataId: data.id,
-          q: data.q,
-          a: data.a
-        });
-      } catch (err) {
-        toast({
-          status: 'warning',
-          title: getErrText(err)
-        });
-      }
-      setIsLoading(false);
-    },
-    [setIsLoading, toast, updateQuoteStatus]
-  );
-
-  return (
-    <>
-      <Modal isOpen={true} onClose={onClose}>
-        <ModalOverlay />
-        <ModalContent
-          position={'relative'}
-          maxW={'min(90vw, 700px)'}
-          h={'80vh'}
-          overflow={'overlay'}
-        >
-          <ModalHeader>
-            知识库引用({quote.length}条)
-            <Box fontSize={'sm'} fontWeight={'normal'}>
-              注意: 修改知识库内容成功后，此处不会显示。点击编辑后，才是显示最新的内容。
-            </Box>
-          </ModalHeader>
-          <ModalCloseButton />
-          <ModalBody pt={0} whiteSpace={'pre-wrap'} textAlign={'justify'} fontSize={'sm'}>
-            {quote.map((item) => (
-              <Box
-                key={item.id}
-                flex={'1 0 0'}
-                p={2}
-                borderRadius={'sm'}
-                border={theme.borders.base}
-                _notLast={{ mb: 2 }}
-                position={'relative'}
-                _hover={{ '& .edit': { display: 'flex' } }}
-              >
-                {item.source && <Box color={'myGray.600'}>({item.source})</Box>}
-                <Box>{item.q}</Box>
-                <Box>{item.a}</Box>
-                <Box
-                  className="edit"
-                  display={'none'}
-                  position={'absolute'}
-                  right={0}
-                  top={0}
-                  bottom={0}
-                  w={'40px'}
-                  bg={'rgba(255,255,255,0.9)'}
-                  alignItems={'center'}
-                  justifyContent={'center'}
-                  boxShadow={'-10px 0 10px rgba(255,255,255,1)'}
-                >
-                  <MyIcon
-                    name={'edit'}
-                    w={'18px'}
-                    h={'18px'}
-                    cursor={'pointer'}
-                    color={'myGray.600'}
-                    _hover={{
-                      color: 'myBlue.700'
-                    }}
-                    onClick={() => onclickEdit(item)}
-                  />
-                </Box>
-              </Box>
-            ))}
-          </ModalBody>
-          <Loading loading={isLoading} fixed={false} />
-        </ModalContent>
-      </Modal>
-      {editDataItem && (
-        <InputDataModal
-          onClose={() => setEditDataItem(undefined)}
-          onSuccess={() => updateQuoteStatus(editDataItem.dataId, '手动修改')}
-          onDelete={() => updateQuoteStatus(editDataItem.dataId, '已删除')}
-          kbId=""
-          defaultValues={editDataItem}
-        />
-      )}
-    </>
-  );
-};
-
-export default QuoteModal;

client/src/pages/chat/index.tsx

@@ -1,28 +1,18 @@
-import React, { useCallback, useState, useRef } from 'react';
+import React, { useCallback, useRef } from 'react';
 import { useRouter } from 'next/router';
 import { getInitChatSiteInfo, delChatRecordByIndex, putChatHistory } from '@/api/chat';
 import {
   Box,
   Flex,
-  useColorModeValue,
-  Modal,
-  ModalOverlay,
-  ModalContent,
-  ModalBody,
-  ModalCloseButton,
-  ModalHeader,
   useDisclosure,
   Drawer,
   DrawerOverlay,
   DrawerContent,
   useTheme
 } from '@chakra-ui/react';
-import { useToast } from '@/hooks/useToast';
 import { useGlobalStore } from '@/store/global';
 import { useQuery } from '@tanstack/react-query';
-import dynamic from 'next/dynamic';
 import { streamFetch } from '@/api/fetch';
-import MyIcon from '@/components/Icon';
 import { useChatStore } from '@/store/chat';
 import { useLoading } from '@/hooks/useLoading';
 
@@ -32,8 +22,6 @@ import PageContainer from '@/components/PageContainer';
 import SideBar from '@/components/SideBar';
 import ChatHistorySlider from './components/ChatHistorySlider';
 import SliderApps from './components/SliderApps';
-import Tag from '@/components/Tag';
-import ToolMenu from './components/ToolMenu';
 import ChatHeader from './components/ChatHeader';
 
 const Chat = () => {
@@ -44,9 +32,6 @@ const Chat = () => {
   const ChatBoxRef = useRef<ComponentRef>(null);
   const forbidRefresh = useRef(false);
 
-  const [showHistoryQuote, setShowHistoryQuote] = useState<string>();
-  const [showSystemPrompt, setShowSystemPrompt] = useState('');
-
   const {
     lastChatAppId,
     setLastChatAppId,
@@ -67,7 +52,7 @@ const Chat = () => {
   const startChat = useCallback(
     async ({ messages, controller, generatingMessage, variables }: StartChatFnProps) => {
       const prompts = messages.slice(-2);
-      const { responseText, newHistoryId } = await streamFetch({
+      const { responseText, newHistoryId, rawSearch } = await streamFetch({
         data: {
           messages: prompts,
           variables,
@@ -113,7 +98,7 @@ const Chat = () => {
         history: ChatBoxRef.current?.getChatHistory() || state.history
       }));
 
-      return { responseText };
+      return { responseText, rawSearch };
     },
     [appId, history, historyId, router, setChatData, updateHistory]
   );
@@ -297,6 +282,7 @@ const Chat = () => {
             <Box flex={1}>
               <ChatBox
                 ref={ChatBoxRef}
+                historyId={historyId}
                 appAvatar={chatData.app.avatar}
                 variableModules={chatData.app.variableModules}
                 welcomeText={chatData.app.welcomeText}
@@ -311,27 +297,6 @@ const Chat = () => {
         </Flex>
         <Loading fixed={false} />
       </PageContainer>
-
-      {/* quote modal*/}
-      {/* {showHistoryQuote && historyId && (
-        <QuoteModal
-          historyId={historyId}
-          onClose={() => setShowHistoryQuote(undefined)}
-        />
-      )} */}
-      {/* system prompt show modal */}
-      {
-        <Modal isOpen={!!showSystemPrompt} onClose={() => setShowSystemPrompt('')}>
-          <ModalOverlay />
-          <ModalContent maxW={'min(90vw, 600px)'} maxH={'80vh'} minH={'50vh'} overflow={'overlay'}>
-            <ModalCloseButton />
-            <ModalHeader>提示词</ModalHeader>
-            <ModalBody pt={0} whiteSpace={'pre-wrap'} textAlign={'justify'} fontSize={'xs'}>
-              {showSystemPrompt}
-            </ModalBody>
-          </ModalContent>
-        </Modal>
-      }
     </Flex>
   );
 };

client/src/pages/chat/share.tsx

@@ -184,7 +184,7 @@ const ShareChat = ({ shareId, historyId }: { shareId: string; historyId: string
           {/* header */}
           <ChatHeader
             appAvatar={shareChatData.app.avatar}
-            appName={shareChatData.history.title}
+            appName={shareChatData.app.name}
             history={shareChatData.history.chats}
             onOpenSlider={onOpenSlider}
           />