Files
FastGPT/projects/app/src/components/common/folder/Path.tsx
Theresa 2d3117c5da feat: update ESLint config with @typescript-eslint/consistent-type-imports (#4746)
* update: Add type

* fix: update import statement for NextApiRequest type

* fix: update imports to use type for LexicalEditor and EditorState

* Refactor imports to use 'import type' for type-only imports across multiple files

- Updated imports in various components and API files to use 'import type' for better clarity and to optimize TypeScript's type checking.
- Ensured consistent usage of type imports in files related to chat, dataset, workflow, and user management.
- Improved code readability and maintainability by distinguishing between value and type imports.

* refactor: remove old ESLint configuration and add new rules

- Deleted the old ESLint configuration file from the app project.
- Added a new ESLint configuration file with updated rules and settings.
- Changed imports to use type-only imports in various files for better clarity and performance.
- Updated TypeScript configuration to remove unnecessary options.
- Added an ESLint ignore file to exclude build and dependency directories from linting.

* fix: update imports to use 'import type' for type-only imports in schema files
2025-05-06 17:33:09 +08:00

87 lines
2.3 KiB
TypeScript

import { Box, type BoxProps, Flex } from '@chakra-ui/react';
import { type ParentTreePathItemType } from '@fastgpt/global/common/parentFolder/type';
import React, { useMemo } from 'react';
import { useTranslation } from 'next-i18next';
import MyIcon from '@fastgpt/web/components/common/Icon';
const FolderPath = (props: {
paths: ParentTreePathItemType[];
rootName?: string;
FirstPathDom?: React.ReactNode;
onClick: (parentId: string) => void;
fontSize?: string;
hoverStyle?: BoxProps;
forbidLastClick?: boolean;
}) => {
const { t } = useTranslation();
const {
paths,
rootName = t('common:root_folder'),
FirstPathDom,
onClick,
fontSize,
hoverStyle,
forbidLastClick = false
} = props;
const concatPaths = useMemo(
() => [
{
parentId: '',
parentName: rootName
},
...paths
],
[rootName, paths]
);
return paths.length === 0 && !!FirstPathDom ? (
<>{FirstPathDom}</>
) : (
<Flex flex={1}>
{concatPaths.map((item, i) => {
const clickStyles = {
cursor: 'pointer',
_hover: {
bg: 'myGray.100',
...hoverStyle
},
onClick: () => {
onClick(item.parentId);
}
};
return (
<Flex key={item.parentId || i} alignItems={'center'}>
<Box
fontSize={['xs', fontSize || 'sm']}
py={0.5}
px={1.5}
borderRadius={'md'}
maxW={'45vw'}
className={'textEllipsis'}
{...(i === concatPaths.length - 1 && concatPaths.length > 1
? {
color: 'myGray.700',
fontWeight: 'bold'
}
: {
fontWeight: 'medium',
color: 'myGray.500',
...clickStyles
})}
{...(i === concatPaths.length - 1 && !forbidLastClick && clickStyles)}
>
{item.parentName}
</Box>
{i !== concatPaths.length - 1 && (
<MyIcon name={'common/line'} color={'myGray.500'} mx={1} width={'5px'} />
)}
</Flex>
);
})}
</Flex>
);
};
export default React.memo(FolderPath);