From e7f2b2ad5781dd700fb057cbb07a47ff619d7a8b Mon Sep 17 00:00:00 2001
From: Rafal Dziegielewski <rafal.dzieg@gmail.com>
Date: Tue, 13 Aug 2024 15:12:34 +0200
Subject: [PATCH] fix: fix property type 'date' when backend returns an iso
 string

---
 .../components/property-type/datetime/edit.tsx    | 15 +++++++++++----
 .../property-type/datetime/map-value.ts           |  3 ++-
 .../property-type/datetime/strip-time-from-iso.ts |  9 +++++++++
 3 files changed, 22 insertions(+), 5 deletions(-)
 create mode 100644 src/frontend/components/property-type/datetime/strip-time-from-iso.ts

diff --git a/src/frontend/components/property-type/datetime/edit.tsx b/src/frontend/components/property-type/datetime/edit.tsx
index b42ef2a00..681864294 100644
--- a/src/frontend/components/property-type/datetime/edit.tsx
+++ b/src/frontend/components/property-type/datetime/edit.tsx
@@ -7,10 +7,14 @@ import { PropertyLabel } from '../utils/property-label/index.js'
 import allowOverride from '../../../hoc/allow-override.js'
 import { useTranslation } from '../../../hooks/index.js'
 import { PropertyType } from '../../../../backend/index.js'
+import { stripTimeFromISO } from './strip-time-from-iso.js'
 
-const formatDate = (val:string|null, propertyType: PropertyType) => {
-  if (val) return (propertyType === 'date' ? `${val}T00:00:00` : val)
-  return ''
+const formatDate = (date: string | Date | null, propertyType: PropertyType) => {
+  if (!date) return ''
+
+  if (propertyType !== 'date') return date
+
+  return `${stripTimeFromISO(date)}T00:00:00`
 }
 
 const Edit: React.FC<EditPropertyProps> = (props) => {
@@ -26,7 +30,10 @@ const Edit: React.FC<EditPropertyProps> = (props) => {
         value={value}
         disabled={property.isDisabled}
         onChange={(date) => {
-          onChange(property.path, property.type === 'date' ? date?.substring(0, 10) ?? date : date)
+          onChange(
+            property.path,
+            property.type === 'date' ? stripTimeFromISO(date) ?? date : date,
+          )
         }}
         propertyType={property.type}
         {...property.props}
diff --git a/src/frontend/components/property-type/datetime/map-value.ts b/src/frontend/components/property-type/datetime/map-value.ts
index c3afe747e..f3d4145f2 100644
--- a/src/frontend/components/property-type/datetime/map-value.ts
+++ b/src/frontend/components/property-type/datetime/map-value.ts
@@ -1,12 +1,13 @@
 import { formatDateProperty } from '@adminjs/design-system'
 
 import { PropertyType } from '../../../../backend/adapters/property/base-property.js'
+import { stripTimeFromISO } from './strip-time-from-iso.js'
 
 export default (value: Date, propertyType: PropertyType): string => {
   if (!value) {
     return ''
   }
-  const date = propertyType === 'date' ? new Date(`${value}T00:00:00`) : new Date(value)
+  const date = propertyType === 'date' ? new Date(`${stripTimeFromISO(value)}T00:00:00`) : new Date(value)
   if (date) {
     return formatDateProperty(date, propertyType)
   }
diff --git a/src/frontend/components/property-type/datetime/strip-time-from-iso.ts b/src/frontend/components/property-type/datetime/strip-time-from-iso.ts
new file mode 100644
index 000000000..c7c9fd987
--- /dev/null
+++ b/src/frontend/components/property-type/datetime/strip-time-from-iso.ts
@@ -0,0 +1,9 @@
+export const stripTimeFromISO = (date: string | Date | null): string | null => {
+  if (date === null) return null
+
+  if (typeof date === 'string') {
+    return date.replace(/T\d{2}:\d{2}:\d{2}\.\d{3}Z$/, '')
+  }
+
+  return date.toISOString().replace(/T\d{2}:\d{2}:\d{2}\.\d{3}Z$/, '')
+}