From 349c3f3f930e05060b3a2aec72c46d8a2f979103 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9CKenzo-Wada=E2=80=9D?= <used.acormhib@gmail.com>
Date: Wed, 25 Sep 2024 23:30:40 +0900
Subject: [PATCH] [@mantine/dates] fix: add locale and timezone to hidden input

---
 .../HiddenDatesInput/HiddenDatesInput.tsx     | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/packages/@mantine/dates/src/components/HiddenDatesInput/HiddenDatesInput.tsx b/packages/@mantine/dates/src/components/HiddenDatesInput/HiddenDatesInput.tsx
index 15bc05a9d70..bd9f56adebb 100644
--- a/packages/@mantine/dates/src/components/HiddenDatesInput/HiddenDatesInput.tsx
+++ b/packages/@mantine/dates/src/components/HiddenDatesInput/HiddenDatesInput.tsx
@@ -1,4 +1,7 @@
+import dayjs from 'dayjs';
 import { DatePickerType, DatesRangeValue, DateValue } from '../../types';
+import { shiftTimezone } from '../../utils';
+import { useDatesContext } from '../DatesProvider';
 
 export type HiddenDatesInputValue = DatesRangeValue | DateValue | DateValue[];
 
@@ -10,6 +13,14 @@ export interface HiddenDatesInputProps {
 }
 
 function formatValue(value: HiddenDatesInputValue, type: DatePickerType) {
+  const ctx = useDatesContext();
+  const locale = ctx.getLocale();
+  dayjs.locale(locale);
+  const formatDateWithTimezoneAndLocale = (date: Date) => {
+    const shiftedDate = shiftTimezone('add', date, ctx.getTimezone());
+    return dayjs(shiftedDate).format();
+  };
+
   if (type === 'range' && Array.isArray(value)) {
     const [startDate, endDate] = value;
     if (!startDate) {
@@ -17,21 +28,21 @@ function formatValue(value: HiddenDatesInputValue, type: DatePickerType) {
     }
 
     if (!endDate) {
-      return `${startDate.toISOString()} –`;
+      return `${formatDateWithTimezoneAndLocale(startDate)} –`;
     }
 
-    return `${startDate.toISOString()} – ${endDate.toISOString()}`;
+    return `${formatDateWithTimezoneAndLocale(startDate)} – ${formatDateWithTimezoneAndLocale(endDate)}`;
   }
 
   if (type === 'multiple' && Array.isArray(value)) {
     return value
-      .map((date) => date?.toISOString())
+      .map((date) => date && formatDateWithTimezoneAndLocale(date))
       .filter(Boolean)
       .join(', ');
   }
 
   if (!Array.isArray(value) && value) {
-    return value.toISOString();
+    return formatDateWithTimezoneAndLocale(value);
   }
 
   return '';