From de5b3e8e5a6b9ef38b4fad7e88fb9616aab40f83 Mon Sep 17 00:00:00 2001
From: Thibault Duplessis <t@lichess.org>
Date: Tue, 24 Sep 2024 13:18:34 +0200
Subject: [PATCH] guess who wants to see AM/PM in their datepickers

---
 ui/bits/src/bits.flatpickr.ts | 2 ++
 ui/bits/src/bits.tourForm.ts  | 2 ++
 ui/common/src/i18n.ts         | 9 +++++++--
 ui/swiss/src/view/main.ts     | 2 ++
 4 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/ui/bits/src/bits.flatpickr.ts b/ui/bits/src/bits.flatpickr.ts
index 06943f95c2c9..19bcd538a167 100644
--- a/ui/bits/src/bits.flatpickr.ts
+++ b/ui/bits/src/bits.flatpickr.ts
@@ -1,4 +1,5 @@
 import flatpickr from 'flatpickr';
+import { use24h } from 'common/i18n';
 
 site.load.then(() => {
   $('.flatpickr').each(function(this: HTMLInputElement) {
@@ -11,6 +12,7 @@ site.load.then(() => {
       maxDate: new Date(Date.now() + 1000 * 3600 * 24 * 31 * 12),
       monthSelectorType: 'static',
       disableMobile: true, // https://flatpickr.js.org/mobile-support/ https://github.com/lichess-org/lila/issues/8110
+      time_24hr: use24h(),
       ...config,
     });
   });
diff --git a/ui/bits/src/bits.tourForm.ts b/ui/bits/src/bits.tourForm.ts
index 10fb63407ed5..c3c69fe28cd2 100644
--- a/ui/bits/src/bits.tourForm.ts
+++ b/ui/bits/src/bits.tourForm.ts
@@ -1,4 +1,5 @@
 import flatpickr from 'flatpickr';
+import { use24h } from 'common/i18n';
 
 site.load.then(() => {
   const $variant = $('#form3-variant'),
@@ -17,6 +18,7 @@ site.load.then(() => {
       altFormat: 'Y-m-d h:i K',
       monthSelectorType: 'static',
       disableMobile: true,
+      time_24hr: use24h(),
     });
   });
 });
diff --git a/ui/common/src/i18n.ts b/ui/common/src/i18n.ts
index e33e41d557b2..7a564c52bd6d 100644
--- a/ui/common/src/i18n.ts
+++ b/ui/common/src/i18n.ts
@@ -34,13 +34,15 @@ export const displayLocale: string = document.documentElement.lang.startsWith('a
   ? 'ar-ly'
   : document.documentElement.lang;;
 
-export const commonDateFormat: (d?: Date|number) => string = new Intl.DateTimeFormat(displayLocale, {
+const commonDateFormatter = new Intl.DateTimeFormat(displayLocale, {
   year: 'numeric',
   month: 'short',
   day: 'numeric',
   hour: 'numeric',
   minute: 'numeric',
-}).format;
+});
+
+export const commonDateFormat: (d?: Date|number) => string = commonDateFormatter.format;
 
 export const timeago: (d: DateLike) => string =
   (date: DateLike) => formatAgo((Date.now() - toDate(date).getTime()) / 1000);
@@ -49,6 +51,9 @@ export const timeago: (d: DateLike) => string =
 export const toDate = (input: DateLike): Date =>
   input instanceof Date ? input : new Date(isNaN(input as any) ? input : parseInt(input as any));
 
+export const use24h = (): boolean =>
+  !new Intl.DateTimeFormat(displayLocale).resolvedOptions().hour12;
+
 // format the diff second to *** time ago
 export const formatAgo = (seconds: number): string => {
   const absSeconds = Math.abs(seconds);
diff --git a/ui/swiss/src/view/main.ts b/ui/swiss/src/view/main.ts
index 8fb851877ca6..4596393750c7 100644
--- a/ui/swiss/src/view/main.ts
+++ b/ui/swiss/src/view/main.ts
@@ -12,6 +12,7 @@ import * as boards from './boards';
 import podium from './podium';
 import playerInfo from './playerInfo';
 import flatpickr from 'flatpickr';
+import { use24h } from 'common/i18n';
 import { once } from 'common/storage';
 import { initMiniGames } from 'common/miniBoard';
 import { watchers } from 'common/watchers';
@@ -107,6 +108,7 @@ function nextRound(ctrl: SwissCtrl): VNode | undefined {
             onClose() {
               (el.parentNode as HTMLFormElement).submit();
             },
+            time_24hr: use24h(),
           }),
         ),
       }),