v4.6.1 (#497)

projects/app/src/components/core/dataset/SelectModal.tsx

@@ -6,6 +6,7 @@ import { useTranslation } from 'next-i18next';
 import { useSystemStore } from '@/web/common/system/useSystemStore';
 import { Box, Flex, ModalHeader } from '@chakra-ui/react';
 import MyIcon from '@/components/Icon';
+import ParentPaths from '@/components/common/ParentPaths';
 
 type PathItemType = {
   parentId: string;
@@ -14,7 +15,6 @@ type PathItemType = {
 
 const DatasetSelectContainer = ({
   isOpen,
-  parentId,
   setParentId,
   paths,
   onClose,
@@ -22,7 +22,6 @@ const DatasetSelectContainer = ({
   children
 }: {
   isOpen: boolean;
-  parentId?: string;
   setParentId: Dispatch<string>;
   paths: PathItemType[];
   onClose: () => void;
@@ -35,45 +34,17 @@ const DatasetSelectContainer = ({
   return (
     <MyModal isOpen={isOpen} onClose={onClose} w={'100%'} maxW={['90vw', '900px']} isCentered>
       <Flex flexDirection={'column'} h={'90vh'}>
-        <ModalHeader>
-          {!!parentId ? (
-            <Flex
-              flex={1}
-              userSelect={'none'}
-              fontSize={['sm', 'lg']}
-              fontWeight={'normal'}
-              color={'myGray.900'}
-            >
-              {paths.map((item, i) => (
-                <Flex key={item.parentId} mr={2} alignItems={'center'}>
-                  <Box
-                    fontSize={'lg'}
-                    borderRadius={'md'}
-                    {...(i === paths.length - 1
-                      ? {
-                          cursor: 'default'
-                        }
-                      : {
-                          cursor: 'pointer',
-                          _hover: {
-                            color: 'myBlue.600'
-                          },
-                          onClick: () => {
-                            setParentId(item.parentId);
-                          }
-                        })}
-                  >
-                    {item.parentName}
-                  </Box>
-                  {i !== paths.length - 1 && (
-                    <MyIcon name={'rightArrowLight'} color={'myGray.500'} w={['18px', '24px']} />
-                  )}
-                </Flex>
-              ))}
-            </Flex>
-          ) : (
-            <Box>{t('chat.Select Mark Kb')}</Box>
-          )}
+        <ModalHeader fontWeight={'normal'}>
+          <ParentPaths
+            paths={paths.map((path, i) => ({
+              parentId: path.parentId,
+              parentName: path.parentName
+            }))}
+            FirstPathDom={t('chat.Select Mark Kb')}
+            onClick={(e) => {
+              setParentId(e);
+            }}
+          />
           {!!tips && (
             <Box fontSize={'sm'} color={'myGray.500'} fontWeight={'normal'}>
               {tips}
@@ -94,16 +65,7 @@ export function useDatasetSelect() {
     Promise.all([getDatasets({ parentId }), getDatasetPaths(parentId)])
   );
 
-  const paths = useMemo(
-    () => [
-      {
-        parentId: '',
-        parentName: t('dataset.My Dataset')
-      },
-      ...(data?.[1] || [])
-    ],
-    [data, t]
-  );
+  const paths = useMemo(() => [...(data?.[1] || [])], [data]);
 
   return {
     parentId,