From 1e65e1d5719d8d01a23602824737317f4163150d Mon Sep 17 00:00:00 2001 From: Robert Kozik Date: Tue, 13 Jun 2023 11:01:33 +0200 Subject: [PATCH 1/2] move PressableWithDelayToggle to components/Pressable directory --- src/components/CopyTextToClipboard.js | 2 +- .../PressableWithDelayToggle.js | 22 +++++++++---------- src/components/Pressable/index.js | 1 + .../Security/TwoFactorAuth/CodesPage.js | 2 +- .../Security/TwoFactorAuth/VerifyPage.js | 2 +- 5 files changed, 15 insertions(+), 14 deletions(-) rename src/components/{ => Pressable}/PressableWithDelayToggle.js (90%) diff --git a/src/components/CopyTextToClipboard.js b/src/components/CopyTextToClipboard.js index 1f9affab67d4..2c82b2be4828 100644 --- a/src/components/CopyTextToClipboard.js +++ b/src/components/CopyTextToClipboard.js @@ -1,7 +1,7 @@ import React, {useCallback} from 'react'; import PropTypes from 'prop-types'; import * as Expensicons from './Icon/Expensicons'; -import PressableWithDelayToggle from './PressableWithDelayToggle'; +import PressableWithDelayToggle from './Pressable/PressableWithDelayToggle'; import Clipboard from '../libs/Clipboard'; import withLocalize, {withLocalizePropTypes} from './withLocalize'; diff --git a/src/components/PressableWithDelayToggle.js b/src/components/Pressable/PressableWithDelayToggle.js similarity index 90% rename from src/components/PressableWithDelayToggle.js rename to src/components/Pressable/PressableWithDelayToggle.js index 57f561ec91ac..e909ae6da3f6 100644 --- a/src/components/PressableWithDelayToggle.js +++ b/src/components/Pressable/PressableWithDelayToggle.js @@ -1,17 +1,17 @@ import React from 'react'; import PropTypes from 'prop-types'; import {Pressable} from 'react-native'; -import * as Expensicons from './Icon/Expensicons'; -import compose from '../libs/compose'; -import Icon from './Icon'; -import Tooltip from './Tooltip'; -import Text from './Text'; -import styles from '../styles/styles'; -import variables from '../styles/variables'; -import getButtonState from '../libs/getButtonState'; -import * as StyleUtils from '../styles/StyleUtils'; -import withLocalize, {withLocalizePropTypes} from './withLocalize'; -import withDelayToggleButtonState, {withDelayToggleButtonStatePropTypes} from './withDelayToggleButtonState'; +import * as Expensicons from '../Icon/Expensicons'; +import compose from '../../libs/compose'; +import Icon from '../Icon'; +import Tooltip from '../Tooltip'; +import Text from '../Text'; +import styles from '../../styles/styles'; +import variables from '../../styles/variables'; +import getButtonState from '../../libs/getButtonState'; +import * as StyleUtils from '../../styles/StyleUtils'; +import withLocalize, {withLocalizePropTypes} from '../withLocalize'; +import withDelayToggleButtonState, {withDelayToggleButtonStatePropTypes} from '../withDelayToggleButtonState'; const propTypes = { ...withLocalizePropTypes, diff --git a/src/components/Pressable/index.js b/src/components/Pressable/index.js index 83f597b3de8d..e0420ac05edd 100644 --- a/src/components/Pressable/index.js +++ b/src/components/Pressable/index.js @@ -1,3 +1,4 @@ export {default as GenericPressable} from './GenericPressable'; export {default as PressableWithFeedback} from './PressableWithFeedback'; export {default as PressableWithoutFeedback} from './PressableWithoutFeedback'; +export {default as PressableWithDelayToggle} from './PressableWithDelayToggle'; diff --git a/src/pages/settings/Security/TwoFactorAuth/CodesPage.js b/src/pages/settings/Security/TwoFactorAuth/CodesPage.js index 02911676d430..b8767e469ba5 100644 --- a/src/pages/settings/Security/TwoFactorAuth/CodesPage.js +++ b/src/pages/settings/Security/TwoFactorAuth/CodesPage.js @@ -17,7 +17,7 @@ import withWindowDimensions, {windowDimensionsPropTypes} from '../../../../compo import styles from '../../../../styles/styles'; import FixedFooter from '../../../../components/FixedFooter'; import Button from '../../../../components/Button'; -import PressableWithDelayToggle from '../../../../components/PressableWithDelayToggle'; +import PressableWithDelayToggle from '../../../../components/Pressable/PressableWithDelayToggle'; import Text from '../../../../components/Text'; import Section from '../../../../components/Section'; import ONYXKEYS from '../../../../ONYXKEYS'; diff --git a/src/pages/settings/Security/TwoFactorAuth/VerifyPage.js b/src/pages/settings/Security/TwoFactorAuth/VerifyPage.js index d3a53a0a03be..ee412c69db10 100644 --- a/src/pages/settings/Security/TwoFactorAuth/VerifyPage.js +++ b/src/pages/settings/Security/TwoFactorAuth/VerifyPage.js @@ -18,7 +18,7 @@ import TextLink from '../../../../components/TextLink'; import Clipboard from '../../../../libs/Clipboard'; import FixedFooter from '../../../../components/FixedFooter'; import * as Expensicons from '../../../../components/Icon/Expensicons'; -import PressableWithDelayToggle from '../../../../components/PressableWithDelayToggle'; +import PressableWithDelayToggle from '../../../../components/Pressable/PressableWithDelayToggle'; import TwoFactorAuthForm from './TwoFactorAuthForm'; import QRCode from '../../../../components/QRCode'; import expensifyLogo from '../../../../../assets/images/expensify-logo-round-transparent.png'; From cc6f0aa8df8618d0885563ddb2e516071f5e2644 Mon Sep 17 00:00:00 2001 From: Robert Kozik Date: Tue, 13 Jun 2023 11:06:25 +0200 Subject: [PATCH 2/2] migrate PressableWithDelayToggle to PressableWithoutFeedback --- .../Pressable/PressableWithDelayToggle.js | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) diff --git a/src/components/Pressable/PressableWithDelayToggle.js b/src/components/Pressable/PressableWithDelayToggle.js index e909ae6da3f6..740e1cd391c7 100644 --- a/src/components/Pressable/PressableWithDelayToggle.js +++ b/src/components/Pressable/PressableWithDelayToggle.js @@ -1,6 +1,5 @@ import React from 'react'; import PropTypes from 'prop-types'; -import {Pressable} from 'react-native'; import * as Expensicons from '../Icon/Expensicons'; import compose from '../../libs/compose'; import Icon from '../Icon'; @@ -12,6 +11,7 @@ import getButtonState from '../../libs/getButtonState'; import * as StyleUtils from '../../styles/StyleUtils'; import withLocalize, {withLocalizePropTypes} from '../withLocalize'; import withDelayToggleButtonState, {withDelayToggleButtonStatePropTypes} from '../withDelayToggleButtonState'; +import PressableWithoutFeedback from './PressableWithoutFeedback'; const propTypes = { ...withLocalizePropTypes, @@ -84,16 +84,19 @@ function PressableWithDelayToggle(props) { // Due to limitations in RN regarding the vertical text alignment of non-Text elements, // for elements that are supposed to be inline, we need to use a Text element instead // of a Pressable - const PressableView = props.inline ? Text : Pressable; + const PressableView = props.inline ? Text : PressableWithoutFeedback; + const tooltipText = props.isDelayButtonStateComplete ? props.tooltipTextChecked : props.tooltipText; return ( <> {props.isDelayButtonStateComplete && props.textChecked ? props.textChecked : props.text} - {({hovered, pressed}) => ( @@ -121,7 +123,7 @@ function PressableWithDelayToggle(props) { )} )} - +