From d13a22eaa8387db210edd09e7a7bcf4c334baf06 Mon Sep 17 00:00:00 2001
From: Mani <12898705+Maniload@users.noreply.github.com>
Date: Fri, 19 Apr 2024 20:56:29 +0200
Subject: [PATCH] fix: Fixed play next not working with disabled autoplay
 (#205)

* Added back last update date on pages for everyone to see.
---
 src/components/utils/PageRevalidation.tsx   | 17 ++++++++-------
 src/components/video-player/VideoPlayer.tsx | 23 ++++++++++++---------
 2 files changed, 23 insertions(+), 17 deletions(-)

diff --git a/src/components/utils/PageRevalidation.tsx b/src/components/utils/PageRevalidation.tsx
index f9e9f68..f796dff 100644
--- a/src/components/utils/PageRevalidation.tsx
+++ b/src/components/utils/PageRevalidation.tsx
@@ -24,10 +24,6 @@ export function PageRevalidation({ lastBuildAt, apiRequests, ...props }: PageRev
 
     const [isRevalidating, setRevalidating] = useState(false);
 
-    if (!canRevalidate) {
-        return null;
-    }
-    
     function revalidate() {
         if (isRevalidating || !canRevalidate) {
             return;
@@ -64,14 +60,21 @@ export function PageRevalidation({ lastBuildAt, apiRequests, ...props }: PageRev
         ? ` using ${apiRequests} API request${apiRequests === 1 ? "" : "s"}`
         : "";
 
-    const canRebuild = !isRevalidating;
     const rebuildDescription = isRevalidating
         ? "Rebuild in progress... The page will automatically reload after it's finished."
         : "Click to start a rebuild.";
 
+    if (canRevalidate) {
+        return (
+            <Text variant="small" color="text-disabled" link={!isRevalidating} onClick={revalidate} {...props}>
+                Page was last updated {lastBuildDescription} ago{apiRequestsDescription}. {rebuildDescription}
+            </Text>
+        );
+    }
+
     return (
-        <Text variant="small" color="text-disabled" link={canRebuild} onClick={revalidate} {...props}>
-            Page was last built {lastBuildDescription} ago{apiRequestsDescription}. {rebuildDescription}
+        <Text variant="small" color="text-disabled" {...props}>
+            Page was last updated {lastBuildDescription} ago.
         </Text>
     );
 }
diff --git a/src/components/video-player/VideoPlayer.tsx b/src/components/video-player/VideoPlayer.tsx
index 0db6335..d6626eb 100644
--- a/src/components/video-player/VideoPlayer.tsx
+++ b/src/components/video-player/VideoPlayer.tsx
@@ -110,19 +110,22 @@ export function VideoPlayer({ video, background, children, overlay, ...props }:
         : null;
 
     const playNextTrack = useCallback((navigate = false) => {
-        if (
-            (
-                isWatchListUsingLocalAutoPlay && isLocalAutoPlay || 
-                !isWatchListUsingLocalAutoPlay && isGlobalAutoPlay
-            ) &&
-            nextVideoPath
-        ) {
+        if (nextVideoPath) {
             setCurrentWatchListItem(nextVideo);
             if (navigate) {
                 router.push(nextVideoPath);
             }
         }
-    }, [isGlobalAutoPlay, isLocalAutoPlay, isWatchListUsingLocalAutoPlay, nextVideo, nextVideoPath, router, setCurrentWatchListItem]);
+    }, [nextVideo, nextVideoPath, router, setCurrentWatchListItem]);
+
+    const autoPlayNextTrack = useCallback(() => {
+        if (
+            isWatchListUsingLocalAutoPlay && isLocalAutoPlay ||
+            !isWatchListUsingLocalAutoPlay && isGlobalAutoPlay
+        ) {
+            playNextTrack(!background);
+        }
+    }, [background, isGlobalAutoPlay, isLocalAutoPlay, isWatchListUsingLocalAutoPlay, playNextTrack]);
 
     useEffect(() => {
         if (playerRef.current) {
@@ -286,7 +289,7 @@ export function VideoPlayer({ video, background, children, overlay, ...props }:
                                     onPause={() => setPlaying(false)}
                                     onEnded={() => {
                                         setPlaying(false);
-                                        playNextTrack(!background);
+                                        autoPlayNextTrack();
                                     }}
                                     onTimeUpdate={updateProgress}
                                     onVolumeChange={(event: SyntheticEvent<HTMLAudioElement>) => setGlobalVolume(event.currentTarget.volume)}
@@ -303,7 +306,7 @@ export function VideoPlayer({ video, background, children, overlay, ...props }:
                                     onPause={() => setPlaying(false)}
                                     onEnded={() => {
                                         setPlaying(false);
-                                        playNextTrack(!background);
+                                        autoPlayNextTrack();
                                     }}
                                     onPointerDown={onPlayerClick}
                                     onTimeUpdate={updateProgress}