Merge branch 'main' into modify-mockserver-for-android

app/components/UI/ReusableModal/ReusableModal.types.ts

@@ -17,6 +17,14 @@ export interface ReusableModalProps extends ViewProps {
    * @default true
    */
   isInteractable?: boolean;
+
+  /**
+   * Determines whether the navigation should revert to the previous path when the modal is closed.
+   * If set to `true`, closing the modal will trigger the navigation to go back to the previous screen or route.
+   * If set to `false`, the navigation will remain on the current path when the modal is closed.
+   * @default true
+   */
+  shouldGoBack?: boolean;
 }
 
 export type ReusableModalPostCallback = () => void;

app/components/UI/ReusableModal/index.tsx

@@ -47,7 +47,17 @@ import {
 export type { ReusableModalRef } from './ReusableModal.types';
 
 const ReusableModal = forwardRef<ReusableModalRef, ReusableModalProps>(
-  ({ children, onDismiss, isInteractable = true, style, ...props }, ref) => {
+  (
+    {
+      children,
+      onDismiss,
+      isInteractable = true,
+      shouldGoBack = true,
+      style,
+      ...props
+    },
+    ref,
+  ) => {
     const postCallback = useRef<ReusableModalPostCallback>();
     const { height: screenHeight } = useWindowDimensions();
     const { styles } = useStyles(styleSheet, {});
@@ -66,10 +76,12 @@ const ReusableModal = forwardRef<ReusableModalRef, ReusableModalProps>(
 
     const onHidden = useCallback(() => {
       // Sheet is automatically unmounted from the navigation stack.
-      navigation.goBack();
+      if (shouldGoBack) {
+        navigation.goBack();
+      }
       onDismiss?.(!!postCallback.current);
       postCallback.current?.();
-    }, [navigation, onDismiss]);
+    }, [navigation, onDismiss, shouldGoBack]);
 
     const gestureHandler = useAnimatedGestureHandler<
       PanGestureHandlerGestureEvent,

app/components/Views/AccountPermissions/AccountPermissionsConnected/AccountPermissionsConnected.tsx

@@ -181,7 +181,7 @@ const AccountPermissionsConnected = ({
         )}
         {!isMultichainVersion1Enabled && (
           <PickerNetwork
-            label={networkName}
+            label={providerConfig?.nickname || networkName}
             imageSource={networkImageSource}
             onPress={switchNetwork}
             style={styles.networkPicker}

app/components/Views/NetworkSelector/NetworkSelector.test.tsx

@@ -185,6 +185,20 @@ describe('Network Selector', () => {
     expect(toJSON()).toMatchSnapshot();
   });
 
+  it('renders correctly when network UI redesign is enabled', () => {
+    (isNetworkUiRedesignEnabled as jest.Mock).mockImplementation(() => true);
+    const { toJSON } = renderComponent(initialState);
+    expect(toJSON()).toMatchSnapshot();
+  });
+
+  it('shows popular networks when UI redesign is enabled', () => {
+    (isNetworkUiRedesignEnabled as jest.Mock).mockImplementation(() => true);
+    const { getByText } = renderComponent(initialState);
+
+    const popularNetworksTitle = getByText('Additional networks');
+    expect(popularNetworksTitle).toBeTruthy();
+  });
+
   it('changes network when another network cell is pressed', async () => {
     (isNetworkUiRedesignEnabled as jest.Mock).mockImplementation(() => false);
     const { getByText } = renderComponent(initialState);
@@ -387,4 +401,62 @@ describe('Network Selector', () => {
       fireEvent.press(rpcOption);
     });
   });
+
+  it('filters networks correctly when searching', () => {
+    (isNetworkUiRedesignEnabled as jest.Mock).mockImplementation(() => true);
+    const { getByPlaceholderText, queryByText } = renderComponent(initialState);
+
+    const searchInput = getByPlaceholderText('Search');
+
+    // Simulate entering a search term
+    fireEvent.changeText(searchInput, 'Polygon');
+
+    // Polygon should appear, but others should not
+    expect(queryByText('Polygon Mainnet')).toBeTruthy();
+    expect(queryByText('Avalanche Mainnet C-Chain')).toBeNull();
+
+    // Clear search and check if all networks appear
+    fireEvent.changeText(searchInput, '');
+    expect(queryByText('Polygon Mainnet')).toBeTruthy();
+    expect(queryByText('Avalanche Mainnet C-Chain')).toBeTruthy();
+  });
+
+  it('shows popular networks when network UI redesign is enabled', () => {
+    (isNetworkUiRedesignEnabled as jest.Mock).mockImplementation(() => true);
+    const { getByText } = renderComponent(initialState);
+
+    // Check that the additional networks section is rendered
+    const popularNetworksTitle = getByText('Additional networks');
+    expect(popularNetworksTitle).toBeTruthy();
+  });
+
+  it('opens the multi-RPC selection modal correctly', async () => {
+    (isNetworkUiRedesignEnabled as jest.Mock).mockImplementation(() => true);
+    const { getByText } = renderComponent(initialState);
+
+    const polygonCell = getByText('Polygon Mainnet');
+
+    // Open the modal
+    fireEvent.press(polygonCell);
+    await waitFor(() => {
+      const rpcOption = getByText('polygon-mainnet.infura.io/v3');
+      expect(rpcOption).toBeTruthy();
+    });
+  });
+
+  it('toggles test networks visibility when switch is used', () => {
+    (isNetworkUiRedesignEnabled as jest.Mock).mockImplementation(() => true);
+    const { getByTestId } = renderComponent(initialState);
+    const testNetworksSwitch = getByTestId(
+      NetworkListModalSelectorsIDs.TEST_NET_TOGGLE,
+    );
+
+    // Toggle the switch on
+    fireEvent(testNetworksSwitch, 'onValueChange', true);
+    expect(setShowTestNetworksSpy).toBeCalledWith(true);
+
+    // Toggle the switch off
+    fireEvent(testNetworksSwitch, 'onValueChange', false);
+    expect(setShowTestNetworksSpy).toBeCalledWith(false);
+  });
 });