UX review: filters, reports page copy, export consistency, by-role navigation, and pagination

Problem/Motivation

A UX review flagged three issues across the module's admin pages:

• AI Usage Log filters: the provider/model/period/role filters are inconsistently sized and unorganized, and take up roughly half the screen, pushing the results table below the fold.
• Reports page copy: the "AI Usage by Role" entry on /admin/reports describes itself as "preview of an upcoming feature for large sites" — verbose compared to a plain "(preview)" suffix.
• Export button inconsistency: "Export CSV" / "Export JSON" render as two separate buttons on the dashboard, but differently on the Usage Log page — no shared pattern.
• No path to the by-role view: the per-editor dashboard has no link to "AI Usage by Role" — reaching it requires going back to /admin/reports or the hub page.
• Neither breakdown table scales: the per-editor and by-role tables both render every row for the month on one page, with no pagination.

Proposed resolution

• Replace the filter form with Choices.js for a more compact, readable layout.
• Trim the by-role menu item's description to drop "preview of an upcoming feature for large sites".
• Consolidate CSV/JSON export into one button with a format dropdown, same icon on every page.
• Add a CTA on the per-editor dashboard linking to the by-role dashboard.
• Paginate both the per-editor and by-role breakdown tables, 10 rows per page, using Drupal's pager service with the LIMIT/OFFSET applied in the SQL query — not fetched in full and sliced in PHP — so performance holds at scale.

AI assistance

N/A