chore: Add Solana devnet support (#20155)

<!--
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**

We are enabling Solana devnet support, its under the FF
`solanaTestnetsEnabled` (already in main).


https://github.com/user-attachments/assets/11b04e4d-43f8-49a2-8d15-8d9d9a686d9f

<img height="700" alt="Simulator Screenshot - iPhone 15 - 2025-09-23 at
11 00 32"
src="https://github.com/user-attachments/assets/7d79f6aa-c6cd-46ae-a203-44f30506cd1c"
/>
<img height="700" alt="Simulator Screenshot - iPhone 15 - 2025-09-23 at
11 00 22"
src="https://github.com/user-attachments/assets/e04f02cc-0909-40ee-9952-0c42b3e77c3d"
/>
<img height="700" alt="Simulator Screenshot - iPhone 15 - 2025-09-23 at
11 06 58"
src="https://github.com/user-attachments/assets/d7e33955-1e5c-4161-b9e8-9e685a1abc74"
/>

## **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: Adds Solana devnet support, under FF.

## **Related issues**

Fixes:

## **Manual testing steps**

```gherkin
Feature: my feature name

  Scenario: user [verb for user action]
    Given [describe expected initial app state]

    When user [verb for user action]
    Then [describe expected outcome]
```

## **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 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**

- [x] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [x] 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.

Author: zone-live

app/components/UI/CollectibleContracts/index.js

@@ -27,7 +27,6 @@ import {
   multichainCollectibleContractsSelector,
   multichainCollectiblesSelector,
   multichainCollectiblesByEnabledNetworksSelector,
-  multichainCollectibleContractsByEnabledNetworksSelector,
 } from '../../../reducers/collectibles';
 import { removeFavoriteCollectible } from '../../../actions/collectibles';
 import AppConstants from '../../../core/AppConstants';
@@ -669,11 +668,7 @@ const CollectibleContracts = ({
               </>
             }
             isDisabled={isDisabled}
-            onPress={
-              isEvmSelected || isMultichainAccountsState2Enabled
-                ? showFilterControls
-                : () => null
-            }
+            onPress={showFilterControls}
             endIconName={
               isEvmSelected || isMultichainAccountsState2Enabled
                 ? IconName.ArrowDown

app/components/Views/NetworkSelector/NetworkSelector.tsx

@@ -97,6 +97,7 @@ import {
   ///: BEGIN:ONLY_INCLUDE_IF(keyring-snaps)
   selectNonEvmNetworkConfigurationsByChainId,
   ///: END:ONLY_INCLUDE_IF
+  selectSelectedNonEvmNetworkChainId,
 } from '../../../selectors/multichainNetworkController';
 import { isNonEvmChainId } from '../../../core/Multichain/utils';
 import { MultichainNetworkConfiguration } from '@metamask/multichain-network-controller';
@@ -161,6 +162,7 @@ const NetworkSelector = () => {
   ///: END:ONLY_INCLUDE_IF
 
   const isEvmSelected = useSelector(selectIsEvmNetworkSelected);
+  const selectedNonEvmChainId = useSelector(selectSelectedNonEvmNetworkChainId);
 
   const route =
     useRoute<RouteProp<Record<string, NetworkSelectorRouteParams>, string>>();
@@ -360,7 +362,11 @@ const NetworkSelector = () => {
       return chainId === browserChainId;
     }
 
-    return !isEvmSelected ? false : chainId === selectedChainId;
+    if (!isEvmSelected) {
+      return chainId === selectedNonEvmChainId;
+    }
+
+    return chainId === selectedChainId;
   };
 
   const {
@@ -711,9 +717,7 @@ const NetworkSelector = () => {
     }
 
     return networks.map((network) => {
-      const isSelected =
-        network.chainId === browserChainId ||
-        (!isEvmSelected && !browserChainId);
+      const isSelected = isNetworkSelected(network.chainId);
       return (
         <Cell
           key={network.chainId}

app/components/hooks/useCurrentNetworkInfo.ts

@@ -1,12 +1,7 @@
 import { useMemo, useCallback } from 'react';
 import { useSelector } from 'react-redux';
-import { KnownCaipNamespace } from '@metamask/utils';
 import { formatChainIdToCaip } from '@metamask/bridge-controller';
-import {
-  selectNetworkConfigurationsByCaipChainId,
-  selectChainId,
-} from '../../selectors/networkController';
-import { selectIsEvmNetworkSelected } from '../../selectors/multichainNetworkController';
+import { selectNetworkConfigurationsByCaipChainId } from '../../selectors/networkController';
 import { useNetworkEnablement } from './useNetworkEnablement/useNetworkEnablement';
 import { selectMultichainAccountsState2Enabled } from '../../selectors/featureFlagController/multichainAccounts';
 
@@ -31,10 +26,6 @@ export const useCurrentNetworkInfo = (): CurrentNetworkInfo => {
   const networksByCaipChainId = useSelector(
     selectNetworkConfigurationsByCaipChainId,
   );
-  const isEvmSelected = useSelector(selectIsEvmNetworkSelected);
-  const selectedChainId = useSelector(selectChainId);
-  const isSolanaSelected =
-    selectedChainId?.includes(KnownCaipNamespace.Solana) ?? false;
   const isMultichainAccountsState2Enabled = useSelector(
     selectMultichainAccountsState2Enabled,
   );
@@ -94,11 +85,9 @@ export const useCurrentNetworkInfo = (): CurrentNetworkInfo => {
     [enabledNetworks, networksByCaipChainId],
   );
 
-  let isDisabled: boolean =
-    Boolean(!isEvmSelected) && !isMultichainAccountsState2Enabled;
-  // We don't have Solana testnet networks, so we disable the network selector if Solana is selected
-  // TODO: Come back when we have Solana devnet available
-  isDisabled = Boolean(isSolanaSelected) && !isMultichainAccountsState2Enabled;
+  // For now there is no use case to have it disabled
+  // but leaving it here since it might be useful
+  const isDisabled: boolean = false;
 
   const hasEnabledNetworks = enabledNetworks.length > 0;
 

app/images/image-icons.js

@@ -12,6 +12,7 @@ import LINEA_TESTNET from './linea-testnet-logo.png';
 import SEPOLIA from './sepolia-logo-dark.png';
 import LINEA_MAINNET from './linea-mainnet-logo.png';
 import SOLANA from './solana-logo.png';
+import SOLANA_DEVNET from './solana-devnet.jpg';
 import GRAVITY from './gravity.png';
 import KAIA_MAINNET from './kaia.png';
 import FOX_LOGO from '../../app/images/branding/tiny-logo.png';
@@ -64,6 +65,7 @@ export default {
   'KAIA-MAINNET': KAIA_MAINNET,
   'KAIA-KAIROS-TESTNET': KAIA_MAINNET,
   SOLANA,
+  SOLANA_DEVNET,
   FOX_LOGO,
   BTC,
   'BTC-TESTNET': BTC_TESTNET,

app/images/solana-devnet.jpg

@@ -76,7 +76,7 @@ export const selectNonEvmNetworkConfigurationsByChainId = createSelector(
       },
       [SolScope.Devnet]: {
         decimals: MULTICHAIN_NETWORK_DECIMAL_PLACES[SolScope.Devnet],
-        imageSource: imageIcons.SOLANA,
+        imageSource: imageIcons.SOLANA_DEVNET as ImageSourcePropType,
         ticker: MULTICHAIN_NETWORK_TICKER[SolScope.Devnet],
         isTestnet: true,
         name: 'Solana Devnet',

app/selectors/multichainNetworkController/index.ts

@@ -3,7 +3,7 @@ import {
   getNonEvmNetworkImageSourceByChainId,
 } from './customNetworks';
 import { toHex } from '@metamask/controller-utils';
-import { SolScope } from '@metamask/keyring-api';
+import { BtcScope, SolScope } from '@metamask/keyring-api';
 import { CaipChainId } from '@metamask/utils';
 
 describe('popularNetwork', () => {
@@ -27,9 +27,53 @@ describe('popularNetwork', () => {
 });
 
 describe('getNonEvmNetworkImageSourceByChainId', () => {
-  it('should return image source for valid non-EVM network chainId', () => {
-    const imageSource = getNonEvmNetworkImageSourceByChainId(SolScope.Mainnet);
-    expect(imageSource).toBeDefined();
+  describe('Solana networks', () => {
+    it('should return solana mainnet image for SolScope.Mainnet', () => {
+      const imageSource = getNonEvmNetworkImageSourceByChainId(
+        SolScope.Mainnet,
+      );
+      expect(imageSource).toBeDefined();
+    });
+
+    it('should return solana devnet image for SolScope.Devnet', () => {
+      const imageSource = getNonEvmNetworkImageSourceByChainId(SolScope.Devnet);
+      expect(imageSource).toBeDefined();
+    });
+  });
+
+  describe('Bitcoin networks', () => {
+    it('should return bitcoin mainnet image for BtcScope.Mainnet', () => {
+      const imageSource = getNonEvmNetworkImageSourceByChainId(
+        BtcScope.Mainnet,
+      );
+      expect(imageSource).toBeDefined();
+    });
+
+    it('should return bitcoin testnet image for BtcScope.Testnet', () => {
+      const imageSource = getNonEvmNetworkImageSourceByChainId(
+        BtcScope.Testnet,
+      );
+      expect(imageSource).toBeDefined();
+    });
+
+    it('should return bitcoin testnet image for BtcScope.Testnet4', () => {
+      const imageSource = getNonEvmNetworkImageSourceByChainId(
+        BtcScope.Testnet4,
+      );
+      expect(imageSource).toBeDefined();
+    });
+
+    it('should return bitcoin testnet image for BtcScope.Regtest', () => {
+      const imageSource = getNonEvmNetworkImageSourceByChainId(
+        BtcScope.Regtest,
+      );
+      expect(imageSource).toBeDefined();
+    });
+
+    it('should return bitcoin signet image for BtcScope.Signet', () => {
+      const imageSource = getNonEvmNetworkImageSourceByChainId(BtcScope.Signet);
+      expect(imageSource).toBeDefined();
+    });
   });
 
   it('should return undefined for invalid chainId', () => {

app/util/networks/customNetworks.test.ts

@@ -147,6 +147,8 @@ export const getNonEvmNetworkImageSourceByChainId = (chainId: CaipChainId) => {
   switch (chainId) {
     case SolScope.Mainnet:
       return require('../../images/solana-logo.png');
+    case SolScope.Devnet:
+      return require('../../images/solana-devnet.jpg');
     case BtcScope.Mainnet:
       return require('../../images/bitcoin-logo.png');
     case BtcScope.Testnet: