|
@@ -940,13 +940,20 @@
|
|
|
(if (or (util/mobile?) (mobile-util/native-platform?))
|
|
(if (or (util/mobile?) (mobile-util/native-platform?))
|
|
|
(content-fn)
|
|
(content-fn)
|
|
|
(let [[visible? set-visible!] (rum/use-state false)
|
|
(let [[visible? set-visible!] (rum/use-state false)
|
|
|
|
|
+ [last-changed-time set-last-changed-time!] (rum/use-state nil)
|
|
|
inViewState (useInView #js {:rootMargin "100px"
|
|
inViewState (useInView #js {:rootMargin "100px"
|
|
|
:triggerOnce trigger-once?
|
|
:triggerOnce trigger-once?
|
|
|
:onChange (fn [in-view? entry]
|
|
:onChange (fn [in-view? entry]
|
|
|
- (let [self-top (.-top (.-boundingClientRect entry))]
|
|
|
|
|
- (when (or (and (not visible?) in-view?)
|
|
|
|
|
- ;; hide only the components below the current top for better ux
|
|
|
|
|
- (and visible? (not in-view?) (> self-top 0)))
|
|
|
|
|
|
|
+ (let [self-top (.-top (.-boundingClientRect entry))
|
|
|
|
|
+ time' (util/time-ms)]
|
|
|
|
|
+ (when (and
|
|
|
|
|
+ (or (and (not visible?) in-view?)
|
|
|
|
|
+ ;; hide only the components below the current top for better ux
|
|
|
|
|
+ (and visible? (not in-view?) (> self-top 0)))
|
|
|
|
|
+ (or (nil? last-changed-time)
|
|
|
|
|
+ (and (some? last-changed-time)
|
|
|
|
|
+ (> (- time' last-changed-time) 50))))
|
|
|
|
|
+ (set-last-changed-time! time')
|
|
|
(set-visible! in-view?))))})
|
|
(set-visible! in-view?))))})
|
|
|
ref (.-ref inViewState)]
|
|
ref (.-ref inViewState)]
|
|
|
(lazy-visible-inner visible? content-fn ref)))))
|
|
(lazy-visible-inner visible? content-fn ref)))))
|
Tienson Qin