add setting to follow current song on playqueue

src/renderer/features/now-playing/components/play-queue.tsx

@@ -21,6 +21,7 @@ import {
     usePlayerActions,
     usePlayerQueueType,
     usePlayerSong,
+    useSettingsStore,
 } from '/@/renderer/store';
 import { Flex } from '/@/shared/components/flex/flex';
 import { LoadingOverlay } from '/@/shared/components/loading-overlay/loading-overlay';
@@ -46,6 +47,7 @@ export const PlayQueue = forwardRef<ItemListHandle, QueueProps>(({ listKey, sear
     const mergedRef = useMergedRef(ref, tableRef);
     const { getQueue } = usePlayerActions();
     const queueType = usePlayerQueueType();
+    const followCurrentSong = useSettingsStore((state) => state.general.followCurrentSong);
 
     const [debouncedSearchTerm] = useDebouncedValue(searchTerm, 200);
 
@@ -91,10 +93,10 @@ export const PlayQueue = forwardRef<ItemListHandle, QueueProps>(({ listKey, sear
         });
 
         const unsubCurrentTrack = subscribeCurrentTrack((e) => {
-            if (e.index !== -1) {
+            if (followCurrentSong && e.index !== -1) {
                 tableRef.current?.scrollToIndex(e.index, {
-                    align: 'top',
-                    behavior: 'smooth',
+                    align: 'center',
+                    behavior: 'auto',
                 });
             }
         });
@@ -105,7 +107,7 @@ export const PlayQueue = forwardRef<ItemListHandle, QueueProps>(({ listKey, sear
             unsub();
             unsubCurrentTrack();
         };
-    }, [getQueue, queueType, tableRef]);
+    }, [getQueue, queueType, tableRef, followCurrentSong]);
 
     const filteredData: QueueSong[] = useMemo(() => {
         if (debouncedSearchTerm) {
@@ -127,6 +129,7 @@ export const PlayQueue = forwardRef<ItemListHandle, QueueProps>(({ listKey, sear
     });
 
     const currentSong = usePlayerSong();
+
     const currentSongUniqueId = currentSong?._uniqueId;
 
     const { focused, ref: containerFocusRef } = useFocusWithin();

src/renderer/features/settings/components/general/control-settings.tsx

@@ -185,6 +185,28 @@ export const ControlSettings = () => {
             isHidden: false,
             title: t('setting.playButtonBehavior', { postProcess: 'sentenceCase' }),
         },
+        {
+            control: (
+                <Switch
+                    aria-label="Follow current song"
+                    defaultChecked={settings.followCurrentSong}
+                    onChange={(e) =>
+                        setSettings({
+                            general: {
+                                ...settings,
+                                followCurrentSong: e.currentTarget.checked,
+                            },
+                        })
+                    }
+                />
+            ),
+            description: t('setting.followCurrentSong', {
+                context: 'description',
+                postProcess: 'sentenceCase',
+            }),
+            isHidden: false,
+            title: t('setting.followCurrentSong', { postProcess: 'sentenceCase' }),
+        },
         {
             control: (
                 <Slider