feat(ListView): add pagination to card view and center row count display

[ompharate]

fixes #36235

The Problem

In Apache Superset's dashboard list page /dashboard/list/ pagination controls were visible and working correctly in List View, but in Thumbnail/Card View, only the first 25 dashboards were displayed with no pagination controls visible, even when more dashboards existed in the database.

Root Cause

The [ListView] component renders two different sub-components based on view mode:

Table View: Uses [TableCollection] component, which internally includes pagination controls

Card View: Uses [CardCollection] component, which only renders cards without any pagination
The pagination state [pageIndex] [pageSize] [count] [gotoPage] existed in both views via the [useListViewState] hook, but the UI controls to navigate pages were never rendered in card view.

The Fix

Added pagination controls after the [CardCollection] component in card view, reusing the existing pagination state

Normal list view (Working Correctly)

tile/ thumbnail (No Pagination)

After Applying Fix

TESTING INSTRUCTIONS

Have >25 dashboards
Switch between:
List view
Thumbnail view
Confirm missing pagination

ADDITIONAL INFORMATION

• Required feature flags:
• Changes UI
• Includes DB Migration (follow approval process in SIP-59)
  • Migration is atomic, supports rollback & is backwards-compatible
  • Confirm DB migration upgrade and downgrade tested
  • Runtime estimates and downtime expectations provided
• Introduces new feature or API
• Removes existing feature or API

[bito-code-review]

Code Review Agent Run #9ab9a0

Actionable Suggestions - 0

Review Details

• Files reviewed - 1 · Commit Range: 9c1c902..9c1c902

  • superset-frontend/src/components/ListView/ListView.tsx
• Files skipped - 0
• Tools

  • Whispers (Secret Scanner) - ✔︎ Successful
  • Detect-secrets (Secret Scanner) - ✔︎ Successful

---

Bito Usage Guide

Commands

Type the following command in the pull request comment and save the comment.

• /review - Manually triggers a full AI review.

• /pause - Pauses automatic reviews on this pull request.

• /resume - Resumes automatic reviews.

• /resolve - Marks all Bito-posted review comments as resolved.

• /abort - Cancels all in-progress reviews.

Refer to the documentation for additional commands.

Configuration

This repository uses Default Agent You can customize the agent settings here or contact your Bito workspace admin at [email protected].

Documentation & Help

• Customize agent settings
• Review rules
• General documentation
• FAQ

AI Code Review powered by

[ompharate]

@justinpark @msyavuz When you get a chance, could you please review this? Thank you!