Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/fix-usetable-sync-with-location-current-page.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@refinedev/core": patch
---

fix(core): strip both `currentPage` and legacy `current` in `useTable`'s `getCurrentQueryParams` so `createLinkForSyncWithLocation` properly handles modern and legacy URL pagination parameters without overwriting target page links.
151 changes: 151 additions & 0 deletions packages/core/src/hooks/useTable/index.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -1552,4 +1552,155 @@ describe("useTable Filters", () => {
}),
);
});

it("createLinkForSyncWithLocation should use provided currentPage and preserve uncontrolled query params", async () => {
const goMock = vi
.fn()
.mockReturnValue("/posts?currentPage=3&pageSize=20&foo=bar");

const { result } = renderHook(() => useTable({ resource: "posts" }), {
wrapper: TestWrapper({
dataProvider: MockJSONServer,
routerProvider: mockRouterProvider({
resource: { name: "posts" },
params: {
currentPage: 2,
pageSize: 10,
sorters: [{ field: "id", order: "asc" }],
filters: [{ field: "status", operator: "eq", value: "draft" }],
foo: "bar",
},
fns: {
go: () => goMock,
},
}),
resources: [{ name: "posts" }],
}),
});

const newSorters: CrudSort[] = [{ field: "title", order: "desc" }];
const newFilters: CrudFilter[] = [
{ field: "status", operator: "eq", value: "published" },
];

const link = result.current.createLinkForSyncWithLocation({
pagination: { currentPage: 3, pageSize: 20 },
sorters: newSorters,
filters: newFilters,
});

expect(link).toBe("/posts?currentPage=3&pageSize=20&foo=bar");
expect(goMock).toHaveBeenCalledWith({
type: "path",
options: {
keepHash: true,
keepQuery: true,
},
query: {
currentPage: 3,
pageSize: 20,
sorters: newSorters,
filters: newFilters,
foo: "bar",
},
});
});

it("createLinkForSyncWithLocation should omit currentPage and pageSize when pagination mode is off", async () => {
const goMock = vi.fn().mockReturnValue("/posts?foo=bar");

const { result } = renderHook(
() =>
useTable({
resource: "posts",
pagination: { mode: "off" },
}),
{
wrapper: TestWrapper({
dataProvider: MockJSONServer,
routerProvider: mockRouterProvider({
resource: { name: "posts" },
params: {
currentPage: 2,
pageSize: 10,
foo: "bar",
},
fns: {
go: () => goMock,
},
}),
resources: [{ name: "posts" }],
}),
},
);

const link = result.current.createLinkForSyncWithLocation({
pagination: { currentPage: 3, pageSize: 20 },
sorters: [],
filters: [],
});

expect(link).toBe("/posts?foo=bar");
expect(goMock).toHaveBeenCalledWith({
type: "path",
options: {
keepHash: true,
keepQuery: true,
},
query: {
sorters: [],
filters: [],
foo: "bar",
},
});
});

it("createLinkForSyncWithLocation should strip legacy current and modern currentPage params", async () => {
const goMock = vi
.fn()
.mockReturnValue("/posts?currentPage=3&pageSize=20&foo=bar");

const { result } = renderHook(() => useTable({ resource: "posts" }), {
wrapper: TestWrapper({
dataProvider: MockJSONServer,
routerProvider: mockRouterProvider({
resource: { name: "posts" },
params: {
current: 2,
currentPage: 2,
pageSize: 10,
sorters: [{ field: "id", order: "asc" }],
filters: [{ field: "status", operator: "eq", value: "draft" }],
foo: "bar",
},
fns: {
go: () => goMock,
},
}),
resources: [{ name: "posts" }],
}),
});

const link = result.current.createLinkForSyncWithLocation({
pagination: { currentPage: 3, pageSize: 20 },
sorters: [],
filters: [],
});

expect(link).toBe("/posts?currentPage=3&pageSize=20&foo=bar");
expect(goMock).toHaveBeenCalledWith({
type: "path",
options: {
keepHash: true,
keepQuery: true,
},
query: {
currentPage: 3,
pageSize: 20,
sorters: [],
filters: [],
foo: "bar",
},
});
});
});
3 changes: 2 additions & 1 deletion packages/core/src/hooks/useTable/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -292,7 +292,8 @@ export function useTable<

const getCurrentQueryParams = (): object => {
// We get QueryString parameters that are uncontrolled by refine.
const { sorters, filters, pageSize, current, ...rest } =
// Strip both v5 `currentPage` and legacy v4 `current` to prevent stale pagination params from leaking into generated links.
const { sorters, filters, pageSize, current, currentPage, ...rest } =
parsedParams?.params ?? {};

return rest;
Expand Down