From efa08029954b94e974e16f6ff7475e01115c7ace Mon Sep 17 00:00:00 2001 From: Shailesh Parmar Date: Wed, 4 Oct 2023 01:26:14 +0530 Subject: [PATCH] ui: UI to use Tier TAG displayName if provided #12899 (#13105) * ui: UI to use Tier TAG displayName if provided #12899 * updated tier label with displayName --- .../DashboardDetails.component.tsx | 15 ++-- .../DataAssetsHeader.component.tsx | 3 +- .../DataAssetsHeader.interface.ts | 3 +- .../DataInsightDetail/TierInsight.tsx | 33 ++++++--- .../DataModels/DataModelDetails.interface.tsx | 3 +- .../Explore/ExploreQuickFilters.tsx | 70 ++++++++++++------- .../ExploreSearchCard/ExploreSearchCard.tsx | 3 +- .../MlModelDetail/MlModelDetail.component.tsx | 15 ++-- .../PipelineDetails.component.tsx | 15 ++-- .../Tag/TagsV1/TagsV1.component.tsx | 18 +++-- .../TopicDetails/TopicDetails.component.tsx | 15 ++-- .../EntitySummaryDetails.tsx | 3 +- .../common/TierCard/TierCard.interface.ts | 3 +- .../components/common/TierCard/TierCard.tsx | 23 ++++-- .../table-data-card-v2/TableDataCardV2.tsx | 3 +- .../searched-data/SearchedData.interface.ts | 4 +- .../searched-data/SearchedData.test.tsx | 5 +- .../ui/src/constants/DataInsight.constants.ts | 34 --------- .../ui/src/constants/explore.constants.ts | 1 + .../src/pages/ContainerPage/ContainerPage.tsx | 25 ++----- .../DataInsightPage.component.tsx | 55 ++++++++++++--- .../DataModelPage/DataModelPage.component.tsx | 22 ++---- .../DatabaseDetailsPage.tsx | 15 ++-- .../DatabaseSchemaPage.component.tsx | 15 ++-- .../SearchIndexDetailsPage.tsx | 18 ++--- .../ServiceDetailsPage/ServiceDetailsPage.tsx | 17 ++--- .../StoredProcedure/StoredProcedurePage.tsx | 15 ++-- .../TableDetailsPageV1/TableDetailsPageV1.tsx | 15 ++-- .../ui/src/utils/DataInsightUtils.tsx | 20 ++---- .../main/resources/ui/src/utils/TagsUtils.tsx | 19 +++++ 30 files changed, 236 insertions(+), 269 deletions(-) diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DashboardDetails/DashboardDetails.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DashboardDetails/DashboardDetails.component.tsx index aeb1a0dcbab..79e52b16814 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/DashboardDetails/DashboardDetails.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/DashboardDetails/DashboardDetails.component.tsx @@ -43,6 +43,7 @@ import { PRIMERY_COLOR, } from '../../constants/constants'; import { EntityTabs, EntityType } from '../../enums/entity.enum'; +import { Tag } from '../../generated/entity/classification/tag'; import { Dashboard } from '../../generated/entity/data/dashboard'; import { DataProduct } from '../../generated/entity/domains/dataProduct'; import { ThreadType } from '../../generated/entity/feed/thread'; @@ -62,6 +63,7 @@ import { searchTagInData, } from '../../utils/TableTags/TableTags.utils'; import { getTagsWithoutTier, getTierTags } from '../../utils/TableUtils'; +import { updateTierTag } from '../../utils/TagsUtils'; import { showErrorToast, showSuccessToast } from '../../utils/ToastUtils'; import ActivityThreadPanel from '../ActivityFeed/ActivityThreadPanel/ActivityThreadPanel'; import { CustomPropertyTable } from '../common/CustomPropertyTable/CustomPropertyTable'; @@ -259,17 +261,8 @@ const DashboardDetails = ({ [owner] ); - const onTierUpdate = async (newTier?: string) => { - const tierTag: Dashboard['tags'] = newTier - ? [ - ...getTagsWithoutTier(dashboardDetails.tags as Array), - { - tagFQN: newTier, - labelType: LabelType.Manual, - state: State.Confirmed, - }, - ] - : getTagsWithoutTier(dashboardDetails.tags ?? []); + const onTierUpdate = async (newTier?: Tag) => { + const tierTag = updateTierTag(dashboardDetails?.tags ?? [], newTier); const updatedDashboard = { ...dashboardDetails, tags: tierTag, diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataAssets/DataAssetsHeader/DataAssetsHeader.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataAssets/DataAssetsHeader/DataAssetsHeader.component.tsx index a14758fd975..09784860cb4 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/DataAssets/DataAssetsHeader/DataAssetsHeader.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/DataAssets/DataAssetsHeader/DataAssetsHeader.component.tsx @@ -37,7 +37,6 @@ import EntityHeaderTitle from '../../../components/Entity/EntityHeaderTitle/Enti import { useTourProvider } from '../../../components/TourProvider/TourProvider'; import Voting from '../../../components/Voting/Voting.component'; import { VotingDataProps } from '../../../components/Voting/voting.interface'; -import { FQN_SEPARATOR_CHAR } from '../../../constants/char.constants'; import { DE_ACTIVE_COLOR } from '../../../constants/constants'; import { SERVICE_TYPES } from '../../../constants/Services.constant'; import { EntityTabs, EntityType } from '../../../enums/entity.enum'; @@ -374,7 +373,7 @@ export const DataAssetsHeader = ({ {tier ? ( - {tier.tagFQN.split(FQN_SEPARATOR_CHAR)[1]} + {getEntityName(tier)} ) : ( diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataAssets/DataAssetsHeader/DataAssetsHeader.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/DataAssets/DataAssetsHeader/DataAssetsHeader.interface.ts index 928d470b3d4..b7c9635c467 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/DataAssets/DataAssetsHeader/DataAssetsHeader.interface.ts +++ b/openmetadata-ui/src/main/resources/ui/src/components/DataAssets/DataAssetsHeader/DataAssetsHeader.interface.ts @@ -16,6 +16,7 @@ import { EntityName } from '../../../components/Modals/EntityNameModal/EntityNam import { OperationPermission } from '../../../components/PermissionProvider/PermissionProvider.interface'; import { QueryVote } from '../../../components/TableQueries/TableQueries.interface'; import { EntityType } from '../../../enums/entity.enum'; +import { Tag } from '../../../generated/entity/classification/tag'; import { Container } from '../../../generated/entity/data/container'; import { Dashboard } from '../../../generated/entity/data/dashboard'; import { DashboardDataModel } from '../../../generated/entity/data/dashboardDataModel'; @@ -91,7 +92,7 @@ export type DataAssetsHeaderProps = { isRecursiveDelete?: boolean; afterDomainUpdateAction?: (asset: DataAssetWithDomains) => void; afterDeleteAction?: (isSoftDelete?: boolean) => void; - onTierUpdate: (tier?: string) => Promise; + onTierUpdate: (tier?: Tag) => Promise; onOwnerUpdate: (owner?: EntityReference) => Promise; onVersionClick?: () => void; onFollowClick?: () => Promise; 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 8ed9a256453..f8c91f4ed3b 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 @@ -13,7 +13,7 @@ import { Card, Col, Row } from 'antd'; import { AxiosError } from 'axios'; -import { isEmpty, round, uniqueId } from 'lodash'; +import { isEmpty, round } from 'lodash'; import React, { FC, useEffect, useMemo, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { @@ -36,7 +36,6 @@ import { import { BAR_CHART_MARGIN, DI_STRUCTURE, - TIER_DATA, TOTAL_ENTITY_CHART_COLOR, } from '../../constants/DataInsight.constants'; import { DataReportIndex } from '../../generated/dataInsight/dataInsightChart'; @@ -44,6 +43,7 @@ import { DataInsightChartResult, DataInsightChartType, } from '../../generated/dataInsight/dataInsightChartResult'; +import { Tag } from '../../generated/entity/classification/tag'; import { ChartFilter } from '../../interface/data-insight.interface'; import { getAggregateChartData } from '../../rest/DataInsightAPI'; import { @@ -55,6 +55,7 @@ import { getGraphDataByTierType, renderLegend, } from '../../utils/DataInsightUtils'; +import { getEntityName } from '../../utils/EntityUtils'; import { showErrorToast } from '../../utils/ToastUtils'; import './DataInsightDetail.less'; import DataInsightProgressBar from './DataInsightProgressBar'; @@ -64,13 +65,14 @@ import EntitySummaryProgressBar from './EntitySummaryProgressBar.component'; interface Props { chartFilter: ChartFilter; selectedDays: number; + tierTags: { tags: Tag[]; isLoading: boolean }; } -const TierInsight: FC = ({ chartFilter, selectedDays }) => { +const TierInsight: FC = ({ chartFilter, selectedDays, tierTags }) => { const [totalEntitiesByTier, setTotalEntitiesByTier] = useState(); - const [isLoading, setIsLoading] = useState(false); + const [isLoading, setIsLoading] = useState(true); const [activeKeys, setActiveKeys] = useState([]); const [activeMouseHoverKey, setActiveMouseHoverKey] = useState(''); @@ -89,8 +91,17 @@ const TierInsight: FC = ({ chartFilter, selectedDays }) => { dataReportIndex: DataReportIndex.EntityReportDataIndex, }; const response = await getAggregateChartData(params); + const updatedRes = response.data?.map((data) => { + const currentTier = tierTags.tags.find( + (value) => value.fullyQualifiedName === data.entityTier + ); - setTotalEntitiesByTier(response); + return { + ...data, + entityTier: getEntityName(currentTier) || data.entityTier, + }; + }); + setTotalEntitiesByTier({ ...response, data: updatedRes }); } catch (error) { showErrorToast(error as AxiosError); } finally { @@ -111,8 +122,10 @@ const TierInsight: FC = ({ chartFilter, selectedDays }) => { }; useEffect(() => { - fetchTotalEntitiesByTier(); - }, [chartFilter]); + if (!tierTags.isLoading) { + fetchTotalEntitiesByTier(); + } + }, [chartFilter, tierTags]); return ( = ({ chartFilter, selectedDays }) => { - renderLegend(props as LegendProps, activeKeys, true) + renderLegend(props as LegendProps, activeKeys) } layout="horizontal" verticalAlign="top" @@ -197,9 +210,9 @@ const TierInsight: FC = ({ chartFilter, selectedDays }) => { {tiers.map((tiers, i) => { return ( - + Promise; handleUpdateTags: (selectedTags?: EntityTags[]) => void; handleUpdateOwner: (owner?: EntityReference) => Promise; - handleUpdateTier: (tier?: string) => Promise; + handleUpdateTier: (tier?: Tag) => Promise; handleUpdateDescription: (value: string) => Promise; handleColumnUpdateDataModel: (updatedDataModel: Column[]) => Promise; onUpdateVote: (data: QueryVote, id: string) => Promise; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Explore/ExploreQuickFilters.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Explore/ExploreQuickFilters.tsx index 93fb8477a00..fd6c8fe3414 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Explore/ExploreQuickFilters.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Explore/ExploreQuickFilters.tsx @@ -13,20 +13,22 @@ import { Space } from 'antd'; import { AxiosError } from 'axios'; -import { isEqual, isString, uniqWith } from 'lodash'; +import { isEqual, isString, isUndefined, uniqWith } from 'lodash'; import { Bucket } from 'Models'; import Qs from 'qs'; -import React, { FC, useCallback, useMemo, useState } from 'react'; +import React, { FC, useCallback, useEffect, useMemo, useState } from 'react'; import { useLocation } from 'react-router-dom'; import { MISC_FIELDS, OWNER_QUICK_FILTER_DEFAULT_OPTIONS_KEY, } from '../../constants/AdvancedSearch.constants'; +import { TIER_FQN_KEY } from '../../constants/explore.constants'; import { SearchIndex } from '../../enums/search.enum'; import { QueryFilterInterface } from '../../pages/explore/ExplorePage.interface'; import { getAggregateFieldOptions } from '../../rest/miscAPI'; import { getTags } from '../../rest/tagAPI'; import { getOptionsFromAggregationBucket } from '../../utils/AdvancedSearchUtils'; +import { getEntityName } from '../../utils/EntityUtils'; import { getCombinedQueryFilterObject } from '../../utils/ExplorePage/ExplorePageUtils'; import { showErrorToast } from '../../utils/ToastUtils'; import SearchDropdown from '../SearchDropdown/SearchDropdown'; @@ -81,7 +83,7 @@ const ExploreQuickFilters: FC = ({ ) => { let buckets: Bucket[] = []; - if (aggregations?.[key] && key !== 'tier.tagFQN') { + if (aggregations?.[key] && key !== TIER_FQN_KEY) { buckets = aggregations[key].buckets; } else { const [res, tierTags] = await Promise.all([ @@ -91,14 +93,14 @@ const ExploreQuickFilters: FC = ({ '', JSON.stringify(combinedQueryFilter) ), - key === 'tier.tagFQN' + key === TIER_FQN_KEY ? getTags({ parent: 'Tier' }) : Promise.resolve(null), ]); buckets = res.data.aggregations[`sterms#${key}`].buckets; - if (key === 'tier.tagFQN' && tierTags) { + if (key === TIER_FQN_KEY && tierTags) { const options = tierTags.data.map((option) => { const bucketItem = buckets.find( (item) => item.key === option.fullyQualifiedName @@ -106,7 +108,7 @@ const ExploreQuickFilters: FC = ({ return { key: option.fullyQualifiedName ?? '', - label: option.name, + label: getEntityName(option), count: bucketItem?.doc_count ?? 0, }; }); @@ -148,7 +150,7 @@ const ExploreQuickFilters: FC = ({ return; } - if (aggregations?.[key] && key !== 'tier.tagFQN') { + if (aggregations?.[key] && key !== TIER_FQN_KEY) { const res = await getAggregateFieldOptions( index, key, @@ -158,7 +160,7 @@ const ExploreQuickFilters: FC = ({ const buckets = res.data.aggregations[`sterms#${key}`].buckets; setOptions(uniqWith(getOptionsFromAggregationBucket(buckets), isEqual)); - } else if (key === 'tier.tagFQN') { + } else if (key === TIER_FQN_KEY) { const filteredOptions = tierOptions?.filter((option) => { return option.label.toLowerCase().includes(value.toLowerCase()); }); @@ -171,25 +173,43 @@ const ExploreQuickFilters: FC = ({ } }; + useEffect(() => { + const tierField = fields.find((value) => value.key === TIER_FQN_KEY); + if (tierField?.value?.length && isUndefined(tierOptions)) { + fetchDefaultOptions(index, TIER_FQN_KEY); + } + }, [fields]); + return ( - {fields.map((field) => ( - { - onFieldValueSelect({ ...field, value: updatedValues }); - }} - onGetInitialOptions={getInitialOptions} - onSearch={getFilterOptions} - /> - ))} + {fields.map((field) => { + const selectedKeys = + field.key === TIER_FQN_KEY && options?.length + ? field.value?.map((value) => { + return ( + options?.find((option) => option.key === value.key) ?? value + ); + }) + : field.value; + + return ( + { + onFieldValueSelect({ ...field, value: updatedValues }); + }} + onGetInitialOptions={getInitialOptions} + onSearch={getFilterOptions} + /> + ); + })} ); }; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ExploreV1/ExploreSearchCard/ExploreSearchCard.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ExploreV1/ExploreSearchCard/ExploreSearchCard.tsx index b22ed2b840b..32c24503ba9 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/ExploreV1/ExploreSearchCard/ExploreSearchCard.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/ExploreV1/ExploreSearchCard/ExploreSearchCard.tsx @@ -17,7 +17,6 @@ import { ExtraInfo } from 'Models'; import React, { forwardRef, useMemo } from 'react'; import { useTranslation } from 'react-i18next'; import { Link, useParams } from 'react-router-dom'; -import { FQN_SEPARATOR_CHAR } from '../../../constants/char.constants'; import { EntityType } from '../../../enums/entity.enum'; import { OwnerType } from '../../../enums/user.enum'; import { EntityReference } from '../../../generated/entity/type'; @@ -62,7 +61,7 @@ const ExploreSearchCard: React.FC = forwardRef< const otherDetails = useMemo(() => { const tierValue = isString(source.tier) ? source.tier - : source.tier?.tagFQN?.split(FQN_SEPARATOR_CHAR)?.[1] ?? ''; + : getEntityName(source.tier); const profileName = source.owner?.type === OwnerType.USER ? source.owner?.name : undefined; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/MlModelDetail/MlModelDetail.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/MlModelDetail/MlModelDetail.component.tsx index 6284a124daf..9e4592baeb6 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/MlModelDetail/MlModelDetail.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/MlModelDetail/MlModelDetail.component.tsx @@ -34,6 +34,7 @@ import { DisplayType } from '../../components/Tag/TagsViewer/TagsViewer.interfac import { getMlModelDetailsPath } from '../../constants/constants'; import { EntityTabs, EntityType } from '../../enums/entity.enum'; import { MlHyperParameter } from '../../generated/api/data/createMlModel'; +import { Tag } from '../../generated/entity/classification/tag'; import { Mlmodel, MlStore } from '../../generated/entity/data/mlmodel'; import { ThreadType } from '../../generated/entity/feed/thread'; import { TagLabel, TagSource } from '../../generated/type/schema'; @@ -45,6 +46,7 @@ import { getEntityFieldThreadCounts } from '../../utils/FeedUtils'; import { DEFAULT_ENTITY_PERMISSION } from '../../utils/PermissionsUtils'; import { getDecodedFqn } from '../../utils/StringsUtils'; import { getTagsWithoutTier, getTierTags } from '../../utils/TableUtils'; +import { updateTierTag } from '../../utils/TagsUtils'; import { showErrorToast, showSuccessToast } from '../../utils/ToastUtils'; import ActivityThreadPanel from '../ActivityFeed/ActivityThreadPanel/ActivityThreadPanel'; import { CustomPropertyTable } from '../common/CustomPropertyTable/CustomPropertyTable'; @@ -185,17 +187,8 @@ const MlModelDetail: FC = ({ [mlModelDetail, mlModelDetail.owner] ); - const onTierUpdate = async (newTier?: string) => { - const tierTag: Mlmodel['tags'] = newTier - ? [ - ...mlModelTags, - { - tagFQN: newTier, - labelType: LabelType.Manual, - state: State.Confirmed, - }, - ] - : getTagsWithoutTier(mlModelDetail.tags ?? []); + const onTierUpdate = async (newTier?: Tag) => { + const tierTag = updateTierTag(mlModelDetail?.tags ?? [], newTier); const updatedMlModelDetails = { ...mlModelDetail, tags: tierTag, diff --git a/openmetadata-ui/src/main/resources/ui/src/components/PipelineDetails/PipelineDetails.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/PipelineDetails/PipelineDetails.component.tsx index 7632c50692d..ccdd00fb6b0 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/PipelineDetails/PipelineDetails.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/PipelineDetails/PipelineDetails.component.tsx @@ -47,6 +47,7 @@ import { import { PIPELINE_TASK_TABS } from '../../constants/pipeline.constants'; import { EntityTabs, EntityType } from '../../enums/entity.enum'; import { CreateThread } from '../../generated/api/feed/createThread'; +import { Tag } from '../../generated/entity/classification/tag'; import { Pipeline, PipelineStatus, @@ -68,6 +69,7 @@ import { searchTagInData, } from '../../utils/TableTags/TableTags.utils'; import { getTagsWithoutTier, getTierTags } from '../../utils/TableUtils'; +import { updateTierTag } from '../../utils/TagsUtils'; import { showErrorToast, showSuccessToast } from '../../utils/ToastUtils'; import ActivityThreadPanel from '../ActivityFeed/ActivityThreadPanel/ActivityThreadPanel'; import { ModalWithMarkdownEditor } from '../Modals/ModalWithMarkdownEditor/ModalWithMarkdownEditor'; @@ -225,17 +227,8 @@ const PipelineDetails = ({ [owner] ); - const onTierUpdate = async (newTier?: string) => { - const tierTag: Pipeline['tags'] = newTier - ? [ - ...getTagsWithoutTier(pipelineDetails.tags as Array), - { - tagFQN: newTier, - labelType: LabelType.Manual, - state: State.Confirmed, - }, - ] - : getTagsWithoutTier(pipelineDetails.tags ?? []); + const onTierUpdate = async (newTier?: Tag) => { + const tierTag = updateTierTag(pipelineDetails?.tags ?? [], newTier); const updatedPipelineDetails = { ...pipelineDetails, tags: tierTag, diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Tag/TagsV1/TagsV1.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Tag/TagsV1/TagsV1.component.tsx index d665ca75910..dd3dd3c203a 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Tag/TagsV1/TagsV1.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Tag/TagsV1/TagsV1.component.tsx @@ -24,6 +24,7 @@ import { ReactComponent as IconTag } from '../../../assets/svg/classification.sv import { ReactComponent as PlusIcon } from '../../../assets/svg/plus-primary.svg'; import { TAG_START_WITH } from '../../../constants/Tag.constants'; import { reduceColorOpacity } from '../../../utils/CommonUtils'; +import { getEntityName } from '../../../utils/EntityUtils'; import Fqn from '../../../utils/Fqn'; import { getEncodedFqn } from '../../../utils/StringsUtils'; import { TagsV1Props } from './TagsV1.interface'; @@ -68,12 +69,15 @@ const TagsV1 = ({ const tagName = useMemo( () => - showOnlyName - ? tag.tagFQN - .split(FQN_SEPARATOR_CHAR) - .slice(-2) - .join(FQN_SEPARATOR_CHAR) - : tag.tagFQN, + getEntityName(tag) || + getTagDisplay( + showOnlyName + ? tag.tagFQN + .split(FQN_SEPARATOR_CHAR) + .slice(-2) + .join(FQN_SEPARATOR_CHAR) + : tag.tagFQN + ), [showOnlyName, tag.tagFQN] ); @@ -105,7 +109,7 @@ const TagsV1 = ({ ellipsis className="m-0 tags-label" data-testid={`tag-${tag.tagFQN}`}> - {getTagDisplay(tagName)} + {tagName} diff --git a/openmetadata-ui/src/main/resources/ui/src/components/TopicDetails/TopicDetails.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/TopicDetails/TopicDetails.component.tsx index 961e920f7d4..a9db737e341 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/TopicDetails/TopicDetails.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/TopicDetails/TopicDetails.component.tsx @@ -35,6 +35,7 @@ import { DisplayType } from '../../components/Tag/TagsViewer/TagsViewer.interfac import { getTopicDetailsPath } from '../../constants/constants'; import { ERROR_PLACEHOLDER_TYPE } from '../../enums/common.enum'; import { EntityTabs, EntityType } from '../../enums/entity.enum'; +import { Tag } from '../../generated/entity/classification/tag'; import { Topic } from '../../generated/entity/data/topic'; import { DataProduct } from '../../generated/entity/domains/dataProduct'; import { ThreadType } from '../../generated/entity/feed/thread'; @@ -48,6 +49,7 @@ import { } from '../../utils/EntityUtils'; import { getDecodedFqn } from '../../utils/StringsUtils'; import { getTagsWithoutTier, getTierTags } from '../../utils/TableUtils'; +import { updateTierTag } from '../../utils/TagsUtils'; import { showErrorToast, showSuccessToast } from '../../utils/ToastUtils'; import ActivityThreadPanel from '../ActivityFeed/ActivityThreadPanel/ActivityThreadPanel'; import { CustomPropertyTable } from '../common/CustomPropertyTable/CustomPropertyTable'; @@ -213,17 +215,8 @@ const TopicDetails: React.FC = ({ [owner] ); - const onTierUpdate = (newTier?: string) => { - const tierTag: Topic['tags'] = newTier - ? [ - ...getTagsWithoutTier(topicDetails.tags as Array), - { - tagFQN: newTier, - labelType: LabelType.Manual, - state: State.Confirmed, - }, - ] - : getTagsWithoutTier(topicDetails.tags ?? []); + const onTierUpdate = (newTier?: Tag) => { + const tierTag = updateTierTag(topicDetails?.tags ?? [], newTier); const updatedTopicDetails = { ...topicDetails, tags: tierTag, diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/EntitySummaryDetails/EntitySummaryDetails.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/EntitySummaryDetails/EntitySummaryDetails.tsx index 75a33760d87..a89a220abb4 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/EntitySummaryDetails/EntitySummaryDetails.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/EntitySummaryDetails/EntitySummaryDetails.tsx @@ -22,6 +22,7 @@ import { ReactComponent as EditIcon } from '../../../assets/svg/edit-new.svg'; import { ReactComponent as IconExternalLink } from '../../../assets/svg/external-links.svg'; import { ReactComponent as IconTeamsGrey } from '../../../assets/svg/teams-grey.svg'; import { DE_ACTIVE_COLOR } from '../../../constants/constants'; +import { Tag } from '../../../generated/entity/classification/tag'; import { Dashboard } from '../../../generated/entity/data/dashboard'; import { Table } from '../../../generated/entity/data/table'; import { TagLabel } from '../../../generated/type/tagLabel'; @@ -38,7 +39,7 @@ export interface GetInfoElementsProps { updateOwner?: (value: Table['owner']) => void; tier?: TagLabel; currentTier?: string; - updateTier?: (value?: string) => void; + updateTier?: (value?: Tag) => void; currentOwner?: Dashboard['owner']; deleted?: boolean; allowTeamOwner?: boolean; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/TierCard/TierCard.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/common/TierCard/TierCard.interface.ts index f7c2f20c029..f7dc0efdb26 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/TierCard/TierCard.interface.ts +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/TierCard/TierCard.interface.ts @@ -12,6 +12,7 @@ */ import { TableDetail } from 'Models'; import { ReactNode } from 'react'; +import { Tag } from '../../../generated/entity/classification/tag'; import { EntityReference } from '../../../generated/type/entityReference'; export type CardWithListItems = { @@ -23,7 +24,7 @@ export type CardWithListItems = { export interface TierCardProps { currentTier?: string; - updateTier?: (value?: string) => void; + updateTier?: (value?: Tag) => void; onSave?: ( owner?: EntityReference, tier?: TableDetail['tier'], diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/TierCard/TierCard.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/TierCard/TierCard.tsx index 40b0e4b91c5..45f6b5e39e6 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/TierCard/TierCard.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/TierCard/TierCard.tsx @@ -24,7 +24,9 @@ import { AxiosError } from 'axios'; import { t } from 'i18next'; import React, { useState } from 'react'; import { FQN_SEPARATOR_CHAR } from '../../../constants/char.constants'; +import { Tag } from '../../../generated/entity/classification/tag'; import { getTags } from '../../../rest/tagAPI'; +import { getEntityName } from '../../../utils/EntityUtils'; import { showErrorToast } from '../../../utils/ToastUtils'; import Loader from '../../Loader/Loader'; import RichTextEditorPreviewer from '../rich-text-editor/RichTextEditorPreviewer'; @@ -33,7 +35,10 @@ import { CardWithListItems, TierCardProps } from './TierCard.interface'; const { Panel } = Collapse; const TierCard = ({ currentTier, updateTier, children }: TierCardProps) => { - const [tierData, setTierData] = useState>([]); + const [tiers, setTiers] = useState>([]); + const [tierCardData, setTierCardData] = useState>( + [] + ); const [isLoadingTierData, setIsLoadingTierData] = useState(false); const getTierData = async () => { @@ -47,7 +52,7 @@ const TierCard = ({ currentTier, updateTier, children }: TierCardProps) => { const tierData: CardWithListItems[] = data.map((tier: { name: string; description: string }) => ({ id: `Tier${FQN_SEPARATOR_CHAR}${tier.name}`, - title: tier.name, + title: getEntityName(tier), description: tier.description.substring( 0, tier.description.indexOf('\n\n') @@ -56,9 +61,10 @@ const TierCard = ({ currentTier, updateTier, children }: TierCardProps) => { tier.description.indexOf('\n\n') + 1 ), })) ?? []; - setTierData(tierData); + setTierCardData(tierData); + setTiers(data); } else { - setTierData([]); + setTierCardData([]); } } catch (err) { showErrorToast( @@ -73,7 +79,8 @@ const TierCard = ({ currentTier, updateTier, children }: TierCardProps) => { }; const handleTierSelection = ({ target: { value } }: RadioChangeEvent) => { - updateTier?.(value as string); + const tier = tiers.find((tier) => tier.fullyQualifiedName === value); + updateTier?.(tier); }; const clearTierSelection = () => { @@ -107,7 +114,7 @@ const TierCard = ({ currentTier, updateTier, children }: TierCardProps) => { collapsible="icon" defaultActiveKey={currentTier} expandIconPosition="end"> - {tierData.map((card) => ( + {tierCardData.map((card) => ( { placement="bottomRight" showArrow={false} trigger="click" - onOpenChange={(visible) => visible && !tierData.length && getTierData()}> + onOpenChange={(visible) => + visible && !tierCardData.length && getTierData() + }> {children} ); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/table-data-card-v2/TableDataCardV2.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/table-data-card-v2/TableDataCardV2.tsx index fb0acae29d6..64eecca9ff4 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/table-data-card-v2/TableDataCardV2.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/table-data-card-v2/TableDataCardV2.tsx @@ -18,7 +18,6 @@ import { ExtraInfo } from 'Models'; import React, { forwardRef, useMemo } from 'react'; import { useTranslation } from 'react-i18next'; import { useParams } from 'react-router-dom'; -import { FQN_SEPARATOR_CHAR } from '../../../constants/char.constants'; import { EntityType } from '../../../enums/entity.enum'; import { OwnerType } from '../../../enums/user.enum'; import { EntityReference } from '../../../generated/entity/type'; @@ -106,7 +105,7 @@ const TableDataCardV2: React.FC = forwardRef< value: source.tier ? isString(source.tier) ? source.tier - : source.tier?.tagFQN.split(FQN_SEPARATOR_CHAR)[1] + : getEntityName(source.tier) : '', }); } diff --git a/openmetadata-ui/src/main/resources/ui/src/components/searched-data/SearchedData.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/searched-data/SearchedData.interface.ts index 3381ed81054..d0ff6cc45c6 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/searched-data/SearchedData.interface.ts +++ b/openmetadata-ui/src/main/resources/ui/src/components/searched-data/SearchedData.interface.ts @@ -77,8 +77,8 @@ export type SourceType = ( > ) & { id: string; - tier?: string | Pick; - tags?: string[] | TagLabel[]; + tier?: string | TagLabel; + tags?: TagLabel[]; entityType?: string; service?: EntityReference; owner?: Partial< diff --git a/openmetadata-ui/src/main/resources/ui/src/components/searched-data/SearchedData.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/searched-data/SearchedData.test.tsx index e495c9df630..39edf731c66 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/searched-data/SearchedData.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/searched-data/SearchedData.test.tsx @@ -41,6 +41,7 @@ const mockData: SearchedDataProps['data'] = [ { ...TAG_CONSTANT, tagFQN: 'tags3' }, ], tier: { + ...TAG_CONSTANT, tagFQN: 'tier1', }, }, @@ -62,7 +63,7 @@ const mockData: SearchedDataProps['data'] = [ { ...TAG_CONSTANT, tagFQN: 'tags2' }, { ...TAG_CONSTANT, tagFQN: 'tags3' }, ], - tier: { tagFQN: 'tier2' }, + tier: { ...TAG_CONSTANT, tagFQN: 'tier2' }, }, }, { @@ -78,7 +79,7 @@ const mockData: SearchedDataProps['data'] = [ { ...TAG_CONSTANT, tagFQN: 'tags2' }, { ...TAG_CONSTANT, tagFQN: 'tags3' }, ], - tier: { tagFQN: 'tier3' }, + tier: { ...TAG_CONSTANT, tagFQN: 'tier3' }, }, }, ]; 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 a3033a5009b..4a8d1b5035a 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 @@ -54,40 +54,6 @@ export const DATA_INSIGHT_GRAPH_COLORS = [ export const BAR_SIZE = 15; -export const TIER_FILTER = { - [i18n.t('label.tier-number', { tier: 1 })]: { - key: 'Tier.Tier1', - label: 'Tier1', - }, - [i18n.t('label.tier-number', { tier: 2 })]: { - key: 'Tier.Tier2', - label: 'Tier2', - }, - [i18n.t('label.tier-number', { tier: 3 })]: { - key: 'Tier.Tier3', - label: 'Tier3', - }, - [i18n.t('label.tier-number', { tier: 4 })]: { - key: 'Tier.Tier4', - label: 'Tier4', - }, - [i18n.t('label.tier-number', { tier: 5 })]: { - key: 'Tier.Tier5', - label: '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-entity', { - entity: i18n.t('label.tier'), - }), -}; - export const INITIAL_CHART_FILTER: ChartFilter = { startTs: getEpochMillisForPastDays(DEFAULT_SELECTED_RANGE.days), endTs: getCurrentMillis(), diff --git a/openmetadata-ui/src/main/resources/ui/src/constants/explore.constants.ts b/openmetadata-ui/src/main/resources/ui/src/constants/explore.constants.ts index 93c79380318..fad7fea2a6a 100644 --- a/openmetadata-ui/src/main/resources/ui/src/constants/explore.constants.ts +++ b/openmetadata-ui/src/main/resources/ui/src/constants/explore.constants.ts @@ -19,6 +19,7 @@ import { Icons } from '../utils/SvgUtils'; export const INITIAL_SORT_FIELD = 'updatedAt'; export const INITIAL_SORT_ORDER = 'desc'; +export const TIER_FQN_KEY = 'tier.tagFQN'; export const initialFilterQS = 'initialFilter'; export const searchFilterQS = 'searchFilter'; diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ContainerPage/ContainerPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ContainerPage/ContainerPage.tsx index 95a408d5def..43d3e3aa9a1 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/ContainerPage/ContainerPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/ContainerPage/ContainerPage.tsx @@ -49,11 +49,10 @@ import { } from '../../constants/constants'; import { ERROR_PLACEHOLDER_TYPE } from '../../enums/common.enum'; import { EntityTabs, EntityType } from '../../enums/entity.enum'; -import { - CreateThread, - ThreadType, -} from '../../generated/api/feed/createThread'; +import { CreateThread } from '../../generated/api/feed/createThread'; +import { Tag } from '../../generated/entity/classification/tag'; import { Container } from '../../generated/entity/data/container'; +import { ThreadType } from '../../generated/entity/feed/thread'; import { Include } from '../../generated/type/include'; import { LabelType, @@ -82,6 +81,7 @@ import { getEntityFieldThreadCounts } from '../../utils/FeedUtils'; import { DEFAULT_ENTITY_PERMISSION } from '../../utils/PermissionsUtils'; import { getDecodedFqn } from '../../utils/StringsUtils'; import { getTagsWithoutTier, getTierTags } from '../../utils/TableUtils'; +import { updateTierTag } from '../../utils/TagsUtils'; import { showErrorToast, showSuccessToast } from '../../utils/ToastUtils'; const ContainerPage = () => { @@ -351,23 +351,12 @@ const ContainerPage = () => { [containerData, containerData?.owner] ); - const handleUpdateTier = async (updatedTier?: string) => { + const handleUpdateTier = async (updatedTier?: Tag) => { try { + const tierTag = updateTierTag(containerData?.tags ?? [], updatedTier); const { tags: newTags, version } = await handleUpdateContainerData({ ...(containerData as Container), - tags: [ - ...getTagsWithoutTier(containerData?.tags ?? []), - ...(updatedTier - ? [ - { - tagFQN: updatedTier, - labelType: LabelType.Manual, - state: State.Confirmed, - source: TagSource.Classification, - }, - ] - : []), - ], + tags: tierTag, }); setContainerData((prev) => ({ diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/DataInsightPage.component.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/DataInsightPage.component.tsx index f5bc3143f1e..4cbff54dbd0 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/DataInsightPage.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/DataInsightPage.component.tsx @@ -40,7 +40,6 @@ import { PAGE_SIZE, ROUTES } from '../../constants/constants'; import { ENTITIES_CHARTS, INITIAL_CHART_FILTER, - TIER_FILTER, } from '../../constants/DataInsight.constants'; import { DEFAULT_RANGE_DATA, @@ -51,6 +50,7 @@ import { ERROR_PLACEHOLDER_TYPE } from '../../enums/common.enum'; import { SearchIndex } from '../../enums/search.enum'; import { DataInsightChartType } from '../../generated/dataInsight/dataInsightChartResult'; import { Kpi } from '../../generated/dataInsight/kpi/kpi'; +import { Tag } from '../../generated/entity/classification/tag'; import { Operation } from '../../generated/entity/policies/policy'; import { ChartFilter, @@ -58,11 +58,13 @@ import { } from '../../interface/data-insight.interface'; import { getListKPIs } from '../../rest/KpiAPI'; import { searchQuery } from '../../rest/searchAPI'; +import { getTags } from '../../rest/tagAPI'; import { getDataInsightPathWithFqn, getTeamFilter, } from '../../utils/DataInsightUtils'; import { formatDate } from '../../utils/date-time/DateTimeUtils'; +import { getEntityName } from '../../utils/EntityUtils'; import { checkPermission } from '../../utils/PermissionsUtils'; import { TeamStateType, TierStateType } from './DataInsight.interface'; import './DataInsight.less'; @@ -121,12 +123,19 @@ const DataInsightPage = () => { ); const [dateRangeObject, setDateRangeObject] = useState(DEFAULT_RANGE_DATA); + const [tier, setTier] = useState<{ tags: Tag[]; isLoading: boolean }>({ + tags: [], + isLoading: true, + }); const [selectedChart, setSelectedChart] = useState(); const defaultTierOptions = useMemo(() => { - return Object.keys(TIER_FILTER); - }, []); + return tier.tags.map((op) => ({ + key: op.fullyQualifiedName ?? op.name, + label: getEntityName(op), + })); + }, [tier]); const { descriptionKpi, ownerKpi } = useMemo(() => { return { @@ -147,9 +156,7 @@ const DataInsightPage = () => { setTierOptions((prev) => ({ ...prev, selectedOptions: tiers })); setChartFilter((previous) => ({ ...previous, - tier: tiers.length - ? tiers.map((tier) => TIER_FILTER[tier.key].key).join(',') - : undefined, + tier: tiers.length ? tiers.map((tier) => tier.key).join(',') : undefined, })); }; @@ -202,14 +209,18 @@ const DataInsightPage = () => { if (query) { setTierOptions((prev) => ({ ...prev, - options: prev.options.filter((value) => - value.key.toLocaleLowerCase().includes(query.toLocaleLowerCase()) + options: prev.options.filter( + (value) => + value.label + .toLocaleLowerCase() + .includes(query.toLocaleLowerCase()) || + value.key.toLocaleLowerCase().includes(query.toLocaleLowerCase()) ), })); } else { setTierOptions((prev) => ({ ...prev, - options: defaultTierOptions.map((op) => ({ key: op, label: op })), + options: defaultTierOptions, })); } }; @@ -246,10 +257,32 @@ const DataInsightPage = () => { } }; + const getTierTag = async () => { + setTier((prev) => ({ ...prev, isLoading: true })); + try { + const { data } = await getTags({ + parent: 'Tier', + }); + + setTier((prev) => ({ ...prev, tags: data })); + setTierOptions((prev) => ({ + ...prev, + options: data.map((op) => ({ + key: op.fullyQualifiedName ?? op.name, + label: getEntityName(op), + })), + })); + } catch (error) { + // error + } finally { + setTier((prev) => ({ ...prev, isLoading: false })); + } + }; + const fetchDefaultTierOptions = () => { setTierOptions((prev) => ({ ...prev, - options: defaultTierOptions.map((op) => ({ key: op, label: op })), + options: defaultTierOptions, })); }; @@ -289,6 +322,7 @@ const DataInsightPage = () => { }, [selectedChart]); useEffect(() => { + getTierTag(); fetchDefaultTeamOptions(); fetchKpiList(); }, []); @@ -475,6 +509,7 @@ const DataInsightPage = () => { diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/DataModelPage/DataModelPage.component.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/DataModelPage/DataModelPage.component.tsx index 20a07f2a1cb..e5f15803f76 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/DataModelPage/DataModelPage.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/DataModelPage/DataModelPage.component.tsx @@ -37,9 +37,9 @@ import { import { QueryVote } from '../../components/TableQueries/TableQueries.interface'; import { ERROR_PLACEHOLDER_TYPE } from '../../enums/common.enum'; import { CreateThread } from '../../generated/api/feed/createThread'; +import { Tag } from '../../generated/entity/classification/tag'; import { DashboardDataModel } from '../../generated/entity/data/dashboardDataModel'; import { Include } from '../../generated/type/include'; -import { LabelType, State, TagSource } from '../../generated/type/tagLabel'; import { addDataModelFollower, getDataModelsByName, @@ -54,7 +54,8 @@ import { } from '../../utils/CommonUtils'; import { getSortedDataModelColumnTags } from '../../utils/DataModelsUtils'; import { DEFAULT_ENTITY_PERMISSION } from '../../utils/PermissionsUtils'; -import { getTagsWithoutTier, getTierTags } from '../../utils/TableUtils'; +import { getTierTags } from '../../utils/TableUtils'; +import { updateTierTag } from '../../utils/TagsUtils'; import { showErrorToast } from '../../utils/ToastUtils'; const DataModelsPage = () => { @@ -230,23 +231,12 @@ const DataModelsPage = () => { [dataModelData, dataModelData?.owner] ); - const handleUpdateTier = async (updatedTier?: string) => { + const handleUpdateTier = async (updatedTier?: Tag) => { try { + const tags = updateTierTag(dataModelData?.tags ?? [], updatedTier); const { tags: newTags, version } = await handleUpdateDataModelData({ ...(dataModelData as DashboardDataModel), - tags: [ - ...getTagsWithoutTier(dataModelData?.tags ?? []), - ...(updatedTier - ? [ - { - tagFQN: updatedTier, - labelType: LabelType.Manual, - state: State.Confirmed, - source: TagSource.Classification, - }, - ] - : []), - ], + tags, }); setDataModelData((prev) => ({ diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/DatabaseDetailsPage/DatabaseDetailsPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/DatabaseDetailsPage/DatabaseDetailsPage.tsx index 898e422b547..2ab7cfcbcd7 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/DatabaseDetailsPage/DatabaseDetailsPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/DatabaseDetailsPage/DatabaseDetailsPage.tsx @@ -66,6 +66,7 @@ import { ERROR_PLACEHOLDER_TYPE } from '../../enums/common.enum'; import { EntityTabs, EntityType } from '../../enums/entity.enum'; import { SearchIndex } from '../../enums/search.enum'; import { CreateThread } from '../../generated/api/feed/createThread'; +import { Tag } from '../../generated/entity/classification/tag'; import { Database } from '../../generated/entity/data/database'; import { DatabaseSchema } from '../../generated/entity/data/databaseSchema'; import { LabelType } from '../../generated/entity/data/table'; @@ -88,6 +89,7 @@ import { getEntityFeedLink, getEntityName } from '../../utils/EntityUtils'; import { DEFAULT_ENTITY_PERMISSION } from '../../utils/PermissionsUtils'; import { getDecodedFqn } from '../../utils/StringsUtils'; import { getTagsWithoutTier, getTierTags } from '../../utils/TableUtils'; +import { updateTierTag } from '../../utils/TagsUtils'; import { showErrorToast, showSuccessToast } from '../../utils/ToastUtils'; const DatabaseDetails: FunctionComponent = () => { @@ -438,17 +440,8 @@ const DatabaseDetails: FunctionComponent = () => { }, []); const handleUpdateTier = useCallback( - (newTier?: string) => { - const tierTag = newTier - ? [ - ...getTagsWithoutTier(database?.tags ?? []), - { - tagFQN: newTier, - labelType: LabelType.Manual, - state: State.Confirmed, - }, - ] - : getTagsWithoutTier(database?.tags ?? []); + (newTier?: Tag) => { + const tierTag = updateTierTag(database?.tags ?? [], newTier); const updatedTableDetails = { ...database, tags: tierTag, diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/DatabaseSchemaPage/DatabaseSchemaPage.component.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/DatabaseSchemaPage/DatabaseSchemaPage.component.tsx index 69111aa7a03..3acfd22171e 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/DatabaseSchemaPage/DatabaseSchemaPage.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/DatabaseSchemaPage/DatabaseSchemaPage.component.tsx @@ -59,6 +59,7 @@ import { import { ERROR_PLACEHOLDER_TYPE } from '../../enums/common.enum'; import { EntityTabs, EntityType } from '../../enums/entity.enum'; import { CreateThread } from '../../generated/api/feed/createThread'; +import { Tag } from '../../generated/entity/classification/tag'; import { DatabaseSchema } from '../../generated/entity/data/databaseSchema'; import { Table } from '../../generated/entity/data/table'; import { ThreadType } from '../../generated/entity/feed/thread'; @@ -87,6 +88,7 @@ import { getEntityFeedLink, getEntityName } from '../../utils/EntityUtils'; import { DEFAULT_ENTITY_PERMISSION } from '../../utils/PermissionsUtils'; import { getDecodedFqn } from '../../utils/StringsUtils'; import { getTagsWithoutTier, getTierTags } from '../../utils/TableUtils'; +import { updateTierTag } from '../../utils/TagsUtils'; import { showErrorToast, showSuccessToast } from '../../utils/ToastUtils'; import { StoredProcedureData } from './DatabaseSchemaPage.interface'; import SchemaTablesTab from './SchemaTablesTab'; @@ -397,17 +399,8 @@ const DatabaseSchemaPage: FunctionComponent = () => { }; const handleUpdateTier = useCallback( - async (newTier?: string) => { - const tierTag = newTier - ? [ - ...getTagsWithoutTier(databaseSchema?.tags ?? []), - { - tagFQN: newTier, - labelType: LabelType.Manual, - state: State.Confirmed, - }, - ] - : getTagsWithoutTier(databaseSchema?.tags ?? []); + async (newTier?: Tag) => { + const tierTag = updateTierTag(databaseSchema?.tags ?? [], newTier); const updatedSchemaDetails = { ...databaseSchema, tags: tierTag, diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/SearchIndexDetailsPage/SearchIndexDetailsPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/SearchIndexDetailsPage/SearchIndexDetailsPage.tsx index dee7f61554b..6c0df057b91 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/SearchIndexDetailsPage/SearchIndexDetailsPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/SearchIndexDetailsPage/SearchIndexDetailsPage.tsx @@ -50,6 +50,7 @@ import { CreateThread, ThreadType, } from '../../generated/api/feed/createThread'; +import { Tag } from '../../generated/entity/classification/tag'; import { SearchIndex, TagLabel } from '../../generated/entity/data/searchIndex'; import { LabelType, State, TagSource } from '../../generated/type/tagLabel'; import { postThread } from '../../rest/feedsAPI'; @@ -73,6 +74,7 @@ import { getSearchIndexTabPath, } from '../../utils/SearchIndexUtils'; import { getTagsWithoutTier, getTierTags } from '../../utils/TableUtils'; +import { updateTierTag } from '../../utils/TagsUtils'; import { showErrorToast, showSuccessToast } from '../../utils/ToastUtils'; import SearchIndexFieldsTab from './SearchIndexFieldsTab/SearchIndexFieldsTab'; @@ -532,18 +534,12 @@ function SearchIndexDetailsPage() { ]); const onTierUpdate = useCallback( - async (newTier?: string) => { + async (newTier?: Tag) => { if (searchIndexDetails) { - const tierTag: SearchIndex['tags'] = newTier - ? [ - ...getTagsWithoutTier(searchIndexTags ?? []), - { - tagFQN: newTier, - labelType: LabelType.Manual, - state: State.Confirmed, - }, - ] - : getTagsWithoutTier(searchIndexTags ?? []); + const tierTag: SearchIndex['tags'] = updateTierTag( + searchIndexTags, + newTier + ); const updatedSearchIndexDetails = { ...searchIndexDetails, tags: tierTag, diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ServiceDetailsPage/ServiceDetailsPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ServiceDetailsPage/ServiceDetailsPage.tsx index 230a74562e2..7a2e1aec2aa 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/ServiceDetailsPage/ServiceDetailsPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/ServiceDetailsPage/ServiceDetailsPage.tsx @@ -64,6 +64,7 @@ import { ERROR_PLACEHOLDER_TYPE } from '../../enums/common.enum'; import { EntityTabs } from '../../enums/entity.enum'; import { ServiceCategory } from '../../enums/service.enum'; import { PipelineType } from '../../generated/api/services/ingestionPipelines/createIngestionPipeline'; +import { Tag } from '../../generated/entity/classification/tag'; import { Container } from '../../generated/entity/data/container'; import { Dashboard } from '../../generated/entity/data/dashboard'; import { DashboardDataModel } from '../../generated/entity/data/dashboardDataModel'; @@ -78,7 +79,6 @@ import { DatabaseService } from '../../generated/entity/services/databaseService import { IngestionPipeline } from '../../generated/entity/services/ingestionPipelines/ingestionPipeline'; import { Include } from '../../generated/type/include'; import { Paging } from '../../generated/type/paging'; -import { LabelType, State } from '../../generated/type/tagLabel'; import { useAuth } from '../../hooks/authHooks'; import { useAirflowStatus } from '../../hooks/useAirflowStatus'; import { ConfigData, ServicesType } from '../../interface/service.interface'; @@ -116,7 +116,7 @@ import { shouldTestConnection, } from '../../utils/ServiceUtils'; import { getDecodedFqn } from '../../utils/StringsUtils'; -import { getTagsWithoutTier } from '../../utils/TableUtils'; +import { updateTierTag } from '../../utils/TagsUtils'; import { showErrorToast } from '../../utils/ToastUtils'; import ServiceMainTabContent from './ServiceMainTabContent'; @@ -750,17 +750,8 @@ const ServiceDetailsPage: FunctionComponent = () => { ); const handleUpdateTier = useCallback( - async (newTier?: string) => { - const tierTag = newTier - ? [ - ...getTagsWithoutTier(serviceDetails?.tags ?? []), - { - tagFQN: newTier, - labelType: LabelType.Manual, - state: State.Confirmed, - }, - ] - : getTagsWithoutTier(serviceDetails?.tags ?? []); + async (newTier?: Tag) => { + const tierTag = updateTierTag(serviceDetails?.tags ?? [], newTier); const updatedServiceDetails = { ...serviceDetails, tags: tierTag, diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/StoredProcedure/StoredProcedurePage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/StoredProcedure/StoredProcedurePage.tsx index 44ee94efe36..f136ee3faad 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/StoredProcedure/StoredProcedurePage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/StoredProcedure/StoredProcedurePage.tsx @@ -51,6 +51,7 @@ import { CreateThread, ThreadType, } from '../../generated/api/feed/createThread'; +import { Tag } from '../../generated/entity/classification/tag'; import { StoredProcedure, StoredProcedureCodeObject, @@ -80,6 +81,7 @@ import { getEntityName } from '../../utils/EntityUtils'; import { DEFAULT_ENTITY_PERMISSION } from '../../utils/PermissionsUtils'; import { STORED_PROCEDURE_DEFAULT_FIELDS } from '../../utils/StoredProceduresUtils'; import { getTagsWithoutTier, getTierTags } from '../../utils/TableUtils'; +import { updateTierTag } from '../../utils/TagsUtils'; import { showErrorToast, showSuccessToast } from '../../utils/ToastUtils'; const StoredProcedurePage = () => { @@ -358,18 +360,9 @@ const StoredProcedurePage = () => { }; const onTierUpdate = useCallback( - async (newTier?: string) => { + async (newTier?: Tag) => { if (storedProcedure) { - const tierTag: StoredProcedure['tags'] = newTier - ? [ - ...getTagsWithoutTier(tags ?? []), - { - tagFQN: newTier, - labelType: LabelType.Manual, - state: State.Confirmed, - }, - ] - : getTagsWithoutTier(tags ?? []); + const tierTag: StoredProcedure['tags'] = updateTierTag(tags, newTier); const updatedDetails = { ...storedProcedure, tags: tierTag, diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/TableDetailsPageV1/TableDetailsPageV1.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/TableDetailsPageV1/TableDetailsPageV1.tsx index 06d4720f834..0b0ca574433 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/TableDetailsPageV1/TableDetailsPageV1.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/TableDetailsPageV1/TableDetailsPageV1.tsx @@ -59,6 +59,7 @@ import { TabSpecificField, } from '../../enums/entity.enum'; import { CreateThread } from '../../generated/api/feed/createThread'; +import { Tag } from '../../generated/entity/classification/tag'; import { JoinedWith, Table } from '../../generated/entity/data/table'; import { DataProduct } from '../../generated/entity/domains/dataProduct'; import { ThreadType } from '../../generated/entity/feed/thread'; @@ -93,6 +94,7 @@ import { } from '../../utils/EntityUtils'; import { DEFAULT_ENTITY_PERMISSION } from '../../utils/PermissionsUtils'; import { getTagsWithoutTier, getTierTags } from '../../utils/TableUtils'; +import { updateTierTag } from '../../utils/TagsUtils'; import { showErrorToast, showSuccessToast } from '../../utils/ToastUtils'; import { FrequentlyJoinedTables } from './FrequentlyJoinedTables/FrequentlyJoinedTables.component'; import './table-details-page-v1.less'; @@ -731,18 +733,9 @@ const TableDetailsPageV1 = () => { ]); const onTierUpdate = useCallback( - async (newTier?: string) => { + async (newTier?: Tag) => { if (tableDetails) { - const tierTag: Table['tags'] = newTier - ? [ - ...getTagsWithoutTier(tableTags ?? []), - { - tagFQN: newTier, - labelType: LabelType.Manual, - state: State.Confirmed, - }, - ] - : getTagsWithoutTier(tableTags ?? []); + const tierTag: Table['tags'] = updateTierTag(tableTags, newTier); const updatedTableDetails = { ...tableDetails, tags: tierTag, 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 01d8b89f926..a2442f8d3cd 100644 --- a/openmetadata-ui/src/main/resources/ui/src/utils/DataInsightUtils.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/utils/DataInsightUtils.tsx @@ -40,7 +40,6 @@ import { } from '../constants/constants'; import { ENTITIES_SUMMARY_LIST, - TIER_DATA, WEB_SUMMARY_LIST, } from '../constants/DataInsight.constants'; import { KpiTargetType } from '../generated/api/dataInsight/kpi/createKpiRequest'; @@ -68,8 +67,7 @@ const checkIsPercentageGraph = (dataInsightChartType: DataInsightChartType) => export const renderLegend = ( legendData: LegendProps, - activeKeys = [] as string[], - isTier = false + activeKeys = [] as string[] ) => { const { payload = [] } = legendData; @@ -103,9 +101,7 @@ export const renderLegend = ( /> - {isTier - ? TIER_DATA[entry.value as keyof typeof TIER_DATA] - : entry.value} + {entry.value} ); @@ -150,13 +146,7 @@ const getEntryFormattedValue = ( }; export const CustomTooltip = (props: DataInsightChartTooltipProps) => { - const { - active, - payload = [], - isPercentage, - kpiTooltipRecord, - isTier, - } = props; + const { active, payload = [], isPercentage, kpiTooltipRecord } = props; if (active && payload && payload.length) { const timestamp = formatDate(payload[0].payload.timestampValue || 0); @@ -173,9 +163,7 @@ export const CustomTooltip = (props: DataInsightChartTooltipProps) => { - {isTier - ? TIER_DATA[entry.dataKey as keyof typeof TIER_DATA] - : entry.dataKey} + {entry.dataKey} {getEntryFormattedValue( diff --git a/openmetadata-ui/src/main/resources/ui/src/utils/TagsUtils.tsx b/openmetadata-ui/src/main/resources/ui/src/utils/TagsUtils.tsx index 81b37dbb912..8258dd59a99 100644 --- a/openmetadata-ui/src/main/resources/ui/src/utils/TagsUtils.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/utils/TagsUtils.tsx @@ -30,6 +30,7 @@ import { Classification } from '../generated/entity/classification/classificatio import { Tag } from '../generated/entity/classification/tag'; import { Column } from '../generated/entity/data/table'; import { Paging } from '../generated/type/paging'; +import { LabelType, State, TagLabel } from '../generated/type/tagLabel'; import { searchQuery } from '../rest/searchAPI'; import { getAllClassifications, @@ -38,6 +39,7 @@ import { } from '../rest/tagAPI'; import { formatSearchTagsResponse } from './APIUtils'; import { fetchGlossaryTerms, getGlossaryTermlist } from './GlossaryUtils'; +import { getTagsWithoutTier } from './TableUtils'; export const getClassifications = async ( fields?: Array | string, @@ -322,3 +324,20 @@ export const fetchTagsElasticSearch = async ( }, }; }; + +export const createTierTag = (tag: Tag) => { + return { + displayName: tag.displayName, + name: tag.name, + description: tag.description, + tagFQN: tag.fullyQualifiedName, + labelType: LabelType.Manual, + state: State.Confirmed, + }; +}; + +export const updateTierTag = (oldTags: Tag[] | TagLabel[], newTier?: Tag) => { + return newTier + ? [...getTagsWithoutTier(oldTags), createTierTag(newTier)] + : getTagsWithoutTier(oldTags); +};