aboutsummaryrefslogtreecommitdiff
path: root/packages/exchange-backoffice-ui/src/forms/InputDate.tsx
diff options
context:
space:
mode:
authorSebastian <sebasjm@gmail.com>2023-05-10 00:53:37 -0300
committerSebastian <sebasjm@gmail.com>2023-05-10 00:53:51 -0300
commitcb535460350bd510dd4b2b7d6bc3c6ec5f5bcdf1 (patch)
tree5b93f143c517f0f35030d75ceafc1032aa56d7c4 /packages/exchange-backoffice-ui/src/forms/InputDate.tsx
parent1c39b2befad80505d67ac8888c44bde4a3c65076 (diff)
almost first document
Diffstat (limited to 'packages/exchange-backoffice-ui/src/forms/InputDate.tsx')
-rw-r--r--packages/exchange-backoffice-ui/src/forms/InputDate.tsx36
1 files changed, 36 insertions, 0 deletions
diff --git a/packages/exchange-backoffice-ui/src/forms/InputDate.tsx b/packages/exchange-backoffice-ui/src/forms/InputDate.tsx
new file mode 100644
index 000000000..c9e1421f8
--- /dev/null
+++ b/packages/exchange-backoffice-ui/src/forms/InputDate.tsx
@@ -0,0 +1,36 @@
+import { AbsoluteTime } from "@gnu-taler/taler-util";
+import { InputLine, UIFormProps } from "./InputLine.js";
+import { CalendarIcon } from "@heroicons/react/24/outline";
+import { VNode, h } from "preact";
+import { format, parse } from "date-fns";
+
+export function InputDate(
+ props: { pattern?: string } & UIFormProps<AbsoluteTime>,
+): VNode {
+ const pattern = props.pattern ?? "dd/MM/yyyy";
+ return (
+ <InputLine<AbsoluteTime>
+ type="text"
+ after={{
+ type: "icon",
+ icon: <CalendarIcon class="h-6 w-6" />,
+ }}
+ converter={{
+ fromStringUI: (v) => {
+ if (!v) return { t_ms: "never" };
+ console.log("from", v);
+ const t_ms = parse(v, pattern, Date.now()).getTime();
+ return { t_ms };
+ },
+ toStringUI: (v) => {
+ return v === undefined
+ ? ""
+ : v.t_ms === "never"
+ ? "never"
+ : format(v.t_ms, pattern);
+ },
+ }}
+ {...props}
+ />
+ );
+}