From 524cf4c03a0412523810eb8907faa754bc8055c5 Mon Sep 17 00:00:00 2001 From: Donnie Date: Tue, 6 Oct 2026 15:57:14 +0100 Subject: [PATCH] fix: scroll to the clicked category when leaving gif mode Co-Authored-By: Claude Fable 5.1 --- src/modules/emote_menu/components/EmoteMenu.jsx | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/src/modules/emote_menu/components/EmoteMenu.jsx b/src/modules/emote_menu/components/EmoteMenu.jsx index 3c099a49a..d6a81897b 100644 --- a/src/modules/emote_menu/components/EmoteMenu.jsx +++ b/src/modules/emote_menu/components/EmoteMenu.jsx @@ -1,7 +1,7 @@ import {autoUpdate, offset, useDismiss, useFloating, useInteractions} from '@floating-ui/react'; import {useDisclosure, useFocusTrap} from '@mantine/hooks'; import classNames from 'classnames'; -import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react'; +import React, {useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState} from 'react'; import {ScrollbarSizeTargetContext} from '@/common/components/Scrollbar'; import useEmoteMenuViewStoreUpdated from '@/common/hooks/EmoteMenuViewStore'; import emoteMenuViewStore, {CategoryPositions} from '@/common/stores/emote-menu-view-store'; @@ -69,6 +69,7 @@ function EmoteMenu({ const gifContext = useGifPickerStore((state) => state.gifContext); const width = useHorizontalResize({boundingQuerySelector, handleRef, open: opened, placement}); const emoteListRef = useRef(null); + const pendingScrollRowIndexRef = useRef(null); const [emoteListCoords, setEmoteListCoords] = useState({x: 0, y: 0}); const [navigationMode, setNavigationMode] = useState(NavigationModeTypes.ARROW_KEYS); const focusRef = useFocusTrap(opened && navigationMode === NavigationModeTypes.ARROW_KEYS); @@ -141,6 +142,7 @@ function EmoteMenu({ const handleScrollToPendingRow = useCallback((pendingScrollRowIndex) => { const listEl = emoteListRef.current; if (listEl == null) { + pendingScrollRowIndexRef.current = pendingScrollRowIndex; return; } @@ -153,6 +155,16 @@ function EmoteMenu({ listEl.scrollTo(0, scrollTop); }, []); + useLayoutEffect(() => { + const pendingScrollRowIndex = pendingScrollRowIndexRef.current; + if (mode !== EmoteMenuModes.EMOTES || pendingScrollRowIndex == null) { + return; + } + + pendingScrollRowIndexRef.current = null; + handleScrollToPendingRow(pendingScrollRowIndex); + }, [mode, handleScrollToPendingRow]); + const updateEmoteListData = useCallback((currentSearch = '') => { let rows = emoteMenuViewStore.rows;