notid/integreat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added new typeahead approach

Browse Source
This commit is contained in:
Bryce Covert
2021-05-30 09:16:56 -07:00
parent 057e88de30
commit bff7d4adf2
6 changed files with 43 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/cljs/auto_ap/subs.cljs
View File

@@ -3,7 +3,10 @@
[auto-ap.utils :refer [by]]
[clojure.string :as str]
[goog.crypt.base64 :as base64]
[memsearch.core :as ms]))
[minisearch :as ms]))
(set! *warn-on-infer* true)
(def MiniSearch (aget ms "default"))
(re-frame/reg-sub
::client
@@ -65,10 +68,13 @@
::accounts-index
:<- [::accounts]
(fn [accounts]
(ms/text-index (map (fn [v] {:id (:id v)
:content (str (:numeric-code v) " " (:name v))})
accounts)
{:maintain-actual? true})))
(doto (MiniSearch. #js {:fields #js ["numeric-code" "name" "content"]
:storeFields #js ["id" "numeric-code" "name" "content"]})
(.addAll (clj->js (map (fn [v] {:id (:id v)
:name (:name v)
:numeric-code (:numeric-code v)
:content (str (:numeric-code v) " " (:name v))})
accounts))))))
@@ -217,10 +223,12 @@
::searchable-vendors-index
:<- [::searchable-vendors]
(fn [searchable-vendors]
(ms/text-index (map (fn [v] {:id (:id v)
:content (:name v)})
searchable-vendors)
{:maintain-actual? true})))
(doto (MiniSearch. #js {:fields #js ["name" "content"]
:storeFields #js ["id" "name" "content"]})
(.addAll (clj->js (map (fn [v] {:id (:id v)
:name (:name v)
:content (:name v)})
searchable-vendors))))))
(re-frame/reg-sub
::all-vendors

18
src/cljs/auto_ap/views/components/typeahead.cljs
View File

@@ -3,9 +3,9 @@
[reagent.ratom :as ra]
[clojure.string :as str]
[clojure.set :as set]
[memsearch.core :as ms]
[downshift :as ds :refer [useCombobox]]
[react]))
(set! *warn-on-infer* true)
;; TODO: This avoids the use of inferred externs by using aget. You could just use the ^js tag though
@@ -21,7 +21,7 @@
:else
(aget actions-and-changes "changes")))
(defn typeahead-v3-internal [{:keys [class style disabled entities entity->text entities-by-id entity-index on-change disabled value name auto-focus] :or {disabled false} :as i}]
(defn typeahead-v3-internal [{:keys [class style disabled entities ^js entity->text entities-by-id entity-index on-change disabled value name auto-focus] :or {disabled false} :as i}]
(let [[items set-items] (react/useState (map clj->js entities))
[getLabelProps getMenuProps getComboboxProps getToggleButtonProps getInputProps getItemProps isOpen highlightedIndex selectItem selectedItem setInputValue]
(as-> (useCombobox (clj->js {:items items
@@ -29,15 +29,11 @@
:defaultSelectedItem value
:onInputValueChange (fn [input]
(if entities-by-id
(->> (ms/text-search (aget input "inputValue") entity-index)
(sort-by (fn [[k v]]
(- (:score v))))
(map (fn [[x]]
(entities-by-id x)
))
(take 5)
clj->js
set-items)
(do
(->> (.search entity-index (or (aget input "inputValue") "") #js {:fuzzy 0.2} )
clj->js
(take 10)
(set-items)))
(set-items (map clj->js (take 5 (filter (fn [x] (str/includes? (or (some-> (entity->text x) str/lower-case) "")
(or (some-> (aget input "inputValue") str/lower-case) "")))