4.6.3-website dataset (#532)

projects/app/src/components/ChatBox/MessageInput.tsx

@@ -74,8 +74,8 @@ const MessageInput = ({
       try {
         const src = await compressImgFileAndUpload({
           file: file.rawFile,
-          maxW: 1000,
-          maxH: 1000,
+          maxW: 4329,
+          maxH: 4329,
           maxSize: 1024 * 1024 * 5,
           // 30 day expired.
           expiredTime: addDays(new Date(), 30)

projects/app/src/components/ChatBox/QuoteModal.tsx

@@ -71,9 +71,9 @@ const QuoteModal = ({
         iconSrc="/imgs/modal/quote.svg"
         title={
           <Box>
-            知识库引用({rawSearch.length}条)
-            <Box fontSize={'10px'} color={'myGray.500'} fontWeight={'normal'}>
-              注意: 修改知识库内容成功后，此处不会显示变更情况。点击编辑后，会显示知识库最新的内容。
+            {t('core.chat.Quote Amount', { amount: rawSearch.length })}
+            <Box fontSize={'sm'} color={'myGray.500'} fontWeight={'normal'}>
+              {t('core.chat.quote.Quote Tip')}
             </Box>
           </Box>
         }

projects/app/src/components/ChatBox/ResponseTags.tsx

@@ -1,7 +1,7 @@
 import React, { useMemo, useState } from 'react';
 import type { ChatHistoryItemResType } from '@fastgpt/global/core/chat/api.d';
 import type { ChatItemType } from '@fastgpt/global/core/chat/type';
-import { Flex, BoxProps, useDisclosure, Image, useTheme } from '@chakra-ui/react';
+import { Flex, BoxProps, useDisclosure, Image, useTheme, Box } from '@chakra-ui/react';
 import { useTranslation } from 'next-i18next';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import type { SearchDataResponseItemType } from '@fastgpt/global/core/dataset/type';
@@ -11,6 +11,8 @@ import MyTooltip from '../MyTooltip';
 import { FlowNodeTypeEnum } from '@fastgpt/global/core/module/node/constant';
 import { getSourceNameIcon } from '@fastgpt/global/core/dataset/utils';
 import ChatBoxDivider from '@/components/core/chat/Divider';
+import MyIcon from '../Icon';
+import { getFileAndOpen } from '@/web/core/dataset/utils';
 
 const QuoteModal = dynamic(() => import('./QuoteModal'), { ssr: false });
 const ContextModal = dynamic(() => import('./ContextModal'), { ssr: false });
@@ -59,6 +61,7 @@ const ResponseTags = ({ responseData = [] }: { responseData?: ChatHistoryItemRes
         .flat()
         .map((item) => ({
           sourceName: item.sourceName,
+          sourceId: item.sourceId,
           icon: getSourceNameIcon({ sourceId: item.sourceId, sourceName: item.sourceName })
         })),
       historyPreview: chatData?.historyPreview,
@@ -83,18 +86,67 @@ const ResponseTags = ({ responseData = [] }: { responseData?: ChatHistoryItemRes
                 alignItems={'center'}
                 flexWrap={'wrap'}
                 fontSize={'sm'}
-                cursor={'pointer'}
                 border={theme.borders.sm}
                 py={1}
                 px={2}
                 borderRadius={'md'}
                 _hover={{
-                  bg: 'myBlue.100'
+                  '.controller': {
+                    display: 'flex'
+                  }
                 }}
+                overflow={'hidden'}
+                position={'relative'}
                 onClick={() => setQuoteModalData(quoteList)}
               >
                 <Image src={item.icon} alt={''} mr={1} w={'12px'} />
-                {item.sourceName}
+                <Box className="textEllipsis" flex={'1 0 0'}>
+                  {item.sourceName}
+                </Box>
+
+                <Box
+                  className="controller"
+                  display={['flex', 'none']}
+                  pr={2}
+                  position={'absolute'}
+                  right={0}
+                  left={0}
+                  justifyContent={'flex-end'}
+                  alignItems={'center'}
+                  h={'100%'}
+                  lineHeight={0}
+                  bg={`linear-gradient(to left, white,white ${
+                    item.sourceId ? '60px' : '30px'
+                  }, rgba(255,255,255,0) 80%)`}
+                >
+                  <MyTooltip label={t('core.chat.quote.Read Quote')}>
+                    <MyIcon
+                      name="common/viewLight"
+                      w={'14px'}
+                      cursor={'pointer'}
+                      _hover={{
+                        color: 'green.600'
+                      }}
+                    />
+                  </MyTooltip>
+                  {item.sourceId && (
+                    <MyTooltip label={t('core.chat.quote.Read Source')}>
+                      <MyIcon
+                        ml={4}
+                        name="common/routePushLight"
+                        w={'14px'}
+                        cursor={'pointer'}
+                        _hover={{ color: 'myBlue.600' }}
+                        onClick={async (e) => {
+                          e.stopPropagation();
+
+                          if (!item.sourceId) return;
+                          await getFileAndOpen(item.sourceId);
+                        }}
+                      />
+                    </MyTooltip>
+                  )}
+                </Box>
               </Flex>
             ))}
           </Flex>

projects/app/src/components/ChatBox/index.module.scss

@@ -1,14 +1,6 @@
 .stopIcon {
   animation: zoomStopIcon 0.4s infinite alternate;
 }
-@keyframes zoomStopIcon {
-  0% {
-    transform: scale(0.8);
-  }
-  100% {
-    transform: scale(1.2);
-  }
-}
 
 .statusAnimation {
   animation: statusBox 0.8s linear infinite alternate;