import React, { useContext, useMemo } from 'react'; import { useApp, useCompile, useDataSourceManager } from '@tachybase/client'; import { RightOutlined } from '@ant-design/icons'; import { Breadcrumb, Space, Tag } from 'antd'; import { Link, useParams } from 'react-router-dom'; import { DataSourceContext } from '../DatabaseConnectionProvider'; import { lang, NAMESPACE } from '../locale'; import { statusEnum } from '../schema'; export const BreadcumbTitle = () => { const app = useApp(); const { name } = useParams(); const compile = useCompile(); const dm = useDataSourceManager(); const { displayName } = dm.getDataSource(name) || {}; const { dataSource } = useContext(DataSourceContext); const dataSourceValue = useMemo(() => dataSource || dm.getDataSource(name), [dataSource, name]); const items = useMemo(() => { const status = dataSourceValue?.status; const option = statusEnum.find((v) => v.value === status); const res = [ { title: {lang('Data source manager')} }, ]; if (dataSourceValue) { res.push({ title: ( {compile(displayName)} {status && ( {compile(option?.label)} )} ), }); } return res; }, [dataSourceValue]); return } items={items} />; };