From dddc390952a46a9303da0bb88789bbe7c22ddc95 Mon Sep 17 00:00:00 2001
From: Tim <tymmesyde@gmail.com>
Date: Thu, 12 Jan 2023 22:07:43 +0100
Subject: [PATCH] refactor(OptionsMenu): better naming

---
 src/routes/Player/OptionsMenu/Option/Option.js |  8 ++++----
 src/routes/Player/OptionsMenu/OptionsMenu.js   | 10 +++++-----
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/routes/Player/OptionsMenu/Option/Option.js b/src/routes/Player/OptionsMenu/Option/Option.js
index f0e6b04a8..317cd0a15 100644
--- a/src/routes/Player/OptionsMenu/Option/Option.js
+++ b/src/routes/Player/OptionsMenu/Option/Option.js
@@ -7,12 +7,12 @@ const Icon = require('@stremio/stremio-icons/dom');
 const { Button } = require('stremio/common');
 const styles = require('./styles');
 
-const Option = ({ icon, label, playerId, disabled, onClick }) => {
+const Option = ({ icon, label, deviceId, disabled, onClick }) => {
     const onButtonClick = React.useCallback(() => {
         if (typeof onClick === 'function') {
-            onClick(playerId);
+            onClick(deviceId);
         }
-    }, [onClick, playerId]);
+    }, [onClick, deviceId]);
     return (
         <Button className={classnames(styles['option-container'], { 'disabled': disabled })} disabled={disabled} onClick={onButtonClick}>
             <Icon className={styles['icon']} icon={icon} />
@@ -24,7 +24,7 @@ const Option = ({ icon, label, playerId, disabled, onClick }) => {
 Option.propTypes = {
     icon: PropTypes.string,
     label: PropTypes.string,
-    playerId: PropTypes.string,
+    deviceId: PropTypes.string,
     disabled: PropTypes.bool,
     onClick: PropTypes.func,
 };
diff --git a/src/routes/Player/OptionsMenu/OptionsMenu.js b/src/routes/Player/OptionsMenu/OptionsMenu.js
index ba3d1f955..d15fe314c 100644
--- a/src/routes/Player/OptionsMenu/OptionsMenu.js
+++ b/src/routes/Player/OptionsMenu/OptionsMenu.js
@@ -22,7 +22,7 @@ const OptionsMenu = ({ className, stream, playbackDevices }) => {
             :
             null;
     }, [stream]);
-    const externalPlayers = React.useMemo(() => {
+    const externalDevices = React.useMemo(() => {
         return playbackDevices.filter(({ type }) => type === 'external');
     }, [playbackDevices]);
     const onCopyStreamButtonClick = React.useCallback(() => {
@@ -52,7 +52,7 @@ const OptionsMenu = ({ className, stream, playbackDevices }) => {
             window.open(streamUrl);
         }
     }, [streamUrl]);
-    const onExternalPlayRequested = React.useCallback((deviceId) => {
+    const onExternalDeviceRequested = React.useCallback((deviceId) => {
         if (streamUrl !== null) {
             core.transport.dispatch({
                 action: 'StreamingServer',
@@ -84,14 +84,14 @@ const OptionsMenu = ({ className, stream, playbackDevices }) => {
                 onClick={onDownloadVideoButtonClick}
             />
             {
-                !stream.infoHash && externalPlayers.map(({ id, name }) => (
+                !stream.infoHash && externalDevices.map(({ id, name }) => (
                     <Option
                         key={id}
                         icon={'ic_vlc'}
                         label={`Play in ${name}`}
-                        playerId={id}
+                        deviceId={id}
                         disabled={stream === null}
-                        onClick={onExternalPlayRequested}
+                        onClick={onExternalDeviceRequested}
                     />
                 ))
             }