Skip to content

Commit 83a3a27

Browse files
committed
fix(repositories): keep deep-linked ?page=N when search hasn't changed
The repositories leaderboard table routes `DebouncedSearchInput`'s `onDebouncedChange` through `useDataTableParams.setFilter('search', ...)`, whose `useCallback` closes over `react-router-dom`'s `setSearchParams`. That ref is recreated on every URL change, so every `setPage(N)` recreates the callback, which re-fires the wrapper's mount-anchored debounce effect. The fired commit deletes `?page` via the filter's default `resetPageOnChange`, snapping the table back to page 1 right after the click. Same root cause #1108 fixed for `MinerPRsTable`. Apply the same callsite gate: keep the latest committed `searchQuery` in a ref and skip `setFilter('search', ...)` when the wrapper hands back the value we already hold. Typing a new search still commits normally and resets `?page` as intended; the mount fire and any re-render driven by an unrelated URL change no longer touches the page slot. Verified locally: - Direct load `/repositories?page=1` retains `?page=1` and renders rows 13-15 of 15. - "Go to next page" / "Go to last page" advance to `?page=1` and stay. - Typing into the search input still commits the filter after the debounce and resets `?page` so the result list starts at page 1. - `npm run build`, `npm run lint`, `npx prettier --check` all clean.
1 parent 4508197 commit 83a3a27

1 file changed

Lines changed: 17 additions & 2 deletions

File tree

src/components/leaderboard/TopRepositoriesTable.tsx

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,10 @@
1-
import React, { useState, useMemo, useCallback } from 'react';
1+
import React, {
2+
useState,
3+
useMemo,
4+
useCallback,
5+
useRef,
6+
useEffect,
7+
} from 'react';
28
import {
39
Box,
410
Card,
@@ -256,8 +262,17 @@ const TopRepositoriesTable: React.FC<TopRepositoriesTableProps> = ({
256262
const [showChart, setShowChart] = useState(false);
257263
const [useLogScale, setUseLogScale] = useState(true);
258264

265+
const searchQueryRef = useRef(searchQuery);
266+
useEffect(() => {
267+
searchQueryRef.current = searchQuery;
268+
});
269+
259270
const handleSearchChange = useCallback(
260-
(value: string) => setFilter('search', value),
271+
(value: string) => {
272+
if (value === searchQueryRef.current) return;
273+
searchQueryRef.current = value;
274+
setFilter('search', value);
275+
},
261276
[setFilter],
262277
);
263278

0 commit comments

Comments
 (0)