From b74816ceed8f0f5525febc5fb790da526b2caa6c Mon Sep 17 00:00:00 2001
From: Chirag Madlani <12962843+chirag-madlani@users.noreply.github.com>
Date: Fri, 16 May 2025 20:37:22 +0530
Subject: [PATCH] chore(ui): update add button styling for expandable cards
(#21197)
* chore(ui): update add button styling for expandable cards
* fix tests
* fix test for expandable card
* fix data test id
* fix playwright tests
* fix tests
* fix metric playwright
* fix test
---
.../ui/playwright/e2e/Pages/Entity.spec.ts | 4 +
.../playwright/support/entity/EntityClass.ts | 8 +-
.../resources/ui/playwright/utils/user.ts | 8 +-
.../DataAssets/OwnerLabelV2/OwnerLabelV2.tsx | 55 ++--
.../ReviewerLabelV2/ReviewerLabelV2.tsx | 72 ++---
.../DataProductsSelectForm.interface.ts | 30 --
.../DataProductsSelectForm.test.tsx | 79 -----
.../DataProductsSelectForm.tsx | 74 -----
.../DataProductsContainer.component.tsx | 50 ++-
.../DataProductSelectList.interface.ts | 6 +-
.../DataProductsSelectList.tsx | 303 +++++++++---------
.../TableQueryRightPanel.component.tsx | 140 ++++----
.../TableQueryRightPanel.test.tsx | 6 +-
.../TableTags/TableTags.component.tsx | 1 -
.../DomainExpertWidget.tsx | 72 ++---
.../tabs/GlossaryTermReferences.tsx | 85 ++---
.../tabs/GlossaryTermSynonyms.tsx | 83 ++---
.../GlossaryTerms/tabs/RelatedTerms.tsx | 57 ++--
.../Metric/RelatedMetrics/RelatedMetrics.tsx | 89 +++--
.../TagsContainerV2.interface.ts | 1 -
.../Tag/TagsContainerV2/TagsContainerV2.tsx | 144 ++++-----
.../components/TagsInput/TagsInput.test.tsx | 221 +++++++------
.../ExpandableCard/ExpandableCard.test.tsx | 12 +-
.../common/ExpandableCard/ExpandableCard.tsx | 4 +
.../common/IconButtons/EditIconButton.tsx | 35 +-
.../FrequentlyJoinedTables.component.tsx | 2 +-
.../TableConstraints/TableConstraints.tsx | 70 ++--
27 files changed, 769 insertions(+), 942 deletions(-)
delete mode 100644 openmetadata-ui/src/main/resources/ui/src/components/DataProducts/DataProductSelectForm/DataProductsSelectForm.interface.ts
delete mode 100644 openmetadata-ui/src/main/resources/ui/src/components/DataProducts/DataProductSelectForm/DataProductsSelectForm.test.tsx
delete mode 100644 openmetadata-ui/src/main/resources/ui/src/components/DataProducts/DataProductSelectForm/DataProductsSelectForm.tsx
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Entity.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Entity.spec.ts
index bafbd1434cd..5873f18fcf1 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Entity.spec.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Entity.spec.ts
@@ -211,10 +211,14 @@ entities.forEach((EntityClass) => {
});
test('Tag Add, Update and Remove', async ({ page }) => {
+ test.slow(true);
+
await entity.tag(page, 'PersonalData.Personal', 'PII.None');
});
test('Glossary Term Add, Update and Remove', async ({ page }) => {
+ test.slow(true);
+
await entity.glossaryTerm(
page,
EntityDataClass.glossaryTerm1.responseData,
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/support/entity/EntityClass.ts b/openmetadata-ui/src/main/resources/ui/playwright/support/entity/EntityClass.ts
index bd9c21b2f46..e34ec5b6eb3 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/support/entity/EntityClass.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/support/entity/EntityClass.ts
@@ -224,7 +224,7 @@ export class EntityClass {
await page
.getByTestId('KnowledgePanel.Tags')
.getByTestId('tags-container')
- .getByTestId('Add')
+ .getByTestId('add-tag')
.isVisible();
}
@@ -265,7 +265,7 @@ export class EntityClass {
await page
.locator(`[${rowSelector}="${rowId}"]`)
.getByTestId('tags-container')
- .getByTestId('Add')
+ .getByTestId('add-tag')
.isVisible();
}
@@ -281,7 +281,7 @@ export class EntityClass {
await page
.getByTestId('KnowledgePanel.GlossaryTerms')
.getByTestId('glossary-container')
- .getByTestId('Add')
+ .getByTestId('add-tag')
.isVisible();
}
@@ -321,7 +321,7 @@ export class EntityClass {
await page
.locator(`[${rowSelector}="${rowId}"]`)
.getByTestId('glossary-container')
- .getByTestId('Add')
+ .getByTestId('add-tag')
.isVisible();
}
diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/user.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/user.ts
index 5937c90bfb4..f4927a96453 100644
--- a/openmetadata-ui/src/main/resources/ui/playwright/utils/user.ts
+++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/user.ts
@@ -532,14 +532,14 @@ export const checkDataConsumerPermissions = async (page: Page) => {
// Check right panel add tags button
await expect(
page.locator(
- '[data-testid="KnowledgePanel.Tags"] [data-testid="tags-container"] [data-testid="entity-tags"] .tag-chip-add-button'
+ '[data-testid="KnowledgePanel.Tags"] [data-testid="tags-container"] [data-testid="add-tag"]'
)
).toBeVisible();
// Check right panel add glossary term button
await expect(
page.locator(
- '[data-testid="KnowledgePanel.GlossaryTerms"] [data-testid="glossary-container"] [data-testid="entity-tags"] .tag-chip-add-button'
+ '[data-testid="KnowledgePanel.GlossaryTerms"] [data-testid="glossary-container"] [data-testid="add-tag"]'
)
).toBeVisible();
@@ -617,14 +617,14 @@ export const checkStewardPermissions = async (page: Page) => {
// Check right panel add tags button
await expect(
page.locator(
- '[data-testid="KnowledgePanel.Tags"] [data-testid="tags-container"] [data-testid="entity-tags"] .tag-chip-add-button'
+ '[data-testid="KnowledgePanel.Tags"] [data-testid="tags-container"] [data-testid="add-tag"]'
)
).toBeVisible();
// Check right panel add glossary term button
await expect(
page.locator(
- '[data-testid="KnowledgePanel.GlossaryTerms"] [data-testid="glossary-container"] [data-testid="entity-tags"] .tag-chip-add-button'
+ '[data-testid="KnowledgePanel.GlossaryTerms"] [data-testid="glossary-container"] [data-testid="add-tag"]'
)
).toBeVisible();
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DataAssets/OwnerLabelV2/OwnerLabelV2.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DataAssets/OwnerLabelV2/OwnerLabelV2.tsx
index 67b6cbce27e..4ef1c98de4a 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DataAssets/OwnerLabelV2/OwnerLabelV2.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DataAssets/OwnerLabelV2/OwnerLabelV2.tsx
@@ -14,13 +14,14 @@ import { Typography } from 'antd';
import { t } from 'i18next';
import { isEmpty } from 'lodash';
import React, { useMemo } from 'react';
-import { ReactComponent as PlusIcon } from '../../../assets/svg/plus-primary.svg';
import { TabSpecificField } from '../../../enums/entity.enum';
import { EntityReference } from '../../../generated/entity/type';
import { getOwnerVersionLabel } from '../../../utils/EntityVersionUtils';
import ExpandableCard from '../../common/ExpandableCard/ExpandableCard';
-import { EditIconButton } from '../../common/IconButtons/EditIconButton';
-import TagButton from '../../common/TagButton/TagButton.component';
+import {
+ EditIconButton,
+ PlusIconButton,
+} from '../../common/IconButtons/EditIconButton';
import { UserTeamSelectableList } from '../../common/UserTeamSelectableList/UserTeamSelectableList.component';
import { useGenericContext } from '../../Customization/GenericProvider/GenericProvider';
@@ -48,15 +49,22 @@ export const OwnerLabelV2 = <