fix: use showVideos prop instead of prop in cards component

Author: KManolov3

packages/scratch-gui/src/components/cards/cards.jsx

@@ -18,8 +18,6 @@ import closeIcon from './icon--close.svg';
 import {translateVideo} from '../../lib/libraries/decks/translate-video.js';
 import {translateImage} from '../../lib/libraries/decks/translate-image.js';
 
-import {PLATFORM} from '../../lib/platform.js';
-
 const CardHeader = ({onCloseCards, onShrinkExpandCards, onShowAll, totalSteps, step, expanded}) => (
     <div className={expanded ? styles.headerButtons : classNames(styles.headerButtons, styles.headerButtonsHidden)}>
         <div
@@ -295,7 +293,7 @@ const Cards = props => {
         onPrevStep,
         step,
         expanded,
-        platform,
+        showVideos,
         ...posProps
     } = props;
     let {x, y} = posProps;
@@ -362,20 +360,18 @@ const Cards = props => {
                                 />
                             ) : (
                                 steps[step].video ? (
-                                    platform === PLATFORM.DESKTOP ?
-                                    // Assume user is offline and don't attempt to
-                                    // download videos
+                                    showVideos ?
                                         (
-                                            <ImageStep
-                                                image={content[activeDeckId].img}
-                                                title={content[activeDeckId].name}
-                                            />
-                                        ) : (
                                             <VideoStep
                                                 dragging={dragging}
                                                 expanded={expanded}
                                                 video={translateVideo(steps[step].video, locale)}
                                             />
+                                        ) : (
+                                            <ImageStep
+                                                image={content[activeDeckId].img}
+                                                title={content[activeDeckId].name}
+                                            />
                                         )
                                 ) : (
                                     <ImageStep
@@ -426,7 +422,7 @@ Cards.propTypes = {
     onShowAll: PropTypes.func,
     onShrinkExpandCards: PropTypes.func.isRequired,
     onStartDrag: PropTypes.func,
-    platform: PropTypes.oneOf(Object.keys(PLATFORM)),
+    showVideos: PropTypes.bool,
     step: PropTypes.number.isRequired,
     x: PropTypes.number,
     y: PropTypes.number

packages/scratch-gui/src/containers/cards.jsx

@@ -41,7 +41,6 @@ class Cards extends React.Component {
 
 Cards.propTypes = {
     locale: PropTypes.string.isRequired,
-    platform: PropTypes.oneOf(Object.keys(PLATFORM))
 };
 
 const mapStateToProps = state => ({
@@ -55,7 +54,9 @@ const mapStateToProps = state => ({
     isRtl: state.locales.isRtl,
     locale: state.locales.locale,
     dragging: state.scratchGui.cards.dragging,
-    platform: state.scratchGui.platform.platform
+    // Assume user is offline and don't attempt to
+    // download and show videos
+    showVideos: state.scratchGui.platform.platform !== PLATFORM.DESKTOP
 });
 
 const mapDispatchToProps = dispatch => ({