diff --git a/web/src/lib/components/CourseDetail.svelte b/web/src/lib/components/CourseDetail.svelte index afe07af..427d074 100644 --- a/web/src/lib/components/CourseDetail.svelte +++ b/web/src/lib/components/CourseDetail.svelte @@ -13,7 +13,7 @@ import { } from "$lib/course"; import { themeStore } from "$lib/stores/theme.svelte"; import { useClipboard } from "$lib/composables/useClipboard.svelte"; -import { cn, tooltipContentClass } from "$lib/utils"; +import { cn, tooltipContentClass, formatNumber } from "$lib/utils"; import { Tooltip } from "bits-ui"; import SimpleTooltip from "./SimpleTooltip.svelte"; import { Info, Copy, Check, Star, Triangle, ExternalLink } from "@lucide/svelte"; @@ -275,7 +275,7 @@ const clipboard = useClipboard(); {#if course.crossListCount != null && course.crossListCapacity != null} - {course.crossListCount}/{course.crossListCapacity} + {formatNumber(course.crossListCount)}/{formatNumber(course.crossListCapacity)} {/if} @@ -285,7 +285,7 @@ const clipboard = useClipboard(); >{course.crossList} {#if course.crossListCount != null && course.crossListCapacity != null} - — {course.crossListCount} enrolled across {course.crossListCapacity} + — {formatNumber(course.crossListCount)} enrolled across {formatNumber(course.crossListCapacity)} shared seats {/if} @@ -298,7 +298,7 @@ const clipboard = useClipboard();

Waitlist

{course.waitCount} / {course.waitCapacity}{formatNumber(course.waitCount)} / {formatNumber(course.waitCapacity)}
{/if} diff --git a/web/src/lib/components/CourseTable.svelte b/web/src/lib/components/CourseTable.svelte index 0c2c9df..0ae7890 100644 --- a/web/src/lib/components/CourseTable.svelte +++ b/web/src/lib/components/CourseTable.svelte @@ -46,7 +46,7 @@ import { ExternalLink, } from "@lucide/svelte"; import { DropdownMenu, ContextMenu, Tooltip } from "bits-ui"; -import { cn, tooltipContentClass } from "$lib/utils"; +import { cn, tooltipContentClass, formatNumber } from "$lib/utils"; import SimpleTooltip from "./SimpleTooltip.svelte"; let { @@ -577,7 +577,7 @@ const table = createSvelteTable({ > {ratingData.rating.toFixed( 1, - )}/5 · {ratingData.count} + )}/5 · {formatNumber(ratingData.count)} ratings {#if (ratingData.count ?? 0) < RMP_CONFIDENCE_THRESHOLD} (low) @@ -701,11 +701,11 @@ const table = createSvelteTable({ class="py-2 px-2 text-right whitespace-nowrap" > + ))} of {formatNumber(course.maxEnrollment)} seats open, {formatNumber(course.enrollment)} enrolled{course.waitCount > 0 - ? `, ${course.waitCount} waitlisted` + ? `, ${formatNumber(course.waitCount)} waitlisted` : ''}" delay={200} side="left" @@ -729,8 +729,8 @@ const table = createSvelteTable({ > {course.enrollment}/{course.maxEnrollment}{#if course.waitCount > 0} - · WL {course.waitCount}/{course.waitCapacity}{/if}{formatNumber(course.enrollment)}/{formatNumber(course.maxEnrollment)}{#if course.waitCount > 0} + · WL {formatNumber(course.waitCount)}/{formatNumber(course.waitCapacity)}{/if} diff --git a/web/src/lib/components/Pagination.svelte b/web/src/lib/components/Pagination.svelte index 367e0ac..c2c38bc 100644 --- a/web/src/lib/components/Pagination.svelte +++ b/web/src/lib/components/Pagination.svelte @@ -2,6 +2,7 @@ import { Select } from "bits-ui"; import { ChevronUp, ChevronDown } from "@lucide/svelte"; import type { Action } from "svelte/action"; +import { formatNumber } from "$lib/utils"; const slideIn: Action = (node, direction) => { if (direction !== 0) { @@ -59,11 +60,11 @@ const selectValue = $derived(String(currentPage)); {#if totalCount > 0 && totalPages > 1} -
+
- Showing {start}–{end} of {totalCount} courses + Showing {formatNumber(start)}–{formatNumber(end)} of {formatNumber(totalCount)} courses
@@ -158,9 +159,9 @@ const selectValue = $derived(String(currentPage));
{:else if totalCount > 0} -
+
- Showing {start}–{end} of {totalCount} courses + Showing {formatNumber(start)}–{formatNumber(end)} of {formatNumber(totalCount)} courses
{/if} diff --git a/web/src/lib/components/SearchStatus.svelte b/web/src/lib/components/SearchStatus.svelte index 0a5e35a..c0ce424 100644 --- a/web/src/lib/components/SearchStatus.svelte +++ b/web/src/lib/components/SearchStatus.svelte @@ -2,6 +2,7 @@ import { onMount } from "svelte"; import SimpleTooltip from "$lib/components/SimpleTooltip.svelte"; import { relativeTime } from "$lib/time"; +import { formatNumber } from "$lib/utils"; export interface SearchMeta { totalCount: number; @@ -26,7 +27,7 @@ let formattedTime = $derived( let relativeTimeResult = $derived(meta ? relativeTime(meta.timestamp, now) : null); let relativeTimeText = $derived(relativeTimeResult?.text ?? ""); -let countLabel = $derived(meta ? meta.totalCount.toLocaleString() : ""); +let countLabel = $derived(meta ? formatNumber(meta.totalCount) : ""); let resultNoun = $derived(meta ? (meta.totalCount !== 1 ? "results" : "result") : ""); let durationLabel = $derived(meta ? `${Math.round(meta.durationMs)}ms` : ""); diff --git a/web/src/lib/components/SubjectCombobox.svelte b/web/src/lib/components/SubjectCombobox.svelte index 242ffeb..e859c40 100644 --- a/web/src/lib/components/SubjectCombobox.svelte +++ b/web/src/lib/components/SubjectCombobox.svelte @@ -3,6 +3,7 @@ import { Combobox } from "bits-ui"; import { Check, ChevronsUpDown } from "@lucide/svelte"; import { fly } from "svelte/transition"; import type { Subject } from "$lib/api"; +import { formatNumber } from "$lib/utils"; let { subjects, @@ -92,7 +93,7 @@ $effect(() => { {/each} {#if !open && overflowCount > 0} - +{overflowCount} + +{formatNumber(overflowCount)} {/if} {/if} = 0) { + return `+${formatted}`; + } + return formatted; +} diff --git a/web/src/routes/(app)/admin/+page.svelte b/web/src/routes/(app)/admin/+page.svelte index 4c95b57..25e66fe 100644 --- a/web/src/routes/(app)/admin/+page.svelte +++ b/web/src/routes/(app)/admin/+page.svelte @@ -1,6 +1,7 @@