chore: use gfun/debounce as util/debounce

src/main/frontend/extensions/handbooks/core.cljs

@@ -1,34 +1,34 @@
 (ns frontend.extensions.handbooks.core
-  (:require [clojure.string :as string]
-            [rum.core :as rum]
+  (:require [camel-snake-kebab.core :as csk]
+            [cljs-bean.core :as bean]
             [cljs.core.async :as async :refer [<! >!]]
-            [frontend.ui :as ui]
-            [frontend.state :as state]
-            [frontend.search :as search]
+            [clojure.edn :as edn]
+            [clojure.string :as string]
             [frontend.config :as config]
-            [frontend.handler.notification :as notification]
+            [frontend.context.i18n :refer [t]]
             [frontend.extensions.lightbox :as lightbox]
+            [frontend.extensions.video.youtube :as youtube]
+            [frontend.handler.notification :as notification]
             [frontend.modules.shortcut.config :as shortcut-config]
             [frontend.rum :as r]
-            [cljs-bean.core :as bean]
-            [promesa.core :as p]
-            [camel-snake-kebab.core :as csk]
-            [medley.core :as medley]
-            [frontend.util :as util]
+            [frontend.search :as search]
+            [frontend.state :as state]
             [frontend.storage :as storage]
-            [frontend.extensions.video.youtube :as youtube]
-            [frontend.context.i18n :refer [t]]
-            [clojure.edn :as edn]))
+            [frontend.ui :as ui]
+            [frontend.util :as util]
+            [medley.core :as medley]
+            [promesa.core :as p]
+            [rum.core :as rum]))
 
 (defonce *config (atom {}))
 
 (defn get-handbooks-endpoint
   [resource]
   (str
-    (if (storage/get :handbooks-dev-watch?)
-      "http://localhost:1337"
-      "https://handbooks.pages.dev")
-    resource))
+   (if (storage/get :handbooks-dev-watch?)
+     "http://localhost:1337"
+     "https://handbooks.pages.dev")
+   resource))
 
 (defn resolve-asset-url
   [path]
@@ -42,10 +42,10 @@
   (if-let [matches (and (not (string/blank? content))
                         (re-seq #"src=\"([^\"]+)\"" content))]
     (reduce
-      (fn [content matched]
-        (if-let [matched (second matched)]
-          (string/replace content matched (resolve-asset-url matched)) content))
-      content matches)
+     (fn [content matched]
+       (if-let [matched (second matched)]
+         (string/replace content matched (resolve-asset-url matched)) content))
+     content matches)
     content))
 
 (defn parse-key-from-href
@@ -68,9 +68,9 @@
 (defn bind-parent-key
   [{:keys [key] :as node}]
   (cond-> node
-          (and (string? key)
-               (string/includes? key "/"))
-          (assoc :parent (parse-parent-key key))))
+    (and (string? key)
+         (string/includes? key "/"))
+    (assoc :parent (parse-parent-key key))))
 
 (defn load-glide-assets!
   []
@@ -83,8 +83,8 @@
   [{:keys [key title description cover] :as _topic} nav-fn! opts]
   [:button.w-full.topic-card.flex.text-left
    (merge
-     {:key      key
-      :on-click nav-fn!} opts)
+    {:key      key
+     :on-click nav-fn!} opts)
    (when cover
      [:div.l.flex.items-center
       [:img {:src (resolve-asset-url cover)}]])
@@ -123,14 +123,14 @@
   [topic children on-select]
   (let [[open?, set-open?] (rum/use-state false)]
     (rum/use-effect!
-      (fn []
-        (when-let [^js el (js/document.querySelector "[data-identity=logseq-handbooks]")]
-          (let [h #(when-not (some->> (.-target %)
-                                      (.contains (js/document.querySelector ".chapters-select")))
-                     (set-open? false))]
-            (.addEventListener el "click" h)
-            #(.removeEventListener el "click" h))))
-      [])
+     (fn []
+       (when-let [^js el (js/document.querySelector "[data-identity=logseq-handbooks]")]
+         (let [h #(when-not (some->> (.-target %)
+                                     (.contains (js/document.querySelector ".chapters-select")))
+                    (set-open? false))]
+           (.addEventListener el "click" h)
+           #(.removeEventListener el "click" h))))
+     [])
 
     [:div.chapters-select.w-full
      [:a.select-trigger
@@ -158,20 +158,20 @@
 
     ;; load deps assets
     (rum/use-effect!
-      (fn []
-        (set-deps-pending? true)
-        (-> (load-glide-assets!)
-            (p/then (fn [] (js/setTimeout
-                             #(when (js/document.getElementById (rum/deref *id-ref))
-                                (doto (js/window.Glide. (str "#" (rum/deref *id-ref))) (.mount))) 50)))
-            (p/finally #(set-deps-pending? false))))
-      [])
+     (fn []
+       (set-deps-pending? true)
+       (-> (load-glide-assets!)
+           (p/then (fn [] (js/setTimeout
+                           #(when (js/document.getElementById (rum/deref *id-ref))
+                              (doto (js/window.Glide. (str "#" (rum/deref *id-ref))) (.mount))) 50)))
+           (p/finally #(set-deps-pending? false))))
+     [])
 
     (rum/use-effect!
-      (fn []
-        (js/setTimeout #(some-> (js/document.querySelector ".cp__handbooks-content")
-                                (.scrollTo 0 0))))
-      [pane-state])
+     (fn []
+       (js/setTimeout #(some-> (js/document.querySelector ".cp__handbooks-content")
+                               (.scrollTo 0 0))))
+     [pane-state])
 
     (when-let [topic-key (:key (second pane-state))]
       (when-let [topic (get handbook-nodes topic-key)]
@@ -197,15 +197,15 @@
              (when show-chapters?
                [:div.chapters-wrap.py-2
                 (chapter-select
-                  topic chapters
-                  (fn [k]
-                    (when-let [chapter (get handbook-nodes k)]
-                      (nav! [:topic-detail chapter (:title parent)] pane-state))))])
+                 topic chapters
+                 (fn [k]
+                   (when-let [chapter (get handbook-nodes k)]
+                     (nav! [:topic-detail chapter (:title parent)] pane-state))))])
 
              ;; demos gallery
              (when-let [demos (:demos topic)]
                (let [demos (cond-> demos
-                                   (string? demos) (list))]
+                             (string? demos) (list))]
                  (if (> (count demos) 1)
                    [:div.flex.demos.glide
                     {:id (rum/deref *id-ref)}
@@ -218,10 +218,10 @@
 
                     [:div.glide__bullets {:data-glide-el "controls[nav]"}
                      (map-indexed
-                       (fn [idx _]
-                         [:button.glide__bullet {:data-glide-dir (str "=" idx)}
-                          (inc idx)])
-                       demos)]]
+                      (fn [idx _]
+                        [:button.glide__bullet {:data-glide-dir (str "=" idx)}
+                         (inc idx)])
+                      demos)]]
 
                    [:div.flex.demos.pt-1
                     (media-render (resolve-asset-url (first demos)))])))
@@ -321,10 +321,10 @@
         [selected, set-selected!] (rum/use-state 0)
         select-fn! #(when-let [ldx (and (seq results) (dec (count results)))]
                       (set-selected!
-                        (case %
-                          :up (if (zero? selected) ldx (max (dec selected) 0))
-                          :down (if (= selected ldx) 0 (min (inc selected) ldx))
-                          :dune)))
+                       (case %
+                         :up (if (zero? selected) ldx (max (dec selected) 0))
+                         :down (if (= selected ldx) 0 (min (inc selected) ldx))
+                         :dune)))
 
         q (util/trim-safe q)
         active? (not (string/blank? (util/trim-safe q)))
@@ -332,28 +332,28 @@
         focus-q! #(some-> (rum/deref *input-ref) (.focus))]
 
     (rum/use-effect!
-      #(focus-q!)
-      [pane-state])
+     #(focus-q!)
+     [pane-state])
 
     (rum/use-effect!
-      (fn []
-        (let [pane-nodes (:children (second pane-state))
-              pane-nodes (and (seq pane-nodes)
-                              (mapcat #(conj (:children %) %) pane-nodes))]
+     (fn []
+       (let [pane-nodes (:children (second pane-state))
+             pane-nodes (and (seq pane-nodes)
+                             (mapcat #(conj (:children %) %) pane-nodes))]
 
-          (set-search-state!
-            (merge search-state {:active? active?}))
+         (set-search-state!
+          (merge search-state {:active? active?}))
 
-          (if (and (seq handbooks-nodes) active?)
-            (-> (or pane-nodes
+         (if (and (seq handbooks-nodes) active?)
+           (-> (or pane-nodes
                     ;; global
-                    (vals (dissoc handbooks-nodes "__root")))
-                (search/fuzzy-search q :limit 30 :extract-fn :title)
-                (set-results!))
-            (set-results! nil))
+                   (vals (dissoc handbooks-nodes "__root")))
+               (search/fuzzy-search q :limit 30 :extract-fn :title)
+               (set-results!))
+           (set-results! nil))
 
-          (set-selected! 0)))
-      [q])
+         (set-selected! 0)))
+     [q])
 
     [:div.search
      [:div.input-wrap.relative
@@ -414,8 +414,8 @@
   (let [{:keys [href]} opts]
     [:div.link-card
      (cond-> opts
-             (string? href)
-             (assoc :on-click #(util/open-url href)))
+       (string? href)
+       (assoc :on-click #(util/open-url href)))
      child]))
 
 ;(rum/defc related-topics
@@ -429,7 +429,6 @@
    :topic-detail [pane-topic-detail]
    :settings     [pane-settings]})
 
-
 (defonce discord-endpoint "https://plugins.logseq.io/ds")
 
 (rum/defc footer-link-cards
@@ -438,44 +437,44 @@
         discord-count (:discord-online config)]
 
     (rum/use-effect!
-      (fn []
-        (when (or (nil? discord-count)
-                  (> (- (js/Date.now) (:discord-online-created config)) (* 10 60 1000)))
-          (-> (js/window.fetch discord-endpoint)
-              (p/then #(.json %))
-              (p/then #(when-let [count (.-approximate_presence_count ^js %)]
-                         (swap! *config assoc
-                                :discord-online (.toLocaleString count)
-                                :discord-online-created (js/Date.now)))))))
-      [discord-count])
+     (fn []
+       (when (or (nil? discord-count)
+                 (> (- (js/Date.now) (:discord-online-created config)) (* 10 60 1000)))
+         (-> (js/window.fetch discord-endpoint)
+             (p/then #(.json %))
+             (p/then #(when-let [count (.-approximate_presence_count ^js %)]
+                        (swap! *config assoc
+                               :discord-online (.toLocaleString count)
+                               :discord-online-created (js/Date.now)))))))
+     [discord-count])
 
     [:<>
      ;; more links
      [:div.flex.space-x-3
       {:style {:padding-top "4px"}}
       (link-card
-        {:class "flex-1" :href "https://discord.gg/KpN4eHY"}
-        [:div.inner.flex.space-x-1.flex-col
-         (ui/icon "brand-discord" {:class "opacity-30" :size 26})
-         [:h1.font-medium.py-1 "Chat on Discord"]
-         [:h2.text-xs.leading-4.opacity-40 "Ask quick questions, meet fellow users, and learn new workflows."]
-         [:small.flex.items-center.pt-1.5
-          [:i.block.rounded-full.bg-green-500 {:style {:width "8px" :height "8px"}}]
-          [:span.pl-2.opacity-90
-           [:strong.opacity-60 (or discord-count "?")]
-           [:span.opacity-70.font-light " users online"]]]])
+       {:class "flex-1" :href "https://discord.gg/KpN4eHY"}
+       [:div.inner.flex.space-x-1.flex-col
+        (ui/icon "brand-discord" {:class "opacity-30" :size 26})
+        [:h1.font-medium.py-1 "Chat on Discord"]
+        [:h2.text-xs.leading-4.opacity-40 "Ask quick questions, meet fellow users, and learn new workflows."]
+        [:small.flex.items-center.pt-1.5
+         [:i.block.rounded-full.bg-green-500 {:style {:width "8px" :height "8px"}}]
+         [:span.pl-2.opacity-90
+          [:strong.opacity-60 (or discord-count "?")]
+          [:span.opacity-70.font-light " users online"]]]])
 
       (link-card
-        {:class "flex-1" :href "https://discuss.logseq.com"}
-        [:div.inner.flex.space-x-1.flex-col
-         (ui/icon "message-dots" {:class "opacity-30" :size 26})
-         [:h1.font-medium.py-1 "Visit the forum"]
-         [:h2.text-xs.leading-4.opacity-40 "Give feedback, request features, and have in-depth conversations."]
-         [:small.flex.items-center.pt-1.5
-          [:i.flex.items-center.opacity-50 (ui/icon "bolt" {:size 14})]
-          [:span.pl-1.opacity-90
-           [:strong.opacity-60 "800+"]
-           [:span.opacity-70.font-light " monthly posts"]]]])]]))
+       {:class "flex-1" :href "https://discuss.logseq.com"}
+       [:div.inner.flex.space-x-1.flex-col
+        (ui/icon "message-dots" {:class "opacity-30" :size 26})
+        [:h1.font-medium.py-1 "Visit the forum"]
+        [:h2.text-xs.leading-4.opacity-40 "Give feedback, request features, and have in-depth conversations."]
+        [:small.flex.items-center.pt-1.5
+         [:i.flex.items-center.opacity-50 (ui/icon "bolt" {:size 14})]
+         [:span.pl-1.opacity-90
+          [:strong.opacity-60 "800+"]
+          [:span.opacity-70.font-light " monthly posts"]]]])]]))
 
 (rum/defc ^:large-vars/data-var content
   []
@@ -529,55 +528,55 @@
                                                    (apply = (map parse-parent-key [prev-key next-key]))))]
                          (when-not in-chapters?
                            (set-history-state!
-                             (conj (sequence history-state) prev-state))))
+                            (conj (sequence history-state) prev-state))))
                        (set-active-pane-state! next-state))
 
         [scrolled?, set-scrolled!] (rum/use-state false)
-        on-scroll (rum/use-memo #(util/debounce 100 (fn [^js e] (set-scrolled! (not (< (.. e -target -scrollTop) 10))))) [])]
+        on-scroll (rum/use-memo #(util/debounce (fn [^js e] (set-scrolled! (not (< (.. e -target -scrollTop) 10)))) 100) [])]
 
     ;; load handbooks
     (rum/use-effect!
-      #(load-handbooks!)
-      [])
+     #(load-handbooks!)
+     [])
 
     ;; navigation sentry
     (rum/use-effect!
-      (fn []
-        (when (seq handbooks-nodes)
-          (let [c (:handbook/route-chan @state/state)]
-            (async/go-loop []
-                           (let [v (<! c)]
-                             (when (not= v :return)
-                               (when-let [to (get handbooks-nodes v)]
-                                 (nav-to-pane! [:topic-detail to (t :handbook/title)] [:dashboard]))
-                               (recur))))
-            #(async/go (>! c :return)))))
-      [handbooks-nodes])
+     (fn []
+       (when (seq handbooks-nodes)
+         (let [c (:handbook/route-chan @state/state)]
+           (async/go-loop []
+             (let [v (<! c)]
+               (when (not= v :return)
+                 (when-let [to (get handbooks-nodes v)]
+                   (nav-to-pane! [:topic-detail to (t :handbook/title)] [:dashboard]))
+                 (recur))))
+           #(async/go (>! c :return)))))
+     [handbooks-nodes])
 
     (rum/use-effect!
-      (fn []
-        (let [*cnt-len (atom 0)
-              check! (fn []
-                       (-> (p/let [^js res (js/fetch (get-handbooks-endpoint "/handbooks.edn") #js{:method "HEAD"})]
-                             (when-let [cl (.get (.-headers res) "content-length")]
-                               (when (not= @*cnt-len cl)
-                                 (println "[Handbooks] dev reload!")
-                                 (load-handbooks!))
-                               (reset! *cnt-len cl)))
-                           (p/catch #(println "[Handbooks] dev check Error:" %))))
-              timer0 (if dev-watch?
-                       (js/setInterval check! 2000) 0)]
-          #(js/clearInterval timer0)))
-      [dev-watch?])
+     (fn []
+       (let [*cnt-len (atom 0)
+             check! (fn []
+                      (-> (p/let [^js res (js/fetch (get-handbooks-endpoint "/handbooks.edn") #js{:method "HEAD"})]
+                            (when-let [cl (.get (.-headers res) "content-length")]
+                              (when (not= @*cnt-len cl)
+                                (println "[Handbooks] dev reload!")
+                                (load-handbooks!))
+                              (reset! *cnt-len cl)))
+                          (p/catch #(println "[Handbooks] dev check Error:" %))))
+             timer0 (if dev-watch?
+                      (js/setInterval check! 2000) 0)]
+         #(js/clearInterval timer0)))
+     [dev-watch?])
 
     (rum/use-effect!
-      (fn []
-        (when handbooks-data
-          (let [nodes (->> (tree-seq map? :children handbooks-data)
-                           (reduce #(assoc %1 (or (:key %2) "__root") (bind-parent-key %2)) {}))]
-            (set-handbooks-nodes! nodes)
-            (set! (.-handbook-nodes js/window) (bean/->js nodes)))))
-      [handbooks-data])
+     (fn []
+       (when handbooks-data
+         (let [nodes (->> (tree-seq map? :children handbooks-data)
+                          (reduce #(assoc %1 (or (:key %2) "__root") (bind-parent-key %2)) {}))]
+           (set-handbooks-nodes! nodes)
+           (set! (.-handbook-nodes js/window) (bean/->js nodes)))))
+     [handbooks-data])
 
     [:div.cp__handbooks-content
      {:class     (util/classnames [{:search-active (:active? search-state)
@@ -591,8 +590,8 @@
           [:button.active:opacity-80.flex.items-center.cursor-pointer
            {:on-click (fn [] (let [prev (first history-state)
                                    prev (cond-> prev
-                                                (nil? (seq prev))
-                                                [:dashboard])]
+                                          (nil? (seq prev))
+                                          [:dashboard])]
                                (set-active-pane-state! prev)
                                (set-history-state! (rest history-state))))}
            [:span.pr-2.flex.items-center (ui/icon "chevron-left")]
@@ -609,8 +608,8 @@
                           (let [s (str "logseq://handbook/" (:key (second active-pane-state)))]
                             (util/copy-to-clipboard! s)
                             (notification/show!
-                              [:div [:strong.block "Handbook link copied!"]
-                               [:label.opacity-50 s]] :success)))}
+                             [:div [:strong.block "Handbook link copied!"]
+                              [:label.opacity-50 s]] :success)))}
            (ui/icon "copy")])
         (when (state/developer-mode?)
           [:a.flex.items-center {:aria-label (t :handbook/settings)

src/main/frontend/extensions/pdf/core.cljs

@@ -1,29 +1,29 @@
 (ns frontend.extensions.pdf.core
   (:require [cljs-bean.core :as bean]
             [clojure.string :as string]
-            [frontend.components.svg :as svg]
+            [datascript.impl.entity :as de]
+            [frontend.commands :as commands]
             [frontend.components.block :as block]
+            [frontend.components.svg :as svg]
+            [frontend.config :as config]
             [frontend.context.i18n :refer [t]]
+            [frontend.db.async :as db-async]
             [frontend.extensions.pdf.assets :as pdf-assets]
-            [frontend.extensions.pdf.utils :as pdf-utils]
             [frontend.extensions.pdf.toolbar :refer [pdf-toolbar *area-dashed? *area-mode? *highlight-mode? *highlights-ctx*]]
+            [frontend.extensions.pdf.utils :as pdf-utils]
             [frontend.extensions.pdf.windows :as pdf-windows]
             [frontend.handler.notification :as notification]
-            [frontend.config :as config]
+            [frontend.handler.property :as property-handler]
             [frontend.modules.shortcut.core :as shortcut]
-            [frontend.commands :as commands]
             [frontend.rum :refer [use-atom]]
             [frontend.state :as state]
+            [frontend.ui :as ui]
             [frontend.util :as util]
+            [goog.functions :refer [debounce]]
             [logseq.shui.ui :as shui]
             [medley.core :as medley]
             [promesa.core :as p]
-            [rum.core :as rum]
-            [frontend.ui :as ui]
-            [frontend.db.async :as db-async]
-            [goog.functions :refer [debounce]]
-            [frontend.handler.property :as property-handler]
-            [datascript.impl.entity :as de]))
+            [rum.core :as rum]))
 
 (declare pdf-container system-embed-playground)
 
@@ -76,10 +76,11 @@
   (let [el-ref   (rum/use-ref nil)
         adjust-main-size!
         (util/debounce
-         200 (fn [width]
-               (let [root-el js/document.documentElement]
-                 (.setProperty (.-style root-el) "--ph-view-container-width" width)
-                 (pdf-utils/adjust-viewer-size! viewer))))
+         (fn [width]
+           (let [root-el js/document.documentElement]
+             (.setProperty (.-style root-el) "--ph-view-container-width" width)
+             (pdf-utils/adjust-viewer-size! viewer)))
+         200)
         group-id (.-$groupIdentity viewer)]
 
     ;; draggable handler
@@ -941,9 +942,10 @@
       (let [persist-hls-data!
             (rum/use-callback
              (util/debounce
-              4000 (fn [latest-hls extra]
-                     (pdf-assets/file-based-persist-hls-data$
-                      pdf-current latest-hls extra))) [pdf-current])]
+              (fn [latest-hls extra]
+                (pdf-assets/file-based-persist-hls-data$
+                 pdf-current latest-hls extra))
+              4000) [pdf-current])]
 
         (rum/use-effect!
          (fn []
@@ -973,9 +975,9 @@
          (set-loader-state! {:status :loading})
 
          (-> (get-doc$ (clj->js opts))
-           (p/then (fn [doc]
-                     (set-loader-state! {:pdf-document doc :status :completed})))
-           (p/catch #(set-loader-state! {:error %})))
+             (p/then (fn [doc]
+                       (set-loader-state! {:pdf-document doc :status :completed})))
+             (p/catch #(set-loader-state! {:error %})))
          #()))
      [url doc-password])
 

src/main/frontend/extensions/pdf/utils.cljs

@@ -110,7 +110,8 @@
 
 (def adjust-viewer-size!
   (util/debounce
-   200 (fn [^js viewer] (set! (. viewer -currentScaleValue) "auto"))))
+   (fn [^js viewer] (set! (. viewer -currentScaleValue) "auto"))
+   200))
 
 (defn fix-nested-js
   [its]

src/main/frontend/util.cljc

@@ -23,6 +23,7 @@
             [goog.dom :as gdom]
             [goog.object :as gobj]
             [goog.string :as gstring]
+            [goog.functions :as gfun]
             [goog.userAgent]
             [promesa.core :as p]
             [rum.core :as rum]
@@ -307,20 +308,8 @@
        x)))
 
 #?(:cljs
-   (defn debounce
-     "Returns a function that will call f only after threshold has passed without new calls
-      to the function. Calls prep-fn on the args in a sync way, which can be used for things like
-      calling .persist on the event object to be able to access the event attributes in f"
-     ([threshold f] (debounce threshold f (constantly nil)))
-     ([threshold f prep-fn]
-      (let [t (atom nil)]
-        (fn [& args]
-          (when @t (js/clearTimeout @t))
-          (apply prep-fn args)
-          (reset! t (js/setTimeout #(do
-                                      (reset! t nil)
-                                      (apply f args))
-                                   threshold)))))))
+   (def debounce gfun/debounce))
+
 #?(:cljs
    (defn cancelable-debounce
      "Create a stateful debounce function with specified interval