Add alert bar component

openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/ActivityFeed.spec.ts

@@ -204,13 +204,13 @@ test.describe('Activity feed', () => {
 
     await page.getByText('Accept Suggestion').click();
 
-    await toastNotification(page, /Task resolved successfully/);
+    await toastNotification(page, /Task resolved successfully/, 'success');
 
     // Task 1 - Request to update tag to be resolved
 
     await page.getByText('Accept Suggestion').click();
 
-    await toastNotification(page, /Task resolved successfully/);
+    await toastNotification(page, /Task resolved successfully/, 'success');
 
     await checkTaskCount(page, 0, 2);
   });
@@ -363,13 +363,13 @@ test.describe('Activity feed', () => {
     await page.getByText('OK').click();
     await resolveTask;
 
-    await toastNotification(page, /Task resolved successfully/);
+    await toastNotification(page, /Task resolved successfully/, 'success');
 
     // Task 1 - Resolved the task
 
     await page.getByText('Accept Suggestion').click();
 
-    await toastNotification(page, /Task resolved successfully/);
+    await toastNotification(page, /Task resolved successfully/, 'success');
 
     await checkTaskCount(page, 0, 2);
   });
@@ -412,7 +412,11 @@ test.describe('Activity feed', () => {
 
     await page.getByRole('menuitem', { name: 'close' }).click();
 
-    await toastNotification(page, 'Task cannot be closed without a comment.');
+    await toastNotification(
+      page,
+      'Task cannot be closed without a comment.',
+      'warning'
+    );
 
     // Close the task from the Button.Group, with comment is added.
     await page.fill(
@@ -429,7 +433,7 @@ test.describe('Activity feed', () => {
     await page.getByRole('menuitem', { name: 'close' }).click();
     await commentWithCloseTask;
 
-    await toastNotification(page, 'Task closed successfully.');
+    await toastNotification(page, 'Task closed successfully.', 'success');
 
     await checkTaskCount(page, 0, 1);
   });
@@ -481,7 +485,7 @@ test.describe('Activity feed', () => {
     await page.getByRole('menuitem', { name: 'close' }).click();
     await commentWithCloseTask;
 
-    await toastNotification(page, 'Task closed successfully.');
+    await toastNotification(page, 'Task closed successfully.', 'success');
     // open task count after closing one task
     await checkTaskCount(page, 1, 1);
 
@@ -671,7 +675,8 @@ 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.'
+        'An exception with message [Cannot invoke "java.util.List.stream()" because "owners" is null] was thrown while processing request.',
+        'error'
       );
 
       // TODO: Ashish - Enable them once issue is resolved from Backend https://github.com/open-metadata/OpenMetadata/issues/17059
@@ -737,7 +742,7 @@ base.describe('Activity feed with Data Consumer User', () => {
 
       await page2.getByText('Accept Suggestion').click();
 
-      await toastNotification(page2, /Task resolved successfully/);
+      await toastNotification(page2, /Task resolved successfully/, 'success');
 
       await page2.waitForLoadState('networkidle');
 
@@ -884,7 +889,7 @@ base.describe('Activity feed with Data Consumer User', () => {
 
         await page2.getByText('OK').click();
 
-        await toastNotification(page2, /Task resolved successfully/);
+        await toastNotification(page2, /Task resolved successfully/, 'success');
 
         // Accept the description task
 
@@ -906,7 +911,7 @@ base.describe('Activity feed with Data Consumer User', () => {
 
         await page2.getByText('OK').click();
 
-        await toastNotification(page2, /Task resolved successfully/);
+        await toastNotification(page2, /Task resolved successfully/, 'success');
 
         await afterActionUser2();
       }
@@ -980,7 +985,8 @@ 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`
+              `Principal: CatalogPrincipal{name='${viewAllUser.responseData.name}'} operation EditDescription denied by role ${viewAllRoles.responseData.name}, policy ${viewAllPolicy.responseData.name}, rule editNotAllowed`,
+              'error'
             );
 
             await afterActionUser2();

openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/TeamsDragAndDrop.spec.ts

@@ -118,7 +118,8 @@ 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`
+        `You cannot move to this team as Team Type ${TEAM_TYPE_BY_NAME[team]} can't be Group children`,
+        'error'
       );
     }
   });
@@ -132,7 +133,8 @@ 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`
+        `You cannot move to this team as Team Type ${TEAM_TYPE_BY_NAME[team]} can't be Department children`,
+        'error'
       );
     }
   });
@@ -143,7 +145,8 @@ 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"
+      "You cannot move to this team as Team Type BusinessUnit can't be Division children",
+      'error'
     );
   });
 

openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/TeamsHierarchy.spec.ts

@@ -139,7 +139,8 @@ test.describe('Add Nested Teams and Test TeamsSelectable', () => {
 
     await toastNotification(
       page,
-      `"${businessTeamName}" deleted successfully!`
+      `"${businessTeamName}" deleted successfully!`,
+      'success'
     );
   });
 });

openmetadata-ui/src/main/resources/ui/playwright/e2e/Flow/ApiServiceRest.spec.ts

@@ -12,7 +12,12 @@
  */
 import { expect, test } from '@playwright/test';
 import { GlobalSettingOptions } from '../../constant/settings';
-import { descriptionBox, redirectToHomePage, uuid } from '../../utils/common';
+import {
+  descriptionBox,
+  redirectToHomePage,
+  toastNotification,
+  uuid,
+} from '../../utils/common';
 import { settingClick } from '../../utils/sidebar';
 
 const apiServiceConfig = {
@@ -89,10 +94,6 @@ test.describe('API service', () => {
 
     await deleteResponse;
 
-    await expect(page.locator('.Toastify__toast-body')).toHaveText(
-      /deleted successfully!/
-    );
-
-    await page.click('.Toastify__close-button');
+    await toastNotification(page, /deleted successfully!/, 'success');
   });
 });

openmetadata-ui/src/main/resources/ui/playwright/e2e/Flow/CustomizeLandingPage.spec.ts

@@ -14,7 +14,7 @@ import { expect, Page, test as base } from '@playwright/test';
 import { PersonaClass } from '../../support/persona/PersonaClass';
 import { UserClass } from '../../support/user/UserClass';
 import { performAdminLogin } from '../../utils/admin';
-import { redirectToHomePage } from '../../utils/common';
+import { redirectToHomePage, toastNotification } from '../../utils/common';
 import {
   checkAllDefaultWidgets,
   navigateToCustomizeLandingPage,
@@ -239,10 +239,10 @@ test.describe('Customize Landing Page Flow', () => {
           .click();
 
         // Verify the toast notification
-        const toastNotification = adminPage.locator('.Toastify__toast-body');
-
-        await expect(toastNotification).toContainText(
-          'Page layout updated successfully.'
+        await toastNotification(
+          adminPage,
+          'Page layout updated successfully.',
+          'success'
         );
 
         // Check if all widgets are present after resetting the layout

openmetadata-ui/src/main/resources/ui/playwright/e2e/Flow/PersonaFlow.spec.ts

@@ -250,7 +250,8 @@ test.describe.serial('Persona operations', () => {
 
     await toastNotification(
       page,
-      `"${PERSONA_DETAILS.displayName}" deleted successfully!`
+      `"${PERSONA_DETAILS.displayName}" deleted successfully!`,
+      'success'
     );
   });
 });

openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/DataInsightReportApplication.spec.ts

@@ -65,7 +65,11 @@ test.describe.serial('Data Insight Report Application', () => {
     await page.click('[data-value="5"]');
     await page.click('[data-testid="deploy-button"]');
 
-    await toastNotification(page, 'Application installed successfully');
+    await toastNotification(
+      page,
+      'Application installed successfully',
+      'success'
+    );
 
     await expect(
       page.locator('[data-testid="data-insights-report-application-card"]')
@@ -83,7 +87,7 @@ test.describe.serial('Data Insight Report Application', () => {
     await page.click('[data-testid="hour-options"]');
     await page.click('[title="01"]');
     await page.click('.ant-modal-body [data-testid="deploy-button"]');
-    await toastNotification(page, 'Schedule saved successfully');
+    await toastNotification(page, 'Schedule saved successfully', 'success');
 
     // Validate update config in the application
     await expect(page.locator('[data-testid="cron-string"]')).toContainText(
@@ -95,7 +99,11 @@ test.describe.serial('Data Insight Report Application', () => {
     await page.click('#root\\/sendToTeams');
     await page.click('[data-testid="submit-btn"]');
 
-    await toastNotification(page, 'Configuration saved successfully');
+    await toastNotification(
+      page,
+      'Configuration saved successfully',
+      'success'
+    );
 
     // Validate update config in the application
 
@@ -109,7 +117,11 @@ test.describe.serial('Data Insight Report Application', () => {
     );
 
     await page.click('[data-testid="run-now-button"]');
-    await toastNotification(page, 'Application triggered successfully');
+    await toastNotification(
+      page,
+      'Application triggered successfully',
+      'success'
+    );
 
     const { apiContext } = await getApiContext(page);
 
@@ -149,7 +161,11 @@ test.describe.serial('Data Insight Report Application', () => {
     await page.click('[data-testid="uninstall-button-title"]');
     await page.click('[data-testid="save-button"]');
 
-    await toastNotification(page, 'Application uninstalled successfully');
+    await toastNotification(
+      page,
+      'Application uninstalled successfully',
+      'success'
+    );
 
     await expect(
       page.locator('[data-testid="data-insights-report-application-card"]')

openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/DataInsightSettings.spec.ts

@@ -72,7 +72,7 @@ test.describe.serial(
       // Click on deploy button
       await page.click('.ant-modal-body [data-testid="deploy-button"]');
 
-      await toastNotification(page, 'Schedule saved successfully');
+      await toastNotification(page, 'Schedule saved successfully', 'success');
 
       // Verify cron string
       await expect(page.locator('[data-testid="cron-string"]')).toContainText(
@@ -101,7 +101,11 @@ test.describe.serial(
       // Click on the save button
       await page.click('[data-testid="save-button"]');
 
-      await toastNotification(page, 'Application uninstalled successfully');
+      await toastNotification(
+        page,
+        'Application uninstalled successfully',
+        'success'
+      );
 
       await expect(
         page.locator('[data-testid="data-insights-application-card"]')
@@ -215,4 +219,4 @@ test.describe.serial(
       });
     }
   }
-);
+);

openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/DataQualityAndProfiler.spec.ts

@@ -148,7 +148,7 @@ test('Table test case', PLAYWRIGHT_INGESTION_TAG_OBJ, async ({ page }) => {
     );
     await page.locator('button').filter({ hasText: 'Submit' }).click();
     await updateTestCaseResponse;
-    await toastNotification(page, 'Test case updated successfully.');
+    await toastNotification(page, 'Test case updated successfully.', 'success');
     await page.click(`[data-testid="edit-${NEW_TABLE_TEST_CASE.name}"]`);
 
     await page.waitForSelector('#tableTestForm_params_columnName');
@@ -232,7 +232,7 @@ test('Column test case', PLAYWRIGHT_INGESTION_TAG_OBJ, async ({ page }) => {
     );
     await page.locator('button').getByText('Submit').click();
     await updateTestCaseResponse;
-    await toastNotification(page, 'Test case updated successfully.');
+    await toastNotification(page, 'Test case updated successfully.', 'success');
 
     await page.click(`[data-testid="edit-${NEW_COLUMN_TEST_CASE.name}"]`);
     await page.waitForSelector('#tableTestForm_params_minLength');
@@ -464,7 +464,11 @@ test(
         await page.locator('#tableTestForm_displayName').clear();
         await page.fill('#tableTestForm_displayName', 'Updated display name');
         await page.click('.ant-modal-footer >> text=Submit');
-        await toastNotification(page, 'Test case updated successfully.');
+        await toastNotification(
+          page,
+          'Test case updated successfully.',
+          'success'
+        );
 
         await expect(
           page.locator(`[data-testid="${testCaseName}"]`)

openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Glossary.spec.ts

@@ -351,7 +351,8 @@ test.describe('Glossary tests', () => {
 
         await toastNotification(
           page,
-          /mutually exclusive and can't be assigned together/
+          /mutually exclusive and can't be assigned together/,
+          'error'
         );
 
         // Add non mutually exclusive tags

openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/LoginConfiguration.spec.ts

@@ -68,7 +68,11 @@ test.describe('Login configuration', () => {
     // Click the save button
     await page.click('[data-testid="save-button"]');
 
-    await toastNotification(page, 'Login Configuration updated successfully.');
+    await toastNotification(
+      page,
+      'Login Configuration updated successfully.',
+      'success'
+    );
 
     // Assert the updated values
     await expect(

openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Policies.spec.ts

@@ -25,7 +25,11 @@ import {
   UPDATED_RULE_NAME,
 } from '../../constant/permission';
 import { GlobalSettingOptions } from '../../constant/settings';
-import { descriptionBox, redirectToHomePage } from '../../utils/common';
+import {
+  descriptionBox,
+  redirectToHomePage,
+  toastNotification,
+} from '../../utils/common';
 import { validateFormNameFieldInput } from '../../utils/form';
 import { settingClick } from '../../utils/sidebar';
 
@@ -258,8 +262,10 @@ test.describe('Policy page should work properly', () => {
       await page.locator('[data-testid="delete-rule"]').click();
 
       // Validate the error message
-      await expect(page.locator('.Toastify__toast-body')).toContainText(
-        ERROR_MESSAGE_VALIDATION.lastRuleCannotBeRemoved
+      await toastNotification(
+        page,
+        ERROR_MESSAGE_VALIDATION.lastRuleCannotBeRemoved,
+        'error'
       );
     });