Add minor improvements to use-visible hook

This commit is contained in:
Andrey Antukh 2023-08-29 17:16:40 +02:00
parent 937d3b4954
commit 1e2603f1f5

View file

@ -302,11 +302,14 @@
(fn [entries _] (fn [entries _]
(run! (partial rx/push! intersection-subject) (seq entries))) (run! (partial rx/push! intersection-subject) (seq entries)))
#js {:rootMargin "0px" #js {:rootMargin "0px"
:threshold 1.0}))) :threshold #js [0 1.0]})))
(defn use-visible (defn use-visible
[ref & {:keys [once?]}] [ref & {:keys [once?]}]
(let [[state update-state!] (mf/useState false)] (let [state (mf/useState false)
update-state! (aget state 1)
state (aget state 0)]
(mf/with-effect [once?] (mf/with-effect [once?]
(let [node (mf/ref-val ref) (let [node (mf/ref-val ref)
stream (->> intersection-subject stream (->> intersection-subject
@ -314,15 +317,16 @@
(let [target (unchecked-get entry "target")] (let [target (unchecked-get entry "target")]
(identical? target node)))) (identical? target node))))
(rx/map (fn [entry] (rx/map (fn [entry]
(let [ratio (unchecked-get entry "intersectionRatio") (let [ratio (unchecked-get entry "intersectionRatio")
intersecting? (unchecked-get entry "isIntersecting")] intersecting? (unchecked-get entry "isIntersecting")
(or intersecting? (> ratio 0.5))))) intersecting? (or ^boolean intersecting?
^boolean (> ratio 0.5))]
(when (and (true? intersecting?) (true? once?))
(.unobserve ^js @intersection-observer node))
intersecting?)))
(rx/dedupe)) (rx/dedupe))
stream (if once?
(->> stream
(rx/filter identity)
(rx/take 1))
stream)
subs (rx/subscribe stream update-state!)] subs (rx/subscribe stream update-state!)]
(.observe ^js @intersection-observer node) (.observe ^js @intersection-observer node)
(fn [] (fn []