diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataInsightDetail/TierInsight.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataInsightDetail/TierInsight.tsx index 0b541c58879..a8a49264228 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/DataInsightDetail/TierInsight.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/DataInsightDetail/TierInsight.tsx @@ -37,6 +37,7 @@ import { BAR_CHART_MARGIN, DI_STRUCTURE, TIER_BAR_COLOR_MAP, + TIER_DATA, } from '../../constants/DataInsight.constants'; import { DataReportIndex } from '../../generated/dataInsight/dataInsightChart'; import { @@ -140,11 +141,11 @@ const TierInsight: FC = ({ chartFilter, selectedDays }) => { axisTickFormatter(value, '%')} /> - } /> + } /> - renderLegend(props as LegendProps, activeKeys) + renderLegend(props as LegendProps, activeKeys, true) } layout="horizontal" verticalAlign="top" @@ -202,7 +203,7 @@ const TierInsight: FC = ({ chartFilter, selectedDays }) => { progress={latestData[tiers]} showLabel={false} startValue={Number(latestData[tiers]).toFixed(2)} - successValue={tiers} + successValue={TIER_DATA[tiers as keyof typeof TIER_DATA]} /> ); diff --git a/openmetadata-ui/src/main/resources/ui/src/constants/DataInsight.constants.ts b/openmetadata-ui/src/main/resources/ui/src/constants/DataInsight.constants.ts index df0522c0b31..9f0b9730797 100644 --- a/openmetadata-ui/src/main/resources/ui/src/constants/DataInsight.constants.ts +++ b/openmetadata-ui/src/main/resources/ui/src/constants/DataInsight.constants.ts @@ -103,6 +103,15 @@ export const TIER_FILTER = { [i18n.t('label.tier-number', { tier: 5 })]: 'Tier.Tier5', }; +export const TIER_DATA = { + 'Tier.Tier1': i18n.t('label.tier-number', { tier: 1 }), + 'Tier.Tier2': i18n.t('label.tier-number', { tier: 2 }), + 'Tier.Tier3': i18n.t('label.tier-number', { tier: 3 }), + 'Tier.Tier4': i18n.t('label.tier-number', { tier: 4 }), + 'Tier.Tier5': i18n.t('label.tier-number', { tier: 5 }), + NoTier: i18n.t('label.no-tier'), +}; + export const INITIAL_CHART_FILTER: ChartFilter = { startTs: getPastDaysDateTimeMillis(DEFAULT_DAYS), endTs: getCurrentDateTimeMillis(), diff --git a/openmetadata-ui/src/main/resources/ui/src/interface/data-insight.interface.ts b/openmetadata-ui/src/main/resources/ui/src/interface/data-insight.interface.ts index edd9f66956b..a7b159a1ae5 100644 --- a/openmetadata-ui/src/main/resources/ui/src/interface/data-insight.interface.ts +++ b/openmetadata-ui/src/main/resources/ui/src/interface/data-insight.interface.ts @@ -34,6 +34,7 @@ export interface ChartFilter { // eslint-disable-next-line @typescript-eslint/no-explicit-any export interface DataInsightChartTooltipProps extends TooltipProps { isPercentage?: boolean; + isTier?: boolean; kpiTooltipRecord?: Record; } diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json index e6aef2f6918..f56d0ed600b 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json @@ -597,7 +597,8 @@ "admin-plural": "Admins", "owner-plural": "Owners", "follower-plural": "Followers", - "email-plural": "Emails" + "email-plural": "Emails", + "no-tier": "No Tier" }, "message": { "service-email-required": "Service account Email is required", diff --git a/openmetadata-ui/src/main/resources/ui/src/utils/DataInsightUtils.tsx b/openmetadata-ui/src/main/resources/ui/src/utils/DataInsightUtils.tsx index feeb0d1cead..0bcfb8e5246 100644 --- a/openmetadata-ui/src/main/resources/ui/src/utils/DataInsightUtils.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/utils/DataInsightUtils.tsx @@ -38,6 +38,7 @@ import { import { ENTITIES_SUMMARY_LIST, KPI_DATE_PICKER_FORMAT, + TIER_DATA, WEB_SUMMARY_LIST, } from '../constants/DataInsight.constants'; import { KpiTargetType } from '../generated/api/dataInsight/kpi/createKpiRequest'; @@ -67,7 +68,8 @@ const checkIsPercentageGraph = (dataInsightChartType: DataInsightChartType) => export const renderLegend = ( legendData: LegendProps, - activeKeys = [] as string[] + activeKeys = [] as string[], + isTier = false ) => { const { payload = [] } = legendData; @@ -101,7 +103,9 @@ export const renderLegend = ( /> - {entry.value} + {isTier + ? TIER_DATA[entry.value as keyof typeof TIER_DATA] + : entry.value} ); @@ -146,7 +150,13 @@ const getEntryFormattedValue = ( }; export const CustomTooltip = (props: DataInsightChartTooltipProps) => { - const { active, payload = [], isPercentage, kpiTooltipRecord } = props; + const { + active, + payload = [], + isPercentage, + kpiTooltipRecord, + isTier, + } = props; if (active && payload && payload.length) { const timestamp = getDateByTimeStamp( @@ -166,7 +176,9 @@ export const CustomTooltip = (props: DataInsightChartTooltipProps) => { - {entry.dataKey} + {isTier + ? TIER_DATA[entry.dataKey as keyof typeof TIER_DATA] + : entry.dataKey} {getEntryFormattedValue(