From cac919911aec22a88022b02409ebae92750c9cfb Mon Sep 17 00:00:00 2001 From: Claude Date: Thu, 24 Sep 2026 13:35:46 +0000 Subject: [PATCH] desktop: fix click-to-seek on synced lyrics AMLL 0.5 re-dispatches line clicks as "line-click", so the "click" listener never fired. Also read the mapped lines through a ref so a click after a track change seeks within the current track's lyrics. Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01H4jKYEZBrEoNGrrM1hMVkF --- desktop/src/renderer/components/LyricsView.tsx | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/desktop/src/renderer/components/LyricsView.tsx b/desktop/src/renderer/components/LyricsView.tsx index 4db5e6a..dc0e829 100644 --- a/desktop/src/renderer/components/LyricsView.tsx +++ b/desktop/src/renderer/components/LyricsView.tsx @@ -39,6 +39,8 @@ export function LyricsView({ lyrics, variant, showTools = true }: { lyrics: Lyri const animated = mapped.synced && !plain; const stampRef = useRef(stamp); stampRef.current = stamp; + const mappedRef = useRef(mapped); + mappedRef.current = mapped; // Create/destroy the DOM player for synced tiers. useEffect(() => { @@ -51,14 +53,16 @@ export function LyricsView({ lyrics, variant, showTools = true }: { lyrics: Lyri p.setWordFadeWidth(0.5); host.current.replaceChildren(p.getElement()); player.current = p; + // AMLL re-dispatches DOM clicks on a line as "line-click" (not "click"). const onClick = (e: Event) => { const ev = e as LyricLineMouseEvent; - const line = mapped.lines[ev.lineIndex]; - if (line) bridge().dispatch({ type: "seekTo", data: { position_ms: Math.max(0, line.startTime - mapped.offsetMs) } }); + const m = mappedRef.current; + const line = m.lines[ev.lineIndex]; + if (line) bridge().dispatch({ type: "seekTo", data: { position_ms: Math.max(0, line.startTime - m.offsetMs) } }); }; - p.addEventListener("click", onClick); + p.addEventListener("line-click", onClick); return () => { - p.removeEventListener("click", onClick); + p.removeEventListener("line-click", onClick); p.dispose(); player.current = undefined; };