From 56ceb68e0f999c8515afa6fa582b52c0e4203932 Mon Sep 17 00:00:00 2001
From: Leander Furumo <leander@furumo.eu>
Date: Wed, 27 Nov 2024 16:13:30 +0100
Subject: [PATCH 1/3] use built in relative time formatter

---
 src/app/components/EventCard.tsx | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/app/components/EventCard.tsx b/src/app/components/EventCard.tsx
index a0ba8b5..7f5ca0b 100644
--- a/src/app/components/EventCard.tsx
+++ b/src/app/components/EventCard.tsx
@@ -219,15 +219,20 @@ const getTimeDifference = (timeDiff: number): string => {
   const msInHour = 1000 * 60 * 60;
   const msInDay = msInHour * 24;
 
+  const rtf = new Intl.RelativeTimeFormat("en-US", {
+    numeric: "always", // "auto" will show "tomorrow" if day = 1
+    style: "long",
+  });
+
   if (timeDiff < msInHour) {
     const minutesLeft = Math.floor(timeDiff / (1000 * 60));
-    return `in ${minutesLeft} minutes`;
+    return rtf.format(minutesLeft, "minute")
   } else if (timeDiff < msInDay) {
     const hoursLeft = Math.floor(timeDiff / msInHour);
-    return `in ${hoursLeft} hours`;
+    return rtf.format(hoursLeft, "hour")
   } else {
     const daysLeft = Math.floor(timeDiff / msInDay);
-    return `in ${daysLeft} days`;
+    return rtf.format(daysLeft, "day")
   }
 };
 

From 5b4ab6dc3eb3d14e727ba33ccc833bf084d6c46f Mon Sep 17 00:00:00 2001
From: Leander Furumo <leander@furumo.eu>
Date: Wed, 27 Nov 2024 16:23:11 +0100
Subject: [PATCH 2/3] use built in day of week formatter

---
 src/app/components/TimeCard.tsx | 11 +----------
 1 file changed, 1 insertion(+), 10 deletions(-)

diff --git a/src/app/components/TimeCard.tsx b/src/app/components/TimeCard.tsx
index d555a8d..f4d53b7 100644
--- a/src/app/components/TimeCard.tsx
+++ b/src/app/components/TimeCard.tsx
@@ -31,16 +31,7 @@ function TimeCard() {
   };
 
   const day = (date: Date) => {
-    const days = [
-      "Sunday",
-      "Monday",
-      "Tuesday",
-      "Wednesday",
-      "Thursday",
-      "Friday",
-      "Saturday",
-    ];
-    return days[date.getDay()];
+    return date.toLocaleDateString("en-US", { weekday: "long" });
   };
 
   const findDateEnding = (date: Date) => {

From 1cca87d66114336d2b58c645c8a14365ce613b1f Mon Sep 17 00:00:00 2001
From: Leander Furumo <leander@furumo.eu>
Date: Wed, 27 Nov 2024 16:43:51 +0100
Subject: [PATCH 3/3] 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 (