Resolves #41

web/src/main/frontend/components/editor.cljs

@@ -79,18 +79,18 @@
   (when (state/sub :editor/show-date-picker?)
     (ui/datepicker
      (t/today)
-     :on-change
-     (fn [e date]
-       (util/stop e)
-       (let [journal (util/journal-name (tc/to-date date))]
-         ;; similar to page reference
-         (commands/insert! id (str "[[" journal)
-                           *slash-caret-pos
-                           *show-commands
-                           *matched-commands
-                           :last-pattern "[["
-                           :forward-pos 2)
-         (state/set-editor-show-date-picker false))))))
+     {:on-change
+      (fn [e date]
+        (util/stop e)
+        (let [journal (util/journal-name (tc/to-date date))]
+          ;; similar to page reference
+          (commands/insert! id (str "[[" journal)
+                            *slash-caret-pos
+                            *show-commands
+                            *matched-commands
+                            :last-pattern "[["
+                            :forward-pos 2)
+          (state/set-editor-show-date-picker false)))})))
 
 (rum/defcs input < rum/reactive
   (rum/local {} ::input-value)
@@ -256,6 +256,8 @@
                    (let [{:keys [value on-hide]} (get-state state)]
                      (on-hide value)
                      (state/set-editor-show-input nil)
+                     (state/set-editor-show-date-picker false)
+                     (state/set-editor-show-page-search false)
                      (state/set-edit-input-id! nil)
                      (reset! *slash-caret-pos nil)
                      (reset! *show-commands false)

web/src/main/frontend/ui/date_picker.cljs

@@ -1,10 +1,12 @@
 (ns frontend.ui.date-picker
   (:require
    [rum.core :as rum]
-   [cljs-time.core       :refer [now today minus plus months days year month day day-of-week first-day-of-the-month before? after?]]
+   [cljs-time.core       :refer [now today minus plus months days weeks year month day day-of-week first-day-of-the-month before? after?]]
    [cljs-time.predicates :refer [sunday?]]
    [cljs-time.format     :refer [parse unparse formatters formatter]]
-   [frontend.util          :refer [deref-or-value now->utc]]))
+   [frontend.util          :refer [deref-or-value now->utc]]
+   [frontend.mixins :as mixins]
+   [frontend.util :as util]))
 
 ;; Adapted from re-com date-picker
 
@@ -32,6 +34,8 @@
 
 (defn- inc-date [date n] (plus date (days n)))
 
+(defn- inc-week [date n] (plus date (weeks n)))
+
 (defn previous
   "If date fails pred, subtract period until true, otherwise answer date"
   ;; date   - a date object that satisfies cljs-time.core/DateTimeProtocol.
@@ -174,12 +178,39 @@
     (merge attributes {:selectable-fn selectable-fn})))
 
 (rum/defc date-picker < rum/reactive
+  (mixins/event-mixin
+   (fn [state]
+     (mixins/on-key-down
+      state
+      {
+       ;; enter, current day
+       13 (fn [state e]
+            (when-let [on-change (:on-change (last (:rum/args state)))]
+              (on-change e @*internal-model)))
+
+       ;; left, previous day
+       37 (fn [state e]
+            (swap! *internal-model inc-date -1))
+
+       ;; right, next day
+       39 (fn [state e]
+            (swap! *internal-model inc-date 1))
+
+       ;; up, one week ago
+       38 (fn [state e]
+            (swap! *internal-model inc-week -1))
+       ;; down, next week
+       40 (fn [state e]
+            (swap! *internal-model inc-week 1))}
+      (fn [e key-code]
+        (when (contains? #{13 37 38 39 40} key-code)
+          (util/stop e))))))
   {:init (fn [state]
            (reset! *internal-model (first (:rum/args state)))
            state)}
-  [model & {:keys [on-change disabled? start-of-week class style attr]
-            :or   {start-of-week 6} ;; Default to Sunday
-            :as   args}]
+  [model {:keys [on-change disabled? start-of-week class style attr]
+          :or   {start-of-week 6} ;; Default to Sunday
+          :as   args}]
   (let [internal-model (rum/react *internal-model)
         display-month (first-day-of-the-month (or internal-model (now->utc)))
         props-with-defaults (merge args {:start-of-week start-of-week})