From 4c52700e55a8f547a4dc18fd5d5e9cdcf25a19fa Mon Sep 17 00:00:00 2001
From: Kendall Garner <17521368+kgarner7@users.noreply.github.com>
Date: Mon, 4 Jul 2022 02:40:58 +0000
Subject: [PATCH] Set initial scroll height when needed (#346)

---
 src/components/player/NowPlayingMiniView.tsx | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/src/components/player/NowPlayingMiniView.tsx b/src/components/player/NowPlayingMiniView.tsx
index fe4209a..e7fc038 100644
--- a/src/components/player/NowPlayingMiniView.tsx
+++ b/src/components/player/NowPlayingMiniView.tsx
@@ -69,6 +69,7 @@ const NowPlayingMiniView = () => {
   const autoPlaylistTriggerRef = useRef<any>();
   const [autoPlaylistFromYear, setRandomPlaylistFromYear] = useState(0);
   const [autoPlaylistToYear, setRandomPlaylistToYear] = useState(0);
+  const [initialScroll, setInitialScroll] = useState<undefined | number>(undefined);
   const [randomPlaylistGenre, setRandomPlaylistGenre] = useState('');
   const [isLoadingRandom, setIsLoadingRandom] = useState(false);
   const [musicFolder, setMusicFolder] = useState(folder.musicFolder);
@@ -117,13 +118,16 @@ const NowPlayingMiniView = () => {
 
   useEffect(() => {
     if (playQueue.scrollWithCurrentSong) {
+      const rowHeight = Number(settings.getSync('miniListRowHeight'));
+      const scrollPosition =
+        rowHeight * playQueue.currentIndex - rowHeight * 2 > 0
+          ? rowHeight * playQueue.currentIndex - rowHeight * 2
+          : 0;
+
+      setInitialScroll(scrollPosition);
+
       setTimeout(() => {
-        const rowHeight = Number(settings.getSync('miniListRowHeight'));
-        tableRef?.current?.table.current.scrollTop(
-          rowHeight * playQueue.currentIndex - rowHeight * 2 > 0
-            ? rowHeight * playQueue.currentIndex - rowHeight * 2
-            : 0
-        );
+        tableRef?.current?.table.current.scrollTop(scrollPosition);
       }, 100);
     }
   }, [playQueue.currentIndex, tableRef, playQueue.displayQueue, playQueue.scrollWithCurrentSong]);
@@ -457,6 +461,7 @@ const NowPlayingMiniView = () => {
               dnd
               disabledContextMenuOptions={['deletePlaylist', 'viewInModal']}
               handleFavorite={handleFavorite}
+              initialScrollOffset={initialScroll}
             />
           </GenericPage>
         </MiniViewContainer>