mirror of
https://github.com/coder/coder.git
synced 2026-09-22 05:05:20 +08:00
fix(site): use toLocaleString for pagination offsets (#23669)
The Pagination widget localizes the number format of the total results but not the page offsets. Before <img width="620" height="78" alt="Screenshot 2026-03-26 at 09 18 01" src="https://github.com/user-attachments/assets/7ac0ad9a-7baa-4b30-b3d0-0e0325f8433b" /> After <img width="297" height="42" alt="Screenshot 2026-03-26 at 9 41 22 AM" src="https://github.com/user-attachments/assets/79c68366-95fa-4012-8419-5cd6f6e10ae3" />
This commit is contained in:
@@ -48,10 +48,12 @@ export const PaginationAmount: FC<PaginationHeaderProps> = ({
|
||||
|
||||
{totalRecords !== 0 && currentOffsetStart !== undefined && (
|
||||
<div>
|
||||
Showing <strong>{currentOffsetStart}</strong> to{" "}
|
||||
Showing <strong>{currentOffsetStart.toLocaleString()}</strong> to{" "}
|
||||
<strong>
|
||||
{currentOffsetStart +
|
||||
Math.min(limit - 1, totalRecords - currentOffsetStart)}
|
||||
{(
|
||||
currentOffsetStart +
|
||||
Math.min(limit - 1, totalRecords - currentOffsetStart)
|
||||
).toLocaleString()}
|
||||
</strong>{" "}
|
||||
of <strong>{totalRecords.toLocaleString()}</strong>{" "}
|
||||
{paginationUnitLabel}
|
||||
|
||||
@@ -86,6 +86,22 @@ export const FirstPageWithNoData: Story = {
|
||||
},
|
||||
};
|
||||
|
||||
export const FirstPageWithTonsOfData: Story = {
|
||||
args: {
|
||||
query: {
|
||||
...mockPaginationResultBase,
|
||||
isSuccess: true,
|
||||
currentPage: 2,
|
||||
currentOffsetStart: 1000,
|
||||
totalRecords: 123_456,
|
||||
totalPages: 1235,
|
||||
hasPreviousPage: false,
|
||||
hasNextPage: true,
|
||||
isPlaceholderData: false,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export const TransitionFromFirstToSecondPage: Story = {
|
||||
args: {
|
||||
query: {
|
||||
|
||||
Reference in New Issue
Block a user