fix: set token network filter when adding network from dapp (#12661)

## **Description**

PR to setTokenNetworkFilter value when user is adding a new network from
dapp

## **Related issues**

Fixes:

## **Manual testing steps**

1. Click on current network
2. Add new network from chainlist
3. Confirm switching to this network
4. Go back to wallet and you should see your new network with the
correct token list


## **Screenshots/Recordings**

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

### **Before**

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


https://github.com/user-attachments/assets/03b43fd3-239e-47e5-a419-2c87a76e84d5


### **After**

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


https://github.com/user-attachments/assets/c11c4fb4-396f-4db9-b359-2c91108a0b42



## **Pre-merge author checklist**

- [ ] I’ve followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Mobile
Coding
Standards](https://github.com/MetaMask/metamask-mobile/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-mobile/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.

---------

Co-authored-by: Daniel Cross <[email protected]>

app/components/Approvals/SwitchChainApproval/SwitchChainApproval.test.tsx

@@ -5,13 +5,26 @@ import { ApprovalTypes } from '../../../core/RPCMethods/RPCMethodMiddleware';
 import { ApprovalRequest } from '@metamask/approval-controller';
 import SwitchChainApproval from './SwitchChainApproval';
 import { networkSwitched } from '../../../actions/onboardNetwork';
+// eslint-disable-next-line import/no-namespace
+import * as networks from '../../../util/networks';
+import Engine from '../../../core/Engine';
+const { PreferencesController } = Engine.context;
 
 jest.mock('../../Views/confirmations/hooks/useApprovalRequest');
 jest.mock('../../../actions/onboardNetwork');
 
+jest.mock('../../../core/Engine', () => ({
+  context: {
+    PreferencesController: {
+      setTokenNetworkFilter: jest.fn(),
+    },
+  },
+}));
+
 jest.mock('react-redux', () => ({
   ...jest.requireActual('react-redux'),
   useDispatch: () => jest.fn(),
+  useSelector: jest.fn(),
 }));
 
 const URL_MOCK = 'test.com';
@@ -32,6 +45,7 @@ const mockApprovalRequest = (approvalRequest?: ApprovalRequest<any>) => {
 describe('SwitchChainApproval', () => {
   beforeEach(() => {
     jest.resetAllMocks();
+    jest.spyOn(networks, 'isPortfolioViewEnabled').mockReturnValue(false);
   });
 
   it('renders', () => {
@@ -81,4 +95,29 @@ describe('SwitchChainApproval', () => {
       networkStatus: true,
     });
   });
+
+  it('invokes network switched on confirm when portfolio view is enabled', () => {
+    jest.spyOn(networks, 'isPortfolioViewEnabled').mockReturnValue(true);
+    const tokenNetworkFilterSpy = jest.spyOn(
+      PreferencesController,
+      'setTokenNetworkFilter',
+    );
+    mockApprovalRequest({
+      type: ApprovalTypes.SWITCH_ETHEREUM_CHAIN,
+      requestData: {
+        rpcUrl: URL_MOCK,
+      },
+    } as ApprovalRequest<{
+      rpcUrl: string;
+    }>);
+
+    const wrapper = shallow(<SwitchChainApproval />);
+    wrapper.find('SwitchCustomNetwork').simulate('confirm');
+    expect(tokenNetworkFilterSpy).toHaveBeenCalledTimes(1);
+    expect(networkSwitched).toHaveBeenCalledTimes(1);
+    expect(networkSwitched).toHaveBeenCalledWith({
+      networkUrl: URL_MOCK,
+      networkStatus: true,
+    });
+  });
 });

app/components/Approvals/SwitchChainApproval/SwitchChainApproval.tsx

@@ -4,7 +4,11 @@ import { ApprovalTypes } from '../../../core/RPCMethods/RPCMethodMiddleware';
 import ApprovalModal from '../ApprovalModal';
 import SwitchCustomNetwork from '../../UI/SwitchCustomNetwork';
 import { networkSwitched } from '../../../actions/onboardNetwork';
-import { useDispatch } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
+import Engine from '../../../core/Engine';
+import { selectIsAllNetworks } from '../../../selectors/networkController';
+import { selectTokenNetworkFilter } from '../../../selectors/preferencesController';
+import { isPortfolioViewEnabled } from '../../../util/networks';
 
 const SwitchChainApproval = () => {
   const {
@@ -15,17 +19,34 @@ const SwitchChainApproval = () => {
   } = useApprovalRequest();
 
   const dispatch = useDispatch();
+  const isAllNetworks = useSelector(selectIsAllNetworks);
+  const tokenNetworkFilter = useSelector(selectTokenNetworkFilter);
 
   const onConfirm = useCallback(() => {
     defaultOnConfirm();
 
+    // If portfolio view is enabled should set network filter
+    if (isPortfolioViewEnabled()) {
+      const { PreferencesController } = Engine.context;
+      PreferencesController.setTokenNetworkFilter({
+        ...(isAllNetworks ? tokenNetworkFilter : {}),
+        [approvalRequest?.requestData?.chainId]: true,
+      });
+    }
+
     dispatch(
       networkSwitched({
         networkUrl: approvalRequest?.requestData?.rpcUrl,
         networkStatus: true,
       }),
     );
-  }, [approvalRequest, defaultOnConfirm, dispatch]);
+  }, [
+    approvalRequest,
+    defaultOnConfirm,
+    dispatch,
+    isAllNetworks,
+    tokenNetworkFilter,
+  ]);
 
   if (approvalRequest?.type !== ApprovalTypes.SWITCH_ETHEREUM_CHAIN)
     return null;