- virtualized-list/types.ts: VirtualizedListProps - virtualized-list/useInfiniteScroll.ts: useInfiniteScroll hook - virtualized-list/useScrollPosition.ts: useScrollPosition hook - virtualized-list/VirtualizedList.tsx: main component - Re-export from virtualized-list.tsx via ./virtualized-list/index - Test mock extended with getTotalSize, measureElement, key on virtual items - 4 tests pass Co-authored-by: Cursor <cursoragent@cursor.com>
34 lines
891 B
TypeScript
34 lines
891 B
TypeScript
import { useState, useEffect, useCallback } from 'react';
|
|
|
|
/**
|
|
* Hook for saving and restoring scroll position in sessionStorage.
|
|
*/
|
|
export function useScrollPosition(key: string) {
|
|
const [scrollPosition, setScrollPosition] = useState(0);
|
|
|
|
useEffect(() => {
|
|
const saved = sessionStorage.getItem(`scroll-${key}`);
|
|
if (saved) {
|
|
setScrollPosition(parseInt(saved, 10));
|
|
}
|
|
}, [key]);
|
|
|
|
const saveScrollPosition = useCallback(
|
|
(position: number) => {
|
|
setScrollPosition(position);
|
|
sessionStorage.setItem(`scroll-${key}`, position.toString());
|
|
},
|
|
[key],
|
|
);
|
|
|
|
const restoreScrollPosition = useCallback(
|
|
(element: HTMLElement | null) => {
|
|
if (element && scrollPosition > 0) {
|
|
element.scrollTop = scrollPosition;
|
|
}
|
|
},
|
|
[scrollPosition],
|
|
);
|
|
|
|
return { scrollPosition, saveScrollPosition, restoreScrollPosition };
|
|
}
|