feat: add new logic and fix syncing issues

- update network sync issue
- remove network sync issue
- switch networks updating issue

Author: Prithpal-Sooriya

packages/network-controller/src/NetworkController.ts

@@ -218,8 +218,11 @@ export type NetworkConfiguration = {
  * Custom RPC endpoints do not need a `networkClientId` property because it is
  * assumed that they have not already been added and therefore network clients
  * do not exist for them yet (and hence IDs need to be generated).
+ *
+ * However Custom RPC endpoints, that are synchronized between,
+ * can use the same `networkClientId` set on both devices.
  */
-export type AddNetworkCustomRpcEndpointFields = Omit<
+export type AddNetworkCustomRpcEndpointFields = Partialize<
   CustomRpcEndpoint,
   'networkClientId'
 >;
@@ -514,6 +517,11 @@ export type NetworkControllerRemoveNetworkAction = {
   handler: NetworkController['removeNetwork'];
 };
 
+export type NetworkControllerDangerouslySetNetworkConfigurationAction = {
+  type: 'NetworkController:dangerouslySetNetworkConfiguration';
+  handler: NetworkController['dangerouslySetNetworkConfiguration'];
+};
+
 export type NetworkControllerActions =
   | NetworkControllerGetStateAction
   | NetworkControllerGetEthQueryAction
@@ -527,7 +535,8 @@ export type NetworkControllerActions =
   | NetworkControllerGetNetworkConfigurationByNetworkClientId
   | NetworkControllerAddNetworkAction
   | NetworkControllerUpdateNetworkAction
-  | NetworkControllerRemoveNetworkAction;
+  | NetworkControllerRemoveNetworkAction
+  | NetworkControllerDangerouslySetNetworkConfigurationAction;
 
 export type NetworkControllerMessenger = RestrictedControllerMessenger<
   typeof controllerName,
@@ -1019,6 +1028,11 @@ export class NetworkController extends BaseController<
       `${this.name}:removeNetwork`,
       this.removeNetwork.bind(this),
     );
+
+    this.messagingSystem.registerActionHandler(
+      `${this.name}:dangerouslySetNetworkConfiguration`,
+      this.dangerouslySetNetworkConfiguration.bind(this),
+    );
   }
 
   /**
@@ -1622,7 +1636,8 @@ export class NetworkController extends BaseController<
           defaultOrCustomRpcEndpointFields.type === RpcEndpointType.Custom
             ? {
                 ...defaultOrCustomRpcEndpointFields,
-                networkClientId: uuidV4(),
+                networkClientId:
+                  defaultOrCustomRpcEndpointFields.networkClientId ?? uuidV4(),
               }
             : defaultOrCustomRpcEndpointFields;
         return {
@@ -2016,6 +2031,105 @@ export class NetworkController extends BaseController<
     );
   }
 
+  /**
+   * This is used to override an existing network configuration.
+   * This is only meant for internal use only and not to be exposed via the UI.
+   * It is used as part of "Network Syncing", to sync networks, RPCs and block explorers cross devices.
+   *
+   * This will subsequently update the network client registry; state.networksMetadata, and state.selectedNetworkClientId
+   * @param networkConfiguration - the network configuration to override
+   */
+  async dangerouslySetNetworkConfiguration(
+    networkConfiguration: NetworkConfiguration,
+  ) {
+    const prevNetworkConfig: NetworkConfiguration | undefined =
+      networkConfiguration.chainId in this.state.networkConfigurationsByChainId
+        ? this.state.networkConfigurationsByChainId[
+            networkConfiguration.chainId
+          ]
+        : undefined;
+
+    // Update Registry (remove old and add new)
+    const autoManagedNetworkClientRegistry =
+      this.#ensureAutoManagedNetworkClientRegistryPopulated();
+    if (prevNetworkConfig) {
+      const networkClientOperations = prevNetworkConfig.rpcEndpoints.map(
+        (rpcEndpoint) => {
+          return {
+            type: 'remove' as const,
+            rpcEndpoint,
+          };
+        },
+      );
+      this.#unregisterNetworkClientsAsNeeded({
+        networkClientOperations,
+        autoManagedNetworkClientRegistry,
+      });
+    }
+    const networkClientOperations = networkConfiguration.rpcEndpoints.map(
+      (rpcEndpoint) => {
+        return {
+          type: 'add' as const,
+          rpcEndpoint,
+        };
+      },
+    );
+    this.#registerNetworkClientsAsNeeded({
+      networkFields: networkConfiguration,
+      networkClientOperations,
+      autoManagedNetworkClientRegistry,
+    });
+
+    // update new `networkConfigurationsByChainId` (full replace)
+    this.update((state) => {
+      state.networkConfigurationsByChainId[networkConfiguration.chainId] =
+        networkConfiguration;
+    });
+    this.#networkConfigurationsByNetworkClientId =
+      buildNetworkConfigurationsByNetworkClientId(
+        this.state.networkConfigurationsByChainId,
+      );
+
+    // update `networksMetadata` remove old
+    if (prevNetworkConfig) {
+      this.update((state) => {
+        const newNetworksMetadata: NetworksMetadata = {
+          ...state.networksMetadata,
+        };
+        prevNetworkConfig.rpcEndpoints.forEach((rpcEndpoint) => {
+          delete newNetworksMetadata[rpcEndpoint.networkClientId];
+        });
+      });
+    }
+
+    // update `networksMetadata` update new
+    for (const rpcEndpoint of networkConfiguration.rpcEndpoints) {
+      await this.lookupNetwork(rpcEndpoint.networkClientId);
+    }
+
+    // update selectedNetworkId
+    const selectedClientId = this.state.selectedNetworkClientId;
+    const wasReplacedClientId = prevNetworkConfig?.rpcEndpoints.some(
+      (r) => r.networkClientId === selectedClientId,
+    );
+    const isValidClientIdInNewNetworks = networkConfiguration.rpcEndpoints.some(
+      (r) => r.networkClientId === selectedClientId,
+    );
+    if (wasReplacedClientId) {
+      if (!isValidClientIdInNewNetworks) {
+        // Update clientId to something that exists
+        const newSelectedNetworkMetadata =
+          networkConfiguration.rpcEndpoints.find(
+            (r) => r.networkClientId in this.state.networksMetadata,
+          )?.networkClientId;
+        const anyClientId = Object.keys(this.state.networksMetadata)[0];
+        const newlySelectedNetwork =
+          newSelectedNetworkMetadata ?? anyClientId ?? selectedClientId;
+        await this.#refreshNetwork(newlySelectedNetwork);
+      }
+    }
+  }
+
   /**
    * Assuming that the network has been previously switched, switches to this
    * new network.

packages/network-controller/src/index.ts

@@ -32,6 +32,7 @@ export type {
   NetworkControllerAddNetworkAction,
   NetworkControllerUpdateNetworkAction,
   NetworkControllerRemoveNetworkAction,
+  NetworkControllerDangerouslySetNetworkConfigurationAction,
   NetworkControllerGetNetworkConfigurationByNetworkClientId,
   NetworkControllerActions,
   NetworkControllerMessenger,

packages/profile-sync-controller/src/controllers/user-storage/UserStorageController.ts

@@ -21,7 +21,7 @@ import {
 } from '@metamask/keyring-controller';
 import type {
   NetworkControllerAddNetworkAction,
-  NetworkControllerUpdateNetworkAction,
+  NetworkControllerDangerouslySetNetworkConfigurationAction,
   NetworkControllerGetStateAction,
   NetworkControllerNetworkRemovedEvent,
   NetworkControllerRemoveNetworkAction,
@@ -206,7 +206,7 @@ export type AllowedActions =
   // Network Syncing
   | NetworkControllerGetStateAction
   | NetworkControllerAddNetworkAction
-  | NetworkControllerUpdateNetworkAction
+  | NetworkControllerDangerouslySetNetworkConfigurationAction
   | NetworkControllerRemoveNetworkAction;
 
 // Messenger events

packages/profile-sync-controller/src/controllers/user-storage/network-syncing/controller-integration.test.ts

@@ -63,11 +63,7 @@ type ExternalEvents = NotNamespacedBy<
   'UserStorageController',
   AllowedEvents['type']
 >;
-const getEvents = (): ExternalEvents[] => [
-  'NetworkController:networkAdded',
-  'NetworkController:networkUpdated',
-  'NetworkController:networkRemoved',
-];
+const getEvents = (): ExternalEvents[] => ['NetworkController:networkRemoved'];
 
 describe('network-syncing/controller-integration - startNetworkSyncing()', () => {
   it(`should successfully sync when NetworkController:networkRemoved is emitted`, async () => {
@@ -355,7 +351,7 @@ describe('network-syncing/controller-integration - performMainSync()', () => {
       typedMockCallFn<'NetworkController:addNetwork'>();
 
     const mockNetworkControllerUpdateNetwork =
-      typedMockCallFn<'NetworkController:updateNetwork'>();
+      typedMockCallFn<'NetworkController:dangerouslySetNetworkConfiguration'>();
 
     const mockNetworkControllerRemoveNetwork =
       typedMockCallFn<'NetworkController:removeNetwork'>();
@@ -373,7 +369,9 @@ describe('network-syncing/controller-integration - performMainSync()', () => {
         return mockNetworkControllerAddNetwork(...params);
       }
 
-      if (actionType === 'NetworkController:updateNetwork') {
+      if (
+        actionType === 'NetworkController:dangerouslySetNetworkConfiguration'
+      ) {
         const [, ...params] = typedArgs;
         return mockNetworkControllerUpdateNetwork(...params);
       }

packages/profile-sync-controller/src/controllers/user-storage/network-syncing/controller-integration.ts

@@ -94,65 +94,86 @@ export async function performMainNetworkSync(
     );
 
     const remoteNetworks = await getAllRemoteNetworks(opts);
+    const networkChanges = findNetworksToUpdate({
+      localNetworks,
+      remoteNetworks,
+    });
 
-    const networksToUpdate = findNetworksToUpdate({
+    log.debug('performMainNetworkSync() - Network Syncing Started', {
       localNetworks,
       remoteNetworks,
+      networkChanges,
     });
 
     // Update Remote
     if (
-      networksToUpdate?.remoteNetworksToUpdate &&
-      networksToUpdate.remoteNetworksToUpdate.length > 0
+      networkChanges?.remoteNetworksToUpdate &&
+      networkChanges.remoteNetworksToUpdate.length > 0
     ) {
-      await batchUpdateNetworks(networksToUpdate?.remoteNetworksToUpdate, opts);
+      await batchUpdateNetworks(networkChanges?.remoteNetworksToUpdate, opts);
     }
 
     // Add missing local networks
     if (
-      networksToUpdate?.missingLocalNetworks &&
-      networksToUpdate.missingLocalNetworks.length > 0
+      networkChanges?.missingLocalNetworks &&
+      networkChanges.missingLocalNetworks.length > 0
     ) {
-      networksToUpdate.missingLocalNetworks.forEach((n) => {
+      networkChanges.missingLocalNetworks.forEach((n) => {
         try {
           messenger.call('NetworkController:addNetwork', n);
           props.onNetworkAdded?.(n.chainId);
-        } catch {
+        } catch (e) {
+          console.error(
+            'performMainNetworkSync() - NetworkController:addNetwork failed',
+            e,
+          );
           // Silently fail, we can try this again on next main sync
         }
       });
     }
 
     // Update local networks
     if (
-      networksToUpdate?.localNetworksToUpdate &&
-      networksToUpdate.localNetworksToUpdate.length > 0
+      networkChanges?.localNetworksToUpdate &&
+      networkChanges.localNetworksToUpdate.length > 0
     ) {
-      for (const n of networksToUpdate.localNetworksToUpdate) {
+      for (const n of networkChanges.localNetworksToUpdate) {
         try {
-          await messenger.call('NetworkController:updateNetwork', n.chainId, n);
+          await messenger.call(
+            'NetworkController:dangerouslySetNetworkConfiguration',
+            n,
+          );
           props.onNetworkUpdated?.(n.chainId);
-        } catch {
+        } catch (e) {
+          console.error(
+            'performMainNetworkSync() - NetworkController:dangerouslySetNetworkConfiguration failed',
+            e,
+          );
           // Silently fail, we can try this again on next main sync
         }
       }
     }
 
     // Remove local networks
     if (
-      networksToUpdate?.localNetworksToRemove &&
-      networksToUpdate.localNetworksToRemove.length > 0
+      networkChanges?.localNetworksToRemove &&
+      networkChanges.localNetworksToRemove.length > 0
     ) {
-      networksToUpdate.localNetworksToRemove.forEach((n) => {
+      networkChanges.localNetworksToRemove.forEach((n) => {
         try {
           messenger.call('NetworkController:removeNetwork', n.chainId);
           props.onNetworkRemoved?.(n.chainId);
-        } catch {
+        } catch (e) {
+          console.error(
+            'performMainNetworkSync() - NetworkController:removeNetwork failed',
+            e,
+          );
           // Silently fail, we can try this again on next main sync
         }
       });
     }
-  } catch {
+  } catch (e) {
+    console.error('performMainNetworkSync() failed', e);
     // Silently fail sync
   } finally {
     isMainNetworkSyncInProgress = false;

packages/profile-sync-controller/src/controllers/user-storage/network-syncing/services.ts

@@ -1,5 +1,6 @@
 import type { UserStorageBaseOptions } from '../services';
 import {
+  batchUpsertUserStorage,
   getUserStorageAllFeatureEntries,
   upsertUserStorage,
 } from '../services';
@@ -71,8 +72,14 @@ export async function batchUpsertRemoteNetworks(
   networks: RemoteNetworkConfiguration[],
   opts: UserStorageBaseOptions,
 ): Promise<void> {
-  // TODO - this has not yet been provided by the backend team
-  // we will replace this with a batch endpoint in near future
-  const promises = networks.map((n) => upsertRemoteNetwork(n, opts));
-  await Promise.allSettled(promises);
+  const networkPathAndValues = networks.map((n) => {
+    const path = n.chainId;
+    const data = JSON.stringify(n);
+    return [path, data] as [string, string];
+  });
+
+  await batchUpsertUserStorage(networkPathAndValues, {
+    path: 'networks',
+    ...opts,
+  });
 }

packages/profile-sync-controller/src/controllers/user-storage/network-syncing/sync-mutations.ts

@@ -21,7 +21,7 @@ export const deleteNetwork = async (
       v: '1',
       ...network,
       d: true,
-      lastUpdatedAt: network.lastUpdatedAt ?? Date.now(), // Ensures that a deleted entry has a date field
+      lastUpdatedAt: Date.now(), // Ensures that a deleted entry has a date field.
     },
     opts,
   );