diff --git a/apps/web/__tests__/unit/video-thumbnail-duration.test.ts b/apps/web/__tests__/unit/video-thumbnail-duration.test.ts new file mode 100644 index 0000000000..af8549c9e0 --- /dev/null +++ b/apps/web/__tests__/unit/video-thumbnail-duration.test.ts @@ -0,0 +1,30 @@ +import { describe, expect, it } from "vitest"; +import { formatDuration } from "@/components/VideoThumbnail"; + +describe("VideoThumbnail formatDuration", () => { + it("rolls fractional seconds just under a minute over to 1 min", () => { + expect(formatDuration(59)).toBe("59 secs"); + expect(formatDuration(59.2)).toBe("1 min"); + expect(formatDuration(59.5)).toBe("1 min"); + expect(formatDuration(59.99)).toBe("1 min"); + expect(formatDuration(60)).toBe("1 min"); + }); + + it("rolls fractional seconds just under an hour over to 1 hr", () => { + expect(formatDuration(3599)).toBe("59 mins"); + expect(formatDuration(3599.5)).toBe("1 hr"); + }); + + it("keeps short durations readable", () => { + expect(formatDuration(0)).toBe("< 1 sec"); + expect(formatDuration(0.2)).toBe("1 sec"); + expect(formatDuration(1)).toBe("1 sec"); + expect(formatDuration(30.4)).toBe("31 secs"); + }); + + it("keeps whole minutes and hours unchanged", () => { + expect(formatDuration(90)).toBe("1 min"); + expect(formatDuration(150)).toBe("2 mins"); + expect(formatDuration(7200)).toBe("2 hrs"); + }); +}); diff --git a/apps/web/components/VideoThumbnail.tsx b/apps/web/components/VideoThumbnail.tsx index 88b96d0c01..396caf10d0 100644 --- a/apps/web/components/VideoThumbnail.tsx +++ b/apps/web/components/VideoThumbnail.tsx @@ -61,12 +61,12 @@ interface VideoThumbnailProps { showPreview?: boolean; } -const formatDuration = (durationSecs: number) => { - const duration = durationParts(durationSecs); +export const formatDuration = (durationSecs: number) => { + const duration = durationParts(Math.ceil(durationSecs)); const totalHours = Math.floor(duration.asHours); const totalMinutes = Math.floor(duration.asMinutes); - const remainingSeconds = Math.ceil(duration.asSeconds % 60); // Use ceil to avoid 0 secs + const remainingSeconds = duration.asSeconds % 60; if (totalHours > 0) { return `${totalHours} hr${totalHours > 1 ? "s" : ""}`;