From 575ee8bf3829dd2c7c49fc2e0a548a87cd898cef Mon Sep 17 00:00:00 2001
From: jim-sheldon <5619539+jim-sheldon@users.noreply.github.com>
Date: Sat, 23 Mar 2024 12:40:20 -0400
Subject: [PATCH] Fixes date fields autofilling on edit

---
 .../common-form-fields/FormikFields.tsx       | 33 ++++++++++++++++++-
 1 file changed, 32 insertions(+), 1 deletion(-)

diff --git a/verification/curator-service/ui/src/components/common-form-fields/FormikFields.tsx b/verification/curator-service/ui/src/components/common-form-fields/FormikFields.tsx
index 2bfb4e5ca..cc127b666 100644
--- a/verification/curator-service/ui/src/components/common-form-fields/FormikFields.tsx
+++ b/verification/curator-service/ui/src/components/common-form-fields/FormikFields.tsx
@@ -193,6 +193,37 @@ interface DateFieldProps {
 export function DateField(props: DateFieldProps): JSX.Element {
     const classes = useStyles();
 
+    if (props.value) {
+        return (
+            <div className={classes.fieldRow}>
+                <LocalizationProvider dateAdapter={AdapterDateFns}>
+                    <DesktopDatePicker
+                        className={classes.field}
+                        data-testid={props.name}
+                        label={props.label}
+                        inputFormat="yyyy/MM/dd"
+                        mask="____/__/__"
+                        minDate={new Date('2019/12/01')}
+                        disableFuture
+                        value={props.value || undefined}
+                        onChange={props.onChange}
+                        renderInput={(params) => (
+                            <MuiTextField
+                                {...params}
+                                name={props.name}
+                                fullWidth
+                                // Non formik component needs different error handling
+                                error={!!props.errorMessage}
+                                helperText={props.errorMessage}
+                            />
+                        )}
+                    />
+                </LocalizationProvider>
+                {props.required && <RequiredHelperText name={props.name} />}
+            </div>
+        );
+    }
+
     return (
         <div className={classes.fieldRow}>
             <LocalizationProvider dateAdapter={AdapterDateFns}>
@@ -204,7 +235,7 @@ export function DateField(props: DateFieldProps): JSX.Element {
                     mask="____/__/__"
                     minDate={new Date('2019/12/01')}
                     disableFuture
-                    value={props.value}
+                    value="yyyy/MM/dd"
                     onChange={props.onChange}
                     renderInput={(params) => (
                         <MuiTextField