refactor: change place of token request to API

MacareuxDigital · Oct 22, 2024 · 7528680 · 7528680
1 parent d645755
commit 7528680
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 26 deletions.
diff --git a/src/containers/gui.jsx b/src/containers/gui.jsx
@@ -24,6 +24,7 @@ import {
     closeTelemetryModal,
     openExtensionLibrary
 } from '../reducers/modals';
+import { setSession } from "../reducers/session.js";
 
 import FontLoaderHOC from '../lib/font-loader-hoc.jsx';
 import LocalizationHOC from '../lib/localization-hoc.jsx';
@@ -42,6 +43,7 @@ import {setIsScratchDesktop} from '../lib/isScratchDesktop.js';
 
 class GUI extends React.Component {
     componentDidMount () {
+        this.fetchUserSessionFromApi();
         setIsScratchDesktop(this.props.isScratchDesktop);
         this.props.onStorageInit(storage);
         this.props.onVmInit(this.props.vm);
@@ -56,6 +58,26 @@ class GUI extends React.Component {
             this.props.onProjectLoaded();
         }
     }
+    fetchUserSessionFromApi() {
+        return fetch(
+            'http://localhost:3000/ccm/scratch-api/token'
+        )
+            .then((response) => {
+                if (!response.ok) {
+                    throw new Error('Network response was not ok');
+                }
+                return response.json();
+            })
+            .then((data) => {
+                this.props.onSetSession(data.token);
+            })
+            .catch((error) => {
+                console.error(
+                    'There was a problem with the fetch operation:',
+                    error
+                );
+            });
+    }
     render () {
         if (this.props.isError) {
             throw new Error(
@@ -73,6 +95,7 @@ class GUI extends React.Component {
             onStorageInit,
             onUpdateProjectId,
             onVmInit,
+            onSetSession,
             projectHost,
             projectId,
             /* eslint-enable no-unused-vars */
@@ -110,6 +133,7 @@ GUI.propTypes = {
     onStorageInit: PropTypes.func,
     onUpdateProjectId: PropTypes.func,
     onVmInit: PropTypes.func,
+    onSetSession: PropTypes.func,
     projectHost: PropTypes.string,
     projectId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     telemetryModalVisible: PropTypes.bool,
@@ -161,7 +185,8 @@ const mapDispatchToProps = dispatch => ({
     onActivateSoundsTab: () => dispatch(activateTab(SOUNDS_TAB_INDEX)),
     onRequestCloseBackdropLibrary: () => dispatch(closeBackdropLibrary()),
     onRequestCloseCostumeLibrary: () => dispatch(closeCostumeLibrary()),
-    onRequestCloseTelemetryModal: () => dispatch(closeTelemetryModal())
+    onRequestCloseTelemetryModal: () => dispatch(closeTelemetryModal()),
+    onSetSession: (token) => dispatch(setSession(token)),
 });
 
 const ConnectedGUI = injectIntl(connect(

diff --git a/src/lib/project-fetcher-hoc.jsx b/src/lib/project-fetcher-hoc.jsx
@@ -19,7 +19,6 @@ import {
     activateTab,
     BLOCKS_TAB_INDEX
 } from '../reducers/editor-tab';
-import { setSession } from "../reducers/session";
 
 import log from './log';
 import storage from './storage';
@@ -34,7 +33,7 @@ const ProjectFetcherHOC = function (WrappedComponent) {
         constructor (props) {
             super(props);
             bindAll(this, [
-                'fetchProject', 'fetchUserSessionFromApi'
+                'fetchProject'
             ]);
             storage.setProjectHost(props.projectHost);
             storage.setAssetHost(props.assetHost);
@@ -52,7 +51,6 @@ const ProjectFetcherHOC = function (WrappedComponent) {
             }
         }
         componentDidUpdate (prevProps) {
-            this.fetchUserSessionFromApi();
             if (prevProps.projectHost !== this.props.projectHost) {
                 storage.setProjectHost(this.props.projectHost);
             }
@@ -86,26 +84,6 @@ const ProjectFetcherHOC = function (WrappedComponent) {
                     log.error(err);
                 });
         }
-        fetchUserSessionFromApi() {
-            return fetch(
-                'http://localhost:3000/ccm/scratch-api/token'
-            )
-                .then((response) => {
-                    if (!response.ok) {
-                        throw new Error('Network response was not ok');
-                    }
-                    return response.json();
-                })
-                .then((data) => {
-                    this.props.onSetSession(data.token);
-                })
-                .catch((error) => {
-                    console.error(
-                        'There was a problem with the fetch operation:',
-                        error
-                    );
-                });
-        }
         render () {
             const {
                 /* eslint-disable no-unused-vars */
@@ -147,7 +125,6 @@ const ProjectFetcherHOC = function (WrappedComponent) {
         onError: PropTypes.func,
         onFetchedProjectData: PropTypes.func,
         onProjectUnchanged: PropTypes.func,
-        onSetSession: PropTypes.func,
         projectHost: PropTypes.string,
         projectId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
         reduxProjectId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
@@ -173,7 +150,6 @@ const ProjectFetcherHOC = function (WrappedComponent) {
             dispatch(onFetchedProjectData(projectData, loadingState)),
         setProjectId: projectId => dispatch(setProjectId(projectId)),
         onProjectUnchanged: () => dispatch(setProjectUnchanged()),
-        onSetSession: (token) => dispatch(setSession(token)),
     });
     // Allow incoming props to override redux-provided props. Used to mock in tests.
     const mergeProps = (stateProps, dispatchProps, ownProps) => Object.assign(