Merge pull request #19674 from Skalakid/17026-migrate-CurrencySymbolB…

…utton 17026 - migrate CurrencySymbolButton to PressableWithoutFeedback
Expensify · May 29, 2023 · 7bf0763 · 7bf0763
2 parents 63a9bbb + 6b4c0d2
commit 7bf0763
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 7 deletions.
diff --git a/src/components/CurrencySymbolButton.js b/src/components/CurrencySymbolButton.js
@@ -1,10 +1,10 @@
 import React from 'react';
-import {TouchableOpacity} from 'react-native';
 import PropTypes from 'prop-types';
 import Text from './Text';
 import styles from '../styles/styles';
 import Tooltip from './Tooltip';
 import withLocalize, {withLocalizePropTypes} from './withLocalize';
+import PressableWithoutFeedback from './Pressable/PressableWithoutFeedback';
 
 const propTypes = {
     /** Currency symbol of selected currency */
@@ -19,9 +19,13 @@ const propTypes = {
 function CurrencySymbolButton(props) {
     return (
         <Tooltip text={props.translate('iOUCurrencySelection.selectCurrency')}>
-            <TouchableOpacity onPress={props.onCurrencyButtonPress}>
+            <PressableWithoutFeedback
+                onPress={props.onCurrencyButtonPress}
+                accessibilityLabel={props.translate('iOUCurrencySelection.selectCurrency')}
+                accessibilityRole="button"
+            >
                 <Text style={styles.iouAmountText}>{props.currencySymbol}</Text>
-            </TouchableOpacity>
+            </PressableWithoutFeedback>
         </Tooltip>
     );
 }

diff --git a/src/components/Pressable/PressableWithoutFeedback.js b/src/components/Pressable/PressableWithoutFeedback.js
@@ -5,11 +5,16 @@ import GenericPressableProps from './GenericPressable/PropTypes';
 
 const omittedProps = ['pressStyle', 'hoverStyle', 'focusStyle', 'activeStyle', 'disabledStyle', 'screenReaderActiveStyle', 'shouldUseHapticsOnPress', 'shouldUseHapticsOnLongPress'];
 
-const PressableWithoutFeedback = (props) => {
+const PressableWithoutFeedback = React.forwardRef((props, ref) => {
     const propsWithoutStyling = _.omit(props, omittedProps);
-    // eslint-disable-next-line react/jsx-props-no-spreading
-    return <GenericPressable {...propsWithoutStyling} />;
-};
+    return (
+        <GenericPressable
+            // eslint-disable-next-line react/jsx-props-no-spreading
+            {...propsWithoutStyling}
+            ref={ref}
+        />
+    );
+});
 
 PressableWithoutFeedback.displayName = 'PressableWithoutFeedback';
 PressableWithoutFeedback.propTypes = _.omit(GenericPressableProps.pressablePropTypes, omittedProps);