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} />;
};