release(runway): cherry-pick fix: cp-13.6.0 adding network does not update balance (#37141)

- fix: adding network does not update balance (#37062)

<!--
Please submit this PR as a draft initially.
Do not mark it as "Ready for review" until the template has been
completely filled out, and PR status checks have passed at least once.
-->

## **Description**
When adding a network the `selectedNetworkClientId` was not being
updated and many of our components still depend on it. That is why a
refresh was needed after adding a network

<!--
Write a short description of the changes included in this pull request,
also include relevant motivation and context. Have in mind the following
questions:
1. What is the reason for the change?
2. What is the improvement/solution?
-->

[![Open in GitHub

Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/37062?quickstart=1)

## **Changelog**

<!--
If this PR is not End-User-Facing and should not show up in the
CHANGELOG, you can choose to either:
1. Write `CHANGELOG entry: null`
2. Label with `no-changelog`

If this PR is End-User-Facing, please write a short User-Facing
description in the past tense like:
`CHANGELOG entry: Added a new tab for users to see their NFTs`
`CHANGELOG entry: Fixed a bug that was causing some NFTs to flicker`

(This helps the Release Engineer do their job more quickly and
accurately)
-->

CHANGELOG entry: when adding a network the `selectedNetworkClientId` was
not being updated and many of our components still depend on it

## **Related issues**

Fixes: #36845 &
#36752
Maybe also fixes:
#36806

## **Manual testing steps**

1. Go to this page...
2.
3.

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

### **Before**

<!-- [screenshots/recordings] -->

### **After**

<!-- [screenshots/recordings] -->

## **Pre-merge author checklist**

- [ ] I've followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask
Extension Coding

Standards](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [ ] I've completed the PR template to the best of my ability
- [ ] I’ve included tests if applicable
- [ ] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [ ] I’ve applied the right labels on the PR (see [labeling

guidelines](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

## **Pre-merge reviewer checklist**

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.

<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> Ensure newly added networks are immediately set active (updating
`selectedNetworkClientId`) and simplify UI flow to rely on this
behavior.
> 
> - **Controller**:
> - Add `_addNetworkAndSetActive` to add a network and set its
`networkClientId` active.
> - Replace `addNetwork` API bindings to use `_addNetworkAndSetActive`
in `getApi()` and EIP-1193 provider setup.
> - **UI**:
> - Simplify `networks-form` add flow: remove manual `setActiveNetwork`
and rely on `addNetwork` to activate; minor type/import cleanup.
> - **Changelog**:
> - Note fix where adding a network did not update
`selectedNetworkClientId`.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
3854b91. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

---------

Co-authored-by: davidrentc <[email protected]>
Co-authored-by: Salim TOUBAL <[email protected]>
[6e9ff43](6e9ff43)

---------

Co-authored-by: Juanmi <[email protected]>
Co-authored-by: davidrentc <[email protected]>
Co-authored-by: Salim TOUBAL <[email protected]>
Co-authored-by: Gauthier Petetin <[email protected]>

Author: 5 people

CHANGELOG.md

@@ -72,6 +72,7 @@ authorized by the user.` error until the user fully revoked dapp
 - Adds address pattern matching to accounts list search (#37005)
 - Migrates user's existing pinned and hidden state to multichain account designs (#37017)
 - Tweaks messaging for degraded and unavailable networks (#37082)
+- When adding a network the selectedNetworkClientId was not being updated and many of our components still depend on it (#37062)
 
 ## [13.5.0]
 

app/scripts/metamask-controller.js

@@ -2159,6 +2159,21 @@ export default class MetamaskController extends EventEmitter {
     };
   }
 
+  /**
+   * Adds a network and sets it as the active network.
+   *
+   * @param {object} networkConfiguration - The network configuration to add.
+   * @returns {Promise<object>} The added network configuration.
+   */
+  async _addNetworkAndSetActive(networkConfiguration) {
+    const addedNetwork =
+      await this.networkController.addNetwork(networkConfiguration);
+    const { networkClientId } =
+      addedNetwork?.rpcEndpoints?.[addedNetwork.defaultRpcEndpointIndex] ?? {};
+    await this.networkController.setActiveNetwork(networkClientId);
+    return addedNetwork;
+  }
+
   /**
    * Returns an Object containing API Callback Functions.
    * These functions are the interface for the UI.
@@ -2432,9 +2447,7 @@ export default class MetamaskController extends EventEmitter {
       },
       rollbackToPreviousProvider:
         networkController.rollbackToPreviousProvider.bind(networkController),
-      addNetwork: this.networkController.addNetwork.bind(
-        this.networkController,
-      ),
+      addNetwork: this._addNetworkAndSetActive.bind(this),
       updateNetwork: this.networkController.updateNetwork.bind(
         this.networkController,
       ),
@@ -6598,9 +6611,7 @@ export default class MetamaskController extends EventEmitter {
         }),
 
       // Network configuration-related
-      addNetwork: this.networkController.addNetwork.bind(
-        this.networkController,
-      ),
+      addNetwork: this._addNetworkAndSetActive.bind(this),
       updateNetwork: this.networkController.updateNetwork.bind(
         this.networkController,
       ),

ui/pages/settings/networks-tab/networks-form/networks-form.tsx

@@ -3,7 +3,6 @@ import React, { useContext, useEffect, useRef, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import {
   type UpdateNetworkFields,
-  NetworkConfiguration,
   RpcEndpointType,
 } from '@metamask/network-controller';
 import { Hex, isStrictHexString } from '@metamask/utils';
@@ -33,7 +32,6 @@ import { useI18nContext } from '../../../../hooks/useI18nContext';
 import { getNetworkConfigurationsByChainId } from '../../../../../shared/modules/selectors/networks';
 import {
   addNetwork,
-  setActiveNetwork,
   setEditedNetwork,
   setEnabledNetworks,
   setTokenNetworkFilter,
@@ -312,16 +310,7 @@ export const NetworksForm = ({
             await dispatch(setEnabledNetworks(existingNetwork.chainId));
           }
         } else {
-          const addedNetworkConfiguration = (await dispatch(
-            addNetwork(networkPayload),
-          )) as unknown as NetworkConfiguration;
-
-          const networkClientId =
-            addedNetworkConfiguration?.rpcEndpoints?.[
-              addedNetworkConfiguration.defaultRpcEndpointIndex
-            ]?.networkClientId;
-
-          await dispatch(setActiveNetwork(networkClientId));
+          await dispatch(addNetwork(networkPayload));
           await dispatch(setEnabledNetworks(networkPayload.chainId));
         }