A missing pagination control in a WordPress DataViews picker is not always a defect. One page of results may need no pagination, while a missing Apply action can come from eligibility or a custom footer that omitted the action component. Inspect those cases separately before forcing controls back with CSS.
The upstream composable-footer change exposes Footer, Pagination, PageSelect, PageNavigation and Actions on DataViewsPicker. Existing default pickers keep their previous footer behavior. This guide applies to custom screens using a package version that includes the change, not every legacy media modal.
Decide Which State You Are Looking At
Record whether the picker has results, a selected item, more than one page and an eligible action. Use a test dataset that contains enough items to cross your actual page-size boundary. A fixture with only three items cannot verify a 20-item pagination threshold.
| Observation |
First check |
| Page selector disappears after a narrow search |
Did the result count fall to one page? |
| Apply is absent or unavailable |
Is the action included, and is the selected item eligible? |
| Apply moves to the start of the footer |
What remains in the flex row when pagination disappears? |
| Controls overlap in a sidebar |
Does the custom footer include more controls than fit? |
| Default picker changed too |
Is shared CSS or a package mismatch affecting both? |
An empty result set deserves its own state. Do not leave a previously selected item looking ready to apply if the screen's selection rules no longer permit it. Whether selection survives filtering is a consumer decision that should be explicit in your test.
Compose Only the Controls the Screen Needs
The upstream example combines a page selector with actions:
<DataViewsPicker.Footer>
<DataViewsPicker.Pagination>
<DataViewsPicker.PageSelect />
</DataViewsPicker.Pagination>
<DataViewsPicker.Actions className="my-picker__actions" />
</DataViewsPicker.Footer>
This belongs inside a correctly configured picker. It does not provide the data source, selection state or action callback. If the narrow panel needs previous/next navigation instead of a page selector, review the exposed PageNavigation component in the version you use. Avoid rendering both modes by accident when copying examples.
Each composable part accepts className, allowing the consumer to position its own footer. The picker does not know whether your screen wants its only action at the start or end of a one-page row. Inspect the actual layout before treating that movement as a selection bug.
Verify multiple pages, a single result, no results and an ineligible selection. Pagination visibility, action eligibility and action placement are independent checks.
Use a Four-State Regression Fixture
First, load several pages and move to page two. Select an allowed item and confirm the action receives that item, not a stale selection from page one. Next, filter to a single result and check both the disappearance of unnecessary pagination and the placement of Apply.
Third, filter to no results. Verify the empty-state message and that an invalid operation cannot be submitted. Finally, select an item for which the action is ineligible. Confirm that the UI and handler enforce the intended rule. Do not bypass eligibility just to make a button appear in a screenshot.
Run the same sequence in the narrowest supported sidebar and at desktop width. Use keyboard navigation throughout, including opening the page selector, moving between pages and reaching the action. Check that a sticky footer does not cover the last selectable row.
Separate Layout From Data Problems
If page two repeats page one, inspect the view and data request rather than moving the footer. If Apply submits the wrong item, inspect selection and callback state. If every control is correct but the row overflows, then change the consumer's layout rules.
For teams migrating WooCommerce administration extensions, add these states to the DataViews migration readiness matrix. Keep the ordinary media picker as a control case: the upstream change says the default footer should remain unchanged.
For a blocked production admin workflow, ask HandL WP to isolate the picker failure. Include the package version, result count, selected item type, action eligibility and the exact viewport that fails. That evidence distinguishes a missing component from a valid empty or single-page state.
References reviewed October 21, 2026. Diagrams and test fixtures are explanatory, not customer results.