Remove the hideIntro override and default preview modal to false

src/containers/gui.jsx

@@ -84,7 +84,6 @@ class GUI extends React.Component {
             assetHost,
             cloudHost,
             error,
-            hideIntro,
             isError,
             isShowingProject,
             onStorageInit,
@@ -118,7 +117,6 @@ GUI.propTypes = {
     cloudHost: PropTypes.string,
     error: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
     fetchingProject: PropTypes.bool,
-    hideIntro: PropTypes.bool,
     importInfoVisible: PropTypes.bool,
     intl: intlShape,
     isError: PropTypes.bool,
@@ -143,7 +141,7 @@ GUI.defaultProps = {
     onUpdateProjectId: () => {}
 };
 
-const mapStateToProps = (state, ownProps) => {
+const mapStateToProps = state => {
     const loadingState = state.scratchGui.projectState.loadingState;
     return {
         activeTabIndex: state.scratchGui.editorTab.activeTabIndex,
@@ -161,7 +159,7 @@ const mapStateToProps = (state, ownProps) => {
         isRtl: state.locales.isRtl,
         isShowingProject: getIsShowingProject(loadingState),
         loadingStateVisible: state.scratchGui.modals.loadingProject,
-        previewInfoVisible: state.scratchGui.modals.previewInfo && !ownProps.hideIntro,
+        previewInfoVisible: state.scratchGui.modals.previewInfo,
         projectId: state.scratchGui.projectState.projectId,
         targetIsStage: (
             state.scratchGui.targets.stage &&

src/lib/app-state-hoc.jsx

@@ -31,10 +31,6 @@ const AppStateHOC = function (WrappedComponent, localesOnly) {
             let reducers = {};
             let enhancer;
 
-            this.state = {
-                tutorial: false
-            };
-
             let initializedLocales = localesInitialState;
             const locale = detectLocale(Object.keys(locales));
             if (locale !== 'en') {
@@ -56,6 +52,7 @@ const AppStateHOC = function (WrappedComponent, localesOnly) {
                     guiMiddleware,
                     initFullScreen,
                     initPlayer,
+                    initPreviewInfo,
                     initTutorialLibrary
                 } = guiRedux;
                 const {ScratchPaintReducer} = require('scratch-paint');
@@ -70,11 +67,17 @@ const AppStateHOC = function (WrappedComponent, localesOnly) {
                     }
                 } else {
                     const tutorialId = detectTutorialId();
-                    // handle ?tutorial=all for beta
-                    // if we decide to keep this for www, functionality should move to
-                    // setActiveCards in the GUI container
-                    if (tutorialId === 'all') initializedGui = initTutorialLibrary(initializedGui);
-                    if (tutorialId) this.state.tutorial = true;
+                    if (tutorialId === null) {
+                        if (props.showPreviewInfo) {
+                            // Show preview info if requested and no tutorial ID found
+                            initializedGui = initPreviewInfo(initializedGui);
+                        }
+                    } else if (tutorialId === 'all') {
+                        // Specific tutorials are set in setActiveCards in the GUI container.
+                        // Handle ?tutorial=all here for beta, if we decide to keep this for the
+                        // project page, this functionality should move to GUI container also.
+                        initializedGui = initTutorialLibrary(initializedGui);
+                    }
                 }
                 reducers = {
                     locales: localesReducer,
@@ -107,9 +110,9 @@ const AppStateHOC = function (WrappedComponent, localesOnly) {
             const {
                 isFullScreen, // eslint-disable-line no-unused-vars
                 isPlayerOnly, // eslint-disable-line no-unused-vars
+                showPreviewInfo, // eslint-disable-line no-unused-vars
                 ...componentProps
             } = this.props;
-            if (this.state.tutorial) componentProps.hideIntro = true;
             return (
                 <Provider store={this.store}>
                     <ConnectedIntlProvider>
@@ -123,7 +126,8 @@ const AppStateHOC = function (WrappedComponent, localesOnly) {
     }
     AppStateWrapper.propTypes = {
         isFullScreen: PropTypes.bool,
-        isPlayerOnly: PropTypes.bool
+        isPlayerOnly: PropTypes.bool,
+        showPreviewInfo: PropTypes.bool
     };
     return AppStateWrapper;
 };

src/lib/hash-parser-hoc.jsx

@@ -9,6 +9,8 @@ import {
     setProjectId
 } from '../reducers/project-state';
 
+import {closePreviewInfo} from '../reducers/modals';
+
 /* Higher Order Component to get the project id from location.hash
  * @param {React.Component} WrappedComponent: component to render
  * @returns {React.Component} component with hash parsing behavior
@@ -20,9 +22,6 @@ const HashParserHOC = function (WrappedComponent) {
             bindAll(this, [
                 'handleHashChange'
             ]);
-            this.state = {
-                hideIntro: false
-            };
         }
         componentDidMount () {
             window.addEventListener('hashchange', this.handleHashChange);
@@ -43,9 +42,6 @@ const HashParserHOC = function (WrappedComponent) {
             const hashMatch = window.location.hash.match(/#(\d+)/);
             const hashProjectId = hashMatch === null ? defaultProjectId : hashMatch[1];
             this.props.setProjectId(hashProjectId.toString());
-            if (hashProjectId !== defaultProjectId) {
-                this.setState({hideIntro: true});
-            }
         }
         render () {
             const {
@@ -58,7 +54,6 @@ const HashParserHOC = function (WrappedComponent) {
             } = this.props;
             return (
                 <WrappedComponent
-                    hideIntro={this.state.hideIntro}
                     {...componentProps}
                 />
             );
@@ -77,7 +72,12 @@ const HashParserHOC = function (WrappedComponent) {
         };
     };
     const mapDispatchToProps = dispatch => ({
-        setProjectId: projectId => dispatch(setProjectId(projectId))
+        setProjectId: projectId => {
+            dispatch(setProjectId(projectId));
+            if (projectId !== defaultProjectId) {
+                dispatch(closePreviewInfo());
+            }
+        }
     });
     // Allow incoming props to override redux-provided props. Used to mock in tests.
     const mergeProps = (stateProps, dispatchProps, ownProps) => Object.assign(

src/playground/render-gui.jsx

@@ -37,6 +37,7 @@ export default appTarget => {
         <WrappedGui
             backpackVisible
             showComingSoon
+            showPreviewInfo
             backpackHost={backpackHost}
         />,
         appTarget);

src/reducers/gui.js

@@ -80,9 +80,6 @@ const initTutorialCard = function (currentState, deckId) {
         {},
         currentState,
         {
-            modals: {
-                previewInfo: false
-            },
             cards: {
                 visible: true,
                 content: decks,
@@ -102,13 +99,24 @@ const initTutorialLibrary = function (currentState) {
         currentState,
         {
             modals: {
-                previewInfo: false,
                 tipsLibrary: true
             }
         }
     );
 };
 
+const initPreviewInfo = function (currentState) {
+    return Object.assign(
+        {},
+        currentState,
+        {
+            modals: {
+                previewInfo: true
+            }
+        }
+    );
+};
+
 const guiReducer = combineReducers({
     alerts: alertsReducer,
     assetDrag: assetDragReducer,
@@ -141,6 +149,7 @@ export {
     guiMiddleware,
     initFullScreen,
     initPlayer,
+    initPreviewInfo,
     initTutorialCard,
     initTutorialLibrary
 };

src/reducers/modals.js

@@ -23,7 +23,7 @@ const initialState = {
     [MODAL_EXTENSION_LIBRARY]: false,
     [MODAL_IMPORT_INFO]: false,
     [MODAL_LOADING_PROJECT]: false,
-    [MODAL_PREVIEW_INFO]: true,
+    [MODAL_PREVIEW_INFO]: false,
     [MODAL_SOUND_LIBRARY]: false,
     [MODAL_SPRITE_LIBRARY]: false,
     [MODAL_SOUND_RECORDER]: false,