From 9c21b62ff21d17911293c469168238e974f46219 Mon Sep 17 00:00:00 2001
From: Timur Demin <me@tdem.in>
Date: Thu, 16 Jan 2020 16:23:36 +0500
Subject: [PATCH] Add an unset button to datetime picker

---
 src/views/assets/locales.ts             | 1 +
 src/views/components/dateTimePicker.tsx | 9 ++++++++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/views/assets/locales.ts b/src/views/assets/locales.ts
index abd5276..d23bf58 100644
--- a/src/views/assets/locales.ts
+++ b/src/views/assets/locales.ts
@@ -36,6 +36,7 @@ export default new LocalizedStrings({
         editor_parentNoParentVal: "No parent",
         editor_deadline: "Deadline:",
         editor_reminder: "Reminder:",
+        editor_unsetTp: "Unset",
         task_toggleBtnCompleted: "Completed",
         task_toggleBtnPending: "Pending",
         app_versionString: `${appFullName} v${appVersion} by ${appAuthor}`,
diff --git a/src/views/components/dateTimePicker.tsx b/src/views/components/dateTimePicker.tsx
index 89aacf8..7539e96 100644
--- a/src/views/components/dateTimePicker.tsx
+++ b/src/views/components/dateTimePicker.tsx
@@ -7,6 +7,7 @@ import {
     DateFormat,
     TimeFormat,
 } from "../../helpers/datetime";
+import strings from "../assets/locales";
 
 /** Helper for `new Date()`. */
 const FDate = (v: number | undefined) => new Date(v || 0);
@@ -46,9 +47,10 @@ export class DateTimePicker extends React.Component<Props, State> {
         const date = parse(e.currentTarget.value, TimeFormat, this.state.date);
         this.setState({ date });
     };
-    // TODO: add an "Unset" button
+    unsetDate = () => this.setState({ date: FDate(0) });
     render = () => {
         let date, time;
+        // date/time input sometimes reports weird values that are out of range
         try {
             date = format(this.state.date, DateFormat);
             time = format(this.state.date, TimeFormat);
@@ -70,6 +72,11 @@ export class DateTimePicker extends React.Component<Props, State> {
                     value={time}
                     required={this.props.timeRequired}
                 />
+                <input
+                    type="button"
+                    value={strings.editor_unsetTp}
+                    onClick={this.unsetDate}
+                />
             </div>
         );
     };