Merge branch 'main' into bkirby/rampsSell

MetaMask · Oct 8, 2024 · a2afce2 · a2afce2
2 parents 39a7e12 + 368fc19
commit a2afce2
Show file tree

Hide file tree

Showing 250 changed files with 26,276 additions and 28,917 deletions.
diff --git a/.git-blame-ignore-revs b/.git-blame-ignore-revs
@@ -2,3 +2,5 @@
 57afe4ca921d85a51a923470239ca977fccbd1ae
 # Standardize prettier configuration https://github.com/MetaMask/metamask-mobile/pull/4182
 bdb7f37c90e4fc923881a07fca38d4e77c73a579
+# Fix mixed tabs and spaces https://github.com/MetaMask/metamask-mobile/pull/1379
+9f9a1121c6899e06d4aeef29017bb479df142adb
diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
@@ -94,10 +94,25 @@ app/components/Views/NftDetails @MetaMask/metamask-assets
 app/reducers/collectibles @MetaMask/metamask-assets
 
 # UX Team
-app/components                       @MetaMask/wallet-ux
-app/reducers/experimentalSettings    @MetaMask/wallet-ux
-app/reducers/modals                  @MetaMask/wallet-ux
-app/reducers/navigation              @MetaMask/wallet-ux
-app/reducers/onboarding              @MetaMask/wallet-ux
-app/reducers/privacy                 @MetaMask/wallet-ux
-app/reducers/settings                @MetaMask/wallet-ux
+app/components/Views/AccountActions @MetaMask/wallet-ux
+app/components/Views/AccountSelector @MetaMask/wallet-ux
+app/components/Views/AddressQRCode @MetaMask/wallet-ux
+app/components/Views/EditAccountName @MetaMask/wallet-ux
+app/components/Views/LockScreen @MetaMask/wallet-ux
+app/components/Views/Login @MetaMask/wallet-ux
+app/components/Views/NetworkConnect @MetaMask/wallet-ux
+app/components/Views/NetworkSelector @MetaMask/wallet-ux
+app/components/Views/Onboarding @MetaMask/wallet-ux
+app/components/Views/OnboardingCarousel @MetaMask/wallet-ux
+app/components/Views/OnboardingSuccess @MetaMask/wallet-ux
+app/components/Views/QRAccountDisplay @MetaMask/wallet-ux
+app/components/Views/QRScanner @MetaMask/wallet-ux
+app/components/Views/Settings @MetaMask/wallet-ux
+app/components/Views/TermsAndConditions @MetaMask/wallet-ux
+
+app/reducers/experimentalSettings @MetaMask/wallet-ux
+app/reducers/modals @MetaMask/wallet-ux
+app/reducers/navigation @MetaMask/wallet-ux
+app/reducers/onboarding @MetaMask/wallet-ux
+app/reducers/privacy @MetaMask/wallet-ux
+app/reducers/settings @MetaMask/wallet-ux
diff --git a/.iyarc b/.iyarc
@@ -1,7 +1,3 @@
 # ReDoS vulnerability, no impact to this application, and fix not backported yet to the versions we use
 
 GHSA-c2qf-rxjj-qqgw
-
-# Sentry SDK Prototype Pollution gadget in JavaScript SDKs
-
-GHSA-593m-55hh-j8gv
diff --git a/.storybook/storybook.requires.js b/.storybook/storybook.requires.js
@@ -123,7 +123,9 @@ const getStories = () => {
     "./app/component-library/base-components/TagBase/TagBase.stories.tsx": require("../app/component-library/base-components/TagBase/TagBase.stories.tsx"),
     "./app/component-library/components-temp/TagColored/TagColored.stories.tsx": require("../app/component-library/components-temp/TagColored/TagColored.stories.tsx"),
     "./app/component-library/components-temp/KeyValueRow/KeyValueRow.stories.tsx": require("../app/component-library/components-temp/KeyValueRow/KeyValueRow.stories.tsx"),
-    "./app/components/UI/InfoRow/InfoRow.stories.tsx": require("../app/components/UI/InfoRow/InfoRow.stories.tsx"),
+    "./app/components/Views/confirmations/components/UI/InfoRow/InfoRow.stories.tsx": require("../app/components/Views/confirmations/components/UI/InfoRow/InfoRow.stories.tsx"),
+    "./app/components/Views/confirmations/components/UI/ExpandableSection/ExpandableSection.stories.tsx": require("../app/components/Views/confirmations/components/UI/ExpandableSection/ExpandableSection.stories.tsx"),
+    "./app/components/Views/confirmations/components/UI/Tooltip/Tooltip.stories.tsx": require("../app/components/Views/confirmations/components/UI/Tooltip/Tooltip.stories.tsx"),
   };
 };
 

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,7 +2,7 @@
 
 ## Current Main Branch
 
-## 7.32.0 - Sep 19, 2024
+## 7.32.0 - Oct 7, 2024
 
 ### Added
 
@@ -91,6 +91,9 @@
 - [#11193](https://github.com/MetaMask/metamask-mobile/pull/11193): fix: ItemMenu crash using dayjs (#11193)
 - [#11098](https://github.com/MetaMask/metamask-mobile/pull/11098): fix: badge count and ui polishing (#11098)
 
+## 7.31.1 - Oct 4, 2024
+### Fixed
+- [#11631](https://github.com/MetaMask/metamask-mobile/pull/11631): fix: Fixes UI issue in token details (#11631)
 
 ## 7.31.0 - Sep 6, 2024
 ### Added
@@ -361,10 +364,7 @@
 - [#10383](https://github.com/MetaMask/metamask-mobile/pull/10383): fix: race condition issues when doing batch-rpc calls in the DeeplinkProtocolService (#10383)
 - [#10365](https://github.com/MetaMask/metamask-mobile/pull/10365): fix: attribution link (#10365)
 - [#10303](https://github.com/MetaMask/metamask-mobile/pull/10303): fix: page navigation during QR accounts selection (#10303)
-<<<<<<< HEAD
 
-=======
->>>>>>> main
 ## 7.28.1 - Aug 15, 2024
 ### Fixed
 - [#10637](https://github.com/MetaMask/metamask-mobile/pull/10637): fix: swap button blocked by SwapsController polling issue (#10637)

diff --git a/android/app/build.gradle b/android/app/build.gradle
@@ -173,7 +173,7 @@ android {
         applicationId "io.metamask"
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
-        versionCode 1444
+        versionCode 1450
         versionName "7.32.0"
         testBuildType System.getProperty('testBuildType', 'debug')
         missingDimensionStrategy 'react-native-camera', 'general'

diff --git a/app/component-library/components-temp/KeyValueRow/KeyValueLabel/KeyValueLabel.tsx b/app/component-library/components-temp/KeyValueRow/KeyValueLabel/KeyValueLabel.tsx
@@ -14,46 +14,48 @@ import React from 'react';
 import { View } from 'react-native';
 import { KeyValueRowLabelProps, TooltipSizes } from '../KeyValueRow.types';
 import styleSheet from './KeyValueLabel.styles';
+import { isPreDefinedKeyValueRowLabel } from '../KeyValueRow.utils';
 
 /**
  * A label and tooltip component.
  *
  * @param {Object} props - Component props.
- * @param {TextVariant} [props.variant] - Optional text variant. Defaults to TextVariant.BodyMDMedium.
- * @param {TextVariant} [props.color] - Optional text color. Defaults to TextColor.Default.
- * @param {TextVariant} [props.tooltip] - Optional tooltip to render to the right of the label text.
+ * @param {PreDefinedKeyValueRowLabel | ReactNode} props.label - The label content to display.
+ * @param {KeyValueRowTooltip} [props.tooltip] - Optional tooltip to render to the right of the label.
  *
  * @returns {JSX.Element} The rendered KeyValueRowLabel component.
  */
-const KeyValueRowLabel = ({
-  label,
-  variant = TextVariant.BodyMDMedium,
-  color = TextColor.Default,
-  tooltip,
-}: KeyValueRowLabelProps) => {
+const KeyValueRowLabel = ({ label, tooltip }: KeyValueRowLabelProps) => {
   const { styles } = useStyles(styleSheet, {});
 
   const { openTooltipModal } = useTooltipModal();
 
-  const hasTooltip = tooltip?.title && tooltip?.text;
+  const hasTooltip = tooltip?.title && tooltip?.content;
 
   const onNavigateToTooltipModal = () => {
     if (!hasTooltip) return;
-    openTooltipModal(tooltip.title, tooltip.text);
+    openTooltipModal(tooltip.title, tooltip.content);
   };
 
   return (
     <View style={styles.labelContainer}>
-      <Label variant={variant} color={color}>
-        {label}
-      </Label>
+      {isPreDefinedKeyValueRowLabel(label) ? (
+        <Label
+          variant={label?.variant ?? TextVariant.BodyMDMedium}
+          color={label?.color ?? TextColor.Default}
+        >
+          {label.text}
+        </Label>
+      ) : (
+        label
+      )}
       {hasTooltip && (
         <ButtonIcon
           size={tooltip.size ?? TooltipSizes.Md}
           iconColor={IconColor.Muted}
-          iconName={IconName.Info}
+          iconName={IconName.Question}
           accessibilityRole="button"
-          accessibilityLabel={`${tooltip.title}} tooltip`}
+          accessibilityLabel={`${tooltip.title} tooltip`}
           onPress={onNavigateToTooltipModal}
         />
       )}

diff --git a/app/component-library/components-temp/KeyValueRow/KeyValueRow.stories.tsx b/app/component-library/components-temp/KeyValueRow/KeyValueRow.stories.tsx
@@ -8,6 +8,7 @@ import KeyValueRowComponent, {
 import Text, { TextColor, TextVariant } from '../../components/Texts/Text';
 import Title from '../../../components/Base/Title';
 import { IconColor, IconName, IconSize } from '../../components/Icons/Icon';
+import Button, { ButtonVariants } from '../../components/Buttons/Button';
 
 const KeyValueRowMeta = {
   title: 'Components Temp / KeyValueRow',
@@ -38,42 +39,56 @@ export const KeyValueRow = {
       <View style={styles.listItem}>
         <KeyValueRowComponent
           field={{
-            text: 'Sample Key Text',
+            label: {
+              text: 'Sample Key Text',
+            },
           }}
-          value={{ text: 'Sample Key Text' }}
+          value={{ label: { text: 'Sample Value Text' } }}
         />
         <KeyValueRowComponent
           field={{
-            text: 'Sample Key Text',
-            variant: TextVariant.BodySM,
-            color: TextColor.Alternative,
+            label: {
+              text: 'Sample Key Text',
+              variant: TextVariant.BodySM,
+              color: TextColor.Alternative,
+            },
           }}
           value={{
-            text: 'Sample Value Text',
-            variant: TextVariant.BodySMBold,
-            color: TextColor.Success,
+            label: {
+              text: 'Sample Value Text',
+              variant: TextVariant.BodySMBold,
+              color: TextColor.Success,
+            },
             tooltip: {
               title: 'Sample Title',
-              text: 'Sample Tooltip',
+              content:
+                'Pariatur nisi pariatur ex veniam ad. Non tempor nostrud sint velit cupidatat aliquip elit ut pariatur reprehenderit enim enim commodo eu.',
               size: TooltipSizes.Sm,
             },
           }}
         />
         <KeyValueRowComponent
           field={{
-            text: 'Sample Key Text',
+            label: {
+              text: 'Sample Key Text',
+            },
             tooltip: {
               title: 'Sample Tooltip',
-              text: 'Pariatur nisi pariatur ex veniam ad. Non tempor nostrud sint velit cupidatat aliquip elit ut pariatur reprehenderit enim enim commodo eu.',
+              content:
+                'Pariatur nisi pariatur ex veniam ad. Non tempor nostrud sint velit cupidatat aliquip elit ut pariatur reprehenderit enim enim commodo eu.',
             },
           }}
           value={{
-            text: 'Sample Value Text',
+            label: {
+              text: 'Sample Value Text',
+            },
           }}
         />
         <KeyValueRowComponent
           field={{
-            text: 'Sample Key Text',
+            label: {
+              text: 'Sample Key Text',
+            },
             icon: {
               name: IconName.Wifi,
               color: IconColor.Primary,
@@ -82,7 +97,9 @@ export const KeyValueRow = {
             },
           }}
           value={{
-            text: 'Sample Value Text',
+            label: {
+              text: 'Sample Value Text',
+            },
             icon: {
               name: IconName.Wifi,
               color: IconColor.Primary,
@@ -91,6 +108,28 @@ export const KeyValueRow = {
             },
           }}
         />
+        {/* Using Custom ReactNode */}
+        <KeyValueRowComponent
+          field={{
+            label: { text: 'Sample Key' },
+            icon: { name: IconName.UserCircleAdd, color: IconColor.Primary },
+            tooltip: {
+              title: 'Sample Tooltip',
+              content:
+                'Pariatur nisi pariatur ex veniam ad. Non tempor nostrud sint velit cupidatat aliquip elit ut pariatur reprehenderit enim enim commodo eu.',
+            },
+          }}
+          value={{
+            label: (
+              <Button
+                variant={ButtonVariants.Link}
+                label="Sample button"
+                // eslint-disable-next-line no-alert
+                onPress={() => alert('test')}
+              />
+            ),
+          }}
+        />
       </View>
     </View>
   ),

diff --git a/app/component-library/components-temp/KeyValueRow/KeyValueRow.test.tsx b/app/component-library/components-temp/KeyValueRow/KeyValueRow.test.tsx
@@ -19,8 +19,8 @@ describe('KeyValueRow', () => {
       it('should render when there is only text', () => {
         const { toJSON } = render(
           <KeyValueRow
-            field={{ text: 'Sample Key Text' }}
-            value={{ text: 'Sample Value Text' }}
+            field={{ label: { text: 'Sample Key Text' } }}
+            value={{ label: { text: 'Sample Value Text' } }}
           />,
         );
 
@@ -31,17 +31,17 @@ describe('KeyValueRow', () => {
         const { toJSON } = render(
           <KeyValueRow
             field={{
-              text: 'Key Text',
+              label: { text: 'Key Text' },
               tooltip: {
                 title: 'Sample Tooltip 1',
-                text: 'Tooltip 1 text',
+                content: 'Tooltip 1 text',
               },
             }}
             value={{
-              text: 'Value Text',
+              label: { text: 'Value Text' },
               tooltip: {
                 title: 'Sample Tooltip 2',
-                text: 'Tooltip 2 text',
+                content: 'Tooltip 2 text',
               },
             }}
           />,
@@ -54,13 +54,13 @@ describe('KeyValueRow', () => {
         const { toJSON } = render(
           <KeyValueRow
             field={{
-              text: 'Key Text',
+              label: { text: 'Key Text' },
               icon: {
                 name: IconName.Activity,
               },
             }}
             value={{
-              text: 'Value Text',
+              label: { text: 'Value Text' },
               icon: {
                 name: IconName.Add,
               },
@@ -75,23 +75,23 @@ describe('KeyValueRow', () => {
         const { toJSON } = render(
           <KeyValueRow
             field={{
-              text: 'Key Text',
+              label: { text: 'Key Text' },
               icon: {
                 name: IconName.Activity,
               },
               tooltip: {
                 title: 'Sample Tooltip 2',
-                text: 'Tooltip 2 text',
+                content: 'Tooltip 2 text',
               },
             }}
             value={{
-              text: 'Value Text',
+              label: { text: 'Value Text' },
               icon: {
                 name: IconName.Add,
               },
               tooltip: {
                 title: 'Sample Tooltip 2',
-                text: 'Tooltip 2 text',
+                content: 'Tooltip 2 text',
               },
             }}
           />,