From a56158faeec476a5f95ecd2c74f9365be9dde334 Mon Sep 17 00:00:00 2001
From: nklhrstv <me@nikolahristov.com>
Date: Fri, 13 Mar 2020 14:49:12 +0200
Subject: [PATCH] spread props in ControlBar

---
 src/routes/Player/ControlBar/ControlBar.js | 48 ++++++++++++++--------
 1 file changed, 32 insertions(+), 16 deletions(-)

diff --git a/src/routes/Player/ControlBar/ControlBar.js b/src/routes/Player/ControlBar/ControlBar.js
index d62d3a818..4c317c990 100644
--- a/src/routes/Player/ControlBar/ControlBar.js
+++ b/src/routes/Player/ControlBar/ControlBar.js
@@ -9,39 +9,55 @@ const SubtitlesButton = require('./SubtitlesButton');
 const VolumeSlider = require('./VolumeSlider');
 const styles = require('./styles');
 
-const ControlBar = (props) => {
+const ControlBar = ({
+    className,
+    paused,
+    time,
+    duration,
+    volume,
+    muted,
+    subtitlesTracks,
+    onPlayRequested,
+    onPauseRequested,
+    onMuteRequested,
+    onUnmuteRequested,
+    onVolumeChangeRequested,
+    onSeekRequested,
+    onToggleSubtitlesPicker,
+    ...props
+}) => {
     return (
-        <div className={classnames(props.className, styles['control-bar-container'])}>
+        <div {...props} className={classnames(className, styles['control-bar-container'])}>
             <SeekBar
                 className={styles['seek-bar']}
-                time={props.time}
-                duration={props.duration}
-                onSeekRequested={props.onSeekRequested}
+                time={time}
+                duration={duration}
+                onSeekRequested={onSeekRequested}
             />
             <div className={styles['control-bar-buttons-container']}>
                 <PlayPauseButton
                     className={styles['control-bar-button']}
-                    paused={props.paused}
-                    onPlayRequested={props.onPlayRequested}
-                    onPauseRequested={props.onPauseRequested}
+                    paused={paused}
+                    onPlayRequested={onPlayRequested}
+                    onPauseRequested={onPauseRequested}
                 />
                 <MuteButton
                     className={styles['control-bar-button']}
-                    volume={props.volume}
-                    muted={props.muted}
-                    onMuteRequested={props.onMuteRequested}
-                    onUnmuteRequested={props.onUnmuteRequested}
+                    volume={volume}
+                    muted={muted}
+                    onMuteRequested={onMuteRequested}
+                    onUnmuteRequested={onUnmuteRequested}
                 />
                 <VolumeSlider
                     className={styles['volume-slider']}
-                    volume={props.volume}
-                    onVolumeChangeRequested={props.onVolumeChangeRequested}
+                    volume={volume}
+                    onVolumeChangeRequested={onVolumeChangeRequested}
                 />
                 <div className={styles['spacing']} />
                 <SubtitlesButton
                     className={styles['control-bar-button']}
-                    subtitlesTracks={props.subtitlesTracks}
-                    onToggleSubtitlesPicker={props.onToggleSubtitlesPicker}
+                    subtitlesTracks={subtitlesTracks}
+                    onToggleSubtitlesPicker={onToggleSubtitlesPicker}
                 />
                 <ShareButton className={styles['control-bar-button']} />
             </div>