wait for npm install

Author: gonpombo8

packages/renderer/src/components/EditorPage/component.tsx

@@ -38,7 +38,7 @@ export function EditorPage() {
     updateScene,
     loadingPreview,
     loadingPublish,
-    isInstalling,
+    isInstallingProject,
   } = useEditor();
   const userId = useSelector(state => state.analytics.userId);
   const iframeRef = useRef<ReturnType<typeof initRpc>>();
@@ -168,17 +168,17 @@ export function EditorPage() {
               </Button>
               <Button
                 color="secondary"
-                disabled={loadingPreview || isInstalling}
+                disabled={loadingPreview || isInstallingProject}
                 onClick={openPreview}
-                startIcon={(loadingPreview || isInstalling) ? <Loader size={20} /> : <PlayCircleIcon />}
+                startIcon={loadingPreview ? <Loader size={20} /> : <PlayCircleIcon />}
               >
                 {t('editor.header.actions.preview')}
               </Button>
               <Button
                 color="primary"
-                disabled={loadingPublish || isInstalling}
+                disabled={loadingPublish || isInstallingProject}
                 onClick={handleOpenModal('publish')}
-                startIcon={(loadingPublish || isInstalling) ? <Loader size={20} /> : <PublicIcon />}
+                startIcon={loadingPublish ? <Loader size={20} /> : <PublicIcon />}
               >
                 {t('editor.header.actions.publish')}
               </Button>

packages/renderer/src/modules/store/editor/slice.ts

@@ -28,6 +28,8 @@ export type EditorState = {
   loadingPreview: boolean;
   isInstalling: boolean;
   isInstalled: boolean;
+  isInstallingProject: boolean;
+  isInstalledProject: boolean;
   isFetchingVersion: boolean;
   error: Error | null;
 };
@@ -41,6 +43,8 @@ const initialState: EditorState = {
   loadingInspector: false,
   loadingPreview: false,
   isInstalling: false,
+  isInstallingProject: false,
+  isInstalledProject: false,
   isInstalled: false,
   isFetchingVersion: false,
   error: null,
@@ -139,6 +143,13 @@ export const slice = createSlice({
     builder.addCase(workspaceActions.saveAndGetThumbnail.pending, state => {
       if (state.project) state.project.status = 'loading';
     });
+    builder.addCase(workspaceActions.installProject.pending, (state) => {
+      state.isInstallingProject = true;
+    });
+    builder.addCase(workspaceActions.installProject.fulfilled, (state) => {
+      state.isInstalledProject = true;
+      state.isInstallingProject = false;
+    });
     builder.addCase(workspaceActions.saveAndGetThumbnail.fulfilled, (state, action) => {
       if (state.project) {
         state.project.thumbnail = action.payload;