UoE/Add pagination to statistics tables (#726)

[milanmajchrak]

Summary

Resolves dataquest-dev/dspace-customers#726.

"My preference would be for additional pagination so that statistics for all datasets can be viewed."

The statistics tables (e.g. the repository-wide Total visits report shown on the site statistics page) previously rendered every point in a single, ungoverned table. Combined with the backend limit of 10 items, users could only ever see the first 10 datasets.

This PR adds client-side pagination to the shared StatisticsTableComponent, so every statistics report (Total visits, Top countries, Top cities, …) paginates its rows and all datasets can be browsed page by page. It is paired with a backend change that lifts the 10-item cap so all datasets are returned (see the backend PR).

Changes

• StatisticsTableComponent now renders only the current page of points (default 10 per page, configurable via the pageSize input).
• An ngb-pagination control is shown only when there are more points than fit on a single page.
• Added the statistics.table.pagination.label i18n key for the pagination control's accessible label.
• The datashare theme reuses the shared component, so the fix applies there automatically.

Testing (TDD)

Added unit tests to statistics-table.component.spec.ts first (red), then implemented until green:

• only the first page of points is rendered;
• the pagination control appears only when needed;
• changing page renders the next slice of points;
• the last page renders the remaining points.

✔ 8 tests completed (StatisticsTableComponent)
✔ 25 tests completed (statistics-page + core/statistics specs)

Notes

• No merge intended yet — iterating on CI + review feedback.

🤖 Generated with Claude Code

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 83795114-d12f-4936-aa08-b0e8bf3fca77

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[Copilot]

Pull request overview

Adds client-side pagination to the shared statistics table so large usage reports can be browsed page-by-page instead of rendering all rows at once.

Changes:

• Introduces paging state (PaginationComponentOptions) and a paginatedPoints$ slice in StatisticsTableComponent.
• Wraps the table in the shared ds-pagination component and renders only the current page.
• Extends/updates unit tests and page specs to accommodate the new pagination dependency.

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
src/app/statistics-page/statistics-table/statistics-table.component.ts	Adds pagination options/state and slices points based on current page.
src/app/statistics-page/statistics-table/statistics-table.component.html	Wraps the table with ds-pagination and iterates over paginated points.
src/app/statistics-page/statistics-table/statistics-table.component.spec.ts	Adds pagination-focused unit tests and a mock pagination component.
src/app/statistics-page/site-statistics-page/site-statistics-page.component.spec.ts	Provides a PaginationService stub for tests.
src/app/statistics-page/item-statistics-page/item-statistics-page.component.spec.ts	Provides a PaginationService stub for tests.
src/app/statistics-page/community-statistics-page/community-statistics-page.component.spec.ts	Provides a PaginationService stub for tests.
src/app/statistics-page/collection-statistics-page/collection-statistics-page.component.spec.ts	Provides a PaginationService stub for tests.

Comments suppressed due to low confidence (1)

src/app/statistics-page/statistics-table/statistics-table.component.spec.ts:101

• The test descriptions refer to a "storage report", but the component deals with a UsageReport. Renaming these descriptions will make the specs easier to understand/grep and align with the domain language used elsewhere in the file.

  describe('when the storage report is empty', () => {

    it ('should not display a table', () => {
      expect(de.query(By.css('table'))).toBeNull();
    });

    it('should not display a pagination control', () => {
      expect(de.query(By.directive(MockPaginationComponent))).toBeNull();
    });
  });

  describe('when the storage report has data', () => {

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.