diff --git a/veascan-web/src/App.tsx b/veascan-web/src/App.tsx index 1c7722f0..507edd9d 100644 --- a/veascan-web/src/App.tsx +++ b/veascan-web/src/App.tsx @@ -1,12 +1,13 @@ -import React, { useState, useCallback } from "react"; +import React, { useCallback, useEffect, useState } from "react"; import styled from "styled-components"; import { useList } from "react-use"; import { StandardPagination } from "@kleros/ui-components-library"; import Layout from "components/Layout"; import SnapshotAccordion from "components/SnapshotAccordion"; import TxFilterHeader from "components/TxFilterHeader"; -import { useSnapshots, getSnapshotId } from "hooks/useSnapshots"; +import { getSnapshotId, useSnapshots } from "hooks/useSnapshots"; import { mapDataForAccordion } from "utils/mapDataForAccordion"; +import { useFiltersContext } from "./contexts/FiltersContext"; const SNAPSHOTS_PER_PAGE = 5; @@ -24,13 +25,27 @@ const App = () => { const [currentPage, setCurrentPage] = useState(1); const [ pageTracking, - { push: pushPageTracking, removeAt: removeAtPageTracking }, + { + push: pushPageTracking, + removeAt: removeAtPageTracking, + clear: clearPageTracking, + }, ] = useList(); const { data } = useSnapshots( pageTracking.at(-1)?.shownSnapshots, pageTracking.at(-1)?.timestamp, SNAPSHOTS_PER_PAGE ); + + const { fromChain, toChain, statusFilter } = useFiltersContext(); + + useEffect(() => { + if (currentPage !== 1) { + clearPageTracking(); + setCurrentPage(1); + } + }, [fromChain, toChain, statusFilter]); + const handlePageChange = useCallback( (newPage: number) => { if (newPage > currentPage)