From 1cca87d66114336d2b58c645c8a14365ce613b1f Mon Sep 17 00:00:00 2001 From: Leander Furumo Date: Wed, 27 Nov 2024 16:43:51 +0100 Subject: [PATCH] prettify date-day suffix logic utilize built in js stuff. Technically we use the wrong order but since dd-mm-yyyy is superior to mm-dd-yyyy I say fuck it --- src/app/components/TimeCard.tsx | 29 ++++++++++++++++------------- 1 file changed, 16 insertions(+), 13 deletions(-) diff --git a/src/app/components/TimeCard.tsx b/src/app/components/TimeCard.tsx index f4d53b7..2362175 100644 --- a/src/app/components/TimeCard.tsx +++ b/src/app/components/TimeCard.tsx @@ -22,30 +22,33 @@ function TimeCard() { }; const formatDate = (date: Date) => { - const day = date.getDate().toString(); - const ending = findDateEnding(date); + const day = convertToDayWithEnding(date); const monthText = date.toLocaleString("default", { month: "long" }); const year = date.getFullYear(); - return `${day}${ending} ${monthText} ${year}`; + // This is technically the british way of writing things but of well + // If we're going to argue about the order we might as well drop the st, nd, rd, th suffixes. + return `${day} of ${monthText} ${year}`; }; const day = (date: Date) => { return date.toLocaleDateString("en-US", { weekday: "long" }); }; - const findDateEnding = (date: Date) => { + const convertToDayWithEnding = (date: Date) => { const day = date.getDate(); - if (day === 1 || day === 21 || day === 31) { - return "st"; - } else if (day === 2 || day === 22) { - return "nd"; - } else if (day === 3 || day === 23) { - return "rd"; - } else { - return "th"; - } + const enOrdinalRules = new Intl.PluralRules("en-US", { type: "ordinal" }); + const suffixes = new Map([ + ["one", "st"], + ["two", "nd"], + ["few", "rd"], + ["other", "th"], + ]); + + const rule = enOrdinalRules.select(day); + const suffix = suffixes.get(rule); + return `${day}${suffix}`; }; return (