feat(NOTIFY-1096): add account syncing

app/actions/notification/helpers/index.ts

@@ -171,6 +171,15 @@
     return getErrorMessage(error);
   }
 };
+
+export const syncInternalAccountsWithUserStorage = async () => {
+  try {
+    await Engine.context.UserStorageController.syncInternalAccountsWithUserStorage();
+  } catch (error) {
+    return getErrorMessage(error);
+  }
+};
+
 /**
  * Perform the deletion of the notifications storage key and the creation of on chain triggers to reset the notifications.
  *
@@ -187,4 +196,4 @@
   } catch (error) {
     return getErrorMessage(error);
   }
-};
+}

app/components/Views/Wallet/index.tsx

@@ -103,6 +103,8 @@ import {
 } from '../../../selectors/notifications';
 import { ButtonVariants } from '../../../component-library/components/Buttons/Button';
 import { useListNotifications } from '../../../util/notifications/hooks/useNotifications';
+import { useAccountSyncing } from '../../../util/notifications/hooks/useProfileSyncing';
+
 import { isObject } from 'lodash';
 
 const createStyles = ({ colors, typography }: Theme) =>
@@ -169,6 +171,7 @@ const Wallet = ({
   const appState = useRef(AppState.currentState);
   const { navigate } = useNavigation();
   const { listNotifications } = useListNotifications();
+  const { dispatchAccountSyncing } = useAccountSyncing();
   const walletRef = useRef(null);
   const theme = useTheme();
   const { toastRef } = useContext(ToastContext);
@@ -443,13 +446,17 @@ const Wallet = ({
     [navigation, providerConfig.chainId],
   );
 
+  // Layout effect when component/view is visible
+  // - fetches notifications
+  // - dispatches account syncing
   useLayoutEffect(() => {
     const handleAppStateChange = (nextAppState: AppStateStatus) => {
       if (
         appState.current.match(/inactive|background/) &&
         nextAppState === 'active'
       ) {
         listNotifications();
+        dispatchAccountSyncing();
       }
 
       appState.current = nextAppState;
@@ -459,11 +466,14 @@ const Wallet = ({
       'change',
       handleAppStateChange,
     );
+
     listNotifications();
+    dispatchAccountSyncing();
+
     return () => {
       subscription.remove();
     };
-  }, [listNotifications]);
+  }, [listNotifications, dispatchAccountSyncing]);
 
   useEffect(() => {
     navigation.setOptions(

app/core/Analytics/MetaMetrics.events.ts

@@ -369,6 +369,9 @@ enum EVENT_NAME {
   PRIMARY_CURRENCY_TOGGLE = 'primary_currency_toggle',
   LOGIN_DOWNLOAD_LOGS = 'Download State Logs Button Clicked',
 
+  // Profile Syncing
+  ACCOUNTS_SYNC_ADDED = 'Accounts Sync Added',
+  ACCOUNTS_SYNC_NAME_UPDATED = 'Accounts Sync Name Updated',
   // network
   MULTI_RPC_MIGRATION_MODAL_ACCEPTED = 'multi_rpc_migration_modal_accepted',
 }
@@ -854,6 +857,12 @@ const events = {
   ),
   PRIMARY_CURRENCY_TOGGLE: generateOpt(EVENT_NAME.PRIMARY_CURRENCY_TOGGLE),
   LOGIN_DOWNLOAD_LOGS: generateOpt(EVENT_NAME.LOGIN_DOWNLOAD_LOGS),
+
+  // Profile Syncing
+  ACCOUNTS_SYNC_ADDED: generateOpt(EVENT_NAME.ACCOUNTS_SYNC_ADDED),
+  ACCOUNTS_SYNC_NAME_UPDATED: generateOpt(
+    EVENT_NAME.ACCOUNTS_SYNC_NAME_UPDATED,
+  ),
 };
 
 /**

app/core/Engine.ts

@@ -127,7 +127,7 @@ import {
 } from '@metamask/snaps-controllers';
 
 import { WebViewExecutionService } from '@metamask/snaps-controllers/react-native';
-import { NotificationArgs } from '@metamask/snaps-rpc-methods/dist/types/restricted/notify';
+import { NotificationParameters } from '@metamask/snaps-rpc-methods/dist/restricted/notify.cjs';
 import { getSnapsWebViewPromise } from '../lib/snaps';
 import {
   buildSnapEndowmentSpecifications,
@@ -896,7 +896,7 @@ class Engine {
           type,
           requestData: { content, placeholder },
         }),
-      showInAppNotification: (origin: string, args: NotificationArgs) => {
+      showInAppNotification: (origin: string, args: NotificationParameters) => {
         Logger.log(
           'Snaps/ showInAppNotification called with args: ',
           args,
@@ -1213,26 +1213,49 @@ class Engine {
 
     const userStorageController = new UserStorageController.Controller({
       getMetaMetricsState: () => MetaMetrics.getInstance().isEnabled(),
+      env: {
+        isAccountSyncingEnabled: true,
+      },
+      config: {
+        accountSyncing: {
+          onAccountAdded: (profileId) => {
+            MetaMetrics.getInstance().trackEvent(
+              MetaMetricsEvents.ACCOUNTS_SYNC_ADDED,
+              {
+                profile_id: profileId,
+              },
+            );
+          },
+          onAccountNameUpdated: (profileId) => {
+            MetaMetrics.getInstance().trackEvent(
+              MetaMetricsEvents.ACCOUNTS_SYNC_NAME_UPDATED,
+              {
+                profile_id: profileId,
+              },
+            );
+          },
+        },
+      },
       state: initialState.UserStorageController,
       messenger: this.controllerMessenger.getRestricted({
         name: 'UserStorageController',
         allowedActions: [
           'SnapController:handleRequest',
           'KeyringController:getState',
+          'KeyringController:addNewAccount',
           'AuthenticationController:getBearerToken',
           'AuthenticationController:getSessionProfile',
           'AuthenticationController:isSignedIn',
           'AuthenticationController:performSignOut',
           'AuthenticationController:performSignIn',
           'NotificationServicesController:disableNotificationServices',
           'NotificationServicesController:selectIsNotificationServicesEnabled',
-          'KeyringController:addNewAccount',
           'AccountsController:listAccounts',
           'AccountsController:updateAccountMetadata',
         ],
         allowedEvents: [
-          'KeyringController:lock',
           'KeyringController:unlock',
+          'KeyringController:lock',
           'AccountsController:accountAdded',
           'AccountsController:accountRenamed',
         ],

app/util/notifications/hooks/useProfileSyncing.test.tsx

@@ -9,7 +9,7 @@ import { Provider } from 'react-redux';
 import createMockStore from 'redux-mock-store';
 import * as Actions from '../../../actions/notification/helpers';
 import initialRootState from '../../../util/test/initial-root-state';
-import { useProfileSyncing } from './useProfileSyncing';
+import { useAccountSyncing, useProfileSyncing } from './useProfileSyncing';
 
 function arrangeStore() {
   const store = createMockStore()(initialRootState);
@@ -172,3 +172,79 @@ describe('useDisableProfileSyncing', () => {
     );
   });
 });
+
+describe('useAccountSyncing', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  function arrangeHook() {
+    const store = arrangeStore();
+    const hook = renderHook(() => useAccountSyncing(), {
+      wrapper: ({ children }) => <Provider store={store}>{children}</Provider>,
+    });
+
+    return hook;
+  }
+
+  function arrangeActions() {
+    const syncInternalAccountsWithUserStorageAction = jest
+      .spyOn(Actions, 'syncInternalAccountsWithUserStorage')
+      .mockResolvedValue(undefined);
+
+    return {
+      syncInternalAccountsWithUserStorageAction,
+    };
+  }
+
+  it('dispatches account syncing and error as undefined', async () => {
+    const mockActions = arrangeActions();
+
+    const { result } = arrangeHook();
+    await act(async () => {
+      await result.current.dispatchAccountSyncing();
+    });
+
+    expect(
+      mockActions.syncInternalAccountsWithUserStorageAction,
+    ).toHaveBeenCalledTimes(1);
+    expect(result.current.error).toBeUndefined();
+  });
+
+  it('sets error message when syncInternalAccountsWithUserStorageAction returns an error', async () => {
+    const mockActions = arrangeActions();
+    mockActions.syncInternalAccountsWithUserStorageAction.mockRejectedValueOnce(
+      new Error('MOCK - failed to sync internal account with user storage'),
+    );
+
+    const { result } = arrangeHook();
+    await act(async () => {
+      await result.current.dispatchAccountSyncing();
+    });
+
+    expect(
+      mockActions.syncInternalAccountsWithUserStorageAction,
+    ).toHaveBeenCalledTimes(1);
+    expect(result.current.error).toBeDefined();
+    expect(result.current.error).toEqual(
+      'MOCK - failed to sync internal account with user storage',
+    );
+  });
+
+  it('sets error message when an error occurs during dispatchAccountSyncing', async () => {
+    const mockActions = arrangeActions();
+    mockActions.syncInternalAccountsWithUserStorageAction.mockRejectedValueOnce(
+      new Error('MOCK - failed to sync internal account with user storage'),
+    );
+
+    const { result } = arrangeHook();
+    await act(async () => {
+      await result.current.dispatchAccountSyncing();
+    });
+
+    expect(result.current.error).toBeDefined();
+    expect(result.current.error).toEqual(
+      'MOCK - failed to sync internal account with user storage',
+    );
+  });
+});

app/util/notifications/hooks/useProfileSyncing.ts

@@ -5,6 +5,7 @@ import { getErrorMessage } from '../../../util/errorHandling';
 import {
   disableProfileSyncing as disableProfileSyncingAction,
   enableProfileSyncing as enableProfileSyncingAction,
+  syncInternalAccountsWithUserStorage as syncInternalAccountsWithUserStorageAction,
 } from '../../../actions/notification/helpers';
 
 /**
@@ -56,3 +57,32 @@ export function useProfileSyncing(): ProfileSyncingReturn {
 
   return { enableProfileSyncing, disableProfileSyncing, loading, error };
 }
+
+/**
+ * Custom hook to dispatch account syncing.
+ *
+ * @returns An object containing the `dispatchAccountSyncing` function, and error state.
+ */
+export const useAccountSyncing = () => {
+  const [error, setError] = useState<string>();
+
+  const dispatchAccountSyncing = useCallback(async () => {
+    setError(undefined);
+    try {
+      const errorMessage = await syncInternalAccountsWithUserStorageAction();
+      if (errorMessage) {
+        setError(getErrorMessage(errorMessage));
+        return errorMessage;
+      }
+    } catch (e) {
+      const errorMessage = getErrorMessage(e);
+      setError(errorMessage);
+      return errorMessage;
+    }
+  }, []);
+
+  return {
+    dispatchAccountSyncing,
+    error,
+  };
+};

package.json

@@ -107,7 +107,6 @@
     "**/xml2js": ">=0.5.0",
     "react-native-level-fs/**/bl": "^1.2.3",
     "react-native-level-fs/levelup/semver": "^5.7.2",
-    "@metamask/accounts-controller": "^18.1.0",
     "@metamask/contract-metadata": "^2.1.0",
     "@metamask/react-native-payments/validator": "^13.7.0",
     "**/minimist": "1.2.6",
@@ -180,8 +179,8 @@
     "@metamask/smart-transactions-controller": "^13.0.0",
     "@metamask/snaps-controllers": "^9.8.0",
     "@metamask/snaps-execution-environments": "^6.7.2",
-    "@metamask/snaps-rpc-methods": "^9.1.4",
-    "@metamask/snaps-sdk": "^6.5.0",
+    "@metamask/snaps-rpc-methods": "^11.1.1",
+    "@metamask/snaps-sdk": "^6.5.1",
     "@metamask/snaps-utils": "^8.1.1",
     "@metamask/swappable-obj-proxy": "^2.1.0",
     "@metamask/swaps-controller": "^9.0.12",