From b5cdf5fdd8c13bb76cbba1e6cc31af70f2e2c69f Mon Sep 17 00:00:00 2001
From: Alex Shpak <alex-shpak@users.noreply.github.com>
Date: Tue, 6 Jul 2021 14:09:19 +0200
Subject: [PATCH] Respect hour12 settings when formatting local date (#33679)

* Respect hour12 settings when formatting local date
---
 .../grafana-data/src/datetime/formats.test.ts | 21 ++++++++++++++++++-
 packages/grafana-data/src/datetime/formats.ts |  7 +++++--
 2 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/packages/grafana-data/src/datetime/formats.test.ts b/packages/grafana-data/src/datetime/formats.test.ts
index 9b551fa1812..f99fac43802 100644
--- a/packages/grafana-data/src/datetime/formats.test.ts
+++ b/packages/grafana-data/src/datetime/formats.test.ts
@@ -14,6 +14,25 @@ describe('Date Formats', () => {
       ''
     );
 
-    expect(format).toBe('MM/DD/YYYY, HH:mm:ss A');
+    expect(format).toBe('MM/DD/YYYY, hh:mm:ss A');
+  });
+});
+
+describe('Date Formats without hour12', () => {
+  it('localTimeFormat', () => {
+    const format = localTimeFormat(
+      {
+        year: '2-digit',
+        month: '2-digit',
+        day: '2-digit',
+        hour: '2-digit',
+        minute: '2-digit',
+        second: '2-digit',
+        hour12: false,
+      },
+      ''
+    );
+
+    expect(format).toBe('MM/DD/YYYY, HH:mm:ss');
   });
 });
diff --git a/packages/grafana-data/src/datetime/formats.ts b/packages/grafana-data/src/datetime/formats.ts
index f089a8eea8c..cb26ee32716 100644
--- a/packages/grafana-data/src/datetime/formats.ts
+++ b/packages/grafana-data/src/datetime/formats.ts
@@ -97,12 +97,15 @@ export function localTimeFormat(
   }
 
   // https://momentjs.com/docs/#/displaying/format/
-  const parts = new Intl.DateTimeFormat(locale, options).formatToParts(new Date());
+  const dateTimeFormat = new Intl.DateTimeFormat(locale, options);
+  const parts = dateTimeFormat.formatToParts(new Date());
+  const hour12 = dateTimeFormat.resolvedOptions().hour12;
+
   const mapping: { [key: string]: string } = {
     year: 'YYYY',
     month: 'MM',
     day: 'DD',
-    hour: 'HH',
+    hour: hour12 ? 'hh' : 'HH',
     minute: 'mm',
     second: 'ss',
     weekday: 'ddd',