From 6b73d906568bec826e1efa649c249bce07bc82cc Mon Sep 17 00:00:00 2001
From: foyarash <11079152+foyarash@users.noreply.github.com>
Date: Mon, 20 Nov 2023 17:40:54 +0100
Subject: [PATCH] Handle date input

---
 packages/next-admin/src/components/Form.tsx   |  2 ++
 .../src/components/inputs/DateWidget.tsx      | 19 +++++++++++++++++++
 2 files changed, 21 insertions(+)
 create mode 100644 packages/next-admin/src/components/inputs/DateWidget.tsx

diff --git a/packages/next-admin/src/components/Form.tsx b/packages/next-admin/src/components/Form.tsx
index f543300f..ff4dc1f2 100644
--- a/packages/next-admin/src/components/Form.tsx
+++ b/packages/next-admin/src/components/Form.tsx
@@ -18,6 +18,7 @@ import CheckboxWidget from "./inputs/CheckboxWidget";
 import SelectWidget from "./inputs/SelectWidget";
 import Button from "./radix/Button";
 import DateTimeWidget from "./inputs/DateTimeWidget";
+import DateWidget from "./inputs/DateWidget";
 
 // Override Form functions to not prevent the submit
 class CustomForm extends RjsfForm {
@@ -45,6 +46,7 @@ const fields: CustomForm["props"]["fields"] = {
 };
 
 const widgets: CustomForm["props"]["widgets"] = {
+  DateWidget: DateWidget,
   DateTimeWidget: DateTimeWidget,
   SelectWidget: SelectWidget,
   CheckboxWidget: CheckboxWidget,
diff --git a/packages/next-admin/src/components/inputs/DateWidget.tsx b/packages/next-admin/src/components/inputs/DateWidget.tsx
new file mode 100644
index 00000000..761bd93f
--- /dev/null
+++ b/packages/next-admin/src/components/inputs/DateWidget.tsx
@@ -0,0 +1,19 @@
+import { useCallback } from 'react';
+import { getTemplate, FormContextType, RJSFSchema, StrictRJSFSchema, WidgetProps } from '@rjsf/utils';
+
+/** The `DateWidget` component uses the `BaseInputTemplate` changing the type to `date` and transforms
+ * the value to undefined when it is falsy during the `onChange` handling.
+ *
+ * @param props - The `WidgetProps` for this component
+ */
+export default function DateWidget<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
+  props: WidgetProps<T, S, F>
+) {
+  const { onChange, options, registry, value } = props;
+  const BaseInputTemplate = getTemplate<'BaseInputTemplate', T, S, F>('BaseInputTemplate', registry, options);
+  const handleChange = useCallback((value: any) => onChange(value || undefined), [onChange]);
+  
+  const inputValue = value ? new Date(value).toISOString().split('T')[0] : undefined;
+
+  return <BaseInputTemplate type='date' {...props} value={inputValue} onChange={handleChange} />;
+}
\ No newline at end of file