feat: [UEPR-176] add logic for triggering feedback from editor

Author: MiroslavDionisiev

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

@@ -1,7 +1,7 @@
 import classNames from 'classnames';
 import omit from 'lodash.omit';
 import PropTypes from 'prop-types';
-import React from 'react';
+import React, {useCallback} from 'react';
 import {defineMessages, FormattedMessage, injectIntl, intlShape} from 'react-intl';
 import {connect} from 'react-redux';
 import MediaQuery from 'react-responsive';
@@ -86,6 +86,8 @@ const GUIComponent = props => {
         costumeLibraryVisible,
         costumesTabVisible,
         debugModalVisible,
+        displayDebugFeedback,
+        displayTutorialsFeedback,
         enableCommunity,
         intl,
         isCreating,
@@ -147,6 +149,13 @@ const GUIComponent = props => {
         tabSelected: classNames(tabStyles.reactTabsTabSelected, styles.isSelected)
     };
 
+    const onDebugModalClose = useCallback(() => {
+        if (displayDebugFeedback) {
+            displayDebugFeedback();
+        }
+        onRequestCloseDebugModal();
+    }, [displayDebugFeedback, onRequestCloseDebugModal]);
+
     if (isRendererSupported === null) {
         isRendererSupported = Renderer.isSupported();
     }
@@ -194,7 +203,10 @@ const GUIComponent = props => {
                     <WebGlModal isRtl={isRtl} />
                 )}
                 {tipsLibraryVisible ? (
-                    <TipsLibrary hideTutorialProjects={hideTutorialProjects} />
+                    <TipsLibrary
+                        hideTutorialProjects={hideTutorialProjects}
+                        displayTutorialsFeedback={displayTutorialsFeedback}
+                    />
                 ) : null}
                 {cardsVisible ? (
                     <Cards />
@@ -215,7 +227,7 @@ const GUIComponent = props => {
                 ) : null}
                 {<DebugModal
                     isOpen={debugModalVisible}
-                    onClose={onRequestCloseDebugModal}
+                    onClose={onDebugModalClose}
                 />}
                 {backdropLibraryVisible ? (
                     <BackdropLibrary
@@ -414,6 +426,8 @@ GUIComponent.propTypes = {
     costumeLibraryVisible: PropTypes.bool,
     costumesTabVisible: PropTypes.bool,
     debugModalVisible: PropTypes.bool,
+    displayDebugFeedback: PropTypes.func,
+    displayTutorialsFeedback: PropTypes.func,
     enableCommunity: PropTypes.bool,
     intl: intlShape.isRequired,
     isCreating: PropTypes.bool,

packages/scratch-gui/src/containers/tips-library.jsx

@@ -58,6 +58,9 @@ class TipsLibrary extends React.PureComponent {
             return window.open(window.location.origin + urlParams, '_blank');
         }
 
+        if (this.props.displayTutorialsFeedback) {
+            this.props.displayTutorialsFeedback();
+        }
         this.props.onActivateDeck(item.id);
     }
     render () {
@@ -113,6 +116,7 @@ class TipsLibrary extends React.PureComponent {
 }
 
 TipsLibrary.propTypes = {
+    displayTutorialsFeedback: PropTypes.func,
     intl: intlShape.isRequired,
     onActivateDeck: PropTypes.func.isRequired,
     onRequestClose: PropTypes.func,