From 205f3c605aee6e7f15178e3cf27d5a298c9e6669 Mon Sep 17 00:00:00 2001
From: Tim <tymmesyde@gmail.com>
Date: Tue, 1 Nov 2022 02:00:35 +0100
Subject: [PATCH 1/2] feat(Player): add next video button

---
 src/routes/Player/ControlBar/ControlBar.js | 19 +++++++++++++++++++
 src/routes/Player/Player.js                |  1 +
 2 files changed, 20 insertions(+)

diff --git a/src/routes/Player/ControlBar/ControlBar.js b/src/routes/Player/ControlBar/ControlBar.js
index b63c453f4..13c0b3bc1 100644
--- a/src/routes/Player/ControlBar/ControlBar.js
+++ b/src/routes/Player/ControlBar/ControlBar.js
@@ -21,6 +21,7 @@ const ControlBar = ({
     subtitlesTracks,
     audioTracks,
     metaItem,
+    nextVideo,
     onPlayRequested,
     onPauseRequested,
     onMuteRequested,
@@ -51,6 +52,15 @@ const ControlBar = ({
             }
         }
     }, [paused, onPlayRequested, onPauseRequested]);
+    const onNextVideoButtonClick = React.useCallback(() => {
+        if (nextVideo !== null && typeof nextVideo.deepLinks === 'object') {
+            if (nextVideo.deepLinks.player !== null) {
+                window.location.href = nextVideo.deepLinks.player;
+            } else if (nextVideo.deepLinks.metaDetailsStreams !== null) {
+                window.location.href = nextVideo.deepLinks.metaDetailsStreams;
+            }
+        }
+    }, [nextVideo]);
     const onMuteButtonClick = React.useCallback(() => {
         if (muted) {
             if (typeof onUnmuteRequested === 'function') {
@@ -96,6 +106,14 @@ const ControlBar = ({
                 <Button className={classnames(styles['control-bar-button'], { 'disabled': typeof paused !== 'boolean' })} title={paused ? 'Play' : 'Pause'} tabIndex={-1} onClick={onPlayPauseButtonClick}>
                     <Icon className={styles['icon']} icon={typeof paused !== 'boolean' || paused ? 'ic_play' : 'ic_pause'} />
                 </Button>
+                {
+                    nextVideo !== null ?
+                        <Button className={classnames(styles['control-bar-button'])} title={'Next Video'} tabIndex={-1} onClick={onNextVideoButtonClick}>
+                            <Icon className={styles['icon']} icon={'ic_play_next'} />
+                        </Button>
+                        :
+                        null
+                }
                 <Button className={classnames(styles['control-bar-button'], { 'disabled': typeof muted !== 'boolean' })} title={muted ? 'Unmute' : 'Mute'} tabIndex={-1} onClick={onMuteButtonClick}>
                     <Icon
                         className={styles['icon']}
@@ -149,6 +167,7 @@ ControlBar.propTypes = {
     subtitlesTracks: PropTypes.array,
     audioTracks: PropTypes.array,
     metaItem: PropTypes.object,
+    nextVideo: PropTypes.object,
     onPlayRequested: PropTypes.func,
     onPauseRequested: PropTypes.func,
     onMuteRequested: PropTypes.func,
diff --git a/src/routes/Player/Player.js b/src/routes/Player/Player.js
index 91e89c310..53ddb8cc3 100644
--- a/src/routes/Player/Player.js
+++ b/src/routes/Player/Player.js
@@ -508,6 +508,7 @@ const Player = ({ urlParams, queryParams }) => {
                 subtitlesTracks={videoState.subtitlesTracks.concat(videoState.extraSubtitlesTracks)}
                 audioTracks={videoState.audioTracks}
                 metaItem={player.metaItem}
+                nextVideo={player.nextVideo}
                 onPlayRequested={onPlayRequested}
                 onPauseRequested={onPauseRequested}
                 onMuteRequested={onMuteRequested}

From 49cf06a8c2018249b03afc94ce4b374104ed4b7a Mon Sep 17 00:00:00 2001
From: Tim <tymmesyde@gmail.com>
Date: Wed, 2 Nov 2022 16:54:56 +0100
Subject: [PATCH 2/2] refactor(ControlBar): use replace method instead of href

---
 src/routes/Player/ControlBar/ControlBar.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/routes/Player/ControlBar/ControlBar.js b/src/routes/Player/ControlBar/ControlBar.js
index 13c0b3bc1..0297f2b83 100644
--- a/src/routes/Player/ControlBar/ControlBar.js
+++ b/src/routes/Player/ControlBar/ControlBar.js
@@ -55,9 +55,9 @@ const ControlBar = ({
     const onNextVideoButtonClick = React.useCallback(() => {
         if (nextVideo !== null && typeof nextVideo.deepLinks === 'object') {
             if (nextVideo.deepLinks.player !== null) {
-                window.location.href = nextVideo.deepLinks.player;
+                window.location.replace(nextVideo.deepLinks.player);
             } else if (nextVideo.deepLinks.metaDetailsStreams !== null) {
-                window.location.href = nextVideo.deepLinks.metaDetailsStreams;
+                window.location.replace(nextVideo.deepLinks.metaDetailsStreams);
             }
         }
     }, [nextVideo]);