From 05a5ce0e17dca126bb84e92cd926fcb7f6f122ee Mon Sep 17 00:00:00 2001
From: Alexander Zinchuk <alx.zinchuk@gmail.com>
Date: Fri, 22 Oct 2021 02:24:48 +0300
Subject: [PATCH] Mention Tooltip: Fix resetting active item (#1509)

---
 src/components/middle/composer/MentionTooltip.tsx        | 1 +
 .../middle/composer/hooks/useKeyboardNavigation.ts       | 9 +++++++--
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/components/middle/composer/MentionTooltip.tsx b/src/components/middle/composer/MentionTooltip.tsx
index d4586111..e5e83ee1 100644
--- a/src/components/middle/composer/MentionTooltip.tsx
+++ b/src/components/middle/composer/MentionTooltip.tsx
@@ -52,6 +52,7 @@ const MentionTooltip: FC<OwnProps> = ({
     items: filteredUsers,
     onSelect: handleSelectMention,
     shouldSelectOnTab: true,
+    shouldSaveSelectionOnUpdateItems: true,
     onClose,
   });
 
diff --git a/src/components/middle/composer/hooks/useKeyboardNavigation.ts b/src/components/middle/composer/hooks/useKeyboardNavigation.ts
index ce1d59c4..b01a3e94 100644
--- a/src/components/middle/composer/hooks/useKeyboardNavigation.ts
+++ b/src/components/middle/composer/hooks/useKeyboardNavigation.ts
@@ -5,6 +5,7 @@ import cycleRestrict from '../../../../util/cycleRestrict';
 export function useKeyboardNavigation({
   isActive,
   isHorizontal,
+  shouldSaveSelectionOnUpdateItems,
   shouldRemoveSelectionOnReset,
   noArrowNavigation,
   items,
@@ -14,6 +15,7 @@ export function useKeyboardNavigation({
 }: {
   isActive: boolean;
   isHorizontal?: boolean;
+  shouldSaveSelectionOnUpdateItems?: boolean;
   shouldRemoveSelectionOnReset?: boolean;
   noArrowNavigation?: boolean;
   items?: any[];
@@ -46,9 +48,12 @@ export function useKeyboardNavigation({
     }
   }, [items, onSelect, selectedItemIndex]);
 
+  const isSelectionOutOfRange = !items || selectedItemIndex > items.length - 1;
   useEffect(() => {
-    setSelectedItemIndex(shouldRemoveSelectionOnReset ? -1 : 0);
-  }, [items, shouldRemoveSelectionOnReset]);
+    if (!shouldSaveSelectionOnUpdateItems || isSelectionOutOfRange) {
+      setSelectedItemIndex(shouldRemoveSelectionOnReset ? -1 : 0);
+    }
+  }, [isSelectionOutOfRange, shouldRemoveSelectionOnReset, shouldSaveSelectionOnUpdateItems]);
 
   useEffect(() => (isActive ? captureKeyboardListeners({
     onEsc: onClose,