tea/browsertrix
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Format page numbers in pagination component (#2723)

Browse Source 
Closes #2704
This commit is contained in:
Emma Segal-Grossman 2025-07-09 21:32:35 -04:00 committed by GitHub
parent a4b30c056d
commit f36fc91963
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 5 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
frontend/src/components/ui/pagination.ts
View File

@ -8,6 +8,7 @@ import { when } from "lit/directives/when.js";
import { SearchParamsController } from "@/controllers/searchParams";
import { srOnly } from "@/utils/css";
import localize from "@/utils/localize";
import chevronLeft from "~assets/icons/chevron-left.svg";
import chevronRight from "~assets/icons/chevron-right.svg";
@ -375,7 +376,7 @@ export class Pagination extends LitElement {
.align=${"center"}
@click=${() => this.onPageChange(page)}
aria-disabled=${isCurrent}
>${page}</btrix-navigation-button
>${localize.number(page)}</btrix-navigation-button
>
</li>`;
};

5
frontend/src/features/qa/page-list/page-list.ts
View File

@ -10,6 +10,7 @@ import { type PageChangeEvent } from "@/components/ui/pagination";
import { renderSpinner } from "@/pages/org/archived-item-qa/ui/spinner";
import type { APIPaginatedList, APISortQuery } from "@/types/api";
import type { ArchivedItemQAPage } from "@/types/qa";
import { pluralOf } from "@/utils/pluralize";
export type SortDirection = "asc" | "desc";
export type SortableFieldNames =
@ -139,10 +140,10 @@ export class PageList extends BtrixElement {
>
${total === this.totalPages
? msg(
str`Showing all ${this.localize.number(this.totalPages)} pages`,
str`Showing all ${this.localize.number(this.totalPages)} ${pluralOf("pages", this.totalPages)}`,
)
: msg(
str`Showing ${this.localize.number(total)} of ${this.localize.number(this.totalPages)} pages`,
str`Showing ${this.localize.number(total)} of ${this.localize.number(this.totalPages)} ${pluralOf("pages", this.totalPages)}`,
)}
</div>
</div>