fix: UX: Multichain: Fix dead network problem when switching tabs

MetaMask · Jun 19, 2024 · 1bff84a · 1bff84a
1 parent 2115516
commit 1bff84a
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 8 deletions.
diff --git a/app/scripts/metamask-controller.js b/app/scripts/metamask-controller.js
@@ -3141,6 +3141,11 @@ export default class MetamaskController extends EventEmitter {
       setActiveNetwork: (networkConfigurationId) => {
         return this.networkController.setActiveNetwork(networkConfigurationId);
       },
+      // Avoids returning the promise so that initial call to switch network
+      // doesn't block on the network lookup step
+      setActiveNetworkConfigurationId: (networkConfigurationId) => {
+        this.networkController.setActiveNetwork(networkConfigurationId);
+      },
       setNetworkClientIdForDomain: (origin, networkClientId) => {
         return this.selectedNetworkController.setNetworkClientIdForDomain(
           origin,

diff --git a/ui/store/actions.ts b/ui/store/actions.ts
@@ -2168,14 +2168,22 @@ export function automaticallySwitchNetwork(
   selectedTabOrigin: string,
 ): ThunkAction<void, MetaMaskReduxState, unknown, AnyAction> {
   return async (dispatch: MetaMaskReduxDispatch) => {
-    await dispatch(setActiveNetwork(networkClientIdForThisDomain));
-    await dispatch(
-      setSwitchedNetworkDetails({
-        networkClientId: networkClientIdForThisDomain,
-        origin: selectedTabOrigin,
-      }),
-    );
-    await forceUpdateMetamaskState(dispatch);
+    try {
+      await dispatch(
+        setActiveNetworkConfigurationId(networkClientIdForThisDomain),
+      );
+      await dispatch(
+        setSwitchedNetworkDetails({
+          networkClientId: networkClientIdForThisDomain,
+          origin: selectedTabOrigin,
+        }),
+      );
+      await forceUpdateMetamaskState(dispatch);
+    } catch (e) {
+      // The network did not load in time; let network try to load in background
+      // so that the normal UI switching can go through
+      console.log("Network wasn't available, try again but async");
+    }
   };
 }
 
@@ -2504,6 +2512,24 @@ export function setActiveNetwork(
   };
 }
 
+export function setActiveNetworkConfigurationId(
+  networkConfigurationId: string,
+): ThunkAction<void, MetaMaskReduxState, unknown, AnyAction> {
+  return async (dispatch) => {
+    log.debug(
+      `background.setActiveNetworkConfigurationId: ${networkConfigurationId}`,
+    );
+    try {
+      await submitRequestToBackground('setActiveNetworkConfigurationId', [
+        networkConfigurationId,
+      ]);
+    } catch (error) {
+      logErrorWithMessage(error);
+      dispatch(displayWarning('Had a problem changing networks!'));
+    }
+  };
+}
+
 export function rollbackToPreviousProvider(): ThunkAction<
   void,
   MetaMaskReduxState,