From 7f71caaf7f708a1324bd793725dca72669e429c9 Mon Sep 17 00:00:00 2001 From: Qstick Date: Sat, 22 Apr 2023 16:23:39 -0500 Subject: [PATCH] Fixed: Movies table not resizing properly when window size changed --- frontend/src/Movie/Index/Table/MovieIndexTable.tsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/frontend/src/Movie/Index/Table/MovieIndexTable.tsx b/frontend/src/Movie/Index/Table/MovieIndexTable.tsx index 557ab7b8d..f67cd6d95 100644 --- a/frontend/src/Movie/Index/Table/MovieIndexTable.tsx +++ b/frontend/src/Movie/Index/Table/MovieIndexTable.tsx @@ -95,6 +95,8 @@ function MovieIndexTable(props: MovieIndexTableProps) { const listRef: React.MutableRefObject = useRef(); const [measureRef, bounds] = useMeasure(); const [size, setSize] = useState({ width: 0, height: 0 }); + const windowWidth = window.innerWidth; + const windowHeight = window.innerHeight; const rowHeight = useMemo(() => { return showBanners ? 70 : 38; @@ -105,8 +107,8 @@ function MovieIndexTable(props: MovieIndexTableProps) { if (isSmallScreen) { setSize({ - width: window.innerWidth, - height: window.innerHeight, + width: windowWidth, + height: windowHeight, }); return; @@ -119,10 +121,10 @@ function MovieIndexTable(props: MovieIndexTableProps) { setSize({ width: width - padding * 2, - height: window.innerHeight, + height: windowHeight, }); } - }, [isSmallScreen, scrollerRef, bounds]); + }, [isSmallScreen, windowWidth, windowHeight, scrollerRef, bounds]); useEffect(() => { const currentScrollListener = isSmallScreen ? window : scrollerRef.current;