From 6679b7625437d4424845945d4b73c82f0d7eb8de Mon Sep 17 00:00:00 2001 From: bartektomczyk Date: Tue, 7 Nov 2023 16:43:04 +0100 Subject: [PATCH] fix: wrappe initial focus into memo --- src/components/SelectionList/BaseSelectionList.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/SelectionList/BaseSelectionList.js b/src/components/SelectionList/BaseSelectionList.js index 78dfc10ce09b..29d9942b2aa8 100644 --- a/src/components/SelectionList/BaseSelectionList.js +++ b/src/components/SelectionList/BaseSelectionList.js @@ -144,7 +144,9 @@ function BaseSelectionList({ // If `initiallyFocusedOptionKey` is not passed, we fall back to `-1`, to avoid showing the highlight on the first member const [focusedIndex, setFocusedIndex] = useState(() => _.findIndex(flattenedSections.allOptions, (option) => option.keyForList === initiallyFocusedOptionKey)); - const initialFocusedIndex = focusedIndex > -1 ? focusedIndex : undefined; + // initialFocusedIndex is needed only on component did mount event, don't need to update value + // eslint-disable-next-line react-hooks/exhaustive-deps + const initialFocusedIndex = useMemo(() => (focusedIndex > -1 ? focusedIndex : undefined), []); // Disable `Enter` shortcut if the active element is a button or checkbox const disableEnterShortcut = activeElement && [CONST.ACCESSIBILITY_ROLE.BUTTON, CONST.ACCESSIBILITY_ROLE.CHECKBOX].includes(activeElement.role);