Added condition to prevent user mention suggestion from showing when …

…composer is not focused
Expensify · Oct 19, 2023 · 5903e5e · 5903e5e
1 parent 229cb5d
commit 5903e5e
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 2 deletions.
diff --git a/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions.js b/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions.js
@@ -566,6 +566,7 @@ function ComposerWithSuggestions({
             <Suggestions
                 ref={suggestionsRef}
                 isComposerFullSize={isComposerFullSize}
+                isComposerFocused={textInputRef.current && textInputRef.current.isFocused()}
                 updateComment={updateComment}
                 composerHeight={composerHeight}
                 measureParentContainer={measureParentContainer}

diff --git a/src/pages/home/report/ReportActionCompose/SuggestionMention.js b/src/pages/home/report/ReportActionCompose/SuggestionMention.js
@@ -54,6 +54,7 @@ function SuggestionMention({
     forwardedRef,
     isAutoSuggestionPickerLarge,
     measureParentContainer,
+    isComposerFocused,
 }) {
     const {translate} = useLocalize();
     const [suggestionValues, setSuggestionValues] = useState(defaultSuggestionsValues);
@@ -181,7 +182,7 @@ function SuggestionMention({
 
     const calculateMentionSuggestion = useCallback(
         (selectionEnd) => {
-            if (shouldBlockCalc.current || selectionEnd < 1) {
+            if (shouldBlockCalc.current || selectionEnd < 1 || !isComposerFocused) {
                 shouldBlockCalc.current = false;
                 resetSuggestions();
                 return;
@@ -229,7 +230,7 @@ function SuggestionMention({
             }));
             setHighlightedMentionIndex(0);
         },
-        [getMentionOptions, personalDetails, resetSuggestions, setHighlightedMentionIndex, value],
+        [getMentionOptions, personalDetails, resetSuggestions, setHighlightedMentionIndex, value, isComposerFocused],
     );
 
     useEffect(() => {

diff --git a/src/pages/home/report/ReportActionCompose/Suggestions.js b/src/pages/home/report/ReportActionCompose/Suggestions.js
@@ -40,6 +40,7 @@ function Suggestions({
     resetKeyboardInput,
     measureParentContainer,
     isAutoSuggestionPickerLarge,
+    isComposerFocused,
 }) {
     const suggestionEmojiRef = useRef(null);
     const suggestionMentionRef = useRef(null);
@@ -103,6 +104,7 @@ function Suggestions({
         composerHeight,
         isAutoSuggestionPickerLarge,
         measureParentContainer,
+        isComposerFocused,
     };
 
     return (

diff --git a/src/pages/home/report/ReportActionCompose/suggestionProps.js b/src/pages/home/report/ReportActionCompose/suggestionProps.js
@@ -24,6 +24,9 @@ const baseProps = {
 
     /** Meaures the parent container's position and dimensions. */
     measureParentContainer: PropTypes.func.isRequired,
+
+    /** Report composer focus state */
+    isComposerFocused: PropTypes.bool,
 };
 
 const implementationBaseProps = {