QA Promotion: Grid Pagination with Total Record Counts, Inbox Readability Fixes, and Repo-Wide Code Quality Standards
Executive summary
This release promotes a batch of frontend changes from development into the QA environment. It bundles two visible improvements - enhanced pagination with total record counts across all data grids (DA-99) and improved text readability in the Inbox grid (DA-102) - together with a large, mostly invisible engineering effort that standardizes code formatting and tooling across the entire frontend codebase.
Why this was needed
Users previously had no clear sense of how many total records a grid contained or how to jump directly to a specific page, making large lists hard to navigate. Some Inbox grid text rendered in a low-contrast muted color that was hard to read. Separately, the codebase had inconsistent formatting and lacked automated guardrails, which slows reviews and lets style issues slip into the product.
Client / user impact
- Every data grid (Inbox, Documents, Folders, and related tables) now shows the total number of records and offers clearer page navigation, including a 'Jump to page' control and an improved page-number layout.
- Inbox grid text that was previously faint is now darker and easier to read, improving day-to-day legibility.
- No change to user data or business logic; the bulk of the change is internal code formatting and developer tooling that does not alter app behavior but improves future delivery speed and consistency.
Technical scope
Batch promotion (dev -> qa) of three merged feature branches:
- DA-99 (PR #409): Total record counts in pagination. New reusable
src/components/ui/pagination.tsxandsrc/utils/pagination.ts; DataGrid, InboxDataGrid, and Folders pagination reworked to display total item count, persist the total, add 'Jump to page', and refine visible page numbers / ellipsis behavior. - DA-102 (PR #410): Inbox grid readability. InboxGrid text and indicator colors changed from
muted-foregroundto a darker tone for better contrast on empty values, boolean/action-required markers, and selection states. - Code quality standards (PR #407): Added Prettier, ESLint v9 flat config (
eslint.config.mjs), Husky pre-commit hooks, and lint-staged; newpackage.jsonscripts (format,format:check,lint:fix,typecheck); added CONTRIBUTING.md and VS Code settings. The entire codebase (~470+ files) was reformatted to the new standard.
Note: the very large line counts (~28.6K additions / ~28.2K deletions across 300+ files) are dominated by mechanical Prettier reformatting (quote style, arrow-parens, trailing commas), not new functionality.
Risk & mitigation
Primary risk is the breadth of the change: a repo-wide reformat touches nearly every file, so even though edits are mechanical, the surface area for an accidental regression is wide and standard diff review is impractical. Mitigation: formatting was applied by automated tooling (Prettier) rather than hand edits, behavioral changes are confined to the pagination and inbox-color work, and promotion targets QA (not production) so the build can be fully exercised before any production release.
QA validation focus
- Verify total record counts display correctly on Inbox, Documents, and Folders grids and match the actual number of records.
- Test pagination navigation: next/prev, direct page numbers, ellipsis behavior, and the 'Jump to page' control (including out-of-range and empty inputs).
- Confirm Inbox grid text (empty values, boolean/action-required indicators, selected rows) is clearly readable with the new darker color.
- Smoke-test that the reformat did not break rendering or actions across key screens: Inbox, Mails, Documents, Batches, Resolution Center, Admin Hub (Organizations, Folders, Document Types), Settings/Profile, and Login.
- Confirm a clean production build and that lint/format tooling does not block the pipeline.