From 87445e11dc683787ce876e3329cde81ee10e469e Mon Sep 17 00:00:00 2001 From: Monte Lai Date: Thu, 6 Nov 2025 17:20:45 +0800 Subject: [PATCH 1/4] fix: styling for backup and sync toggle. (#22128) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## **Description** This PR fixes the issue where android does not show a disabled state when back up and sync is disabled. ## **Changelog** CHANGELOG entry: Fixes the disabled appearance for backup and sync on android. ## **Related issues** Fixes: https://github.com/MetaMask/metamask-mobile/issues/20034 Fixes: https://consensyssoftware.atlassian.net/browse/MUL-1213?atlOrigin=eyJpIjoiNWZmODdiY2NlZTJiNDAwMGEyZjcyOWUwNjI0OTNlYWYiLCJwIjoiaiJ9 ## **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** ### **Before** [mul-1213-before.webm](https://github.com/user-attachments/assets/97d7dcad-cdc7-417b-a29a-1243adef246f) ### **After** [mul-1213-after.webm](https://github.com/user-attachments/assets/aaad6fb7-99f1-465b-895e-d422717f6adf) ## **Pre-merge author checklist** - [x] 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). - [x] I've completed the PR template to the best of my ability - [x] I’ve included tests if applicable - [x] I’ve documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [x] 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** - [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [ ] 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. --- > [!NOTE] > Adjusts Backup & Sync feature toggles to properly display a disabled state on Android by computing a memoized disabled flag and updating Switch track colors. > > - **UI (BackupAndSyncFeaturesToggles)** > - Compute `isDisabled` via `useMemo` from `isBackupAndSyncEnabled` and `isBackupAndSyncUpdateLoading`. > - Update `Switch` `trackColor.true` to show `colors.border.muted` when disabled or off (Android-specific behavior), otherwise `colors.primary.default`. > - **Tests** > - Update snapshots to reflect muted disabled track/tint colors. > > Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit 53a88cbb8aa65832fb7f8ea8666329902fb318c1. This will update automatically on new commits. Configure [here](https://cursor.com/dashboard?tab=bugbot). --- .../BackupAndSyncFeaturesToggles.tsx | 16 +++++++++++++--- .../BackupAndSyncFeaturesToggles.test.tsx.snap | 4 ++-- 2 files changed, 15 insertions(+), 5 deletions(-) diff --git a/app/components/UI/Identity/BackupAndSyncFeaturesToggles/BackupAndSyncFeaturesToggles.tsx b/app/components/UI/Identity/BackupAndSyncFeaturesToggles/BackupAndSyncFeaturesToggles.tsx index 8bb3ffbaddc..938f954e9b6 100644 --- a/app/components/UI/Identity/BackupAndSyncFeaturesToggles/BackupAndSyncFeaturesToggles.tsx +++ b/app/components/UI/Identity/BackupAndSyncFeaturesToggles/BackupAndSyncFeaturesToggles.tsx @@ -1,4 +1,4 @@ -import React, { useCallback } from 'react'; +import React, { useCallback, useMemo } from 'react'; import { View, Switch, InteractionManager } from 'react-native'; import Text, { @@ -83,6 +83,11 @@ const FeatureToggle = ({ }); }; + const isDisabled = useMemo( + () => !isBackupAndSyncEnabled || isBackupAndSyncUpdateLoading, + [isBackupAndSyncEnabled, isBackupAndSyncUpdateLoading], + ); + return ( @@ -92,10 +97,15 @@ const FeatureToggle = ({ Date: Thu, 6 Nov 2025 11:53:08 +0100 Subject: [PATCH 2/4] fix: cp-7.59.0 Return empty contacts for nonEVM send flow (#22235) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## **Description** This PR early return empty contacts for nonEVM send flow contact recipients. BTC feature is getting released in this release hence there is no need for changelog. ## **Changelog** CHANGELOG entry: null ## **Related issues** Fixes: https://github.com/MetaMask/metamask-mobile/issues/22205 ## **Manual testing steps** Contacts shouldn't appear for nonEVM send flow as it's EVM only. ## **Screenshots/Recordings** ### **Before** ### **After** ## **Pre-merge author checklist** - [X] 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). - [X] I've completed the PR template to the best of my ability - [X] I’ve included tests if applicable - [X] I’ve documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [X] 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** - [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [ ] 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. --- > [!NOTE] > Ensure `useContacts` returns an empty list for non-EVM send types and add a test to cover it. > > - **Hooks**: > - `useContacts`: include `isNonEvmSendType` from `useSendType` and early-return `[]` when true; retain EVM-only address filtering logic. > - **Tests**: > - Add test verifying empty contacts when `isNonEvmSendType` is true. > > Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit 31d42ce46666bdd69ce552e9e8663540333e741f. This will update automatically on new commits. Configure [here](https://cursor.com/dashboard?tab=bugbot). --- .../confirmations/hooks/send/useContacts.test.ts | 14 ++++++++++++++ .../Views/confirmations/hooks/send/useContacts.ts | 6 +++++- 2 files changed, 19 insertions(+), 1 deletion(-) diff --git a/app/components/Views/confirmations/hooks/send/useContacts.test.ts b/app/components/Views/confirmations/hooks/send/useContacts.test.ts index 4afd02b3201..c059c565f4f 100644 --- a/app/components/Views/confirmations/hooks/send/useContacts.test.ts +++ b/app/components/Views/confirmations/hooks/send/useContacts.test.ts @@ -201,6 +201,20 @@ describe('useContacts', () => { expect(result.current).toEqual([]); }); + it('returns empty array when isNonEvmSendType is true', () => { + mockUseSendType.mockReturnValue({ + isEvmSendType: true, + isSolanaSendType: false, + isEvmNativeSendType: false, + isNonEvmSendType: true, + isNonEvmNativeSendType: false, + isBitcoinSendType: false, + isTronSendType: false, + }); + const { result } = renderHook(() => useContacts()); + expect(result.current).toEqual([]); + }); + it('handles address book with empty chains', () => { mockUseSelector.mockImplementation((selector) => { if (selector === selectAddressBook) { diff --git a/app/components/Views/confirmations/hooks/send/useContacts.ts b/app/components/Views/confirmations/hooks/send/useContacts.ts index 132ec0bb350..2a9edfc9b41 100644 --- a/app/components/Views/confirmations/hooks/send/useContacts.ts +++ b/app/components/Views/confirmations/hooks/send/useContacts.ts @@ -8,7 +8,7 @@ import { useSendType } from './useSendType'; export const useContacts = () => { const addressBook = useSelector(selectAddressBook); - const { isEvmSendType } = useSendType(); + const { isEvmSendType, isNonEvmSendType } = useSendType(); const contacts = useMemo(() => { const flattenedContacts: RecipientType[] = []; @@ -38,5 +38,9 @@ export const useContacts = () => { }); }, [addressBook, isEvmSendType]); + if (isNonEvmSendType) { + return []; + } + return contacts; }; From 362b21456632c2b3251c4c1ea636d81146c9ae0b Mon Sep 17 00:00:00 2001 From: Xiaoming Wang <7315988+dawnseeker8@users.noreply.github.com> Date: Thu, 6 Nov 2025 18:57:51 +0800 Subject: [PATCH 3/4] fix: 20839 fix the qr name not matched in swap page. (#22043) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This PR fix QR not match in swap page. ## **Description** ## **Changelog** CHANGELOG entry: Change the name of QR in swap page to match the name in account list. ## **Related issues** Fixes: #20839 ## **Manual testing steps** Android 1. Add hardware wallet 2. Import QR accounts 3. Initiate Swap via QR account (POL-> USDT) 4. Verify account name on swap confirmation screen is same as account list account name ## **Screenshots/Recordings** ### **Before** https://github.com/user-attachments/assets/91c7c831-537b-4f44-be41-4519e42fcaaf ### **After** ![newScreen](https://github.com/user-attachments/assets/fd5705cb-7872-459b-ae04-90abaf52d194) ## **Pre-merge author checklist** - [x] 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). - [x] I've completed the PR template to the best of my ability - [x] I’ve included tests if applicable - [x] I’ve documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [x] 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. --- > [!NOTE] > Displays account group name (when available) with truncated label and restructures AccountInfoCard layout; adds helper for short names and updates snapshots. > > - **UI** > - **AccountInfoCard (`app/components/UI/AccountInfoCard/index.js`)**: > - Resolve account label from `accountToGroupMap` (fallback to `renderAccountName`); wire new prop via `selectAccountToGroupMap`. > - Truncate long account names using new `renderShortAccountName`; add `tooltip` with full name. > - Restructure layout: separate rows for `accountName`, `address`, and `balance`; add `marginLeft: 8`; remove parentheses around `address`. > - **Utils** > - **`app/util/address/index.ts`**: Add `renderShortAccountName(accountName, chars=20)`. > - **Tests/Snapshots** > - Update snapshots for `AccountInfoCard` and `AccountApproval` to reflect name truncation, tooltip, address formatting, and layout changes. > > Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit 1f3d78381234257a1deae96197b06c29563ae6a8. This will update automatically on new commits. Configure [here](https://cursor.com/dashboard?tab=bugbot). --- .../__snapshots__/index.test.tsx.snap | 64 +++++++++++++------ .../__snapshots__/index.test.tsx.snap | 64 +++++++++++++------ app/components/UI/AccountInfoCard/index.js | 51 ++++++++++----- app/util/address/index.test.ts | 19 ++++++ app/util/address/index.ts | 18 ++++++ 5 files changed, 158 insertions(+), 58 deletions(-) diff --git a/app/components/UI/AccountApproval/__snapshots__/index.test.tsx.snap b/app/components/UI/AccountApproval/__snapshots__/index.test.tsx.snap index 5e17a5bb2f6..07dbb426956 100644 --- a/app/components/UI/AccountApproval/__snapshots__/index.test.tsx.snap +++ b/app/components/UI/AccountApproval/__snapshots__/index.test.tsx.snap @@ -303,6 +303,7 @@ exports[`AccountApproval should render correctly 1`] = ` { "flexDirection": "row", "justifyContent": "flex-start", + "marginLeft": 8, "width": "100%", } } @@ -327,9 +328,21 @@ exports[`AccountApproval should render correctly 1`] = ` "lineHeight": 24, } } + tooltip="Account 2" > Account 2 + + - ( 0xC4966...4a756 - ) - - Balance: - - 0 ETH - + + Balance: + + 0 ETH + + diff --git a/app/components/UI/AccountInfoCard/__snapshots__/index.test.tsx.snap b/app/components/UI/AccountInfoCard/__snapshots__/index.test.tsx.snap index a0a0746d5bd..cb37f786963 100644 --- a/app/components/UI/AccountInfoCard/__snapshots__/index.test.tsx.snap +++ b/app/components/UI/AccountInfoCard/__snapshots__/index.test.tsx.snap @@ -87,6 +87,7 @@ exports[`AccountInfoCard should match snapshot 1`] = ` { "flexDirection": "row", "justifyContent": "flex-start", + "marginLeft": 8, "width": "100%", } } @@ -111,9 +112,21 @@ exports[`AccountInfoCard should match snapshot 1`] = ` "lineHeight": 24, } } + tooltip="Account 1" > Account 1 + + - ( 0xC4955...4D272 - ) - - Balance: - - < 0.00001 SepoliaETH - + + Balance: + + < 0.00001 SepoliaETH + + `; diff --git a/app/components/UI/AccountInfoCard/index.js b/app/components/UI/AccountInfoCard/index.js index f3e22eab2e9..75c353af29f 100644 --- a/app/components/UI/AccountInfoCard/index.js +++ b/app/components/UI/AccountInfoCard/index.js @@ -1,8 +1,8 @@ import isUrl from 'is-url'; import PropTypes from 'prop-types'; import React, { PureComponent } from 'react'; -import { StyleSheet, View } from 'react-native'; import { connect } from 'react-redux'; +import { StyleSheet, View } from 'react-native'; import { strings } from '../../../../locales/i18n'; import Text, { TextVariant, @@ -20,6 +20,8 @@ import { renderAccountName, renderShortAddress, safeToChecksumAddress, + getInternalAccountByAddress, + renderShortAccountName, } from '../../../util/address'; import Device from '../../../util/device'; import { hexToBN, renderFromWei, weiToFiat } from '../../../util/number'; @@ -33,6 +35,7 @@ import ApproveTransactionHeader from '../../Views/confirmations/legacy/component import Identicon from '../Identicon'; import { selectInternalAccounts } from '../../../selectors/accountsController'; import { selectSignatureRequests } from '../../../selectors/signatureController'; +import { selectAccountToGroupMap } from '../../../selectors/multichainAccounts/accountTreeController'; const createStyles = (colors) => StyleSheet.create({ @@ -59,6 +62,7 @@ const createStyles = (colors) => width: '100%', flexDirection: 'row', justifyContent: 'flex-start', + marginLeft: 8, }, accountName: { maxWidth: Device.isMediumDevice() ? '35%' : '45%', @@ -138,6 +142,7 @@ class AccountInfoCard extends PureComponent { transaction: PropTypes.object, origin: PropTypes.string, signatureRequests: PropTypes.object, + accountToGroupMap: PropTypes.object, }; render() { @@ -153,6 +158,7 @@ class AccountInfoCard extends PureComponent { transaction, origin, signatureRequests, + accountToGroupMap, } = this.props; const signatureRequest = Object.values(signatureRequests || {})?.[0]; @@ -164,7 +170,14 @@ class AccountInfoCard extends PureComponent { ? hexToBN(accounts[fromAddress].balance) : 0; const balance = `${renderFromWei(weiBalance)} ${getTicker(ticker)}`; - const accountLabel = renderAccountName(fromAddress, internalAccounts); + + const account = getInternalAccountByAddress(fromAddress); + const accountGroup = + account && accountToGroupMap ? accountToGroupMap[account.id] : undefined; + + const accountLabel = + accountGroup?.metadata?.name || + renderAccountName(fromAddress, internalAccounts); const address = renderShortAddress(fromAddress); const dollarBalance = showFiatBalance ? weiToFiat(weiBalance, conversionRate, currentCurrency, 2)?.toUpperCase() @@ -211,9 +224,12 @@ class AccountInfoCard extends PureComponent { styles.accountName, accountLabelTag ? styles.accountNameSmall : undefined, ]} + tooltip={accountLabel} > - {accountLabel} + {renderShortAccountName(accountLabel)} + + - ({address}) + {address} + + + + + {strings('signature_request.balance_title')}{' '} + {dollarBalance !== undefined + ? `${dollarBalance} (${balance})` + : balance} - - {strings('signature_request.balance_title')}{' '} - {dollarBalance !== undefined - ? `${dollarBalance} (${balance})` - : balance} - {accountLabelTag && ( @@ -258,6 +276,7 @@ const mapStateToProps = (state) => ({ transaction: getNormalizedTxState(state), activeTabUrl: getActiveTabUrl(state), signatureRequests: selectSignatureRequests(state), + accountToGroupMap: selectAccountToGroupMap(state), }); AccountInfoCard.contextType = ThemeContext; diff --git a/app/util/address/index.test.ts b/app/util/address/index.test.ts index 6e12ab83152..60ee2e4ef57 100644 --- a/app/util/address/index.test.ts +++ b/app/util/address/index.test.ts @@ -23,6 +23,7 @@ import { getTokenDetails, areAddressesEqual, toChecksumAddress, + renderShortAccountName, } from '.'; import { mockHDKeyringAddress, @@ -632,6 +633,24 @@ describe('getTokenDetails,', () => { }); }); +describe('renderShortAccountName', () => { + it('returns the short account name', () => { + expect(renderShortAccountName('Account 12345678')).toBe('Account 12345678'); + }); + + it('returns the short account name with the default number of characters', () => { + expect(renderShortAccountName('Account 12345678901234567890')).toBe( + 'Account 123456789012...', + ); + }); + + it('returns the short account name with the specified number of characters', () => { + expect(renderShortAccountName('Account 12345678', 13)).toBe( + 'Account 12345...', + ); + }); +}); + describe('areAddressesEqual', () => { const ethAddress1 = '0xC4955C0d639D99699Bfd7Ec54d9FaFEe40e4D272'; const ethAddress1Lower = ethAddress1.toLowerCase(); diff --git a/app/util/address/index.ts b/app/util/address/index.ts index a47b5c531a1..6cfa247f72e 100644 --- a/app/util/address/index.ts +++ b/app/util/address/index.ts @@ -148,6 +148,24 @@ export function renderShortAddress(address: string, chars = 5) { )}`; } +/** + * Returns short account name format + * @param {String} accountName - String corresponding to an account name + * @param {Number} chars - Number of characters to show at the end and beginning. + * Defaults to 20. + * @returns {String} - String corresponding to short account name format + */ +export function renderShortAccountName( + accountName: string, + chars: number = 20, +): string { + if (!accountName) return accountName; + if (accountName.length <= chars) { + return accountName; + } + return `${accountName.substr(0, chars)}...`; +} + export function renderSlightlyLongAddress( address: string, chars = 4, From beb4564313b6921e1531b6c2dd584bf8df41bf29 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Patryk=20=C5=81ucka?= <5708018+PatrykLucka@users.noreply.github.com> Date: Thu, 6 Nov 2025 12:29:04 +0100 Subject: [PATCH 4/4] fix: backdrop press on edit rpc bottom sheets (#22098) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## **Description** This PR fixes backdrop press on edit rpc bottom sheets ## **Changelog** CHANGELOG entry: Fixed a bug preventing edit rpc bottom sheet to close ## **Related issues** Fixes: https://consensyssoftware.atlassian.net/browse/TMCU-21 ## **Manual testing steps** ```gherkin Feature: Edit rpc url Scenario: user is adding new custom network Given user onboarded When user navigates to Activity > Networks dropdown > Custom > + Add a custom network > RPC URL Then user is able to close bottom sheet by clicking above the bottom sheet ``` ## **Screenshots/Recordings** ### **Before** https://github.com/user-attachments/assets/af8e59be-ac66-4d5f-b679-4919c42e423a ### **After** https://github.com/user-attachments/assets/4e33f3c7-3ba4-469d-807e-17714703a78d ## **Pre-merge author checklist** - [x] 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). - [x] I've completed the PR template to the best of my ability - [x] I’ve included tests if applicable - [x] I’ve documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [x] 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** - [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [ ] 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. --- > [!NOTE] > Enables closing bottom sheets via backdrop tap/swipe and refactors Bridge to use shared parse/format utilities with minor UI loading improvements. > > - **Modals**: > - `app/components/UI/NetworkModal/index.tsx`: Add `onBackdropPress` and `onSwipeComplete` to close on backdrop tap/swipe. > - `app/components/UI/ReusableModal/index.tsx`: Make backdrop a pressable `TouchableOpacity` that dismisses; remove inner blocking touchable. > - *Tests/Snapshots*: Update affected snapshots (`CollectibleModal`, `LedgerMessageSignModal`, `ReusableModal`, `UpdateNeeded`, `AssetOptions`, `NetworkSelector`) to reflect interactive backdrop. > - **Bridge**: > - Consolidate amount parsing: switch imports to `../../Ramp/Aggregator/utils/parseAmount` in `TokenInputArea`, `TokenSelectorItem`, and `useIntentAmount`. > - Replace custom currency formatter by importing `formatCurrency` from `../../Ramp/Deposit/utils`; remove `utils/currencyUtils.ts` and its tests. > - UI: Use `SkeletonText` for loading balances in `TokenSelectorItem`. > > Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit 02180ed694f5457f31ad27ea0e8738772da2f4ce. This will update automatically on new commits. Configure [here](https://cursor.com/dashboard?tab=bugbot). --- .../CollectibleModal.test.tsx.snap | 58 ++++----- .../LedgerMessageSignModal.test.tsx.snap | 58 ++++----- .../__snapshots__/index.test.tsx.snap | 6 +- app/components/UI/NetworkModal/index.tsx | 2 + .../__snapshots__/index.test.tsx.snap | 61 ++++----- app/components/UI/ReusableModal/index.tsx | 14 ++- .../__snapshots__/UpdateNeeded.test.tsx.snap | 58 ++++----- .../__snapshots__/AssetOptions.test.tsx.snap | 60 ++++----- .../NetworkSelector.test.tsx.snap | 116 +++++++++--------- 9 files changed, 227 insertions(+), 206 deletions(-) diff --git a/app/components/UI/CollectibleModal/__snapshots__/CollectibleModal.test.tsx.snap b/app/components/UI/CollectibleModal/__snapshots__/CollectibleModal.test.tsx.snap index 85bb3f2eb2f..78ce89a4052 100644 --- a/app/components/UI/CollectibleModal/__snapshots__/CollectibleModal.test.tsx.snap +++ b/app/components/UI/CollectibleModal/__snapshots__/CollectibleModal.test.tsx.snap @@ -12,23 +12,38 @@ exports[`CollectibleModal should render correctly 1`] = ` } } > - + > + + - - + > + + - { backdropOpacity={0.7} animationInTiming={600} animationOutTiming={600} + onBackdropPress={onClose} + onSwipeComplete={onClose} propagateSwipe > diff --git a/app/components/UI/ReusableModal/__snapshots__/index.test.tsx.snap b/app/components/UI/ReusableModal/__snapshots__/index.test.tsx.snap index 8afb68ae767..52e75e9cf08 100644 --- a/app/components/UI/ReusableModal/__snapshots__/index.test.tsx.snap +++ b/app/components/UI/ReusableModal/__snapshots__/index.test.tsx.snap @@ -13,23 +13,38 @@ exports[`ReusableModal should render correctly 1`] = ` } } > - + > + + - - + /> `; diff --git a/app/components/UI/ReusableModal/index.tsx b/app/components/UI/ReusableModal/index.tsx index 05e7c4428cb..a9b90028f4a 100644 --- a/app/components/UI/ReusableModal/index.tsx +++ b/app/components/UI/ReusableModal/index.tsx @@ -210,17 +210,19 @@ const ReusableModal = forwardRef( return ( - + + + - {children} diff --git a/app/components/UI/UpdateNeeded/__snapshots__/UpdateNeeded.test.tsx.snap b/app/components/UI/UpdateNeeded/__snapshots__/UpdateNeeded.test.tsx.snap index 255687c9fed..faa6737ab0b 100644 --- a/app/components/UI/UpdateNeeded/__snapshots__/UpdateNeeded.test.tsx.snap +++ b/app/components/UI/UpdateNeeded/__snapshots__/UpdateNeeded.test.tsx.snap @@ -323,23 +323,38 @@ exports[`UpdateNeeded should render snapshot correctly 1`] = ` } } > - + > + + - - + + + - - + + + - - + > + + - - + > + + -