Skip to content

ListPage does not forward transformQueryKey to PaginatedListDataTable, so transformVariables-injected state serves a stale cache #5026

Description

@julian-boerema

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

  1. Build a ListPage with a toolbar <Select> held in component state.
  2. Inject it into the query with transformVariables={vars => ({ ...vars, someFilter: value })}.
  3. 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.

Metadata

Metadata

Assignees

No one assigned

    Labels

    @vendure/dashboardT1: Fast trackClearly understood fix with limited blast radius. Fast lane.👋 contributions welcomeIssues where we appreciate contributions from our community

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions