diff --git a/packages/pl-fe/src/components/scrollable-list.tsx b/packages/pl-fe/src/components/scrollable-list.tsx index 784604489..0bec32c4c 100644 --- a/packages/pl-fe/src/components/scrollable-list.tsx +++ b/packages/pl-fe/src/components/scrollable-list.tsx @@ -1,4 +1,4 @@ -import { useRouter } from '@tanstack/react-router'; +import { useLocation } from '@tanstack/react-router'; import debounce from 'lodash/debounce'; import React, { useEffect, useRef, useMemo, useCallback } from 'react'; import { Virtuoso, Components, VirtuosoProps, VirtuosoHandle, ListRange, IndexLocationWithAlign } from 'react-virtuoso'; @@ -104,11 +104,11 @@ const ScrollableList = React.forwardRef(({ useWindowScroll = true, ...params }, ref) => { - const { history } = useRouter(); const { autoloadMore } = useSettings(); + const { state: locationState } = useLocation(); // Preserve scroll position - const scrollDataKey = `plfe:scrollData:${scrollKey}`; + const scrollDataKey = `plfe:scrollData:${scrollKey}:${locationState.key}`; const scrollData: SavedScrollPosition | null = useMemo(() => JSON.parse(sessionStorage.getItem(scrollDataKey)!), [scrollDataKey]); const topIndex = useRef(scrollData ? scrollData.index : 0); const topOffset = useRef(scrollData ? scrollData.offset : 0); @@ -211,7 +211,7 @@ const ScrollableList = React.forwardRef(({ return initialTopMostItemIndex; } - if (scrollData && history.action === 'POP') { + if (scrollData) { return { align: 'start', index: scrollData.index, diff --git a/packages/pl-fe/src/features/ui/router.tsx b/packages/pl-fe/src/features/ui/router.tsx index 25c7e4080..1690d99ae 100644 --- a/packages/pl-fe/src/features/ui/router.tsx +++ b/packages/pl-fe/src/features/ui/router.tsx @@ -1361,6 +1361,7 @@ const router = createRouter({ }, defaultNotFoundComponent: GenericNotFound, defaultPendingComponent: PendingComponent, + scrollRestoration: true, }); declare module '@tanstack/react-router' {