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 { SearchParamsController } from "@/controllers/searchParams";
import { srOnly } from "@/utils/css"; import { srOnly } from "@/utils/css";
import localize from "@/utils/localize";
import chevronLeft from "~assets/icons/chevron-left.svg"; import chevronLeft from "~assets/icons/chevron-left.svg";
import chevronRight from "~assets/icons/chevron-right.svg"; import chevronRight from "~assets/icons/chevron-right.svg";
@ -375,7 +376,7 @@ export class Pagination extends LitElement {
.align=${"center"} .align=${"center"}
@click=${() => this.onPageChange(page)} @click=${() => this.onPageChange(page)}
aria-disabled=${isCurrent} aria-disabled=${isCurrent}
>${page}</btrix-navigation-button >${localize.number(page)}</btrix-navigation-button
> >
</li>`; </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 { renderSpinner } from "@/pages/org/archived-item-qa/ui/spinner";
import type { APIPaginatedList, APISortQuery } from "@/types/api"; import type { APIPaginatedList, APISortQuery } from "@/types/api";
import type { ArchivedItemQAPage } from "@/types/qa"; import type { ArchivedItemQAPage } from "@/types/qa";
import { pluralOf } from "@/utils/pluralize";
export type SortDirection = "asc" | "desc"; export type SortDirection = "asc" | "desc";
export type SortableFieldNames = export type SortableFieldNames =
@ -139,10 +140,10 @@ export class PageList extends BtrixElement {
> >
${total === this.totalPages ${total === this.totalPages
? msg( ? msg(
str`Showing all ${this.localize.number(this.totalPages)} pages`, str`Showing all ${this.localize.number(this.totalPages)} ${pluralOf("pages", this.totalPages)}`,
) )
: msg( : 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>
</div> </div>