yujunjun/OpenMetadata
1
0
Fork 0
mirror of https://github.com/open-metadata/OpenMetadata.git synced 2025-11-30 09:36:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): tab name didn't render on persona page (#24018)

Browse Source 
* fix(ui): tab name didn't render on persona page

* update getTabLabelFromId to have a override

* fix table failure

* fix error and code smells
This commit is contained in:
Chirag Madlani 2025-10-28 16:55:53 +05:30 committed by GitHub
parent 5e0e7d4465
commit 3fb800cabc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 52 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
openmetadata-ui/src/main/resources/ui/playwright/constant/customizeDetail.ts
View File

@ -85,7 +85,6 @@ export const TABLE_DEFAULT_TABS = [
EntityTabs.CUSTOM_PROPERTIES,
EntityTabs.PROFILER,
EntityTabs.LINEAGE,
EntityTabs.KNOWLEDGE_GRAPH,
EntityTabs.TABLE_QUERIES,
EntityTabs.SAMPLE_DATA,
EntityTabs.SCHEMA,

20
openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/CustomizeDetailPage.spec.ts
View File

@ -401,6 +401,13 @@ test.describe('Persona customization', () => {
await adminPage.getByRole('button', { name: 'Add tab' }).click();
await expect(adminPage.getByRole('dialog')).toBeVisible();
await adminPage
.getByRole('dialog')
.getByRole('textbox')
.fill('Custom Tab');
await adminPage
.getByRole('dialog')
.getByRole('button', { name: 'Add' })
@ -431,10 +438,10 @@ test.describe('Persona customization', () => {
});
await expect(
userPage.getByRole('tab', { name: 'New Tab' })
userPage.getByRole('tab', { name: 'Custom Tab' })
).toBeVisible();
await userPage.getByRole('tab', { name: 'New Tab' }).click();
await userPage.getByRole('tab', { name: 'Custom Tab' }).click();
const visibleDescription = userPage
.getByTestId(/KnowledgePanel.Description-/)
@ -508,6 +515,11 @@ test.describe('Persona customization', () => {
await expect(adminPage.getByRole('dialog')).toBeVisible();
await adminPage
.getByRole('dialog')
.getByRole('textbox')
.fill('Custom Tab');
await adminPage
.getByRole('dialog')
.getByRole('button', { name: 'Add' })
@ -536,9 +548,9 @@ test.describe('Persona customization', () => {
state: 'detached',
});
expect(userPage.getByRole('tab', { name: 'New Tab' })).toBeVisible();
expect(userPage.getByRole('tab', { name: 'Custom Tab' })).toBeVisible();
await userPage.getByRole('tab', { name: 'New Tab' }).click();
await userPage.getByRole('tab', { name: 'Custom Tab' }).click();
const visibleDescription = userPage
.getByTestId(/KnowledgePanel.Description-/)

9
openmetadata-ui/src/main/resources/ui/src/utils/CustomizeDetailPage/CustomizeDetailPageClassBase.ts
View File

@ -43,11 +43,14 @@ import TablesSchemaImg from '../../assets/img/widgets/tables-schema.png';
import TagsImg from '../../assets/img/widgets/tags.png';
import TermsImg from '../../assets/img/widgets/Terms.png';
import TopicSchemaImg from '../../assets/img/widgets/topic-schema.png';
import { TAB_LABEL_MAP } from '../../constants/Customize.constants';
import {
DetailPageWidgetKeys,
GlossaryTermDetailPageWidgetKeys,
WidgetWidths,
} from '../../enums/CustomizeDetailPage.enum';
import { EntityTabs } from '../../enums/entity.enum';
import i18n from '../i18next/LocalUtil';
class CustomizeDetailPageClassBase {
public getGlossaryWidgetImageFromKey(
@ -147,6 +150,12 @@ class CustomizeDetailPageClassBase {
return '';
}
}
public getTabLabelFromId(tab: EntityTabs): string {
const labelKey = TAB_LABEL_MAP[tab];
return labelKey ? i18n.t(labelKey) : tab;
}
}
const customizeDetailPageClassBase = new CustomizeDetailPageClassBase();

14
openmetadata-ui/src/main/resources/ui/src/utils/CustomizePage/CustomizePageUtils.test.ts
View File

@ -60,6 +60,18 @@ describe('CustomizePageUtils', () => {
expect(typeof result).toBe('string');
});
it("should return name if it's not predefined", () => {
const tab: Tab = {
id: EntityTabs.OVERVIEW,
name: 'custom-tab-name' as EntityTabs,
layout: [],
};
const result = getTabDisplayName(tab);
expect(result).toBe('custom-tab-name');
});
});
describe('sortTabs', () => {
@ -104,7 +116,7 @@ describe('CustomizePageUtils', () => {
it('should return empty string for invalid tab id', () => {
const result = getTabLabelFromId('invalid-tab' as EntityTabs);
expect(result).toBe('');
expect(result).toBe('invalid-tab');
});
});

24
openmetadata-ui/src/main/resources/ui/src/utils/CustomizePage/CustomizePageUtils.ts
View File

@ -24,6 +24,7 @@ import apiEndpointClassBase from '../APIEndpoints/APIEndpointClassBase';
import chartDetailsClassBase from '../ChartDetailsClassBase';
import containerDetailsClassBase from '../ContainerDetailsClassBase';
import { getNewWidgetPlacement } from '../CustomizableLandingPageUtils';
import customizeDetailPageClassBase from '../CustomizeDetailPage/CustomizeDetailPageClassBase';
import customizeGlossaryPageClassBase from '../CustomizeGlossaryPage/CustomizeGlossaryPage';
import customizeGlossaryTermPageClassBase from '../CustomizeGlossaryTerm/CustomizeGlossaryTermBaseClass';
import dashboardDataModelClassBase from '../DashboardDataModelClassBase';
@ -121,7 +122,7 @@ export const getGlossaryDefaultTabs = () => {
export const getTabLabelFromId = (tab: EntityTabs): string => {
const labelKey = TAB_LABEL_MAP[tab];
return labelKey ? i18n.t(labelKey) : '';
return labelKey ? i18n.t(labelKey) : tab;
};
export const getDefaultTabs = (pageType?: string): Tab[] => {
@ -478,7 +479,7 @@ const calculateNewPosition = (
);
// Get the last widget
const lastWidget = sortedLayout[sortedLayout.length - 1];
const lastWidget = sortedLayout.at(sortedLayout.length - 1);
if (!lastWidget) {
// If no widgets exist, start at 0,0
@ -661,6 +662,8 @@ export const checkIfExpandViewSupported = (
);
case PageType.GlossaryTerm:
case PageType.Metric:
case PageType.File:
case PageType.Worksheet:
return (
(!activeTab && firstTab.key === EntityTabs.OVERVIEW) ||
activeTab === EntityTabs.OVERVIEW
@ -676,6 +679,7 @@ export const checkIfExpandViewSupported = (
activeTab === EntityTabs.MODEL
);
case PageType.Container:
case PageType.Directory:
return (
(!activeTab && firstTab.key === EntityTabs.CHILDREN) ||
activeTab === EntityTabs.CHILDREN
@ -717,17 +721,6 @@ export const checkIfExpandViewSupported = (
(!activeTab && firstTab.key === EntityTabs.FEATURES) ||
activeTab === EntityTabs.FEATURES
);
case PageType.Directory:
return (
(!activeTab && firstTab.key === EntityTabs.CHILDREN) ||
activeTab === EntityTabs.CHILDREN
);
case PageType.File:
case PageType.Worksheet:
return (
(!activeTab && firstTab.key === EntityTabs.OVERVIEW) ||
activeTab === EntityTabs.OVERVIEW
);
case PageType.Spreadsheet:
return (
(!activeTab && firstTab.key === EntityTabs.WORKSHEETS) ||
@ -761,5 +754,8 @@ export const updateWidgetHeightRecursively = (
}, [] as WidgetConfig[]);
export const getTabDisplayName = (item: Tab) => {
return item.displayName ?? getTabLabelFromId(item.name as EntityTabs);
return (
item.displayName ??
customizeDetailPageClassBase.getTabLabelFromId(item.name as EntityTabs)
);
};

5
openmetadata-ui/src/main/resources/ui/src/utils/TableClassBase.ts
View File

@ -25,6 +25,7 @@ import { DetailPageWidgetKeys } from '../enums/CustomizeDetailPage.enum';
import { EntityTabs } from '../enums/entity.enum';
import { Table } from '../generated/entity/data/table';
import { Tab } from '../generated/system/ui/uiCustomization';
import { useApplicationStore } from '../hooks/useApplicationStore';
import { FeedCounts } from '../interface/feed.interface';
import { WidgetConfig } from '../pages/CustomizablePage/CustomizablePage.interface';
import i18n from './i18next/LocalUtil';
@ -96,7 +97,9 @@ class TableClassBase {
EntityTabs.TABLE_QUERIES,
EntityTabs.PROFILER,
EntityTabs.LINEAGE,
EntityTabs.KNOWLEDGE_GRAPH,
...(useApplicationStore.getState().rdfEnabled
? [EntityTabs.KNOWLEDGE_GRAPH]
: []),
EntityTabs.DBT,
EntityTabs.VIEW_DEFINITION,
EntityTabs.CONTRACT,