Merge pull request #28953 from mkhutornyi/fix-25485

prevent focusing on composer while popover is open
Expensify · Oct 9, 2023 · 4a24fd6 · 4a24fd6
2 parents 547e10d + cdc45d7
commit 4a24fd6
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 4 deletions.
diff --git a/src/components/BaseMiniContextMenuItem.js b/src/components/BaseMiniContextMenuItem.js
@@ -61,6 +61,12 @@ function BaseMiniContextMenuItem(props) {
                         return;
                     }
 
+                    // Allow text input blur on right click
+                    if (!e || e.button === 2) {
+                        return;
+                    }
+
+                    // Prevent text input blur on left click
                     e.preventDefault();
                 }}
                 accessibilityLabel={props.tooltipText}

diff --git a/src/components/LHNOptionsList/OptionRowLHN.js b/src/components/LHNOptionsList/OptionRowLHN.js
@@ -171,11 +171,12 @@ function OptionRowLHN(props) {
                             props.onSelectRow(optionItem, popoverAnchor);
                         }}
                         onMouseDown={(e) => {
-                            if (!e) {
+                            // Allow composer blur on right click
+                            if (!e || e.button === 2) {
                                 return;
                             }
 
-                            // Prevent losing Composer focus
+                            // Prevent composer blur on left click
                             e.preventDefault();
                         }}
                         onSecondaryInteraction={(e) => showPopover(e)}

diff --git a/src/components/Reactions/AddReactionBubble.js b/src/components/Reactions/AddReactionBubble.js
@@ -88,8 +88,15 @@ function AddReactionBubble(props) {
                 ref={ref}
                 style={({hovered, pressed}) => [styles.emojiReactionBubble, styles.userSelectNone, StyleUtils.getEmojiReactionBubbleStyle(hovered || pressed, false, props.isContextMenu)]}
                 onPress={Session.checkIfActionIsAllowed(onPress)}
-                // Prevent text input blur when Add reaction is clicked
-                onMouseDown={(e) => e.preventDefault()}
+                onMouseDown={(e) => {
+                    // Allow text input blur when Add reaction is right clicked
+                    if (!e || e.button === 2) {
+                        return;
+                    }
+
+                    // Prevent text input blur when Add reaction is left clicked
+                    e.preventDefault();
+                }}
                 accessibilityLabel={props.translate('emojiReactions.addReactionTooltip')}
                 accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON}
                 // disable dimming