Merge pull request #20172 from Skalakid/17043-migrate-CategoryShortcu…

…tButton 17043 - migrate CategoryShortcutButton to PressableWithoutFeedback
Expensify · Jun 7, 2023 · c3b3a53 · c3b3a53
2 parents 1af8b3b + 66cf38d
commit c3b3a53
Showing 1 changed file with 5 additions and 3 deletions.
diff --git a/src/components/EmojiPicker/CategoryShortcutButton.js b/src/components/EmojiPicker/CategoryShortcutButton.js
@@ -1,6 +1,5 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
-import {Pressable} from 'react-native';
 import Icon from '../Icon';
 import Tooltip from '../Tooltip';
 import withLocalize, {withLocalizePropTypes} from '../withLocalize';
@@ -9,6 +8,7 @@ import styles from '../../styles/styles';
 import * as StyleUtils from '../../styles/StyleUtils';
 import getButtonState from '../../libs/getButtonState';
 import themeColors from '../../styles/themes/default';
+import PressableWithoutFeedback from '../Pressable/PressableWithoutFeedback';
 
 const propTypes = {
     /** The emoji code of the category header */
@@ -37,7 +37,7 @@ class CategoryShortcutButton extends PureComponent {
                 text={this.props.translate(`emojiPicker.headers.${this.props.code}`)}
                 shiftVertical={-4}
             >
-                <Pressable
+                <PressableWithoutFeedback
                     onPress={this.props.onPress}
                     onHoverIn={() => this.setState({isHighlighted: true})}
                     onHoverOut={() => this.setState({isHighlighted: false})}
@@ -46,14 +46,16 @@ class CategoryShortcutButton extends PureComponent {
                         styles.categoryShortcutButton,
                         this.state.isHighlighted && styles.emojiItemHighlighted,
                     ]}
+                    accessibilityLabel={`emojiPicker.headers.${this.props.code}`}
+                    accessibilityRole="button"
                 >
                     <Icon
                         fill={themeColors.icon}
                         src={this.props.icon}
                         height={variables.iconSizeNormal}
                         width={variables.iconSizeNormal}
                     />
-                </Pressable>
+                </PressableWithoutFeedback>
             </Tooltip>
         );
     }