diff --git a/web/app/components/app-sidebar/dataset-info.tsx b/web/app/components/app-sidebar/dataset-info.tsx new file mode 100644 index 0000000000..b5c2f0c235 --- /dev/null +++ b/web/app/components/app-sidebar/dataset-info.tsx @@ -0,0 +1,42 @@ +'use client' +import type { FC } from 'react' +import React from 'react' +import { useTranslation } from 'react-i18next' +import AppIcon from '../base/app-icon' + +const DatasetSvg = + + + +type Props = { + isExternal?: boolean + name: string + description: string + expand: boolean +} + +const DatasetInfo: FC = ({ + name, + description, + isExternal, + expand, +}) => { + const { t } = useTranslation() + return ( +
+
+ +
+ {expand && ( +
+
+ {name} +
+
{isExternal ? t('dataset.externalTag') : t('dataset.localDocs')}
+
{description}
+
+ )} +
+ ) +} +export default React.memo(DatasetInfo) diff --git a/web/app/components/app-sidebar/index.tsx b/web/app/components/app-sidebar/index.tsx index 5ee063ad64..1ba8aeecc9 100644 --- a/web/app/components/app-sidebar/index.tsx +++ b/web/app/components/app-sidebar/index.tsx @@ -4,12 +4,14 @@ import NavLink from './navLink' import type { NavIcon } from './navLink' import AppBasic from './basic' import AppInfo from './app-info' +import DatasetInfo from './dataset-info' import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints' import { AlignLeft01, AlignRight01, } from '@/app/components/base/icons/src/vender/line/layout' import { useStore as useAppStore } from '@/app/components/app/store' +import cn from '@/utils/classnames' export type IAppDetailNavProps = { iconType?: 'app' | 'dataset' | 'notion' @@ -63,7 +65,15 @@ const AppDetailNav = ({ title, desc, isExternal, icon, icon_background, navigati {iconType === 'app' && ( )} - {iconType !== 'app' && ( + {iconType === 'dataset' && ( + + )} + {!['app', 'dataset'].includes(iconType) && ( )} - {!expand && ( -
- )} +
+
+