From f09b6bf090580e438126a7ac9496aff3a4aa4ec9 Mon Sep 17 00:00:00 2001
From: Adria Navarro <adria@budibase.com>
Date: Thu, 6 Jun 2024 13:03:00 +0200
Subject: [PATCH] Handle times properly on time only settings for timestamps

---
 .../app/blocks/FormBlockComponent.svelte      |  5 ++++
 .../components/app/forms/DateTimeField.svelte | 28 +++++++++++++++++--
 2 files changed, 30 insertions(+), 3 deletions(-)

diff --git a/packages/client/src/components/app/blocks/FormBlockComponent.svelte b/packages/client/src/components/app/blocks/FormBlockComponent.svelte
index 396dfcf808..58632ad1bc 100644
--- a/packages/client/src/components/app/blocks/FormBlockComponent.svelte
+++ b/packages/client/src/components/app/blocks/FormBlockComponent.svelte
@@ -68,6 +68,11 @@
           maximum: schema?.constraints?.length?.maximum,
         }
       },
+      [FieldType.DATETIME]: (_field, schema) => {
+        return {
+          valueAsTimestamp: !schema?.timeOnly,
+        }
+      },
     }
 
     const fieldSchema = getFieldSchema(field)
diff --git a/packages/client/src/components/app/forms/DateTimeField.svelte b/packages/client/src/components/app/forms/DateTimeField.svelte
index 499f0443cb..7b6ed734fe 100644
--- a/packages/client/src/components/app/forms/DateTimeField.svelte
+++ b/packages/client/src/components/app/forms/DateTimeField.svelte
@@ -16,15 +16,37 @@
   export let onChange
   export let span
   export let helpText = null
+  export let valueAsTimestamp = false
 
   let fieldState
   let fieldApi
 
   const handleChange = e => {
-    const changed = fieldApi.setValue(e.detail)
-    if (onChange && changed) {
-      onChange({ value: e.detail })
+    let value = e.detail
+    if (timeOnly && valueAsTimestamp) {
+      if (!isValidDate(value)) {
+        // Handle time only fields that are timestamps under the hood
+        value = timeToDateISOString(value)
+      }
     }
+
+    const changed = fieldApi.setValue(value)
+    if (onChange && changed) {
+      onChange({ value })
+    }
+  }
+
+  const isValidDate = value => !isNaN(new Date(value))
+
+  const timeToDateISOString = value => {
+    let [hours, minutes] = value.split(":").map(Number)
+
+    const date = new Date()
+    date.setHours(hours)
+    date.setMinutes(minutes)
+    date.setSeconds(0)
+    date.setMilliseconds(0)
+    return date.toISOString()
   }
 </script>