From 7412ba76bbdb1410fe05d50da114170299aff9b3 Mon Sep 17 00:00:00 2001
From: Mawe <MalteWerner.Service@outlook.de>
Date: Fri, 5 Apr 2024 16:23:44 +0200
Subject: [PATCH] Fix date formatting for different locales

---
 assets/lib/formatsDates.js       | 29 ++++++++++++++++++++---------
 components/League/SeasonCard.vue |  2 +-
 2 files changed, 21 insertions(+), 10 deletions(-)

diff --git a/assets/lib/formatsDates.js b/assets/lib/formatsDates.js
index 07e992b..4844d25 100644
--- a/assets/lib/formatsDates.js
+++ b/assets/lib/formatsDates.js
@@ -1,33 +1,44 @@
 import { format as formatDate, formatDistanceToNow, parseISO } from 'date-fns'
-import { enCA } from 'date-fns/locale'
+
+let allLocales = {};
+import("date-fns/locale").then(locales => {
+  allLocales = locales;
+});
+
+const getLocale = () => {
+  const locale = navigator.language.replace("-", "");
+  const rootLocale = locale.substring(0, 2);
+
+  return allLocales[locale] ?? allLocales[rootLocale];
+};
 
 export const formatsDates = {
   methods: {
     formatDateRelative(date) {
       if (process.server) {
         return 'on ' + formatDate(new Date(date), 'PP', {
-          locale: enCA,
+          locale: getLocale(),
         })
       }
 
       return formatDistanceToNow(new Date(date), {
         addSuffix: true,
-        locale: enCA,
+        locale: getLocale(),
       })
     },
-    formatDate(dateISO, format = 'dd.MM.yyyy') {
+    formatDate(dateISO, format = 'P') {
       return formatDate(parseISO(dateISO), format, {
-        locale: enCA,
+        locale: getLocale(),
       })
     },
-    formatDateObject(date, format = 'dd.MM.yyyy') {
+    formatDateObject(date, format = 'P') {
       return formatDate(date, format, {
-        locale: enCA,
+        locale: getLocale(),
       })
     },
-    formatDateEpoch(epochMillis, format = 'dd.MM.yyyy') {
+    formatDateEpoch(epochMillis, format = 'P') {
       return formatDate(new Date(epochMillis), format, {
-        locale: enCA,
+        locale: getLocale(),
       })
     },
   },
diff --git a/components/League/SeasonCard.vue b/components/League/SeasonCard.vue
index 3d71a35..276778b 100644
--- a/components/League/SeasonCard.vue
+++ b/components/League/SeasonCard.vue
@@ -18,7 +18,7 @@
 
       <div v-if="mode === MODE_UPCOMING">
         <v-icon x-small>mdi-clock-outline</v-icon> starts at
-        {{ formatDateEpoch(season.nextContinuationAt, 'dd.MM.yyyy HH:mm') }}
+        {{ formatDateEpoch(season.nextContinuationAt, 'P p') }}
       </div>
       <div>
         <v-icon x-small>mdi-account-multiple-outline</v-icon>