fix: refactor notifications unit tests

app/components/Views/Settings/NotificationsSettings/__snapshots__/index.test.tsx.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`NotificationsSettings should render correctly 1`] = `
+exports[`NotificationsSettings render matches snapshot 1`] = `
 <RCTScrollView
   style={
     {

app/components/Views/Settings/NotificationsSettings/index.test.tsx

@@ -1,18 +1,11 @@
-import React, { useCallback }  from 'react';
-import { renderHook, act } from '@testing-library/react-hooks';
-
+import React from 'react';
 import renderWithProvider from '../../../../util/test/renderWithProvider';
-import NotificationsService from '../../../../util/notifications/services/NotificationService';
 import { backgroundState } from '../../../../util/test/initial-root-state';
 import NotificationsSettings from '.';
-
-import Routes from '../../../../constants/navigation/Routes';
 import { Props } from './NotificationsSettings.types';
 import { MOCK_ACCOUNTS_CONTROLLER_STATE } from '../../../../util/test/accountsControllerTestUtils';
-import { MetaMetricsEvents } from '../../../../core/Analytics/MetaMetrics.events';
-import { NavigationProp, ParamListBase } from '@react-navigation/native';
 
-// Mock store.getState
+
 let mockGetState: jest.Mock;
 jest.mock('../../../../store', () => {
   mockGetState = jest.fn();
@@ -57,130 +50,10 @@ jest.mock('../../../../util/notifications/services/NotificationService', () => (
   getAllPermissions: jest.fn(),
 }));
 
-jest.mock('../../../../core/Analytics/MetaMetrics.events', () => ({
-  MetaMetricsEvents: {
-    NOTIFICATIONS_SETTINGS_UPDATED: 'NOTIFICATIONS_SETTINGS_UPDATED',
-  },
-}));
-
-const mockDisableNotifications = jest.fn();
-const mockEnableNotifications = jest.fn();
-const mockSetUiNotificationStatus = jest.fn();
-const mockTrackEvent = jest.fn();
-
-const mockNavigation = {
-  navigate: jest.fn(),
-} as unknown as NavigationProp<ParamListBase>;
-
 const setOptions = jest.fn();
 
-describe('toggleNotificationsEnabled', () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  const setup = (basicFunctionalityEnabled: boolean, isMetamaskNotificationsEnabled: boolean, isProfileSyncingEnabled: boolean) => renderHook(() =>
-      useCallback(async () => {
-        if (!basicFunctionalityEnabled) {
-          mockNavigation.navigate(Routes.MODAL.ROOT_MODAL_FLOW, {
-            screen: Routes.SHEET.BASIC_FUNCTIONALITY,
-            params: {
-              caller: Routes.SETTINGS.NOTIFICATIONS,
-            },
-          });
-        } else if (isMetamaskNotificationsEnabled) {
-          mockDisableNotifications();
-          mockSetUiNotificationStatus(false);
-        } else {
-          const { permission } = await NotificationsService.getAllPermissions(false);
-          if (permission !== 'authorized') {
-            return;
-          }
-
-          mockEnableNotifications();
-          mockSetUiNotificationStatus(true);
-        }
-        mockTrackEvent(MetaMetricsEvents.NOTIFICATIONS_SETTINGS_UPDATED, {
-          settings_type: 'notifications',
-          old_value: isMetamaskNotificationsEnabled,
-          new_value: !isMetamaskNotificationsEnabled,
-          was_profile_syncing_on: isMetamaskNotificationsEnabled ? true : isProfileSyncingEnabled,
-        });
-      }, [])
-    );
-
-  it('should navigate to basic functionality screen if basicFunctionalityEnabled is false', async () => {
-    const { result } = setup(false, false, false);
-
-    await act(async () => {
-      await result.current();
-    });
-
-    expect(mockNavigation.navigate).toHaveBeenCalledWith(Routes.MODAL.ROOT_MODAL_FLOW, {
-      screen: Routes.SHEET.BASIC_FUNCTIONALITY,
-      params: {
-        caller: Routes.SETTINGS.NOTIFICATIONS,
-      },
-    });
-  });
-
-  it('should disable notifications if isMetamaskNotificationsEnabled is true', async () => {
-    const { result } = setup(true, true, false);
-
-    await act(async () => {
-      await result.current();
-    });
-
-    expect(mockDisableNotifications).toHaveBeenCalled();
-    expect(mockSetUiNotificationStatus).toHaveBeenCalledWith(false);
-  });
-
-  it('should enable notifications if isMetamaskNotificationsEnabled is false and permission is authorized', async () => {
-    (NotificationsService.getAllPermissions as jest.Mock).mockResolvedValue({ permission: 'authorized' });
-
-    const { result } = setup(true, false, false);
-
-    await act(async () => {
-      await result.current();
-    });
-
-    expect(mockEnableNotifications).toHaveBeenCalled();
-    expect(mockSetUiNotificationStatus).toHaveBeenCalledWith(true);
-  });
-
-  it('should not enable notifications if permission is not authorized', async () => {
-    (NotificationsService.getAllPermissions as jest.Mock).mockResolvedValue({ permission: 'denied' });
-
-    const { result } = setup(true, false, false);
-
-    await act(async () => {
-      await result.current();
-    });
-
-    expect(mockEnableNotifications).not.toHaveBeenCalled();
-    expect(mockSetUiNotificationStatus).not.toHaveBeenCalled();
-  });
-
-  it('should track event when notifications settings are updated', async () => {
-    (NotificationsService.getAllPermissions as jest.Mock).mockResolvedValue({ permission: 'authorized' });
-
-    const { result } = setup(true, false, true);
-
-    await act(async () => {
-      await result.current();
-    });
-
-    expect(mockTrackEvent).toHaveBeenCalledWith(MetaMetricsEvents.NOTIFICATIONS_SETTINGS_UPDATED, {
-      settings_type: 'notifications',
-      old_value: false,
-      new_value: true,
-      was_profile_syncing_on: true,
-    });
-  });
-});
-
 describe('NotificationsSettings', () => {
-  it('should render correctly', () => {
+  it('render matches snapshot', () => {
     mockGetState.mockImplementation(() => ({
       notifications: {},
     }));
@@ -199,21 +72,4 @@ describe('NotificationsSettings', () => {
     );
     expect(toJSON()).toMatchSnapshot();
   });
-
-  it('should toggle notifications and handle permission correctly', async () => {
-    const isMetamaskNotificationsEnabled = true;
-    const basicFunctionalityEnabled = true;
-    const isProfileSyncingEnabled = true;
-
-    const toggleNotificationsEnabledImpl = jest.fn(() => Promise.resolve({
-      isMetamaskNotificationsEnabled,
-      basicFunctionalityEnabled,
-      isProfileSyncingEnabled,
-    }));
-
-    await toggleNotificationsEnabledImpl();
-
-    expect(NotificationsService.getAllPermissions).toHaveBeenCalledTimes(1);
-    expect(NotificationsService.getAllPermissions).toHaveBeenCalledWith(false);
-  });
 });

app/components/Views/Settings/NotificationsSettings/index.tsx

@@ -31,7 +31,6 @@ import {
   selectIsProfileSyncingEnabled,
 } from '../../../../selectors/notifications';
 
-import NotificationsService from '../../../../util/notifications/services/NotificationService';
 import Routes from '../../../../constants/navigation/Routes';
 
 import ButtonIcon, {
@@ -57,6 +56,7 @@ import AppConstants from '../../../../core/AppConstants';
 import notificationsRows from './notificationsRows';
 import { IconName } from '../../../../component-library/components/Icons/Icon';
 import { MetaMetricsEvents } from '../../../../core/Analytics/MetaMetrics.events';
+import { useToggleNotifications } from './useToggleNotifications';
 
 interface MainNotificationSettingsProps extends Props {
   toggleNotificationsEnabled: () => void;
@@ -109,6 +109,7 @@ const NotificationsSettings = ({ navigation, route }: Props) => {
   const { accounts } = useAccounts();
   const { trackEvent } = useMetrics();
   const theme = useTheme();
+
   const isMetamaskNotificationsEnabled = useSelector(
     selectIsMetamaskNotificationsEnabled,
   );
@@ -177,42 +178,15 @@ const NotificationsSettings = ({ navigation, route }: Props) => {
    * it will request the push notifications permission and enable the notifications
    * if the permission is granted.
    */
-  const toggleNotificationsEnabled = useCallback(async () => {
-    if (!basicFunctionalityEnabled) {
-      navigation.navigate(Routes.MODAL.ROOT_MODAL_FLOW, {
-        screen: Routes.SHEET.BASIC_FUNCTIONALITY,
-        params: {
-          caller: Routes.SETTINGS.NOTIFICATIONS,
-        },
-      });
-    } else if (isMetamaskNotificationsEnabled) {
-      disableNotifications();
-      setUiNotificationStatus(false);
-    } else {
-      const { permission } = await NotificationsService.getAllPermissions(false);
-      if (permission !== 'authorized') {
-        return;
-      }
-        enableNotifications();
-        setUiNotificationStatus(true);
-    }
-    trackEvent(MetaMetricsEvents.NOTIFICATIONS_SETTINGS_UPDATED, {
-      settings_type: 'notifications',
-      old_value: isMetamaskNotificationsEnabled,
-      new_value: !isMetamaskNotificationsEnabled,
-      was_profile_syncing_on: isMetamaskNotificationsEnabled
-        ? true
-        : isProfileSyncingEnabled,
-    });
-  }, [
+  const { toggleNotificationsEnabled } = useToggleNotifications({
+    navigation,
     basicFunctionalityEnabled,
-    disableNotifications,
-    enableNotifications,
     isMetamaskNotificationsEnabled,
-    navigation,
-    trackEvent,
     isProfileSyncingEnabled,
-  ]);
+    disableNotifications,
+    enableNotifications,
+    setUiNotificationStatus,
+  });
 
   const toggleCustomNotificationsEnabled = useCallback(async () => {
     setPlatformAnnouncementsState(!platformAnnouncementsState);

app/components/Views/Settings/NotificationsSettings/useToggleNotifications.test.tsx

@@ -0,0 +1,125 @@
+import { renderHook, act } from '@testing-library/react-hooks';
+import { useToggleNotifications } from './useToggleNotifications';
+import NotificationsService from '../../../../util/notifications/services/NotificationService';
+import Routes from '../../../../constants/navigation/Routes';
+import { NavigationProp, ParamListBase } from '@react-navigation/native';
+
+jest.mock(
+  '../../../../util/notifications/services/NotificationService',
+  () => ({
+    getAllPermissions: jest.fn(),
+  }),
+);
+
+const mockNavigation = {
+  navigate: jest.fn(),
+} as unknown as NavigationProp<ParamListBase>;
+
+const mockDisableNotifications = jest.fn();
+const mockEnableNotifications = jest.fn();
+const mockSetUiNotificationStatus = jest.fn();
+
+describe('useToggleNotifications', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('navigates to basic functionality screen if basic functionality is disabled', async () => {
+    const { result } = renderHook(() =>
+      useToggleNotifications({
+        navigation: mockNavigation,
+        basicFunctionalityEnabled: false,
+        isMetamaskNotificationsEnabled: false,
+        isProfileSyncingEnabled: false,
+        disableNotifications: mockDisableNotifications,
+        enableNotifications: mockEnableNotifications,
+        setUiNotificationStatus: mockSetUiNotificationStatus,
+      }),
+    );
+
+    await act(async () => {
+      await result.current.toggleNotificationsEnabled();
+    });
+
+    expect(mockNavigation.navigate).toHaveBeenCalledWith(
+      Routes.MODAL.ROOT_MODAL_FLOW,
+      {
+        screen: Routes.SHEET.BASIC_FUNCTIONALITY,
+        params: {
+          caller: Routes.SETTINGS.NOTIFICATIONS,
+        },
+      },
+    );
+  });
+
+  it('switches notifications OFF if notifications previously enabled', async () => {
+    const { result } = renderHook(() =>
+      useToggleNotifications({
+        navigation: mockNavigation,
+        basicFunctionalityEnabled: true,
+        isMetamaskNotificationsEnabled: true,
+        isProfileSyncingEnabled: false,
+        disableNotifications: mockDisableNotifications,
+        enableNotifications: mockEnableNotifications,
+        setUiNotificationStatus: mockSetUiNotificationStatus,
+      }),
+    );
+
+    await act(async () => {
+      await result.current.toggleNotificationsEnabled();
+    });
+
+    expect(mockDisableNotifications).toHaveBeenCalled();
+    expect(mockSetUiNotificationStatus).toHaveBeenCalledWith(false);
+  });
+
+  it('switches notifications ON if notifications previously disabled and permission is authorized', async () => {
+    (NotificationsService.getAllPermissions as jest.Mock).mockResolvedValue({
+      permission: 'authorized',
+    });
+
+    const { result } = renderHook(() =>
+      useToggleNotifications({
+        navigation: mockNavigation,
+        basicFunctionalityEnabled: true,
+        isMetamaskNotificationsEnabled: false,
+        isProfileSyncingEnabled: false,
+        disableNotifications: mockDisableNotifications,
+        enableNotifications: mockEnableNotifications,
+        setUiNotificationStatus: mockSetUiNotificationStatus,
+      }),
+    );
+
+    await act(async () => {
+      await result.current.toggleNotificationsEnabled();
+    });
+
+    expect(mockEnableNotifications).toHaveBeenCalled();
+    expect(mockSetUiNotificationStatus).toHaveBeenCalledWith(true);
+  });
+
+  it('switches notifications OFF if device permission is not authorized', async () => {
+    (NotificationsService.getAllPermissions as jest.Mock).mockResolvedValue({
+      permission: 'denied',
+    });
+
+    const { result } = renderHook(() =>
+      useToggleNotifications({
+        navigation: mockNavigation,
+        basicFunctionalityEnabled: true,
+        isMetamaskNotificationsEnabled: false,
+        isProfileSyncingEnabled: false,
+        disableNotifications: mockDisableNotifications,
+        enableNotifications: mockEnableNotifications,
+        setUiNotificationStatus: mockSetUiNotificationStatus,
+      }),
+    );
+
+    await act(async () => {
+      await result.current.toggleNotificationsEnabled();
+    });
+
+    expect(mockEnableNotifications).not.toHaveBeenCalled();
+    expect(mockSetUiNotificationStatus).not.toHaveBeenCalled();
+  });
+});