feat: implement wallet activity account selection with toggle functionality

Author: baptiste-marchand

app/components/Views/Settings/NotificationsSettings/AccountsList.hooks.test.tsx

@@ -10,12 +10,14 @@ import {
   useAccountProps,
   useNotificationAccountListProps,
   useNotificationWalletAccountGroups,
+  useWalletActivityAccountSelection,
 } from './AccountsList.hooks';
 import { selectInternalAccountsById } from '../../../../selectors/accountsController';
 import { InternalAccount } from '@metamask/keyring-internal-api';
 import { selectAccountGroupsByWallet } from '../../../../selectors/multichainAccounts/accountTreeController';
 import { AccountGroupType, AccountWalletType } from '@metamask/account-api';
 import { KeyringTypes } from '@metamask/keyring-controller';
+import { toFormattedAddress } from '../../../../util/address';
 
 jest.mock('../../../../selectors/notifications', () => ({
   getValidNotificationAccounts: jest.fn(),
@@ -35,6 +37,15 @@ jest.mock(
 );
 
 const MOCK_KEYRING_TYPE = 'HD Key Tree' as KeyringTypes;
+const EVM_ADDRESSES = [
+  '0xb2B92547A92C1aC55EAe3F6632Fa1aF87dc05a29',
+  '0x700CcD8172BC3807D893883a730A1E0E6630F8EC',
+  '0xb2B92547A92C1aC55EAe3F6632Fa1aF87dc05a20',
+  '0x700CcD8172BC3807D893883a730A1E0E6630F8E0',
+];
+const FORMATTED_EVM_ADDRESSES = EVM_ADDRESSES.map((address) =>
+  toFormattedAddress(address),
+);
 
 const createNotificationAccountsMap = () =>
   ({
@@ -431,3 +442,77 @@ describe('useAccountProps', () => {
     );
   });
 });
+
+describe('useWalletActivityAccountSelection', () => {
+  const arrangeMocks = (notificationData: Record<string, boolean>) => {
+    arrangeMockUseAccounts();
+    jest
+      .mocked(selectInternalAccountsById)
+      .mockReturnValue(createNotificationAccountsMap());
+    jest.mocked(getValidNotificationAccounts).mockReturnValue(EVM_ADDRESSES);
+
+    const mockUpdate = jest.fn();
+    jest
+      .spyOn(UseSwitchNotificationsModule, 'useFetchAccountNotifications')
+      .mockReturnValue({
+        accountsBeingUpdated: [],
+        data: notificationData,
+        error: null,
+        initialLoading: false,
+        update: mockUpdate,
+      });
+
+    const mockOnToggle = jest.fn();
+    jest
+      .spyOn(UseSwitchNotificationsModule, 'useAccountNotificationsToggle')
+      .mockReturnValue({
+        onToggle: mockOnToggle,
+        error: null,
+        loading: false,
+      });
+
+    return {
+      mockOnToggle,
+      mockUpdate,
+    };
+  };
+
+  beforeEach(() => jest.clearAllMocks());
+
+  it('deselects all visible EVM accounts when any account is enabled', async () => {
+    const mocks = arrangeMocks({
+      [FORMATTED_EVM_ADDRESSES[0]]: true,
+    });
+
+    const { result } = renderHookWithProvider(() =>
+      useWalletActivityAccountSelection(),
+    );
+
+    expect(result.current.hasEnabledAccount).toBe(true);
+
+    await act(async () => result.current.toggleAllAccounts());
+
+    expect(mocks.mockOnToggle).toHaveBeenCalledWith(
+      FORMATTED_EVM_ADDRESSES,
+      false,
+    );
+    expect(mocks.mockUpdate).toHaveBeenCalledWith(EVM_ADDRESSES);
+  });
+
+  it('selects all visible EVM accounts when every account is disabled', async () => {
+    const mocks = arrangeMocks({});
+
+    const { result } = renderHookWithProvider(() =>
+      useWalletActivityAccountSelection(),
+    );
+
+    expect(result.current.hasEnabledAccount).toBe(false);
+
+    await act(async () => result.current.toggleAllAccounts());
+
+    expect(mocks.mockOnToggle).toHaveBeenCalledWith(
+      FORMATTED_EVM_ADDRESSES,
+      true,
+    );
+  });
+});

app/components/Views/Settings/NotificationsSettings/AccountsList.hooks.tsx

@@ -1,6 +1,9 @@
 import { useCallback, useMemo } from 'react';
 import { useSelector } from 'react-redux';
-import { useFetchAccountNotifications } from '../../../../util/notifications/hooks/useSwitchNotifications';
+import {
+  useAccountNotificationsToggle,
+  useFetchAccountNotifications,
+} from '../../../../util/notifications/hooks/useSwitchNotifications';
 import { getValidNotificationAccounts } from '../../../../selectors/notifications';
 import { toFormattedAddress } from '../../../../util/address';
 import { selectAvatarAccountType } from '../../../../selectors/settings';
@@ -120,3 +123,55 @@ export function useAccountProps() {
     accountAvatarType,
   };
 }
+
+export function useWalletActivityAccountSelection() {
+  const accountProps = useAccountProps();
+  const notificationAccountListProps = useNotificationAccountListProps();
+  const { onToggle, loading } = useAccountNotificationsToggle();
+
+  const accountAddresses = useMemo(
+    () =>
+      accountProps.accountWalletGroups.flatMap((walletGroup) =>
+        walletGroup.data
+          .map((accountGroup) =>
+            notificationAccountListProps.getEvmAddress(accountGroup.accounts),
+          )
+          .filter((address): address is string => Boolean(address)),
+      ),
+    [accountProps.accountWalletGroups, notificationAccountListProps],
+  );
+
+  const hasEnabledAccount = useMemo(
+    () =>
+      accountProps.accountWalletGroups.some((walletGroup) =>
+        walletGroup.data.some((accountGroup) =>
+          notificationAccountListProps.isAccountEnabled(accountGroup.accounts),
+        ),
+      ),
+    [accountProps.accountWalletGroups, notificationAccountListProps],
+  );
+
+  const toggleAllAccounts = useCallback(async () => {
+    if (accountAddresses.length === 0) {
+      return;
+    }
+
+    await onToggle(accountAddresses, !hasEnabledAccount);
+    await notificationAccountListProps.refetchAccountSettings();
+  }, [
+    accountAddresses,
+    hasEnabledAccount,
+    notificationAccountListProps,
+    onToggle,
+  ]);
+
+  return {
+    accountProps,
+    notificationAccountListProps,
+    hasEnabledAccount,
+    hasNotificationAccounts: accountAddresses.length > 0,
+    isUpdatingAllAccounts:
+      loading || notificationAccountListProps.shouldDisableSwitches,
+    toggleAllAccounts,
+  };
+}