From d3375bb2c150611e891d883674831ede574ad346 Mon Sep 17 00:00:00 2001
From: Sarah Vaupel <vaupel.sarah@campus.lmu.de>
Date: Wed, 18 Sep 2019 13:21:42 +0200
Subject: [PATCH] fix(datepicker): select time from preselected date on edit

---
 frontend/src/utils/form/datepicker.js | 34 +++++++++------------------
 1 file changed, 11 insertions(+), 23 deletions(-)

diff --git a/frontend/src/utils/form/datepicker.js b/frontend/src/utils/form/datepicker.js
index 11d7394bc..c116e8ea6 100644
--- a/frontend/src/utils/form/datepicker.js
+++ b/frontend/src/utils/form/datepicker.js
@@ -24,17 +24,6 @@ const FORM_DATE_FORMAT_MOMENT = {
   'datetime-local': `${FORM_DATE_FORMAT_DATE_MOMENT} ${FORM_DATE_FORMAT_TIME_MOMENT}`,
 };
 
-/**
- * Takes a string representation of a date and a format string and parses the given date to a Date object.
- * If the date string is not valid (i.e. cannot be parsed with the given format string), returns undefined.
- * @param {*} dateStr string representation of a date
- * @param {*} dateFormat format string of the date
- */
-function parseDateWithFormat(dateStr, dateFormat) {
-  const parsedMomentDate = moment(dateStr, dateFormat);
-  if (parsedMomentDate.isValid()) return parsedMomentDate.toDate();
-}
-
 /**
  * Takes a string representation of a date, an input ('previous') format and a desired output format and returns a reformatted date string.
  * If the date string is not valid (i.e. cannot be parsed with the given input format string), returns the original date string;
@@ -136,6 +125,9 @@ export class Datepicker {
       throw new Error('Datepicker utility called on unsupported element!');
     }
 
+    // format any existing dates to fancy display format on pageload
+    this.formatElementValue(true);
+
     // initialize tail.datetime (datepicker) instance
     this.datepickerInstance = datetime(this._element, { ...datepickerGlobalConfig, ...datepickerConfig });
 
@@ -187,9 +179,6 @@ export class Datepicker {
 
     // format the date value of the form input element of this datepicker before form submission
     this._element.form.addEventListener('submit', () => this.formatElementValue());
-
-    // format any existing dates to fancy display format on pageload
-    this.formatElementValue(true);
   }
 
   destroy() {
@@ -201,22 +190,21 @@ export class Datepicker {
    * @param {*} toFancy optional target format switch (boolean value; default is false). If set to a truthy value, formats the element value to fancy instead of internal date format.
    */
   formatElementValue(toFancy) {
-    const dp = this.datepickerInstance;
     if (this._element.value) {
-      if (toFancy) {
-        const parsedDate = parseDateWithFormat(this._element.value, FORM_DATE_FORMAT[this.elementType]);
-        if (parsedDate) dp.selectDate();
-      } else {
-        this._element.value = this.unformat();
-      }
+      this._element.value = this.unformat(toFancy);
     }
   }
 
+
+
   /**
    * Returns a datestring in internal format from the current state of the input element value.
+   * @param {*} toFancy Format date from internal to fancy or vice versa. When omitted, toFancy is falsy and results in fancy -> internal
    */
-  unformat() {
-    return reformatDateString(this._element.value, FORM_DATE_FORMAT_MOMENT[this.elementType], FORM_DATE_FORMAT[this.elementType]);
+  unformat(toFancy) {
+    const formatIn = toFancy ? FORM_DATE_FORMAT[this.elementType] : FORM_DATE_FORMAT_MOMENT[this.elementType];
+    const formatOut = toFancy ? FORM_DATE_FORMAT_MOMENT[this.elementType] : FORM_DATE_FORMAT[this.elementType];
+    return reformatDateString(this._element.value, formatIn, formatOut);
   }
 
   /**