Unit tests for observability and notification alert flow components (#…

…14953)

* add notification list page unit test

* observability alerts page unit tests

* observability utils unit tests

openmetadata-ui/src/main/resources/ui/src/pages/NotificationListPage/NotificationListPage.test.tsx

@@ -10,10 +10,11 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
-import { render } from '@testing-library/react';
+import { act, render, screen } from '@testing-library/react';
 import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import { ROUTES } from '../../constants/constants';
+import { getAllAlerts } from '../../rest/alertsAPI';
 import NotificationListPage from './NotificationListPage';
 
 const MOCK_DATA = [
@@ -55,6 +56,12 @@ jest.mock('../../rest/alertsAPI', () => ({
       paging: { total: 1 },
     })
   ),
+  getAlertsFromName: jest.fn().mockImplementation(() =>
+    Promise.resolve({
+      name: 'ActivityFeedAlert',
+      params: 'all',
+    })
+  ),
 }));
 
 jest.mock('../../utils/GlobalSettingsUtils', () => ({
@@ -77,28 +84,68 @@ jest.mock(
   }
 );
 
-describe('Alerts Page Tests', () => {
+describe('Notification Alerts Page Tests', () => {
   it('Title should be rendered', async () => {
-    const { findByText } = render(<NotificationListPage />, {
-      wrapper: MemoryRouter,
+    await act(async () => {
+      render(<NotificationListPage />, {
+        wrapper: MemoryRouter,
+      });
     });
 
-    expect(await findByText('label.notification-plural')).toBeInTheDocument();
+    expect(
+      await screen.findByText('label.notification-plural')
+    ).toBeInTheDocument();
   });
 
   it('SubTitle should be rendered', async () => {
-    const { findByText } = render(<NotificationListPage />, {
-      wrapper: MemoryRouter,
+    await act(async () => {
+      render(<NotificationListPage />, {
+        wrapper: MemoryRouter,
+      });
     });
 
-    expect(await findByText(/message.alerts-description/)).toBeInTheDocument();
+    expect(
+      await screen.findByText(/message.alerts-description/)
+    ).toBeInTheDocument();
   });
 
   it('Add alert button should be rendered', async () => {
-    const { findByText } = render(<NotificationListPage />, {
-      wrapper: MemoryRouter,
+    await act(async () => {
+      render(<NotificationListPage />, {
+        wrapper: MemoryRouter,
+      });
+    });
+
+    expect(await screen.findByText(/label.create-entity/)).toBeInTheDocument();
+  });
+
+  it('Table should render alerts data', async () => {
+    await act(async () => {
+      render(<NotificationListPage />, {
+        wrapper: MemoryRouter,
+      });
     });
 
-    expect(await findByText(/label.create-entity/)).toBeInTheDocument();
+    const alertNameElement = await screen.findByTestId('alert-name');
+
+    expect(alertNameElement).toBeInTheDocument();
+  });
+
+  it('Table should render no data', async () => {
+    (getAllAlerts as jest.Mock).mockImplementation(() =>
+      Promise.resolve({
+        data: [],
+        paging: { total: 1 },
+      })
+    );
+    await act(async () => {
+      render(<NotificationListPage />, {
+        wrapper: MemoryRouter,
+      });
+    });
+
+    const alertNameElement = await screen.findByText('label.no-entity');
+
+    expect(alertNameElement).toBeInTheDocument();
   });
 });

openmetadata-ui/src/main/resources/ui/src/pages/ObservabilityAlertsPage/ObservabilityAlertsPage.test.tsx

@@ -10,9 +10,10 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
-import { render } from '@testing-library/react';
+import { act, render, screen } from '@testing-library/react';
 import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
+import { getAllAlerts } from '../../rest/alertsAPI';
 import ObservabilityAlertsPage from './ObservabilityAlertsPage';
 
 const MOCK_DATA = [
@@ -55,29 +56,72 @@ jest.mock('../../rest/alertsAPI', () => ({
     })
   ),
 }));
+jest.mock('../../components/PageLayoutV1/PageLayoutV1', () => {
+  return jest.fn().mockImplementation(({ children }) => <div>{children}</div>);
+});
 
-describe.skip('Alerts Page Tests', () => {
+describe('Observability Alerts Page Tests', () => {
   it('Title should be rendered', async () => {
-    const { findByText } = render(<ObservabilityAlertsPage />, {
-      wrapper: MemoryRouter,
+    await act(async () => {
+      render(<ObservabilityAlertsPage />, {
+        wrapper: MemoryRouter,
+      });
     });
 
-    expect(await findByText('label.alert-plural')).toBeInTheDocument();
+    expect(await screen.findByText('label.observability')).toBeInTheDocument();
   });
 
   it('SubTitle should be rendered', async () => {
-    const { findByText } = render(<ObservabilityAlertsPage />, {
-      wrapper: MemoryRouter,
+    await act(async () => {
+      render(<ObservabilityAlertsPage />, {
+        wrapper: MemoryRouter,
+      });
     });
 
-    expect(await findByText(/message.alerts-description/)).toBeInTheDocument();
+    expect(
+      await screen.findByText(/message.alerts-description/)
+    ).toBeInTheDocument();
   });
 
   it('Add alert button should be rendered', async () => {
-    const { findByText } = render(<ObservabilityAlertsPage />, {
-      wrapper: MemoryRouter,
+    await act(async () => {
+      render(<ObservabilityAlertsPage />, {
+        wrapper: MemoryRouter,
+      });
+    });
+
+    expect(await screen.findByText(/label.create-entity/)).toBeInTheDocument();
+  });
+
+  it('Table should render alerts data', async () => {
+    await act(async () => {
+      render(<ObservabilityAlertsPage />, {
+        wrapper: MemoryRouter,
+      });
     });
 
-    expect(await findByText(/label.create-entity/)).toBeInTheDocument();
+    const alertNameElement = await screen.findByText('alert-test');
+
+    expect(alertNameElement).toBeInTheDocument();
+  });
+
+  it('Table should render no data', async () => {
+    (getAllAlerts as jest.Mock).mockImplementation(() =>
+      Promise.resolve({
+        data: [],
+        paging: { total: 1 },
+      })
+    );
+    await act(async () => {
+      render(<ObservabilityAlertsPage />, {
+        wrapper: MemoryRouter,
+      });
+    });
+
+    const alertNameElement = await screen.findByText(
+      'message.adding-new-entity-is-easy-just-give-it-a-spin'
+    );
+
+    expect(alertNameElement).toBeInTheDocument();
   });
 });

openmetadata-ui/src/main/resources/ui/src/utils/ObservabilityUtils.test.ts

@@ -0,0 +1,90 @@
+/*
+ *  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 { SubscriptionCategory } from '../generated/events/eventSubscription';
+import {
+  checkIfDestinationIsInternal,
+  getAlertDestinationCategoryIcons,
+  getConfigFieldFromDestinationType,
+} from './ObservabilityUtils';
+
+describe('Observability Utils test', () => {
+  describe('getAlertDestinationCategoryIcons', () => {
+    it('should return the correct icon for each type', () => {
+      const types = [
+        'Teams',
+        'Users',
+        'Admins',
+        'GChat',
+        'Slack',
+        'Email',
+        'MsTeams',
+        'Followers',
+        'Generic',
+        'Owners',
+      ];
+      types.forEach((type) => {
+        const icon = getAlertDestinationCategoryIcons(type);
+
+        expect(icon).not.toBeNull();
+      });
+    });
+
+    it('should return null for an unknown type', () => {
+      const icon = getAlertDestinationCategoryIcons('Unknown');
+
+      expect(icon).toBeNull();
+    });
+  });
+
+  describe('checkIfDestinationIsInternal', () => {
+    it('should return true for internal destinations', () => {
+      const destinationName = SubscriptionCategory.Admins;
+      const result = checkIfDestinationIsInternal(destinationName);
+
+      expect(result).toBe(true);
+    });
+
+    it('should return false for external destinations', () => {
+      const destinationName = 'Test';
+      const result = checkIfDestinationIsInternal(destinationName);
+
+      expect(result).toBe(false);
+    });
+  });
+
+  describe('getConfigFieldFromDestinationType', () => {
+    it('should return the correct config field for each type', () => {
+      const types = [
+        SubscriptionCategory.Admins,
+        SubscriptionCategory.Owners,
+        SubscriptionCategory.Followers,
+      ];
+      const expectedResults = [
+        'sendToAdmins',
+        'sendToOwners',
+        'sendToFollowers',
+      ];
+      types.forEach((type, index) => {
+        const result = getConfigFieldFromDestinationType(type);
+
+        expect(result).toBe(expectedResults[index]);
+      });
+    });
+
+    it('should return an empty string for an unknown type', () => {
+      const result = getConfigFieldFromDestinationType('Unknown');
+
+      expect(result).toBe('');
+    });
+  });
+});