1 files changed, 57 insertions, 47 deletions
diff --git a/packages/anastasis-webui/src/components/fields/DateInput.tsx b/packages/anastasis-webui/src/components/fields/DateInput.tsx
index 3148c953f..0b6a7e316 100644
--- a/packages/anastasis-webui/src/components/fields/DateInput.tsx
+++ b/packages/anastasis-webui/src/components/fields/DateInput.tsx
@@ -19,56 +19,66 @@ export function DateInput(props: DateInputProps): VNode {
       inputRef.current?.focus();
     }
   }, [props.grabFocus]);
-  const [opened, setOpened] = useState(false)
+  const [opened, setOpened] = useState(false);
 
   const value = props.bind[0] || "";
-  const [dirty, setDirty] = useState(false)
-  const showError = dirty && props.error
+  const [dirty, setDirty] = useState(false);
+  const showError = dirty && props.error;
 
-  const calendar = subYears(new Date(), 30)
-  
-  return <div class="field">
-    <label class="label">
-      {props.label}
-      {props.tooltip && <span class="icon has-tooltip-right" data-tooltip={props.tooltip}>
-        <i class="mdi mdi-information" />
-      </span>}
-    </label>
-    <div class="control">
-      <div class="field has-addons">
-        <p class="control">
-          <input
-            type="text"
-            class={showError ? 'input is-danger' : 'input'}
-            value={value}
-            onInput={(e) => {
-              const text = e.currentTarget.value
-              setDirty(true)
-              props.bind[1](text);
-            }}
-            ref={inputRef} />
-        </p>
-        <p class="control">
-          <a class="button" onClick={() => { setOpened(true) }}>
-            <span class="icon"><i class="mdi mdi-calendar" /></span>
-          </a>
-        </p>
+  const calendar = subYears(new Date(), 30);
+
+  return (
+    <div class="field">
+      <label class="label">
+        {props.label}
+        {props.tooltip && (
+          <span class="icon has-tooltip-right" data-tooltip={props.tooltip}>
+            <i class="mdi mdi-information" />
+          </span>
+        )}
+      </label>
+      <div class="control">
+        <div class="field has-addons">
+          <p class="control">
+            <input
+              type="text"
+              class={showError ? "input is-danger" : "input"}
+              value={value}
+              onInput={(e) => {
+                const text = e.currentTarget.value;
+                setDirty(true);
+                props.bind[1](text);
+              }}
+              ref={inputRef}
+            />
+          </p>
+          <p class="control">
+            <a
+              class="button"
+              onClick={() => {
+                setOpened(true);
+              }}
+            >
+              <span class="icon">
+                <i class="mdi mdi-calendar" />
+              </span>
+            </a>
+          </p>
+        </div>
       </div>
+      <p class="help">Using the format yyyy-mm-dd</p>
+      {showError && <p class="help is-danger">{props.error}</p>}
+      <DatePicker
+        opened={opened}
+        initialDate={calendar}
+        years={props.years}
+        closeFunction={() => setOpened(false)}
+        dateReceiver={(d) => {
+          setDirty(true);
+          const v = format(d, "yyyy-MM-dd");
+          props.bind[1](v);
+        }}
+      />
     </div>
-    <p class="help">Using the format yyyy-mm-dd</p>
-    {showError && <p class="help is-danger">{props.error}</p>}
-    <DatePicker
-      opened={opened}
-      initialDate={calendar}
-      years={props.years}
-      closeFunction={() => setOpened(false)}
-      dateReceiver={(d) => {
-        setDirty(true)
-        const v = format(d, 'yyyy-MM-dd')
-        props.bind[1](v);
-      }}
-    />
-  </div>
-    ;
-
+  );
 }