Merge branch 'main' into fix/account-connect-origin-spoof

Author: smilingkylan

.github/CODEOWNERS

@@ -42,6 +42,7 @@ app/reducers/fiatOrders/             @MetaMask/ramp
 # Confirmation Team
 app/components/Views/confirmations                          @MetaMask/confirmations
 app/core/Engine/controllers/gas-fee-controller              @MetaMask/confirmations
+app/core/Engine/controllers/signature-controller            @MetaMask/confirmations
 app/core/Engine/controllers/transaction-controller          @MetaMask/confirmations
 app/core/Analytics/events/confirmations                     @MetaMask/confirmations
 ppom                                                        @MetaMask/confirmations

.github/workflows/automated-rca.yml

@@ -0,0 +1,19 @@
+name: Automated RCA
+
+on:
+  issues:
+    types: [closed]
+
+permissions:
+  issues: write
+  contents: read
+
+jobs:
+  automated-rca:
+    uses: MetaMask/github-tools/.github/workflows/post-gh-rca.yml@115cc6dce7aa32c85cbd77a19e9c04db85fb7920
+    with:
+      google-form-base-url: 'https://docs.google.com/forms/d/e/1FAIpQLSdnPbJISzFlR_aQD2uRpnMKSoGAopuTd_yeZK7J4Q5GzgbsOA/viewform?usp=pp_url&entry.340898780='
+      repo-owner: ${{ github.repository_owner }}
+      repo-name: ${{ github.event.repository.name }}
+      issue-number: ${{ github.event.issue.number }}
+      issue-labels: '["Sev0-urgent", "Sev1-high"]'

CHANGELOG.md

@@ -10,12 +10,19 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Added
 
 - fix(browser): fix browser PermissionsSummary origin spoofing when browser redirects issue ([#13394](https://github.com/MetaMask/metamask-mobile/pull/13394))
+- feat(bridge): add error handling and input management for bridge quotes ([#14693](https://github.com/MetaMask/metamask-mobile/pull/14693))
 - feat(multi-srp): enable multi-srp in main and beta ([#14558](https://github.com/MetaMask/metamask-mobile/pull/14558))
+- feat(ramp): Update ramp data flow to fetch cryptos before payment methods ([#14437](https://github.com/MetaMask/metamask-mobile/pull/14437))
 - feat(bridge): add destination account picker ([#14656](https://github.com/MetaMask/metamask-mobile/pull/14656))
 - feat(bridge): add Solana assets to bridge token pickers ([#14365](https://github.com/MetaMask/metamask-mobile/pull/14365))
 - feat: add AppMetadataController controller ([#14513](https://github.com/MetaMask/metamask-mobile/pull/14513))
 - feat(bridge): implement bridge quote fetching ([#14413](https://github.com/MetaMask/metamask-mobile/pull/14413))
 
+
+### Changed
+
+- feat(bridge): Handle Solana vs EVM swap and bridge routing ([#14614](https://github.com/MetaMask/metamask-mobile/pull/14614))
+
 ## [7.44.0]
 
 ### Added

app/components/Nav/Main/MainNavigator.js

@@ -89,6 +89,7 @@ import NftDetailsFullImage from '../../Views/NftDetails/NFtDetailsFullImage';
 import AccountPermissions from '../../../components/Views/AccountPermissions';
 import { AccountPermissionsScreens } from '../../../components/Views/AccountPermissions/AccountPermissions.types';
 import { StakeModalStack, StakeScreenStack } from '../../UI/Stake/routes';
+import { BridgeTransactionDetails } from '../../UI/Bridge/components/TransactionDetails/TransactionDetails';
 import { BridgeModalStack, BridgeScreenStack } from '../../UI/Bridge/routes';
 
 const Stack = createStackNavigator();
@@ -205,6 +206,7 @@ const TransactionsHome = () => (
       name={Routes.RAMP.SEND_TRANSACTION}
       component={SendTransaction}
     />
+    <Stack.Screen name={Routes.BRIDGE.BRIDGE_TRANSACTION_DETAILS} component={BridgeTransactionDetails} />
   </Stack.Navigator>
 );
 

app/components/Snaps/SnapUIAddressInput/SnapUIAddressInput.test.tsx

@@ -195,21 +195,17 @@ describe('SnapUIAddressInput', () => {
     expect(toJSON()).toMatchSnapshot();
   });
 
-  it('does not render the matched address info if there is an error', () => {
+  it('renders the matched address info with an error', () => {
     mockGetValue.mockReturnValue(`${testChainId}:${testAddress}`);
     const displayName = 'Vitalik.eth';
     (useDisplayName as jest.Mock).mockReturnValue(displayName);
 
-    const { queryByText, queryByTestId, getByText, toJSON } = renderWithProvider(
+    const { queryByText, getByText, toJSON } = renderWithProvider(
       <SnapUIAddressInput name="testAddress" chainId={testChainId} error="Error" />,
       { state: mockInitialState },
     );
 
-    expect(queryByText(displayName)).toBeFalsy();
-
-    const input = queryByTestId(INPUT_TEST_ID);
-
-    expect(input.props.value).toBe(testAddress);
+    expect(queryByText(displayName)).toBeTruthy();
     expect(getByText('Error')).toBeTruthy();
 
     const tree = JSON.stringify(toJSON());

app/components/Snaps/SnapUIAddressInput/SnapUIAddressInput.tsx

@@ -51,6 +51,7 @@ interface MatchedAccountInfoProps {
   displayName: string;
   handleClear: () => void;
   disabled?: boolean;
+  error?: string;
 }
 
 const MatchedAccountInfo = ({
@@ -61,6 +62,7 @@ const MatchedAccountInfo = ({
   displayName,
   handleClear,
   disabled,
+  error,
 }: MatchedAccountInfoProps) => {
   const { colors } = useTheme();
   const styles = StyleSheet.create({
@@ -115,6 +117,12 @@ const MatchedAccountInfo = ({
           testID="snap-ui-address-input__clear-button"
         />
       </Box>
+      {error && (
+        // eslint-disable-next-line react-native/no-inline-styles
+        <HelpText severity={HelpTextSeverity.Error} style={{ marginTop: 4 }}>
+          {error}
+        </HelpText>
+      )}
     </Box>
   );
 };
@@ -204,7 +212,7 @@ export const SnapUIAddressInput = ({
     handleInputChange(name, '', form);
   };
 
-  if (displayName && !error) {
+  if (displayName) {
     return (
       <MatchedAccountInfo
         label={label}
@@ -214,6 +222,7 @@ export const SnapUIAddressInput = ({
         displayName={displayName}
         handleClear={handleClear}
         disabled={disabled}
+        error={error}
       />
     );
   }

app/components/Snaps/SnapUILink/SnapUILink.test.tsx

@@ -1,14 +1,12 @@
 import React from 'react';
 import { render, fireEvent } from '@testing-library/react-native';
-import { Linking } from 'react-native';
+import { Linking, Text, View } from 'react-native';
 import { SnapUILink } from './SnapUILink';
-import ButtonLink from '../../../component-library/components/Buttons/Button/variants/ButtonLink';
 import Icon, {
   IconColor,
   IconName,
   IconSize,
 } from '../../../component-library/components/Icons/Icon';
-import { TextColor } from '../../../component-library/components/Texts/Text';
 
 jest.mock('react-native/Libraries/Linking/Linking', () => ({
   openURL: jest.fn(),
@@ -25,14 +23,19 @@ describe('SnapUILink', () => {
   };
 
   it('renders correctly with valid props', () => {
-    const { UNSAFE_getByType } = render(<SnapUILink {...validProps} />);
+    const { UNSAFE_getByType, getByTestId } = render(
+      <SnapUILink {...validProps} />,
+    );
 
-    const button = UNSAFE_getByType(ButtonLink);
+    const linkText = getByTestId('snaps-ui-link');
+    const spacer = UNSAFE_getByType(View);
     const icon = UNSAFE_getByType(Icon);
 
-    expect(button).toBeTruthy();
-    expect(button.props.testID).toBe('snaps-ui-link');
-    expect(button.props.color).toBe(TextColor.Info);
+    expect(linkText).toBeTruthy();
+    expect(linkText.props.children[0]).toBe('Visit MetaMask');
+    expect(spacer).toBeTruthy();
+    expect(spacer.props.style).toEqual({ width: 4 });
+    expect(linkText.props.accessibilityRole).toBe('link');
     expect(icon.props.name).toBe(IconName.Export);
     expect(icon.props.color).toBe(IconColor.Primary);
     expect(icon.props.size).toBe(IconSize.Sm);
@@ -41,8 +44,8 @@ describe('SnapUILink', () => {
   it('opens URL when pressed with valid https URL', () => {
     const { getByTestId } = render(<SnapUILink {...validProps} />);
 
-    const button = getByTestId('snaps-ui-link');
-    fireEvent.press(button);
+    const link = getByTestId('snaps-ui-link');
+    fireEvent.press(link);
 
     expect(Linking.openURL).toHaveBeenCalledWith(validProps.href);
     expect(Linking.openURL).toHaveBeenCalledTimes(1);
@@ -56,12 +59,88 @@ describe('SnapUILink', () => {
 
     const { getByTestId } = render(<SnapUILink {...invalidProps} />);
 
-    const button = getByTestId('snaps-ui-link');
+    const link = getByTestId('snaps-ui-link');
 
     expect(() => {
-      fireEvent.press(button);
+      fireEvent.press(link);
     }).toThrow('Invalid URL');
 
     expect(Linking.openURL).not.toHaveBeenCalled();
   });
+
+  it('can be nested inside another Text component', () => {
+    const { toJSON } = render(
+      <Text>
+        Before <SnapUILink href="https://metamask.io">MetaMask</SnapUILink>{' '}
+        After
+      </Text>,
+    );
+
+    const textContent = JSON.stringify(toJSON());
+    expect(textContent).toContain('Before');
+    expect(textContent).toContain('MetaMask');
+    expect(textContent).toContain('After');
+  });
+
+  it('handles array children correctly', () => {
+    const { getByTestId } = render(
+      <SnapUILink href="https://metamask.io">
+        {'Part 1 '}
+        {'Part 2'}
+      </SnapUILink>,
+    );
+
+    const link = getByTestId('snaps-ui-link');
+    const childrenArray = link.props.children;
+    const textContent = childrenArray[0].toString();
+
+    expect(textContent).toBe('Part 1 ,Part 2');
+  });
+
+  it('renders correctly with complex children', () => {
+    const { UNSAFE_getAllByType, toJSON } = render(
+      <SnapUILink href="https://metamask.io">
+        Normal text
+        {/* eslint-disable-next-line react-native/no-inline-styles */}
+        <Text style={{ fontWeight: 'bold' }}>Bold text</Text>
+      </SnapUILink>,
+    );
+
+    const textContent = JSON.stringify(toJSON());
+    expect(textContent).toContain('Normal text');
+    expect(textContent).toContain('Bold text');
+
+    // Should have our Icon plus any Text components
+    const allIcons = UNSAFE_getAllByType(Icon);
+    expect(allIcons.length).toBe(1);
+  });
+
+  it('validates URL format correctly', () => {
+    // Valid HTTPS URL
+    expect(() => {
+      fireEvent.press(
+        render(
+          <SnapUILink href="https://example.com">Link</SnapUILink>,
+        ).getByTestId('snaps-ui-link'),
+      );
+    }).not.toThrow();
+
+    // Invalid HTTP URL
+    expect(() => {
+      fireEvent.press(
+        render(
+          <SnapUILink href="http://example.com">Link</SnapUILink>,
+        ).getByTestId('snaps-ui-link'),
+      );
+    }).toThrow('Invalid URL');
+
+    // Invalid non-HTTP URL
+    expect(() => {
+      fireEvent.press(
+        render(
+          <SnapUILink href="ftp://example.com">Link</SnapUILink>,
+        ).getByTestId('snaps-ui-link'),
+      );
+    }).toThrow('Invalid URL');
+  });
 });

app/components/Snaps/SnapUILink/SnapUILink.tsx

@@ -1,14 +1,24 @@
 ///: BEGIN:ONLY_INCLUDE_IF(preinstalled-snaps,external-snaps)
 import { LinkChildren } from '@metamask/snaps-sdk/jsx';
 import React from 'react';
-import { Linking, View } from 'react-native';
-import ButtonLink from '../../../component-library/components/Buttons/Button/variants/ButtonLink';
-import { TextColor } from '../../../component-library/components/Texts/Text';
+import { Text, StyleSheet, Linking, View } from 'react-native';
 import Icon, {
   IconColor,
   IconName,
   IconSize,
 } from '../../../component-library/components/Icons/Icon';
+import { strings } from '../../../../locales/i18n';
+
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    alignSelf: 'flex-start',
+  },
+  spacer: {
+    width: 4,
+  },
+});
 
 export interface SnapUILinkProps {
   children: LinkChildren;
@@ -27,38 +37,18 @@ const onPress = (href: string) => {
 };
 
 // TODO: This component should show a modal for links when not using preinstalled Snaps
-export const SnapUILink: React.FC<SnapUILinkProps> = ({ href, children }) => {
-  const label = (
-    <>
-      {children}
-      <View
-        /* eslint-disable-next-line react-native/no-inline-styles */
-        style={{
-          width: 4,
-        }}
-      />
-      <Icon
-        name={IconName.Export}
-        color={IconColor.Primary}
-        size={IconSize.Sm}
-        /* eslint-disable-next-line react-native/no-inline-styles */
-        style={{
-          justifyContent: 'center',
-          alignItems: 'center',
-          alignSelf: 'center',
-        }}
-      />
-    </>
-  );
+export const SnapUILink: React.FC<SnapUILinkProps> = ({ href, children }) => (
+  <Text
+    testID="snaps-ui-link"
+    style={styles.container}
+    onPress={() => onPress(href)}
+    accessibilityRole="link"
+    accessibilityHint={strings('snaps.snap_ui.link.accessibilityHint')}
+  >
+    {children}
+    <View style={styles.spacer} />
+    <Icon name={IconName.Export} color={IconColor.Primary} size={IconSize.Sm} />
+  </Text>
+);
 
-  return (
-    <ButtonLink
-      testID="snaps-ui-link"
-      // @ts-expect-error This prop is not part of the type but it works.
-      color={TextColor.Info}
-      onPress={() => onPress(href)}
-      label={label}
-    />
-  );
-};
 ///: END:ONLY_INCLUDE_IF