diff --git a/apps/console/src/components/documents/PDFPreview.tsx b/apps/console/src/components/documents/PDFPreview.tsx index bc3224551..6cdfcdd3c 100644 --- a/apps/console/src/components/documents/PDFPreview.tsx +++ b/apps/console/src/components/documents/PDFPreview.tsx @@ -21,7 +21,7 @@ import { Spinner, } from "@probo/ui"; import { IconMinusLarge } from "@probo/ui/src/Atoms/Icons/IconMinusLarge"; -import { type ComponentProps, useRef, useState } from "react"; +import { type ComponentProps, useCallback, useEffect, useRef, useState } from "react"; import { Document, Page, pdfjs } from "react-pdf"; import "react-pdf/dist/Page/TextLayer.css"; @@ -51,11 +51,17 @@ export function PDFPreview({ src, name }: { src: string; name?: string }) { setScale(scale * factor); }; - const movePage = (direction: 1 | -1) => () => { - if (currentPage === 1 && direction === -1) { + const currentPageRef = useRef(currentPage); + useEffect(() => { + currentPageRef.current = currentPage; + }, [currentPage]); + + const movePage = useCallback((direction: 1 | -1) => { + const prev = currentPageRef.current; + if (prev === 1 && direction === -1) { return; } - const newPage = currentPage + direction; + const newPage = prev + direction; const page = documentRef.current?.pages.current[newPage - 1]; if (!page) { return; @@ -66,9 +72,9 @@ export function PDFPreview({ src, name }: { src: string; name?: string }) { inline: "center", }); setCurrentPage(newPage); - }; + }, []); - const resolveCurrentPage = () => { + const resolveCurrentPage = useCallback(() => { if (!wrapperRef.current) { return; } @@ -81,10 +87,11 @@ export function PDFPreview({ src, name }: { src: string; name?: string }) { for (let i = 0; i < pages.length; i++) { const childRect = pages[i].getBoundingClientRect(); if (childRect.top <= parentMiddleY && childRect.bottom >= parentMiddleY) { - return setCurrentPage(i + 1); + setCurrentPage(i + 1); + return; } } - }; + }, []); const handleDownload = () => { const link = document.createElement("a"); @@ -100,7 +107,7 @@ export function PDFPreview({ src, name }: { src: string; name?: string }) {
{name}
- diff --git a/apps/console/src/pages/organizations/measures/MeasuresPage.tsx b/apps/console/src/pages/organizations/measures/MeasuresPage.tsx index 3c8059527..7eddf8e71 100644 --- a/apps/console/src/pages/organizations/measures/MeasuresPage.tsx +++ b/apps/console/src/pages/organizations/measures/MeasuresPage.tsx @@ -185,8 +185,6 @@ export default function MeasuresPage({ queryRef }: MeasuresPageProps) { const [isPending, startTransition] = useTransition(); const [queryFilter, setQueryFilter] = useState(null); const [stateFilter, setStateFilter] = useState(null); - const [categoryFilter, setCategoryFilter] = useState(urlCategory); - const { data, loadNext, hasNext, isLoadingNext, refetch } = usePaginationFragment( measuresPageFragment, @@ -199,7 +197,7 @@ export default function MeasuresPage({ queryRef }: MeasuresPageProps) { { query: queryFilter, state: stateFilter, - category: categoryFilter, + category: urlCategory, ...overrides, }, { fetchPolicy: "network-only" }, @@ -208,6 +206,7 @@ export default function MeasuresPage({ queryRef }: MeasuresPageProps) { }; const initialUrlCategory = useRef(urlCategory); + const prevUrlCategory = useRef(urlCategory); useEffect(() => { if (initialUrlCategory.current) { startTransition(() => { @@ -224,12 +223,11 @@ export default function MeasuresPage({ queryRef }: MeasuresPageProps) { }, [refetch, startTransition]); useEffect(() => { - if (urlCategory !== categoryFilter) { - setCategoryFilter(urlCategory); + if (urlCategory !== prevUrlCategory.current) { + prevUrlCategory.current = urlCategory; refetchFilters({ category: urlCategory }); } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [urlCategory]); + }); const handleQueryFilterChange = (value: string) => { const newQuery = value === "" ? null : value; @@ -245,7 +243,6 @@ export default function MeasuresPage({ queryRef }: MeasuresPageProps) { const handleCategoryFilterChange = (value: string) => { const newCategory = value === "ALL" ? null : value; - setCategoryFilter(newCategory); setSearchParams((prev) => { const next = new URLSearchParams(prev); if (newCategory) { @@ -255,13 +252,12 @@ export default function MeasuresPage({ queryRef }: MeasuresPageProps) { } return next; }, { replace: true }); - refetchFilters({ category: newCategory }); }; const currentFilter = { query: queryFilter, state: stateFilter, - category: categoryFilter, + category: urlCategory, }; const connectionId = ConnectionHandler.getConnectionID( @@ -274,7 +270,7 @@ export default function MeasuresPage({ queryRef }: MeasuresPageProps) { MeasuresConnectionKey, { filter: { query: null, state: null, category: null } }, ); - const hasActiveFilter = queryFilter || stateFilter || categoryFilter; + const hasActiveFilter = queryFilter || stateFilter || urlCategory; const createConnectionIds = hasActiveFilter ? [allFiltersNullConnectionId, connectionId] : [connectionId]; @@ -362,7 +358,7 @@ export default function MeasuresPage({ queryRef }: MeasuresPageProps) {