From 07232cea9ac18933b93287c6f581fc6800cda28c Mon Sep 17 00:00:00 2001
From: Psychotoxical <171614930+Psychotoxical@users.noreply.github.com>
Date: Sun, 14 Jun 2026 13:37:25 +0200
Subject: [PATCH] fix(fullscreen-player): honour the Lyrics scroll style
 setting (#1089)

The rebuilt fullscreen player hardcoded Apple-style lyrics scrolling (active
line ~35% from the top) and ignored Settings -> Lyrics -> Lyrics scroll style,
which still drives the sidebar/mobile LyricsPane. FsLyricsApple now reads
sidebarLyricsStyle: 'classic' centres the active line, 'apple' keeps the 35%
anchor, matching the sidebar lyrics.
---
 .../fullscreenPlayer/FsLyricsApple.tsx        | 21 +++++++++++++------
 1 file changed, 15 insertions(+), 6 deletions(-)

diff --git a/src/components/fullscreenPlayer/FsLyricsApple.tsx b/src/components/fullscreenPlayer/FsLyricsApple.tsx
index a877f172..a9cf10ce 100644
--- a/src/components/fullscreenPlayer/FsLyricsApple.tsx
+++ b/src/components/fullscreenPlayer/FsLyricsApple.tsx
@@ -8,13 +8,15 @@ import type { LrcLine } from '../../api/lrclib';
 import type { Track } from '../../store/playerStoreTypes';
 import { EaseScroller, targetForFraction } from '../../utils/ui/easeScroll';
 
-// Apple Music-style fullscreen lyrics.
-// Full-screen scrollable list. Active line auto-scrolls to ~35% from top.
-// Word-sync runs imperatively (no React re-renders on every time tick).
+// Fullscreen synced lyrics.
+// Full-screen scrollable list. The active line auto-scrolls following the
+// "Lyrics scroll style" setting: 'apple' anchors it ~35% from the top, 'classic'
+// centres it. Word-sync runs imperatively (no React re-renders on every time tick).
 // User scroll pauses auto-scroll for 4 s then resumes.
 export const FsLyricsApple = memo(function FsLyricsApple({ currentTrack }: { currentTrack: Track | null }) {
   const { syncedLines, wordLines, plainLyrics, loading } = useLyrics(currentTrack);
   const staticOnly = useAuthStore(s => s.lyricsStaticOnly);
+  const sidebarLyricsStyle = useAuthStore(s => s.sidebarLyricsStyle);
 
   const useWords = !staticOnly && wordLines !== null && wordLines.length > 0;
   const lineSrc: LrcLine[] | null = useWords
@@ -68,14 +70,21 @@ export const FsLyricsApple = memo(function FsLyricsApple({ currentTrack }: { cur
     return subscribePlaybackProgress(s => apply(s.currentTime));
   }, [hasSynced, currentTrack?.id]);
 
-  // Ease-scroll active line to ~35% from the top of the container.
+  // Scroll the active line into view, honouring the "Lyrics scroll style" setting
+  // (same as the sidebar LyricsPane): 'apple' ease-scrolls to ~35% from the top,
+  // 'classic' centres the active line via native smooth scrollIntoView.
   useEffect(() => {
     if (activeIdx < 0 || isUserScroll.current) return;
     const el  = lineRefs.current[activeIdx];
     const box = containerRef.current;
     if (!el || !box || !scrollerRef.current) return;
-    scrollerRef.current.scrollTo(targetForFraction(box, el, 0.35));
-  }, [activeIdx]);
+    if (sidebarLyricsStyle === 'apple') {
+      scrollerRef.current.scrollTo(targetForFraction(box, el, 0.35));
+    } else {
+      scrollerRef.current.stop();
+      el.scrollIntoView({ behavior: 'smooth', block: 'center' });
+    }
+  }, [activeIdx, sidebarLyricsStyle]);
 
   const { setWordRef } = useWordLyricsSync({
     enabled: useWords,