From 3ff11d8518700ddf75ec0c979b208be88bdc6b44 Mon Sep 17 00:00:00 2001 From: Chirag Madlani <12962843+chirag-madlani@users.noreply.github.com> Date: Wed, 27 Nov 2024 16:43:33 +0530 Subject: [PATCH] Revert "Add alert bar component (#17230)" (#18812) This reverts commit e32f9cf8623cbe96cce8d0cc6c063b489c3f9590. --- .../src/main/resources/ui/package.json | 1 + .../e2e/Features/ActivityFeed.spec.ts | 18 +- .../e2e/Features/TeamsDragAndDrop.spec.ts | 9 +- .../e2e/Flow/ApiServiceRest.spec.ts | 13 +- .../ui/playwright/e2e/Pages/Domains.spec.ts | 6 +- .../ui/playwright/e2e/Pages/Glossary.spec.ts | 3 +- .../ui/playwright/e2e/Pages/Policies.spec.ts | 12 +- .../ui/playwright/e2e/Pages/Roles.spec.ts | 14 +- .../ui/playwright/e2e/Pages/TestCases.spec.ts | 19 +- .../VersionPages/EntityVersionPages.spec.ts | 12 +- .../ServiceEntityVersionPage.spec.ts | 12 +- .../resources/ui/playwright/utils/common.ts | 13 +- .../ui/playwright/utils/customMetric.ts | 6 +- .../resources/ui/playwright/utils/entity.ts | 21 +- .../resources/ui/playwright/utils/lineage.ts | 6 +- .../resources/ui/playwright/utils/user.ts | 9 +- .../src/main/resources/ui/src/App.tsx | 4 + .../resources/ui/src/assets/svg/ic-cross.svg | 3 - .../resources/ui/src/assets/svg/ic-error.svg | 12 - .../ui/src/assets/svg/ic-info-tag.svg | 12 - .../ui/src/assets/svg/ic-success.svg | 10 - .../ui/src/assets/svg/ic-warning-tag.svg | 12 - .../ui/src/components/AlertBar/AlertBar.tsx | 43 --- .../components/AlertBar/alert-bar.style.less | 85 ------ .../AppAuthenticators/MsalAuthenticator.tsx | 4 +- .../Domain/DomainPage.component.tsx | 47 ++-- .../ui/src/components/Domain/domain.less | 3 - .../components/PageLayoutV1/PageLayoutV1.tsx | 50 ++-- .../Toasts.constants.ts} | 17 +- .../resources/ui/src/hooks/useAlertStore.ts | 45 --- .../ui/src/locale/languages/de-de.json | 1 - .../ui/src/locale/languages/en-us.json | 1 - .../ui/src/locale/languages/es-es.json | 1 - .../ui/src/locale/languages/fr-fr.json | 1 - .../ui/src/locale/languages/gl-es.json | 1 - .../ui/src/locale/languages/he-he.json | 1 - .../ui/src/locale/languages/ja-jp.json | 1 - .../ui/src/locale/languages/nl-nl.json | 1 - .../ui/src/locale/languages/pr-pr.json | 1 - .../ui/src/locale/languages/pt-br.json | 1 - .../ui/src/locale/languages/pt-pt.json | 1 - .../ui/src/locale/languages/ru-ru.json | 1 - .../ui/src/locale/languages/th-th.json | 1 - .../ui/src/locale/languages/zh-cn.json | 1 - .../AlertDetailsPage.test.tsx | 9 - .../AlertDetailsPage/AlertDetailsPage.tsx | 257 +++++++++--------- .../DataQuality/DataQualityPage.test.tsx | 4 - .../src/pages/DataQuality/DataQualityPage.tsx | 141 +++++----- .../GlossaryPage/GlossaryPage.component.tsx | 41 ++- .../GlossaryPage/GlossaryPage.test.tsx | 9 - .../LineageConfigPage/LineageConfigPage.tsx | 241 ++++++++-------- .../Persona/PersonaListPage/PersonaPage.tsx | 128 ++++----- .../ui/src/styles/layout/page-layout.less | 14 - .../resources/ui/src/styles/variables.less | 4 - .../main/resources/ui/src/utils/ToastUtils.ts | 83 ++---- .../src/main/resources/ui/yarn.lock | 7 + 56 files changed, 574 insertions(+), 899 deletions(-) delete mode 100644 openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-cross.svg delete mode 100644 openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-error.svg delete mode 100644 openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-info-tag.svg delete mode 100644 openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-success.svg delete mode 100644 openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-warning-tag.svg delete mode 100644 openmetadata-ui/src/main/resources/ui/src/components/AlertBar/AlertBar.tsx delete mode 100644 openmetadata-ui/src/main/resources/ui/src/components/AlertBar/alert-bar.style.less rename openmetadata-ui/src/main/resources/ui/src/{components/AlertBar/AlertBar.interface.ts => constants/Toasts.constants.ts} (72%) delete mode 100644 openmetadata-ui/src/main/resources/ui/src/hooks/useAlertStore.ts diff --git a/openmetadata-ui/src/main/resources/ui/package.json b/openmetadata-ui/src/main/resources/ui/package.json index 2d2ccf9b876..99c44c51705 100644 --- a/openmetadata-ui/src/main/resources/ui/package.json +++ b/openmetadata-ui/src/main/resources/ui/package.json @@ -120,6 +120,7 @@ "react-quill-new": "^3.3.2", "react-reflex": "^4.0.12", "react-router-dom": "^5.2.0", + "react-toastify": "^8.2.0", "reactflow": "^11.10.2", "reactjs-localstorage": "^1.0.1", "recharts": "2.10.3", diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/ActivityFeed.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/ActivityFeed.spec.ts index 467bf511d00..57578ef22ea 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/ActivityFeed.spec.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/ActivityFeed.spec.ts @@ -363,15 +363,13 @@ test.describe('Activity feed', () => { await page.getByText('OK').click(); await resolveTask; - await toastNotification(page, /Task resolved successfully/, 'success'); + await toastNotification(page, /Task resolved successfully/); // Task 1 - Resolved the task - const resolveTask2 = page.waitForResponse('/api/v1/feed/tasks/*/resolve'); await page.getByText('Accept Suggestion').click(); - await resolveTask2; - await toastNotification(page, /Task resolved successfully/, 'success'); + await toastNotification(page, /Task resolved successfully/); await checkTaskCount(page, 0, 2); }); @@ -414,11 +412,7 @@ test.describe('Activity feed', () => { await page.getByRole('menuitem', { name: 'close' }).click(); - await toastNotification( - page, - 'Task cannot be closed without a comment.', - 'error' - ); + await toastNotification(page, 'Task cannot be closed without a comment.'); // Close the task from the Button.Group, with comment is added. await page.fill( @@ -677,8 +671,7 @@ base.describe('Activity feed with Data Consumer User', () => { // await toastNotification(page1, 'Task closed successfully.'); await toastNotification( page1, - 'An exception with message [Cannot invoke "java.util.List.stream()" because "owners" is null] was thrown while processing request.', - 'error' + 'An exception with message [Cannot invoke "java.util.List.stream()" because "owners" is null] was thrown while processing request.' ); // TODO: Ashish - Enable them once issue is resolved from Backend https://github.com/open-metadata/OpenMetadata/issues/17059 @@ -991,8 +984,7 @@ base.describe('Activity feed with Data Consumer User', () => { await toastNotification( page2, // eslint-disable-next-line max-len - `Principal: CatalogPrincipal{name='${viewAllUser.responseData.name}'} operation EditDescription denied by role ${viewAllRoles.responseData.name}, policy ${viewAllPolicy.responseData.name}, rule editNotAllowed`, - 'error' + `Principal: CatalogPrincipal{name='${viewAllUser.responseData.name}'} operation EditDescription denied by role ${viewAllRoles.responseData.name}, policy ${viewAllPolicy.responseData.name}, rule editNotAllowed` ); await afterActionUser2(); diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/TeamsDragAndDrop.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/TeamsDragAndDrop.spec.ts index eaa13dbc0f3..a91ddc482b0 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/TeamsDragAndDrop.spec.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/TeamsDragAndDrop.spec.ts @@ -118,8 +118,7 @@ test.describe('Teams drag and drop should work properly', () => { await dragAndDropElement(page, team, teamNameGroup); await toastNotification( page, - `You cannot move to this team as Team Type ${TEAM_TYPE_BY_NAME[team]} can't be Group children`, - 'error' + `You cannot move to this team as Team Type ${TEAM_TYPE_BY_NAME[team]} can't be Group children` ); } }); @@ -133,8 +132,7 @@ test.describe('Teams drag and drop should work properly', () => { await dragAndDropElement(page, team, teamNameDepartment); await toastNotification( page, - `You cannot move to this team as Team Type ${TEAM_TYPE_BY_NAME[team]} can't be Department children`, - 'error' + `You cannot move to this team as Team Type ${TEAM_TYPE_BY_NAME[team]} can't be Department children` ); } }); @@ -145,8 +143,7 @@ test.describe('Teams drag and drop should work properly', () => { await dragAndDropElement(page, teamNameBusiness, teamNameDivision); await toastNotification( page, - "You cannot move to this team as Team Type BusinessUnit can't be Division children", - 'error' + "You cannot move to this team as Team Type BusinessUnit can't be Division children" ); }); diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Flow/ApiServiceRest.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Flow/ApiServiceRest.spec.ts index 22c9cd195f5..d9b46f3d514 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Flow/ApiServiceRest.spec.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Flow/ApiServiceRest.spec.ts @@ -12,12 +12,7 @@ */ import { expect, test } from '@playwright/test'; import { GlobalSettingOptions } from '../../constant/settings'; -import { - descriptionBox, - redirectToHomePage, - toastNotification, - uuid, -} from '../../utils/common'; +import { descriptionBox, redirectToHomePage, uuid } from '../../utils/common'; import { settingClick } from '../../utils/sidebar'; const apiServiceConfig = { @@ -94,6 +89,10 @@ test.describe('API service', () => { await deleteResponse; - await toastNotification(page, /deleted successfully!/); + await expect(page.locator('.Toastify__toast-body')).toHaveText( + /deleted successfully!/ + ); + + await page.click('.Toastify__close-button'); }); }); diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Domains.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Domains.spec.ts index 622514a9552..ef6d563b7d0 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Domains.spec.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Domains.spec.ts @@ -84,11 +84,7 @@ test.describe('Domains', () => { await deleteRes; await expect( - page.getByText( - `"${ - domain.data.displayName ?? domain.data.name - }" deleted successfully!` - ) + page.getByText(`"${domain.data.displayName}" deleted`) ).toBeVisible(); }); diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Glossary.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Glossary.spec.ts index 84c13afb08c..f5c5fe15000 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Glossary.spec.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Glossary.spec.ts @@ -378,8 +378,7 @@ test.describe('Glossary tests', () => { await toastNotification( page, - /mutually exclusive and can't be assigned together/, - 'error' + /mutually exclusive and can't be assigned together/ ); // Add non mutually exclusive tags diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Policies.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Policies.spec.ts index 038c637ee8e..5ae25ec71fe 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Policies.spec.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Policies.spec.ts @@ -25,11 +25,7 @@ import { UPDATED_RULE_NAME, } from '../../constant/permission'; import { GlobalSettingOptions } from '../../constant/settings'; -import { - descriptionBox, - redirectToHomePage, - toastNotification, -} from '../../utils/common'; +import { descriptionBox, redirectToHomePage } from '../../utils/common'; import { validateFormNameFieldInput } from '../../utils/form'; import { settingClick } from '../../utils/sidebar'; @@ -262,10 +258,8 @@ test.describe('Policy page should work properly', () => { await page.locator('[data-testid="delete-rule"]').click(); // Validate the error message - await toastNotification( - page, - ERROR_MESSAGE_VALIDATION.lastRuleCannotBeRemoved, - 'error' + await expect(page.locator('.Toastify__toast-body')).toContainText( + ERROR_MESSAGE_VALIDATION.lastRuleCannotBeRemoved ); }); diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Roles.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Roles.spec.ts index 911747d396a..ce8df842364 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Roles.spec.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Roles.spec.ts @@ -12,12 +12,7 @@ */ import { expect, test } from '@playwright/test'; import { GlobalSettingOptions } from '../../constant/settings'; -import { - descriptionBox, - redirectToHomePage, - toastNotification, - uuid, -} from '../../utils/common'; +import { descriptionBox, redirectToHomePage, uuid } from '../../utils/common'; import { removePolicyFromRole } from '../../utils/roles'; import { settingClick } from '../../utils/sidebar'; @@ -206,12 +201,9 @@ test('Roles page should work properly', async ({ page }) => { // Removing the last policy and validating the error message await removePolicyFromRole(page, policies.dataConsumerPolicy, roleName); - await toastNotification( - page, - errorMessageValidation.lastPolicyCannotBeRemoved, - 'error' + await expect(page.locator('.Toastify__toast-body')).toContainText( + errorMessageValidation.lastPolicyCannotBeRemoved ); - await expect(page.locator('.ant-table-row')).toContainText( policies.dataConsumerPolicy ); diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/TestCases.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/TestCases.spec.ts index 76887b2056b..56bef624f08 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/TestCases.spec.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/TestCases.spec.ts @@ -16,7 +16,6 @@ import { descriptionBox, getApiContext, redirectToHomePage, - toastNotification, } from '../../utils/common'; import { deleteTestCase, visitDataQualityTab } from '../../utils/testCases'; @@ -134,7 +133,11 @@ test('Table difference test case', async ({ page }) => { await page.getByTitle('name', { exact: true }).click(); await page.getByRole('button', { name: 'Submit' }).click(); - await toastNotification(page, 'Test case updated successfully.'); + await expect(page.getByRole('alert')).toContainText( + 'Test case updated successfully.' + ); + + await page.getByLabel('close', { exact: true }).click(); }); await test.step('Delete', async () => { @@ -230,7 +233,11 @@ test('Custom SQL Query', async ({ page }) => { await page.getByPlaceholder('Enter a Threshold').fill('244'); await page.getByRole('button', { name: 'Submit' }).click(); - await toastNotification(page, 'Test case updated successfully.'); + await expect(page.getByRole('alert')).toContainText( + 'Test case updated successfully.' + ); + + await page.getByLabel('close', { exact: true }).click(); }); await test.step('Delete', async () => { @@ -327,7 +334,11 @@ test('Column Values To Be Not Null', async ({ page }) => { await page.keyboard.type(' update'); await page.getByRole('button', { name: 'Submit' }).click(); - await toastNotification(page, 'Test case updated successfully.'); + await expect(page.getByRole('alert')).toContainText( + 'Test case updated successfully.' + ); + + await page.getByLabel('close', { exact: true }).click(); }); await test.step('Delete', async () => { diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/VersionPages/EntityVersionPages.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/VersionPages/EntityVersionPages.spec.ts index 0f820128d26..6b8ae01172a 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/VersionPages/EntityVersionPages.spec.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/VersionPages/EntityVersionPages.spec.ts @@ -22,11 +22,7 @@ import { SearchIndexClass } from '../../support/entity/SearchIndexClass'; import { StoredProcedureClass } from '../../support/entity/StoredProcedureClass'; import { TableClass } from '../../support/entity/TableClass'; import { TopicClass } from '../../support/entity/TopicClass'; -import { - createNewPage, - redirectToHomePage, - toastNotification, -} from '../../utils/common'; +import { createNewPage, redirectToHomePage } from '../../utils/common'; import { addMultiOwner, assignTier } from '../../utils/entity'; const entities = [ @@ -237,7 +233,11 @@ entities.forEach((EntityClass) => { await deleteResponse; - await toastNotification(page, /deleted successfully!/); + await expect(page.locator('.Toastify__toast-body')).toHaveText( + /deleted successfully!/ + ); + + await page.click('.Toastify__close-button'); await page.reload(); diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/VersionPages/ServiceEntityVersionPage.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/VersionPages/ServiceEntityVersionPage.spec.ts index f79a1a68307..d083c18c1ec 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/VersionPages/ServiceEntityVersionPage.spec.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/VersionPages/ServiceEntityVersionPage.spec.ts @@ -23,11 +23,7 @@ import { MlmodelServiceClass } from '../../support/entity/service/MlmodelService import { PipelineServiceClass } from '../../support/entity/service/PipelineServiceClass'; import { SearchIndexServiceClass } from '../../support/entity/service/SearchIndexServiceClass'; import { StorageServiceClass } from '../../support/entity/service/StorageServiceClass'; -import { - createNewPage, - redirectToHomePage, - toastNotification, -} from '../../utils/common'; +import { createNewPage, redirectToHomePage } from '../../utils/common'; import { addMultiOwner, assignTier } from '../../utils/entity'; const entities = [ @@ -202,7 +198,11 @@ entities.forEach((EntityClass) => { await deleteResponse; - await toastNotification(page, /deleted successfully!/); + await expect(page.locator('.Toastify__toast-body')).toHaveText( + /deleted successfully!/ + ); + + await page.click('.Toastify__close-button'); await page.reload(); diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/common.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/common.ts index c38ea012a88..f2b7ffc39d9 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/utils/common.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/common.ts @@ -113,14 +113,15 @@ export const getEntityTypeSearchIndexMapping = (entityType: string) => { export const toastNotification = async ( page: Page, - message: string | RegExp, - type: 'info' | 'success' | 'warning' | 'error' = 'success' + message: string | RegExp ) => { - await expect(page.locator(`.alert-container.${type}`)).toHaveText(message); + await expect(page.getByRole('alert').first()).toHaveText(message); - await expect(page.locator('.ant-alert-icon')).toBeVisible(); - - await expect(page.locator('.alert-container button')).toBeVisible(); + await page + .locator('.Toastify__toast') + .getByLabel('close', { exact: true }) + .first() + .click(); }; export const clickOutside = async (page: Page) => { diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/customMetric.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/customMetric.ts index e8cda5d48f7..aec19a4749a 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/utils/customMetric.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/customMetric.ts @@ -16,7 +16,6 @@ import { NAME_MAX_LENGTH_VALIDATION_ERROR, NAME_VALIDATION_ERROR, } from '../constant/common'; -import { toastNotification } from './common'; type CustomMetricDetails = { page: Page; @@ -119,11 +118,12 @@ export const createCustomMetric = async ({ await page.click('[data-testid="submit-button"]'); await createMetricResponse; - await toastNotification( - page, + await expect(page.locator('.Toastify__toast-body')).toHaveText( new RegExp(`${metric.name} created successfully.`) ); + await page.locator('.Toastify__close-button').click(); + // verify the created custom metric await expect(page).toHaveURL(/profiler/); await expect( diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/entity.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/entity.ts index 93358e01247..42b2d3db4e1 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/utils/entity.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/entity.ts @@ -24,7 +24,7 @@ import { } from '../constant/delete'; import { ES_RESERVED_CHARACTERS } from '../constant/entity'; import { EntityTypeEndpoint } from '../support/entity/Entity.interface'; -import { clickOutside, redirectToHomePage, toastNotification } from './common'; +import { clickOutside, redirectToHomePage } from './common'; export const visitEntityPage = async (data: { page: Page; @@ -789,6 +789,7 @@ const announcementForm = async ( ); await page.click('#announcement-submit'); await announcementSubmit; + await page.click('.Toastify__close-button'); }; export const createAnnouncement = async ( @@ -1178,7 +1179,11 @@ export const restoreEntity = async (page: Page) => { await page.click('[data-testid="restore-button"]'); await page.click('button:has-text("Restore")'); - await toastNotification(page, /restored successfully/); + await expect(page.locator('.Toastify__toast-body')).toHaveText( + /restored successfully/ + ); + + await page.click('.Toastify__close-button'); const exists = await page .locator('[data-testid="deleted-badge"]') @@ -1217,7 +1222,11 @@ export const softDeleteEntity = async ( await deleteResponse; - await toastNotification(page, /deleted successfully!/); + await expect(page.locator('.Toastify__toast-body')).toHaveText( + /deleted successfully!/ + ); + + await page.click('.Toastify__close-button'); await page.reload(); @@ -1282,7 +1291,11 @@ export const hardDeleteEntity = async ( await page.click('[data-testid="confirm-button"]'); await deleteResponse; - await toastNotification(page, /deleted successfully!/); + await expect(page.locator('.Toastify__toast-body')).toHaveText( + /deleted successfully!/ + ); + + await page.click('.Toastify__close-button'); }; export const checkDataAssetWidget = async ( diff --git a/openmetadata-ui/src/main/resources/ui/playwright/utils/lineage.ts b/openmetadata-ui/src/main/resources/ui/playwright/utils/lineage.ts index 9d09e344818..a41c7a16793 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/utils/lineage.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/lineage.ts @@ -63,9 +63,9 @@ export const LINEAGE_CSV_HEADERS = [ export const verifyColumnLayerInactive = async (page: Page) => { await page.click('[data-testid="lineage-layer-btn"]'); // Open Layer popover - - await expect(page.getByTestId('lineage-layer-column-btn')).not.toBeFocused; - + await page.waitForSelector( + '[data-testid="lineage-layer-column-btn"]:not(.active)' + ); await page.click('[data-testid="lineage-layer-btn"]'); // Close Layer popover }; 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 ab96c291514..cc119a639cf 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/utils/user.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/utils/user.ts @@ -138,7 +138,11 @@ export const softDeleteUserProfilePage = async ( await deleteResponse; - await toastNotification(page, /deleted successfully!/); + await expect(page.locator('.Toastify__toast-body')).toHaveText( + /deleted successfully!/ + ); + + await page.click('.Toastify__close-button'); await deletedUserChecks(page); }; @@ -715,8 +719,7 @@ const resetPasswordModal = async ( page, isOldPasswordCorrect ? 'Password updated successfully.' - : 'Old Password is not correct', - isOldPasswordCorrect ? 'success' : 'error' + : 'Old Password is not correct' ); }; diff --git a/openmetadata-ui/src/main/resources/ui/src/App.tsx b/openmetadata-ui/src/main/resources/ui/src/App.tsx index a8edf6289a8..cbcc1eaef49 100644 --- a/openmetadata-ui/src/main/resources/ui/src/App.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/App.tsx @@ -16,12 +16,15 @@ import React, { FC, useEffect } from 'react'; import { HelmetProvider } from 'react-helmet-async'; import { I18nextProvider } from 'react-i18next'; import { Router } from 'react-router-dom'; +import { ToastContainer } from 'react-toastify'; +import 'react-toastify/dist/ReactToastify.min.css'; import AppRouter from './components/AppRouter/AppRouter'; import { AuthProvider } from './components/Auth/AuthProviders/AuthProvider'; import ErrorBoundary from './components/common/ErrorBoundary/ErrorBoundary'; import { EntityExportModalProvider } from './components/Entity/EntityExportModalProvider/EntityExportModalProvider.component'; import ApplicationsProvider from './components/Settings/Applications/ApplicationsProvider/ApplicationsProvider'; import WebAnalyticsProvider from './components/WebAnalytics/WebAnalyticsProvider'; +import { TOAST_OPTIONS } from './constants/Toasts.constants'; import AntDConfigProvider from './context/AntDConfigProvider/AntDConfigProvider'; import PermissionProvider from './context/PermissionProvider/PermissionProvider'; import TourProvider from './context/TourProvider/TourProvider'; @@ -95,6 +98,7 @@ const App: FC = () => { + ); diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-cross.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-cross.svg deleted file mode 100644 index 4edb4b8312e..00000000000 --- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-cross.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-error.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-error.svg deleted file mode 100644 index b321359d7d3..00000000000 --- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-error.svg +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - - - - diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-info-tag.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-info-tag.svg deleted file mode 100644 index 0874efa5b7d..00000000000 --- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-info-tag.svg +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - - - - diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-success.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-success.svg deleted file mode 100644 index 53c6a0b63ec..00000000000 --- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-success.svg +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - - - - diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-warning-tag.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-warning-tag.svg deleted file mode 100644 index 00f5761b5e5..00000000000 --- a/openmetadata-ui/src/main/resources/ui/src/assets/svg/ic-warning-tag.svg +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - - - - diff --git a/openmetadata-ui/src/main/resources/ui/src/components/AlertBar/AlertBar.tsx b/openmetadata-ui/src/main/resources/ui/src/components/AlertBar/AlertBar.tsx deleted file mode 100644 index 6ffb5876639..00000000000 --- a/openmetadata-ui/src/main/resources/ui/src/components/AlertBar/AlertBar.tsx +++ /dev/null @@ -1,43 +0,0 @@ -/* - * Copyright 2024 Collate. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * http://www.apache.org/licenses/LICENSE-2.0 - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -import { Alert } from 'antd'; -import classNames from 'classnames'; -import React, { useMemo } from 'react'; -import { ReactComponent as CrossIcon } from '../../assets/svg/ic-cross.svg'; -import { useAlertStore } from '../../hooks/useAlertStore'; -import { getIconAndClassName } from '../../utils/ToastUtils'; -import './alert-bar.style.less'; -import { AlertBarProps } from './AlertBar.interface'; - -const AlertBar = ({ type, message }: AlertBarProps): JSX.Element => { - const { resetAlert, animationClass } = useAlertStore(); - - const { icon: AlertIcon, className } = useMemo(() => { - return getIconAndClassName(type); - }, [type]); - - return ( - } - description={message} - icon={AlertIcon && } - type={type} - /> - ); -}; - -export default AlertBar; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/AlertBar/alert-bar.style.less b/openmetadata-ui/src/main/resources/ui/src/components/AlertBar/alert-bar.style.less deleted file mode 100644 index c139ba7cbe2..00000000000 --- a/openmetadata-ui/src/main/resources/ui/src/components/AlertBar/alert-bar.style.less +++ /dev/null @@ -1,85 +0,0 @@ -/* - * Copyright 2024 Collate. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * http://www.apache.org/licenses/LICENSE-2.0 - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -@import (reference) url('../../styles/variables.less'); - -@keyframes resize-show-animation { - from { - height: 0; - padding: 0 20px; - } - to { - height: 64px; - padding: 20px; - } -} - -@keyframes resize-hide-animation { - from { - height: 64px; - padding: 20px; - } - to { - height: 0; - padding: 0 20px; - } -} - -.alert-container { - overflow-y: scroll; - backdrop-filter: blur(500px); - - &.show-alert { - animation: resize-show-animation 1.2s ease-in-out forwards; - position: fixed; - top: 64px; - z-index: 20; - width: 96%; - } - - &.hide-alert { - animation: resize-hide-animation 1.2s ease-in-out forwards; - } - - &.info { - background-color: @info-bg-color; - color: @info-color; - border: none; - border-radius: 0px; - } - - &.success { - background-color: @success-bg-color; - color: @success-color; - border: none; - border-radius: 0px; - } - - &.warning { - background-color: @warning-bg-color; - color: @warning-color; - border: none; - border-radius: 0px; - } - - &.error { - background-color: @error-bg-color; - color: @error-color; - border: none; - border-radius: 0px; - } - - .ant-alert-description { - font-size: 16px; - } -} diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Auth/AppAuthenticators/MsalAuthenticator.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Auth/AppAuthenticators/MsalAuthenticator.tsx index c3687226679..dfc9efb7579 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Auth/AppAuthenticators/MsalAuthenticator.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Auth/AppAuthenticators/MsalAuthenticator.tsx @@ -24,13 +24,13 @@ import React, { useEffect, useImperativeHandle, } from 'react'; +import { toast } from 'react-toastify'; import { msalLoginRequest, parseMSALResponse, } from '../../../utils/AuthProvider.util'; import { getPopupSettingLink } from '../../../utils/BrowserUtils'; import { Transi18next } from '../../../utils/CommonUtils'; -import { showErrorToast } from '../../../utils/ToastUtils'; import Loader from '../../common/Loader/Loader'; import { AuthenticatorRef, @@ -96,7 +96,7 @@ const MsalAuthenticator = forwardRef( // eslint-disable-next-line no-console console.error(e); if (e?.message?.includes('popup_window_error')) { - showErrorToast( + toast.error( { } }, [rootDomains, domainFqn]); + if (domainLoading) { + return ; + } + if (!(viewBasicDomainPermission || viewAllDomainPermission)) { return ( { ); } - const pageContent = isEmpty(rootDomains) ? ( - - {t('message.domains-not-configured')} - - ) : ( + if (isEmpty(rootDomains)) { + return ( + + {t('message.domains-not-configured')} + + ); + } + + return ( { }} /> ); - - return ( - - {domainLoading ? : pageContent} - - ); }; export default DomainPage; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Domain/domain.less b/openmetadata-ui/src/main/resources/ui/src/components/Domain/domain.less index a0fe86d6b5e..81bcd468dad 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Domain/domain.less +++ b/openmetadata-ui/src/main/resources/ui/src/components/Domain/domain.less @@ -15,9 +15,6 @@ height: @domain-page-height; overflow-y: auto; } -.domain-page { - margin-top: -12px; -} .domain-details-page-tabs { .ant-tabs-nav { diff --git a/openmetadata-ui/src/main/resources/ui/src/components/PageLayoutV1/PageLayoutV1.tsx b/openmetadata-ui/src/main/resources/ui/src/components/PageLayoutV1/PageLayoutV1.tsx index f5e8ebdacbb..3d03682e20e 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/PageLayoutV1/PageLayoutV1.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/PageLayoutV1/PageLayoutV1.tsx @@ -21,8 +21,6 @@ import React, { ReactNode, useMemo, } from 'react'; -import { useAlertStore } from '../../hooks/useAlertStore'; -import AlertBar from '../AlertBar/AlertBar'; import DocumentTitle from '../common/DocumentTitle/DocumentTitle'; import './../../styles/layout/page-layout.less'; @@ -62,8 +60,6 @@ const PageLayoutV1: FC = ({ mainContainerClassName = '', pageContainerStyle = {}, }: PageLayoutProp) => { - const { alert } = useAlertStore(); - const contentWidth = useMemo(() => { if (leftPanel && rightPanel) { return `calc(100% - ${leftPanelWidth + rightPanelWidth}px)`; @@ -103,35 +99,27 @@ const PageLayoutV1: FC = ({ {leftPanel} )} - - -
- {alert && } -
- {children} -
-
- - {rightPanel && ( - - {rightPanel} - + + {children} + {rightPanel && ( + + {rightPanel} + + )} ); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/AlertBar/AlertBar.interface.ts b/openmetadata-ui/src/main/resources/ui/src/constants/Toasts.constants.ts similarity index 72% rename from openmetadata-ui/src/main/resources/ui/src/components/AlertBar/AlertBar.interface.ts rename to openmetadata-ui/src/main/resources/ui/src/constants/Toasts.constants.ts index 269daa647ba..33a2e24018d 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/AlertBar/AlertBar.interface.ts +++ b/openmetadata-ui/src/main/resources/ui/src/constants/Toasts.constants.ts @@ -1,7 +1,5 @@ -import { AlertProps } from 'antd'; - /* - * Copyright 2024 Collate. + * Copyright 2022 Collate. * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at @@ -12,7 +10,12 @@ import { AlertProps } from 'antd'; * See the License for the specific language governing permissions and * limitations under the License. */ -export interface AlertBarProps { - type: AlertProps['type']; - message: string | JSX.Element; -} + +import { ToastOptions } from 'react-toastify'; + +export const TOAST_OPTIONS: ToastOptions = { + autoClose: false, + hideProgressBar: true, + draggable: false, + closeOnClick: false, +}; diff --git a/openmetadata-ui/src/main/resources/ui/src/hooks/useAlertStore.ts b/openmetadata-ui/src/main/resources/ui/src/hooks/useAlertStore.ts deleted file mode 100644 index 654af5fbaa1..00000000000 --- a/openmetadata-ui/src/main/resources/ui/src/hooks/useAlertStore.ts +++ /dev/null @@ -1,45 +0,0 @@ -/* - * Copyright 2024 Collate. - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * http://www.apache.org/licenses/LICENSE-2.0 - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -import { AlertProps } from 'antd'; -import { create } from 'zustand'; - -type AlertType = { - type: AlertProps['type']; - message: string | JSX.Element; -}; - -interface AlertStore { - alert: AlertType | undefined; - animationClass: string; - addAlert: (alert: AlertType, timer?: number) => void; - resetAlert: () => void; -} - -export const useAlertStore = create()((set) => ({ - alert: undefined, - animationClass: '', - addAlert: (alert: AlertType, timer?: number) => { - set({ alert, animationClass: 'show-alert' }); - - const autoCloseTimer = timer ?? (alert.type === 'error' ? Infinity : 5000); - - if (autoCloseTimer !== Infinity) { - setTimeout(() => { - set({ animationClass: 'hide-alert', alert: undefined }); - }, autoCloseTimer); - } - }, - resetAlert: () => { - set({ alert: undefined }); - }, -})); diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/de-de.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/de-de.json index e2a9564b212..c81b4b2225b 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/de-de.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/de-de.json @@ -56,7 +56,6 @@ "aggregate": "Aggregate", "airflow-config-plural": "Airflow-Konfigurationen", "alert": "Warnung", - "alert-details": "Alert Details", "alert-lowercase": "warnung", "alert-lowercase-plural": "warnungen", "alert-plural": "Warnungen", 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 8d150c97f42..53c59fc4c68 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 @@ -56,7 +56,6 @@ "aggregate": "Aggregate", "airflow-config-plural": "airflow configs", "alert": "Alert", - "alert-details": "Alert Details", "alert-lowercase": "alert", "alert-lowercase-plural": "alerts", "alert-plural": "Alerts", diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/es-es.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/es-es.json index 399adb1786d..567ee4ea7d8 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/es-es.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/es-es.json @@ -56,7 +56,6 @@ "aggregate": "Agregar", "airflow-config-plural": "Configuraciones de airflow", "alert": "Alerta", - "alert-details": "Alert Details", "alert-lowercase": "alerta", "alert-lowercase-plural": "alertas", "alert-plural": "Alertas", diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/fr-fr.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/fr-fr.json index 6df0cd1ca7e..f2fb485ac79 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/fr-fr.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/fr-fr.json @@ -56,7 +56,6 @@ "aggregate": "Aggregate", "airflow-config-plural": "Configurations Airflow", "alert": "Alerte", - "alert-details": "Alert Details", "alert-lowercase": "alerte", "alert-lowercase-plural": "alertes", "alert-plural": "Alertes", diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/gl-es.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/gl-es.json index 2762cad96c0..b49ed88003a 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/gl-es.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/gl-es.json @@ -56,7 +56,6 @@ "aggregate": "Agrupar", "airflow-config-plural": "configuracións de Airflow", "alert": "Alerta", - "alert-details": "Alert Details", "alert-lowercase": "alerta", "alert-lowercase-plural": "alertas", "alert-plural": "Alertas", diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/he-he.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/he-he.json index 68169146c27..08bc17a4e53 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/he-he.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/he-he.json @@ -56,7 +56,6 @@ "aggregate": "כלול", "airflow-config-plural": "תצורות airflow", "alert": "התראה", - "alert-details": "Alert Details", "alert-lowercase": "התראה", "alert-lowercase-plural": "התראות", "alert-plural": "התראות", diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/ja-jp.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/ja-jp.json index 8d610313d94..8ad67d0b2b9 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/ja-jp.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/ja-jp.json @@ -56,7 +56,6 @@ "aggregate": "Aggregate", "airflow-config-plural": "Airflowの設定", "alert": "アラート", - "alert-details": "Alert Details", "alert-lowercase": "alert", "alert-lowercase-plural": "alerts", "alert-plural": "アラート", diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/nl-nl.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/nl-nl.json index 8ea7a551228..b62b391e819 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/nl-nl.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/nl-nl.json @@ -56,7 +56,6 @@ "aggregate": "Agregaat", "airflow-config-plural": "Airflowconfiguraties", "alert": "Alert", - "alert-details": "Alert Details", "alert-lowercase": "alert", "alert-lowercase-plural": "alerts", "alert-plural": "Alerts", diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/pr-pr.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/pr-pr.json index 1c1e47b9ec7..86cdfbc49cb 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/pr-pr.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/pr-pr.json @@ -56,7 +56,6 @@ "aggregate": "تجمیع", "airflow-config-plural": "پیکربندی‌های ایر‌فلو", "alert": "هشدار", - "alert-details": "Alert Details", "alert-lowercase": "هشدار", "alert-lowercase-plural": "هشدارها", "alert-plural": "هشدارها", diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-br.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-br.json index 4f42b5d45c7..ca8d538e259 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-br.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-br.json @@ -56,7 +56,6 @@ "aggregate": "Agregado", "airflow-config-plural": "configs do airflow", "alert": "Alerta", - "alert-details": "Alert Details", "alert-lowercase": "alerta", "alert-lowercase-plural": "alertas", "alert-plural": "Alertas", diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-pt.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-pt.json index ba4ba1eea95..943b762a3c4 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-pt.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/pt-pt.json @@ -56,7 +56,6 @@ "aggregate": "Agregado", "airflow-config-plural": "configs do airflow", "alert": "Alerta", - "alert-details": "Alert Details", "alert-lowercase": "alerta", "alert-lowercase-plural": "alertas", "alert-plural": "Alertas", diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/ru-ru.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/ru-ru.json index 29c89cd19c5..82cab0add59 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/ru-ru.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/ru-ru.json @@ -56,7 +56,6 @@ "aggregate": "Aggregate", "airflow-config-plural": "конфиги airflow", "alert": "Предупреждение", - "alert-details": "Alert Details", "alert-lowercase": "предупреждение", "alert-lowercase-plural": "предупреждения", "alert-plural": "Предупреждения", diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/th-th.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/th-th.json index a874fea3583..6950d92b1af 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/th-th.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/th-th.json @@ -56,7 +56,6 @@ "aggregate": "รวม", "airflow-config-plural": "การกำหนดค่าของ airflow", "alert": "การแจ้งเตือน", - "alert-details": "Alert Details", "alert-lowercase": "การแจ้งเตือน", "alert-lowercase-plural": "การแจ้งเตือนหลายอย่าง", "alert-plural": "การแจ้งเตือนหลายอย่าง", diff --git a/openmetadata-ui/src/main/resources/ui/src/locale/languages/zh-cn.json b/openmetadata-ui/src/main/resources/ui/src/locale/languages/zh-cn.json index 820c976160b..1e95d27866e 100644 --- a/openmetadata-ui/src/main/resources/ui/src/locale/languages/zh-cn.json +++ b/openmetadata-ui/src/main/resources/ui/src/locale/languages/zh-cn.json @@ -56,7 +56,6 @@ "aggregate": "聚合", "airflow-config-plural": "Airflow 配置", "alert": "提醒", - "alert-details": "Alert Details", "alert-lowercase": "提醒", "alert-lowercase-plural": "提醒", "alert-plural": "提醒", diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.test.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.test.tsx index 9212c33ff41..93fdfcb03fa 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.test.tsx @@ -43,15 +43,6 @@ jest.mock('react-router-dom', () => ({ }), })); -jest.mock('../../components/PageLayoutV1/PageLayoutV1', () => { - return jest.fn(({ children, pageTitle }) => ( -
-

{pageTitle}

-
{children}
-
- )); -}); - jest.mock('../../rest/observabilityAPI', () => ({ getObservabilityAlertByFQN: jest .fn() diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.tsx index 7790f10af80..835039f8563 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/AlertDetailsPage/AlertDetailsPage.tsx @@ -30,7 +30,6 @@ import { OwnerLabel } from '../../components/common/OwnerLabel/OwnerLabel.compon import ResizablePanels from '../../components/common/ResizablePanels/ResizablePanels'; import TitleBreadcrumb from '../../components/common/TitleBreadcrumb/TitleBreadcrumb.component'; import EntityHeaderTitle from '../../components/Entity/EntityHeaderTitle/EntityHeaderTitle.component'; -import PageLayoutV1 from '../../components/PageLayoutV1/PageLayoutV1'; import { ROUTES } from '../../constants/constants'; import { GlobalSettingsMenuCategory } from '../../constants/GlobalSettings.constants'; import { usePermissionProvider } from '../../context/PermissionProvider/PermissionProvider'; @@ -328,140 +327,136 @@ function AlertDetailsPage({ } return ( - - - ) : ( -
- - - - + + ) : ( +
+ + + + - - - - - - - - -
- {ownerLoading ? ( - - ) : ( - - )} - {extraInfo} -
- - - - - - {editPermission && - alertDetails?.provider !== ProviderType.System && ( - -
+ + + + + + {editPermission && + alertDetails?.provider !== ProviderType.System && ( + +
- ), - minWidth: 700, - flex: 0.7, - }} - pageTitle={t('label.entity-detail-plural', { - entity: t('label.alert'), - })} - secondPanel={{ - children: <>, - minWidth: 0, - className: 'content-resizable-panel-container', - }} - /> - + + + + + + + ), + minWidth: 700, + flex: 0.7, + }} + pageTitle={t('label.entity-detail-plural', { entity: t('label.alert') })} + secondPanel={{ + children: <>, + minWidth: 0, + className: 'content-resizable-panel-container', + }} + /> ); } diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/DataQuality/DataQualityPage.test.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/DataQuality/DataQualityPage.test.tsx index 318bc94530c..ce6f706cb07 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/DataQuality/DataQualityPage.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/DataQuality/DataQualityPage.test.tsx @@ -63,10 +63,6 @@ jest.mock('../../components/common/ResizablePanels/ResizableLeftPanels', () => { )); }); -jest.mock('../../components/PageLayoutV1/PageLayoutV1', () => { - return jest.fn().mockImplementation(({ children }) =>
{children}
); -}); - jest.mock('react-router-dom', () => { return { ...jest.requireActual('react-router-dom'), diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/DataQuality/DataQualityPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/DataQuality/DataQualityPage.tsx index 81134593936..40e5719231d 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/DataQuality/DataQualityPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/DataQuality/DataQualityPage.tsx @@ -24,7 +24,6 @@ import { import LeftPanelCard from '../../components/common/LeftPanelCard/LeftPanelCard'; import ResizableLeftPanels from '../../components/common/ResizablePanels/ResizableLeftPanels'; import TabsLabel from '../../components/common/TabsLabel/TabsLabel.component'; -import PageLayoutV1 from '../../components/PageLayoutV1/PageLayoutV1'; import { ROUTES } from '../../constants/constants'; import { getDataQualityPagePath } from '../../utils/RouterUtils'; import './data-quality-page.less'; @@ -69,78 +68,76 @@ const DataQualityPage = () => { }; return ( - - - - - ), - }} - pageTitle="Quality" - secondPanel={{ - children: ( - - - - - {t('label.data-quality')} - - - {t('message.page-sub-header-for-data-quality')} - - - - - {tabDetailsComponent.map((tab) => ( - - ))} + + + + ), + }} + pageTitle="Quality" + secondPanel={{ + children: ( + + + + + {t('label.data-quality')} + + + {t('message.page-sub-header-for-data-quality')} + + + + + {tabDetailsComponent.map((tab) => ( + + ))} - - - - - - - - ), - className: 'content-resizable-panel-container p-t-sm', - minWidth: 800, - flex: 0.87, - }} - /> - + + + + + + + + ), + className: 'content-resizable-panel-container p-t-sm', + minWidth: 800, + flex: 0.87, + }} + /> ); }; diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/Glossary/GlossaryPage/GlossaryPage.component.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/Glossary/GlossaryPage/GlossaryPage.component.tsx index a565feae5e9..2839a2b4727 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/Glossary/GlossaryPage/GlossaryPage.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/Glossary/GlossaryPage/GlossaryPage.component.tsx @@ -29,7 +29,6 @@ import { ModifiedGlossary, useGlossaryStore, } from '../../../components/Glossary/useGlossary.store'; -import PageLayoutV1 from '../../../components/PageLayoutV1/PageLayoutV1'; import { FQN_SEPARATOR_CHAR } from '../../../constants/char.constants'; import { PAGE_SIZE_LARGE, ROUTES } from '../../../constants/constants'; import { GLOSSARIES_DOCS } from '../../../constants/docs.constants'; @@ -349,6 +348,24 @@ const GlossaryPage = () => { return ; } + if (glossaries.length === 0 && !isLoading) { + return ( + + ); + } + const glossaryElement = (
{isRightPanelLoading ? ( @@ -416,27 +433,7 @@ const GlossaryPage = () => { /> ); - return ( - - {glossaries.length === 0 && !isLoading ? ( - - ) : ( - resizableLayout - )} - - ); + return <>{resizableLayout}; }; export default GlossaryPage; diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/Glossary/GlossaryPage/GlossaryPage.test.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/Glossary/GlossaryPage/GlossaryPage.test.tsx index b542c7cd88b..8c1b0f7e52f 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/Glossary/GlossaryPage/GlossaryPage.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/Glossary/GlossaryPage/GlossaryPage.test.tsx @@ -46,15 +46,6 @@ jest.mock('../../../context/PermissionProvider/PermissionProvider', () => { }; }); -jest.mock('../../../components/PageLayoutV1/PageLayoutV1', () => { - return jest.fn(({ children, pageTitle }) => ( -
-

{pageTitle}

-
{children}
-
- )); -}); - jest.mock('../../../components/Glossary/GlossaryV1.component', () => { return jest.fn().mockImplementation((props) => (
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/LineageConfigPage/LineageConfigPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/LineageConfigPage/LineageConfigPage.tsx index 8b65c053a9a..9eaca4e7bd7 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/LineageConfigPage/LineageConfigPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/LineageConfigPage/LineageConfigPage.tsx @@ -26,7 +26,6 @@ import ResizablePanels from '../../components/common/ResizablePanels/ResizablePa import ServiceDocPanel from '../../components/common/ServiceDocPanel/ServiceDocPanel'; import TitleBreadcrumb from '../../components/common/TitleBreadcrumb/TitleBreadcrumb.component'; import { TitleBreadcrumbProps } from '../../components/common/TitleBreadcrumb/TitleBreadcrumb.interface'; -import PageLayoutV1 from '../../components/PageLayoutV1/PageLayoutV1'; import { GlobalSettingsMenuCategory } from '../../constants/GlobalSettings.constants'; import { OPEN_METADATA } from '../../constants/service-guide.constant'; import { @@ -117,130 +116,128 @@ const LineageConfigPage = () => { } return ( - - - - - - + + + + + - - - {t('label.lineage')} - - - -
- - - + + + {t('label.lineage')} + + + + + + + - - - + + + - - - -
- - - - - - - - -
- ), - minWidth: 700, - flex: 0.7, - }} - pageTitle={t('label.lineage-config')} - secondPanel={{ - className: 'service-doc-panel content-resizable-panel-container', - minWidth: 400, - flex: 0.3, - children: ( - - ), - }} - /> - + + + + + + + + + + + + +
+ ), + minWidth: 700, + flex: 0.7, + }} + pageTitle={t('label.lineage-config')} + secondPanel={{ + className: 'service-doc-panel content-resizable-panel-container', + minWidth: 400, + flex: 0.3, + children: ( + + ), + }} + /> ); }; diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/Persona/PersonaListPage/PersonaPage.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/Persona/PersonaListPage/PersonaPage.tsx index 62bf50f8208..f9d90a85db9 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/Persona/PersonaListPage/PersonaPage.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/Persona/PersonaListPage/PersonaPage.tsx @@ -120,73 +120,75 @@ export const PersonaPage = () => { } }; + if (isEmpty(persona) && !isLoading) { + return ( + <> + {errorPlaceHolder} + {Boolean(addEditPersona) && ( + + )} + + ); + } + return ( - {isEmpty(persona) && !isLoading ? ( -
- {errorPlaceHolder} - {Boolean(addEditPersona) && ( - - )} -
- ) : ( - + + + + + + + + + + + + + + {isLoading + ? [1, 2, 3].map((key) => ( + + + + + + )) + : persona?.map((persona) => ( + + + + ))} + + {showPagination && ( - - - - - - - - - - - - {isLoading - ? [1, 2, 3].map((key) => ( - - - - - - )) - : persona?.map((persona) => ( - - - - ))} - - {showPagination && ( - - - - )} - {Boolean(addEditPersona) && ( - - )} - - )} + + )} + {Boolean(addEditPersona) && ( + + )} + ); }; diff --git a/openmetadata-ui/src/main/resources/ui/src/styles/layout/page-layout.less b/openmetadata-ui/src/main/resources/ui/src/styles/layout/page-layout.less index acd866f1333..4d2cea492ec 100644 --- a/openmetadata-ui/src/main/resources/ui/src/styles/layout/page-layout.less +++ b/openmetadata-ui/src/main/resources/ui/src/styles/layout/page-layout.less @@ -20,20 +20,6 @@ overflow-x: hidden; } -.alert-page-container { - position: relative; -} - -.page-content { - position: relative; - top: 0; - transition: top 1s ease-in-out; -} - -.page-content-shifted { - top: 64px; -} - .page-layout-v1-left-panel { border: @global-border; border-radius: @border-radius-base; diff --git a/openmetadata-ui/src/main/resources/ui/src/styles/variables.less b/openmetadata-ui/src/main/resources/ui/src/styles/variables.less index 211e4b10122..e1f685b0f90 100644 --- a/openmetadata-ui/src/main/resources/ui/src/styles/variables.less +++ b/openmetadata-ui/src/main/resources/ui/src/styles/variables.less @@ -110,10 +110,6 @@ @team-avatar-bg: #0950c51a; @om-navbar-height: ~'var(--ant-navbar-height)'; @sidebar-width: 60px; -@error-bg-color: rgb(from @error-color r g b / 0.1); -@success-bg-color: rgb(from @success-color r g b / 0.1); -@warning-bg-color: rgb(from @warning-color r g b / 0.1); -@info-bg-color: rgb(from @info-color r g b / 0.1); // Sizing @page-height: calc(100vh - @om-navbar-height); diff --git a/openmetadata-ui/src/main/resources/ui/src/utils/ToastUtils.ts b/openmetadata-ui/src/main/resources/ui/src/utils/ToastUtils.ts index 697072f5c49..38dddaffc89 100644 --- a/openmetadata-ui/src/main/resources/ui/src/utils/ToastUtils.ts +++ b/openmetadata-ui/src/main/resources/ui/src/utils/ToastUtils.ts @@ -11,53 +11,14 @@ * limitations under the License. */ -import { AlertProps } from 'antd'; import { AxiosError } from 'axios'; import { isEmpty, isString } from 'lodash'; import React from 'react'; -import { ReactComponent as ErrorIcon } from '../assets/svg/ic-error.svg'; -import { ReactComponent as InfoIcon } from '../assets/svg/ic-info-tag.svg'; -import { ReactComponent as SuccessIcon } from '../assets/svg/ic-success.svg'; -import { ReactComponent as WarningIcon } from '../assets/svg/ic-warning-tag.svg'; +import { toast } from 'react-toastify'; import { ClientErrors } from '../enums/Axios.enum'; -import { useAlertStore } from '../hooks/useAlertStore'; import i18n from './i18next/LocalUtil'; import { getErrorText } from './StringsUtils'; -export const getIconAndClassName = (type: AlertProps['type']) => { - switch (type) { - case 'info': - return { - icon: InfoIcon, - className: 'info', - }; - - case 'success': - return { - icon: SuccessIcon, - className: 'success', - }; - - case 'warning': - return { - icon: WarningIcon, - className: 'warning', - }; - - case 'error': - return { - icon: ErrorIcon, - className: 'error', - }; - - default: - return { - icon: null, - className: '', - }; - } -}; - export const hashCode = (str: string) => { let hash = 0, i, @@ -81,18 +42,15 @@ export const hashCode = (str: string) => { * @param autoCloseTimer Set the delay in ms to close the toast automatically. */ export const showErrorToast = ( - error: AxiosError | string | JSX.Element, + error: AxiosError | string, fallbackText?: string, autoCloseTimer?: number, - callback?: (value: React.SetStateAction) => void + callback?: (value: React.SetStateAction) => void ) => { - let errorMessage: string | JSX.Element; - - if (React.isValidElement(error)) { - errorMessage = error; - } else if (isString(error)) { + let errorMessage; + if (isString(error)) { errorMessage = error.toString(); - } else if ('config' in error && 'response' in error) { + } else { const method = error.config?.method?.toUpperCase(); const fallback = fallbackText && fallbackText.length > 0 @@ -111,15 +69,12 @@ export const showErrorToast = ( ) { return; } - } else { - errorMessage = fallbackText ?? i18n.t('server.unexpected-error'); } - callback && callback(errorMessage); - - useAlertStore - .getState() - .addAlert({ type: 'error', message: errorMessage }, autoCloseTimer); + toast.error(errorMessage, { + toastId: hashCode(errorMessage), + autoClose: autoCloseTimer, + }); }; /** @@ -128,9 +83,9 @@ export const showErrorToast = ( * @param autoCloseTimer Set the delay in ms to close the toast automatically. `Default: 5000` */ export const showSuccessToast = (message: string, autoCloseTimer = 5000) => { - useAlertStore - .getState() - .addAlert({ type: 'success', message }, autoCloseTimer); + toast.success(message, { + autoClose: autoCloseTimer, + }); }; /** @@ -139,5 +94,15 @@ export const showSuccessToast = (message: string, autoCloseTimer = 5000) => { * @param autoCloseTimer Set the delay in ms to close the toast automatically. `Default: 5000` */ export const showInfoToast = (message: string, autoCloseTimer = 5000) => { - useAlertStore.getState().addAlert({ type: 'info', message }, autoCloseTimer); + toast.info(message, { + autoClose: autoCloseTimer, + }); +}; + +/** + * Clear all the toast messages. + */ +export const clearAllToasts = () => { + toast.clearWaitingQueue(); + toast.dismiss(); }; diff --git a/openmetadata-ui/src/main/resources/ui/yarn.lock b/openmetadata-ui/src/main/resources/ui/yarn.lock index 72cabeb8203..e5fa09ef4c8 100644 --- a/openmetadata-ui/src/main/resources/ui/yarn.lock +++ b/openmetadata-ui/src/main/resources/ui/yarn.lock @@ -12481,6 +12481,13 @@ react-test-renderer@^16.14.0: react-is "^16.8.6" scheduler "^0.19.1" +react-toastify@^8.2.0: + version "8.2.0" + resolved "https://registry.yarnpkg.com/react-toastify/-/react-toastify-8.2.0.tgz#ef7d56bdfdc6272ca6b228368ab564721c3a3244" + integrity sha512-Pg2Ju7NngAamarFvLwqrFomJ57u/Ay6i6zfLurt/qPynWkAkOthu6vxfqYpJCyNhHRhR4hu7+bySSeWWJu6PAg== + dependencies: + clsx "^1.1.1" + react-transition-group@2.9.0: version "2.9.0" resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-2.9.0.tgz#df9cdb025796211151a436c69a8f3b97b5b07c8d"