From 6c019aa8220486b8135d7a2559730969a1e7534e Mon Sep 17 00:00:00 2001
From: mrjvs <jellevs@gmail.com>
Date: Fri, 20 Oct 2023 17:29:10 +0200
Subject: [PATCH] next episode button actually working

---
 .../player/atoms/NextEpisodeButton.tsx        | 23 +++++++++++++++++--
 src/components/player/hooks/usePlayerMeta.ts  | 21 +++++++++++++----
 src/stores/player/slices/source.ts            | 13 +++++++----
 3 files changed, 46 insertions(+), 11 deletions(-)

diff --git a/src/components/player/atoms/NextEpisodeButton.tsx b/src/components/player/atoms/NextEpisodeButton.tsx
index 23fda5a3..e197300e 100644
--- a/src/components/player/atoms/NextEpisodeButton.tsx
+++ b/src/components/player/atoms/NextEpisodeButton.tsx
@@ -1,7 +1,10 @@
 import classNames from "classnames";
+import { useCallback } from "react";
 
 import { Icon, Icons } from "@/components/Icon";
+import { usePlayerMeta } from "@/components/player/hooks/usePlayerMeta";
 import { Transition } from "@/components/Transition";
+import { PlayerMetaEpisode } from "@/stores/player/slices/source";
 import { usePlayerStore } from "@/stores/player/store";
 
 function shouldShowNextEpisodeButton(
@@ -34,10 +37,11 @@ function Button(props: {
   );
 }
 
-// TODO check if has next episode
 export function NextEpisodeButton(props: { controlsShowing: boolean }) {
   const duration = usePlayerStore((s) => s.progress.duration);
   const isHidden = usePlayerStore((s) => s.interface.hideNextEpisodeBtn);
+  const meta = usePlayerStore((s) => s.meta);
+  const { setDirectMeta } = usePlayerMeta();
   const hideNextEpisodeButton = usePlayerStore((s) => s.hideNextEpisodeButton);
   const metaType = usePlayerStore((s) => s.meta?.type);
   const time = usePlayerStore((s) => s.progress.time);
@@ -54,6 +58,18 @@ export function NextEpisodeButton(props: { controlsShowing: boolean }) {
   if (showingState === "always")
     bottom = props.controlsShowing ? "bottom-24" : "bottom-12";
 
+  const nextEp = meta?.episodes?.find(
+    (v) => v.number === (meta?.episode?.number ?? 0) + 1
+  );
+
+  const loadNextEpisode = useCallback(() => {
+    if (!meta || !nextEp) return;
+    const metaCopy = { ...meta };
+    metaCopy.episode = nextEp;
+    setDirectMeta(metaCopy);
+  }, [setDirectMeta, nextEp, meta]);
+
+  if (!meta?.episode || !nextEp) return null;
   if (metaType !== "show") return null;
 
   return (
@@ -74,7 +90,10 @@ export function NextEpisodeButton(props: { controlsShowing: boolean }) {
         >
           Cancel
         </Button>
-        <Button className="bg-video-buttons-primary hover:bg-video-buttons-primaryHover text-video-buttons-primaryText flex justify-center items-center">
+        <Button
+          onClick={() => loadNextEpisode()}
+          className="bg-video-buttons-primary hover:bg-video-buttons-primaryHover text-video-buttons-primaryText flex justify-center items-center"
+        >
           <Icon className="text-xl mr-1" icon={Icons.SKIP_EPISODE} />
           Next episode
         </Button>
diff --git a/src/components/player/hooks/usePlayerMeta.ts b/src/components/player/hooks/usePlayerMeta.ts
index 0e6513dd..f37bd4c4 100644
--- a/src/components/player/hooks/usePlayerMeta.ts
+++ b/src/components/player/hooks/usePlayerMeta.ts
@@ -13,6 +13,15 @@ export function usePlayerMeta() {
     [meta]
   );
 
+  const setDirectMeta = useCallback(
+    (m: PlayerMeta) => {
+      _setPlayerMeta(m);
+      setMeta(m);
+      setScrapeStatus();
+    },
+    [_setPlayerMeta, setMeta, setScrapeStatus]
+  );
+
   const setPlayerMeta = useCallback(
     (m: DetailedMeta, episodeId?: string) => {
       let playerMeta: PlayerMeta;
@@ -26,6 +35,11 @@ export function usePlayerMeta() {
           poster: m.meta.poster,
           tmdbId: m.tmdbId ?? "",
           imdbId: m.imdbId,
+          episodes: m.meta.seasonData.episodes.map((v) => ({
+            number: v.number,
+            title: v.title,
+            tmdbId: v.id,
+          })),
           episode: {
             number: ep.number,
             title: ep.title,
@@ -47,17 +61,16 @@ export function usePlayerMeta() {
           imdbId: m.imdbId,
         };
       }
-      _setPlayerMeta(playerMeta);
-      setMeta(playerMeta);
-      setScrapeStatus();
+      setDirectMeta(playerMeta);
       return playerMeta;
     },
-    [_setPlayerMeta, setMeta, setScrapeStatus]
+    [setDirectMeta]
   );
 
   return {
     playerMeta: meta,
     setPlayerMeta,
+    setDirectMeta,
     scrapeMedia,
   };
 }
diff --git a/src/stores/player/slices/source.ts b/src/stores/player/slices/source.ts
index 430a2a31..7d1b0e61 100644
--- a/src/stores/player/slices/source.ts
+++ b/src/stores/player/slices/source.ts
@@ -17,6 +17,12 @@ export const playerStatus = {
 
 export type PlayerStatus = ValuesOf<typeof playerStatus>;
 
+export interface PlayerMetaEpisode {
+  number: number;
+  tmdbId: string;
+  title: string;
+}
+
 export interface PlayerMeta {
   type: "movie" | "show";
   title: string;
@@ -24,11 +30,8 @@ export interface PlayerMeta {
   imdbId?: string;
   releaseYear: number;
   poster?: string;
-  episode?: {
-    number: number;
-    tmdbId: string;
-    title: string;
-  };
+  episodes?: PlayerMetaEpisode[];
+  episode?: PlayerMetaEpisode;
   season?: {
     number: number;
     tmdbId: string;