feat: searching loader

pull/2456/head
Junyu Zhan 2021-07-20 16:15:34 +08:00
parent f2197daaff
commit 246f9628e7
1 changed files with 24 additions and 26 deletions

View File

@ -4,12 +4,13 @@
[frontend.extensions.zotero.api :as api]
[frontend.extensions.zotero.handler :as zotero-handler]
[frontend.extensions.zotero.extractor :as extractor]
[frontend.components.svg :as svg]
[frontend.state :as state]
[frontend.util :as util]
[rum.core :as rum]))
(defonce term-chan (chan))
(defonce debounce-chan (api/debounce term-chan 5000))
(defonce debounce-chan (api/debounce term-chan 200))
(rum/defc zotero-search-item [{:keys [data] :as item} handle-command-zotero]
@ -52,33 +53,29 @@
(let [[term set-term!] (rum/use-state "")
[search-result set-search-result!] (rum/use-state [])
[search-error set-search-error!] (rum/use-state nil)
[is-searching set-is-searching!] (rum/use-state false)
term-chan (chan)
debounce-chan (api/debounce term-chan 500)]
[is-searching set-is-searching!] (rum/use-state false)]
(println search-error)
(rum/use-effect!
(fn []
(go
(let [term (<! debounce-chan)]
(when-not (str/blank? term)
(set-is-searching! true)
(set-search-result!
(<! (api/query-items "journalArticle" term)))
(set-is-searching! false)))))
[term])
(go
(let [d-term (<! debounce-chan)]
;; (js/console.log "xxx term:::" d-term)
(when-not (str/blank? d-term)
(set-search-result!
(<! (api/query-items "journalArticle" d-term))))))
(set-is-searching! true)
(let [result (<! (api/query-items "journalArticle" d-term))]
(if (false? (:success result))
(set-search-error! (:body result))
(set-search-result! result)))
(set-is-searching! false))))
[:div.zotero-search.p-4
{:style {:width 600}}
[:input.p-2.border.block.w-full.mb-2
[:div.flex
[[:input.p-2.border.block.w-full.mb-2
{:autoFocus true
:placeholder "Search for your Zotero journal article (title, author, text, anything)"
:value term :on-change (fn [e]
@ -87,7 +84,8 @@
(>! term-chan (util/evalue e)))
(set-term! (util/evalue e)))}]
[:div.h-2.text-sm.mb-2 (when is-searching "loading...")]
[:span {:class (when is-searching "loader-reverse")} svg/refresh]]]
[:div
(map