Merge branch 'main' into salim/fix-non-regression-tests

MetaMask · Oct 21, 2024 · fe8b868 · fe8b868
2 parents 63ca9a5 + 7d4577f
commit fe8b868
Show file tree

Hide file tree

Showing 86 changed files with 5,639 additions and 2,460 deletions.
diff --git a/.depcheckrc.yml b/.depcheckrc.yml
@@ -49,22 +49,17 @@ ignores:
   - 'rn-nodeify'
 
   ## Unused devDependencies to investigate
-  - '@ethersproject/abi'
   - '@metamask/swappable-obj-proxy'
-  - '@react-native-picker/picker'
-  - '@rnhooks/keyboard'
   - '@segment/sovran-react-native'
   - '@tradle/react-native-http'
   - 'asyncstorage-down'
   - 'buffer'
   - 'd3-shape'
-  - 'dnode'
   - 'eciesjs'
   - 'eth-block-tracker'
   - 'eth-json-rpc-infura'
   - 'events'
   - 'https-browserify'
-  - 'obs-store'
   - 'path'
   - 'pbkdf2'
   - 'pify'
@@ -73,11 +68,9 @@ ignores:
   - 'react-native-aes-crypto'
   - 'react-native-aes-crypto-forked'
   - 'react-native-crypto'
-  - 'react-native-flash-message'
   - 'react-native-level-fs'
   - 'react-native-os'
   - 'react-native-randombytes'
-  - 'react-native-redash'
   - 'react-native-swipe-gestures'
   - 'react-native-tcp'
   - 'socket.io-client'

diff --git a/.github/workflows/create-release-pr.yml b/.github/workflows/create-release-pr.yml
@@ -43,14 +43,10 @@ jobs:
           cache: yarn
       - name: Install dependencies
         run: yarn --immutable
-      - name: Set Versions
-        id: set-versions
-        shell: bash
-        run: SEMVER_VERSION=${{ github.event.inputs.semver-version }} VERSION_NUMBER=${{ github.event.inputs.version-number }} yarn set-version
-      - name: Create Release PR
-        id: create-release-pr
+      - name: Create Release & Changelog PR
+        id: create-release-changelog-pr
         shell: bash
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         run: |
-          ./scripts/create-release-pr.sh ${{ github.event.inputs.previous-version-tag }} ${{ github.event.inputs.semver-version }}
+          ./scripts/create-release-pr.sh ${{ github.event.inputs.previous-version-tag }} ${{ github.event.inputs.semver-version }} ${{ github.event.inputs.version-number }}
diff --git a/.js.env.example b/.js.env.example
@@ -90,7 +90,10 @@ export MM_ENABLE_SETTINGS_PAGE_DEV_OPTIONS="true"
 # The endpoint used to submit errors and tracing data to Sentry for dev environment.
 # export MM_SENTRY_DSN_DEV=
 
-# Multichain Feature flag
-export MULTICHAIN_V1=""
+# Per dapp selected network (Amon Hen) feature flag
+export MM_PER_DAPP_SELECTED_NETWORK=""
+
+export MM_CHAIN_PERMISSIONS=""
+
 #Multichain feature flag specific to UI changes
 export MM_MULTICHAIN_V1_ENABLED=""
diff --git a/app/component-library/components/Form/TextField/foundation/Input/Input.tsx b/app/component-library/components/Form/TextField/foundation/Input/Input.tsx
@@ -21,7 +21,7 @@ const Input: React.FC<InputProps> = ({
   isReadonly = false,
   onBlur,
   onFocus,
-  autoFocus = false,
+  autoFocus = true,
   ...props
 }) => {
   const [isFocused, setIsFocused] = useState(autoFocus);
@@ -64,7 +64,7 @@ const Input: React.FC<InputProps> = ({
       {...props}
       style={styles.base}
       editable={!isDisabled && !isReadonly}
-      autoFocus
+      autoFocus={autoFocus}
       onBlur={onBlurHandler}
       onFocus={onFocusHandler}
     />

diff --git a/...nent-library/components/Form/TextField/foundation/Input/__snapshots__/Input.test.tsx.snap b/...nent-library/components/Form/TextField/foundation/Input/__snapshots__/Input.test.tsx.snap
@@ -9,7 +9,7 @@ exports[`Input should render correctly 1`] = `
   style={
     {
       "backgroundColor": "#ffffff",
-      "borderColor": "transparent",
+      "borderColor": "#0376c9",
       "borderWidth": 1,
       "color": "#141618",
       "fontFamily": "Euclid Circular B",

diff --git a/app/components/Nav/App/index.js b/app/components/Nav/App/index.js
@@ -131,7 +131,6 @@ import OptionsSheet from '../../UI/SelectOptionSheet/OptionsSheet';
 import FoxLoader from '../../../components/UI/FoxLoader';
 import { AppStateEventProcessor } from '../../../core/AppStateEventListener';
 import MultiRpcModal from '../../../components/Views/MultiRpcModal/MultiRpcModal';
-import { trace, TraceName, TraceOperation } from '../../../util/trace';
 
 const clearStackNavigatorOptions = {
   headerShown: false,
@@ -355,15 +354,7 @@ const App = (props) => {
       setOnboarded(!!existingUser);
       try {
         if (existingUser) {
-          await trace(
-            {
-              name: TraceName.BiometricAuthentication,
-              op: TraceOperation.BiometricAuthentication,
-            },
-            async () => {
-              await Authentication.appTriggeredAuth();
-            },
-          );
+          await Authentication.appTriggeredAuth();
           // we need to reset the navigator here so that the user cannot go back to the login screen
           navigator.reset({ routes: [{ name: Routes.ONBOARDING.HOME_NAV }] });
         } else {

diff --git a/app/components/UI/AssetOverview/TokenDetails/TokenDetails.tsx b/app/components/UI/AssetOverview/TokenDetails/TokenDetails.tsx
@@ -5,7 +5,7 @@ import { useSelector } from 'react-redux';
 import i18n from '../../../../../locales/i18n';
 import { useStyles } from '../../../../component-library/hooks';
 import styleSheet from './TokenDetails.styles';
-import { formatAddress, safeToChecksumAddress } from '../../../../util/address';
+import { safeToChecksumAddress } from '../../../../util/address';
 import { selectTokenList } from '../../../../selectors/tokenListController';
 import { selectContractExchangeRates } from '../../../../selectors/tokenRatesController';
 import {
@@ -75,13 +75,12 @@ const TokenDetails: React.FC<TokenDetailsProps> = ({ asset }) => {
 
   const tokenDetails: TokenDetails = asset.isETH
     ? {
-        contractAddress: formatAddress(zeroAddress(), 'short'),
+        contractAddress: zeroAddress(),
         tokenDecimal: 18,
         tokenList: '',
       }
     : {
-        contractAddress:
-          formatAddress(tokenContractAddress as string, 'short') || null,
+        contractAddress: tokenContractAddress || null,
         tokenDecimal: tokenMetadata?.decimals || null,
         tokenList: tokenMetadata?.aggregators.join(', ') || null,
       };

diff --git a/app/components/UI/AssetOverview/TokenDetails/TokenDetailsList/TokenDetailsList.tsx b/app/components/UI/AssetOverview/TokenDetails/TokenDetailsList/TokenDetailsList.tsx
@@ -17,6 +17,7 @@ import Icon, {
 import ClipboardManager from '../../../../../core/ClipboardManager';
 import { TokenDetails } from '../TokenDetails';
 import TokenDetailsListItem from '../TokenDetailsListItem';
+import { formatAddress } from '../../../../../util/address';
 
 interface TokenDetailsListProps {
   tokenDetails: TokenDetails;
@@ -62,7 +63,7 @@ const TokenDetailsList: React.FC<TokenDetailsListProps> = ({
               onPress={copyAccountToClipboard}
             >
               <Text color={TextColor.Primary} variant={TextVariant.BodySM}>
-                {tokenDetails.contractAddress}
+                {formatAddress(tokenDetails.contractAddress, 'short')}
               </Text>
               <Icon
                 name={IconName.Copy}

diff --git a/app/components/UI/PermissionsSummary/PermissionsSummary.test.tsx b/app/components/UI/PermissionsSummary/PermissionsSummary.test.tsx
@@ -29,6 +29,24 @@ const mockInitialState = {
 };
 
 describe('PermissionsSummary', () => {
+  it('should render correctly for network switch', () => {
+    const { toJSON } = renderWithProvider(
+      <PermissionsSummary
+        currentPageInformation={{
+          currentEnsName: '',
+          icon: '',
+          url: 'https://app.uniswap.org/',
+        }}
+        customNetworkInformation={{
+          chainName: 'Sepolia',
+          chainId: '0x1',
+        }}
+        isNetworkSwitch
+      />,
+      { state: mockInitialState },
+    );
+    expect(toJSON()).toMatchSnapshot();
+  });
   it('should render correctly', () => {
     const { toJSON } = renderWithProvider(
       <PermissionsSummary

diff --git a/app/components/UI/PermissionsSummary/PermissionsSummary.tsx b/app/components/UI/PermissionsSummary/PermissionsSummary.tsx
@@ -1,6 +1,11 @@
 import React, { useCallback } from 'react';
 import StyledButton from '../StyledButton';
-import { SafeAreaView, TouchableOpacity, View } from 'react-native';
+import {
+  ImageSourcePropType,
+  SafeAreaView,
+  TouchableOpacity,
+  View,
+} from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import { strings } from '../../../../locales/i18n';
 import { useTheme } from '../../../util/theme';
@@ -30,19 +35,21 @@ import useSelectedAccount from '../Tabs/TabThumbnail/useSelectedAccount';
 import styleSheet from './PermissionsSummary.styles';
 import { useStyles } from '../../../component-library/hooks';
 import { PermissionsSummaryProps } from './PermissionsSummary.types';
-import { useSelector } from 'react-redux';
-import { selectNetworkName } from '../../../selectors/networkInfos';
 import { USER_INTENT } from '../../../constants/permissions';
 import Routes from '../../../constants/navigation/Routes';
 import ButtonIcon, {
   ButtonIconSizes,
 } from '../../../component-library/components/Buttons/ButtonIcon';
+import { getNetworkImageSource } from '../../../util/networks';
 
 const PermissionsSummary = ({
   currentPageInformation,
+  customNetworkInformation,
   onEdit,
   onEditNetworks,
   onBack,
+  onCancel,
+  onConfirm,
   onUserAction,
   showActionButtons = true,
   isAlreadyConnected = true,
@@ -54,14 +61,26 @@ const PermissionsSummary = ({
   const { styles } = useStyles(styleSheet, { isRenderedAsBottomSheet });
   const { navigate } = useNavigation();
   const selectedAccount = useSelectedAccount();
-  const networkName = useSelector(selectNetworkName);
+
+  // if network switch, we get the chain name from the customNetworkInformation
+  let chainName = '';
+  let chainImage: ImageSourcePropType;
+  if (isNetworkSwitch && customNetworkInformation?.chainId) {
+    chainName = customNetworkInformation?.chainName;
+    // @ts-expect-error getNetworkImageSource is not implemented in typescript
+    chainImage = getNetworkImageSource({
+      chainId: customNetworkInformation?.chainId,
+    });
+  }
 
   const confirm = () => {
     onUserAction?.(USER_INTENT.Confirm);
+    onConfirm?.();
   };
 
   const cancel = () => {
     onUserAction?.(USER_INTENT.Cancel);
+    onCancel?.();
   };
 
   const handleEditAccountsButtonPress = () => {
@@ -208,21 +227,33 @@ const PermissionsSummary = ({
               {strings('permissions.use_enabled_networks')}
             </TextComponent>
             <View style={styles.permissionRequestNetworkInfo}>
-              <View style={styles.permissionRequestNetworkName}>
-                <TextComponent numberOfLines={1} ellipsizeMode="tail">
-                  <TextComponent variant={TextVariant.BodySM}>
-                    {strings('permissions.requesting_for')}
-                  </TextComponent>
-                  <TextComponent variant={TextVariant.BodySMMedium}>
-                    {networkName}
-                  </TextComponent>
-                </TextComponent>
-              </View>
-              <View style={styles.avatarGroup}>
-                <AvatarGroup
-                  avatarPropsList={SAMPLE_AVATARGROUP_PROPS.avatarPropsList}
-                />
-              </View>
+              {isNetworkSwitch && (
+                <>
+                  <View style={styles.permissionRequestNetworkName}>
+                    <TextComponent numberOfLines={1} ellipsizeMode="tail">
+                      <TextComponent variant={TextVariant.BodySM}>
+                        {strings('permissions.requesting_for')}
+                      </TextComponent>
+                      <TextComponent variant={TextVariant.BodySMMedium}>
+                        {chainName}
+                      </TextComponent>
+                    </TextComponent>
+                  </View>
+                  <Avatar
+                    variant={AvatarVariant.Network}
+                    size={AvatarSize.Xs}
+                    name={chainName}
+                    imageSource={chainImage}
+                  />
+                </>
+              )}
+              {!isNetworkSwitch && (
+                <View style={styles.avatarGroup}>
+                  <AvatarGroup
+                    avatarPropsList={SAMPLE_AVATARGROUP_PROPS.avatarPropsList}
+                  />
+                </View>
+              )}
             </View>
           </View>
           {!isNetworkSwitch && renderEndAccessory()}
@@ -247,6 +278,7 @@ const PermissionsSummary = ({
                   })}
             </TextComponent>
           </View>
+          {/*TODO These should be conditional upon which permissions are being requested*/}
           {!isNetworkSwitch && renderAccountPermissionsRequestInfoCard()}
           {renderNetworkPermissionsRequestInfoCard()}
         </View>

diff --git a/app/components/UI/PermissionsSummary/PermissionsSummary.types.ts b/app/components/UI/PermissionsSummary/PermissionsSummary.types.ts
@@ -9,10 +9,16 @@ export interface PermissionsSummaryProps {
   onEdit?: () => void;
   onEditNetworks?: () => void;
   onBack?: () => void;
+  onCancel?: () => void;
+  onConfirm?: () => void;
   onUserAction?: React.Dispatch<React.SetStateAction<USER_INTENT>>;
   showActionButtons?: boolean;
   isAlreadyConnected?: boolean;
   isRenderedAsBottomSheet?: boolean;
   isDisconnectAllShown?: boolean;
   isNetworkSwitch?: boolean;
+  customNetworkInformation?: {
+    chainName: string;
+    chainId: string;
+  };
 }