mirror of
https://github.com/status-im/re-frame-10x.git
synced 2025-02-10 05:03:49 +00:00
Autocompletion
This commit is contained in:
parent
9d7be2c845
commit
c263846175
@ -187,6 +187,14 @@
|
|||||||
(assoc-in [:app-db :search-string] "")))
|
(assoc-in [:app-db :search-string] "")))
|
||||||
db))))
|
db))))
|
||||||
|
|
||||||
|
(rf/reg-event-db
|
||||||
|
:app-db/add-autocomplete
|
||||||
|
[(rf/path :app-db :search-string)]
|
||||||
|
(fn [search-string [_ k]]
|
||||||
|
(if (str/blank? search-string)
|
||||||
|
(prn-str k)
|
||||||
|
(str (str/trim search-string) " " (prn-str k) " "))))
|
||||||
|
|
||||||
(rf/reg-event-db
|
(rf/reg-event-db
|
||||||
:app-db/search-string
|
:app-db/search-string
|
||||||
(fn [db [_ search-string]]
|
(fn [db [_ search-string]]
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
(let [subtree-input (r/atom "")
|
(let [subtree-input (r/atom "")
|
||||||
subtree-paths (rf/subscribe [:app-db/paths])
|
subtree-paths (rf/subscribe [:app-db/paths])
|
||||||
search-string (rf/subscribe [:app-db/search-string])
|
search-string (rf/subscribe [:app-db/search-string])
|
||||||
|
autocomplete (rf/subscribe [:app-db/autocomplete-keys])
|
||||||
input-error (r/atom false)]
|
input-error (r/atom false)]
|
||||||
(fn []
|
(fn []
|
||||||
[:div {:style {:flex "1 1 auto" :display "flex" :flex-direction "column"}}
|
[:div {:style {:flex "1 1 auto" :display "flex" :flex-direction "column"}}
|
||||||
@ -22,6 +23,16 @@
|
|||||||
:change-on-blur? false
|
:change-on-blur? false
|
||||||
:placeholder ":path :into :app-db"]
|
:placeholder ":path :into :app-db"]
|
||||||
|
|
||||||
|
(js/console.log "Autocomplete" @autocomplete)
|
||||||
|
|
||||||
|
|
||||||
|
[re-com/h-box
|
||||||
|
:children (map (fn [k] [:button.label
|
||||||
|
{:key (prn-str k)
|
||||||
|
:on-click #(rf/dispatch [:app-db/add-autocomplete k])}
|
||||||
|
(prn-str k)])
|
||||||
|
@autocomplete)]
|
||||||
|
|
||||||
;; TODO: check for input errors
|
;; TODO: check for input errors
|
||||||
; (if @input-error
|
; (if @input-error
|
||||||
; [:div.input-error {:style {:color "red" :margin-top 5}}
|
; [:div.input-error {:style {:color "red" :margin-top 5}}
|
||||||
|
@ -115,6 +115,7 @@
|
|||||||
(def label-mixin {:color text-color
|
(def label-mixin {:color text-color
|
||||||
:background background-gray-hint
|
:background background-gray-hint
|
||||||
:border [[(px 1) "solid" light-gray]]
|
:border [[(px 1) "solid" light-gray]]
|
||||||
|
:flex [[0 0 "auto"]]
|
||||||
:font-size (em 0.9)
|
:font-size (em 0.9)
|
||||||
:margin [[(px 10) (px 5)]]})
|
:margin [[(px 10) (px 5)]]})
|
||||||
|
|
||||||
@ -295,7 +296,7 @@
|
|||||||
[:.filter-items-count
|
[:.filter-items-count
|
||||||
{:cursor "auto"}
|
{:cursor "auto"}
|
||||||
[(s/& ".active") {:background yellow
|
[(s/& ".active") {:background yellow
|
||||||
:cursor "pointer"}
|
:cursor "pointer"}
|
||||||
[(s/& ":hover") {:text-decoration "line-through"}]]]
|
[(s/& ":hover") {:text-decoration "line-through"}]]]
|
||||||
[:.filter-fields {:margin-top "10px"}]
|
[:.filter-fields {:margin-top "10px"}]
|
||||||
[:.filter-category {:display "inline-block"
|
[:.filter-category {:display "inline-block"
|
||||||
|
@ -1,5 +1,7 @@
|
|||||||
(ns day8.re-frame.trace.subs
|
(ns day8.re-frame.trace.subs
|
||||||
(:require [mranderson047.re-frame.v0v10v2.re-frame.core :as rf]))
|
(:require [mranderson047.re-frame.v0v10v2.re-frame.core :as rf]
|
||||||
|
[re-frame.db]
|
||||||
|
[clojure.string :as str]))
|
||||||
|
|
||||||
(rf/reg-sub
|
(rf/reg-sub
|
||||||
:settings/root
|
:settings/root
|
||||||
@ -31,6 +33,32 @@
|
|||||||
(fn [db _]
|
(fn [db _]
|
||||||
(get db :app-db)))
|
(get db :app-db)))
|
||||||
|
|
||||||
|
(rf/reg-sub
|
||||||
|
:app-db/re-frame-db
|
||||||
|
(fn []
|
||||||
|
[])
|
||||||
|
(fn [_ _]
|
||||||
|
@re-frame.db/app-db))
|
||||||
|
|
||||||
|
(rf/reg-sub
|
||||||
|
:app-db/autocomplete-keys
|
||||||
|
:<- [:app-db/root]
|
||||||
|
:<- [:app-db/re-frame-db]
|
||||||
|
(fn [[app-db-settings re-frame-db] _]
|
||||||
|
(let [search-string (:search-string app-db-settings)]
|
||||||
|
(take 20
|
||||||
|
(try
|
||||||
|
(if (str/blank? search-string)
|
||||||
|
(keys re-frame-db)
|
||||||
|
(let [path (try
|
||||||
|
(cljs.reader/read-string (str "[" search-string "]"))
|
||||||
|
(catch :default e
|
||||||
|
nil))]
|
||||||
|
(when (some? path)
|
||||||
|
(keys (get-in re-frame-db path)))))
|
||||||
|
(catch :default e
|
||||||
|
nil))))))
|
||||||
|
|
||||||
(rf/reg-sub
|
(rf/reg-sub
|
||||||
:app-db/paths
|
:app-db/paths
|
||||||
:<- [:app-db/root]
|
:<- [:app-db/root]
|
||||||
|
@ -200,7 +200,7 @@
|
|||||||
:style (flex-child-style "auto")}
|
:style (flex-child-style "auto")}
|
||||||
[(if (= input-type :password) :input input-type)
|
[(if (= input-type :password) :input input-type)
|
||||||
(merge
|
(merge
|
||||||
{:class (str "form-control " class)
|
{:class class
|
||||||
:type (case input-type
|
:type (case input-type
|
||||||
:input "text"
|
:input "text"
|
||||||
:password "password"
|
:password "password"
|
||||||
|
Loading…
x
Reference in New Issue
Block a user