Describe the bug
PaginatedListDataTable accepts transformQueryKey and uses it to build the react-query key:
// packages/dashboard/src/lib/components/shared/paginated-list-data-table.tsx (3.7.1, ~line 465)
const queryKey = transformQueryKey ? transformQueryKey(defaultQueryKey) : defaultQueryKey;
ListPage wraps that component, and its commonTableProps object forwards 22 props — but not transformQueryKey:
// packages/dashboard/src/lib/framework/page/list-page.tsx (3.7.1, ~lines 564-603)
const commonTableProps = {
listQuery,
deleteMutation,
transformVariables, // <- forwarded
customizeColumns,
...
transformData,
registerRefresher,
}; // <- transformQueryKey is not in the object
ListPage does forward transformVariables. The two belong together: the default query key contains page, itemsPerPage, sorting, the column filters and the debounced search term, and nothing else. Any state a page injects through transformVariables — a language selector, a status filter in the action bar, a parent entity id — is therefore invisible to react-query.
The result is a list that fetches once and then serves that first response forever, for every value of the injected state. There is no error and no empty table: the rows simply never change, which makes it easy to ship and hard to notice in review.
disableViewOptions and includeSelectionColumn are missing from ListPage in the same way, though those fail visibly rather than silently.
To Reproduce
- Build a
ListPage with a toolbar <Select> held in component state.
- Inject it into the query with
transformVariables={vars => ({ ...vars, someFilter: value })}.
- Change the Select.
Expected: the list refetches with the new variable. Actual: no network request; the previously cached page is re-rendered.
Expected behavior
ListPage forwards transformQueryKey (and ideally disableViewOptions / includeSelectionColumn) to PaginatedListDataTable, so a page that customises variables can keep the query key in sync.
Environment
@vendure/dashboard 3.7.1
- Verified by reading the installed package source; the prop appears in
paginated-list-data-table.tsx only.
Additional context
The workaround is to drop ListPage and render PaginatedListDataTable directly, which means taking ownership of page / itemsPerPage / sorting state and the URL wiring ListPage otherwise provides. Happy to open a PR adding the prop to ListPageProps and to commonTableProps if that is the shape you would want.
Describe the bug
PaginatedListDataTableacceptstransformQueryKeyand uses it to build the react-query key:ListPagewraps that component, and itscommonTablePropsobject forwards 22 props — but nottransformQueryKey:ListPagedoes forwardtransformVariables. The two belong together: the default query key containspage,itemsPerPage,sorting, the column filters and the debounced search term, and nothing else. Any state a page injects throughtransformVariables— a language selector, a status filter in the action bar, a parent entity id — is therefore invisible to react-query.The result is a list that fetches once and then serves that first response forever, for every value of the injected state. There is no error and no empty table: the rows simply never change, which makes it easy to ship and hard to notice in review.
disableViewOptionsandincludeSelectionColumnare missing fromListPagein the same way, though those fail visibly rather than silently.To Reproduce
ListPagewith a toolbar<Select>held in component state.transformVariables={vars => ({ ...vars, someFilter: value })}.Expected: the list refetches with the new variable. Actual: no network request; the previously cached page is re-rendered.
Expected behavior
ListPageforwardstransformQueryKey(and ideallydisableViewOptions/includeSelectionColumn) toPaginatedListDataTable, so a page that customises variables can keep the query key in sync.Environment
@vendure/dashboard3.7.1paginated-list-data-table.tsxonly.Additional context
The workaround is to drop
ListPageand renderPaginatedListDataTabledirectly, which means taking ownership ofpage/itemsPerPage/sortingstate and the URL wiringListPageotherwise provides. Happy to open a PR adding the prop toListPagePropsand tocommonTablePropsif that is the shape you would want.