Merge pull request #215 from kleros/fix(web)/reset-pages-when-filtered

fix: reset pages shown when filter applied

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<IPageTracking>();
   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)