noe/tl
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: reliable playhead-driven pane scroll to the active annotation

Browse source 
Rewrite commentary-scroll as a lifecycle component that scrolls in
component-did-update via scrollIntoView (offsetParent-agnostic, so it works for
nested cards too), replacing the fragile after-render + manual offsetTop math.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Your Name 2026-07-02 20:46:34 -04:00
parent 28bdac1142
commit f6e887c14d
1 changed files with 13 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

18
tl/src/tl/views.cljs
View file

@ -1095,15 +1095,19 @@
;; Renders nothing: owns the active-annotation subscription and scrolls the active ;; Renders nothing: owns the active-annotation subscription and scrolls the active
;; card into view, so `commentary` itself no longer re-renders on every crossing. ;; card into view, so `commentary` itself no longer re-renders on every crossing.
(defn- commentary-scroll [el] (defn- commentary-scroll [el]
;; Form-3 so the scroll runs in component-did-update — reliably after the DOM is
;; committed on every active-annotation change — and via scrollIntoView, which
;; (unlike offsetTop math) is correct even when the active card is nested.
(letfn [(scroll! [& _]
(let [active @(rf/subscribe [::subs/active-annotation])] (let [active @(rf/subscribe [::subs/active-annotation])]
(r/after-render (when-let [c @el]
(fn [] (when-let [c @el]
(when-let [node (and active (.querySelector c (str "#ann-" (name active))))] (when-let [node (and active (.querySelector c (str "#ann-" (name active))))]
;; scrollIntoView (not manual offsetTop math): a nested card's (.scrollIntoView node #js {:block "center" :behavior "smooth"})))))]
;; offsetParent is its parent .ann (position:relative), so offsetTop (r/create-class
;; would be measured inside the parent, not the scroll container. {:display-name "commentary-scroll"
(.scrollIntoView node #js {:block "center" :behavior "smooth"}))))) :component-did-mount scroll!
nil)) :component-did-update scroll!
:reagent-render (fn [_] @(rf/subscribe [::subs/active-annotation]) nil)})))
(defn commentary [] (defn commentary []
(let [el (atom nil) open (r/atom nil)] (let [el (atom nil) open (r/atom nil)]