@finos/legend-application-studio 18.1.0 → 19.1.0

package/src/components/project-viewer/ProjectViewer.tsx

@@ -19,18 +19,14 @@ import { observer } from 'mobx-react-lite';
 import { EditPanel } from '../editor/edit-panel/EditPanel.js';
 import { GrammarTextEditor } from '../editor/edit-panel/GrammarTextEditor.js';
 import { LEGEND_STUDIO_TEST_ID } from '../LegendStudioTestID.js';
-import {
-  ACTIVITY_MODE,
-  LEGEND_STUDIO_HOTKEY,
-  LEGEND_STUDIO_HOTKEY_MAP,
-} from '../../stores/EditorConfig.js';
+import { ACTIVITY_MODE } from '../../stores/EditorConfig.js';
 import {
   type ResizablePanelHandlerProps,
   clsx,
   ResizablePanel,
   ResizablePanelGroup,
   ResizablePanelSplitter,
-  getControlledResizablePanelProps,
+  getCollapsiblePanelGroupProps,
   RepoIcon,
   CodeBranchIcon,
   HackerIcon,
@@ -40,7 +36,6 @@ import {
   useResizeDetector,
 } from '@finos/legend-art';
 import { isNonNullable } from '@finos/legend-shared';
-import { GlobalHotKeys } from 'react-hotkeys';
 import {
   useProjectViewerStore,
   withProjectViewerStore,
@@ -55,7 +50,11 @@ import {
   useEditorStore,
   withEditorStore,
 } from '../editor/EditorStoreProvider.js';
-import { useApplicationStore, useParams } from '@finos/legend-application';
+import {
+  useApplicationStore,
+  useCommands,
+  useParams,
+} from '@finos/legend-application';
 import {
   ActivityBarMenu,
   type ActivityDisplay,
@@ -63,7 +62,10 @@ import {
 import { Explorer } from '../editor/side-bar/Explorer.js';
 import { ProjectOverview } from '../editor/side-bar/ProjectOverview.js';
 import { WorkflowManager } from '../editor/side-bar/WorkflowManager.js';
-import { useLegendStudioApplicationStore } from '../LegendStudioBaseStoreProvider.js';
+import {
+  useLegendStudioApplicationStore,
+  useLegendStudioBaseStore,
+} from '../LegendStudioBaseStoreProvider.js';
 import { EmbeddedQueryBuilder } from '../EmbeddedQueryBuilder.js';
 
 const ProjectViewerStatusBar = observer(() => {
@@ -113,8 +115,10 @@ const ProjectViewerStatusBar = observer(() => {
                 title="Go back to workspace setup using the specified project"
                 tabIndex={-1}
                 onClick={(): void =>
-                  applicationStore.navigator.goToLocation(
-                    generateSetupRoute(projectId),
+                  applicationStore.navigator.visitAddress(
+                    applicationStore.navigator.generateAddress(
+                      generateSetupRoute(projectId),
+                    ),
                   )
                 }
               >
@@ -169,7 +173,7 @@ const ProjectViewerStatusBar = observer(() => {
 
 const ProjectViewerSideBar = observer(() => {
   const viewerStore = useProjectViewerStore();
-  const editorStore = viewerStore.editorStore;
+  const editorStore = useEditorStore();
   const renderSideBar = (): React.ReactNode => {
     switch (editorStore.activeActivity) {
       case ACTIVITY_MODE.EXPLORER:
@@ -195,7 +199,9 @@ const ProjectViewerSideBar = observer(() => {
 
 const ProjectViewerActivityBar = observer(() => {
   const viewerStore = useProjectViewerStore();
-  const editorStore = viewerStore.editorStore;
+  const baseStore = useLegendStudioBaseStore();
+  const editorStore = useEditorStore();
+
   const changeActivity =
     (activity: ACTIVITY_MODE): (() => void) =>
     (): void =>
@@ -207,7 +213,7 @@ const ProjectViewerActivityBar = observer(() => {
       title: 'Explorer (Ctrl + Shift + X)',
       icon: <FileTrayIcon />,
     },
-    !editorStore.isInConflictResolutionMode && {
+    baseStore.isSDLCAuthorized !== undefined && {
       mode: ACTIVITY_MODE.PROJECT_OVERVIEW,
       title: 'Project',
       icon: (
@@ -256,14 +262,7 @@ export const ProjectViewer = withEditorStore(
       const viewerStore = useProjectViewerStore();
       const editorStore = useEditorStore();
       const applicationStore = useApplicationStore();
-      const allowOpeningElement =
-        editorStore.sdlcState.currentProject &&
-        editorStore.graphManagerState.graphBuildState.hasSucceeded;
-      const resizeSideBar = (handleProps: ResizablePanelHandlerProps): void =>
-        editorStore.sideBarDisplayState.setSize(
-          (handleProps.domElement as HTMLDivElement).getBoundingClientRect()
-            .width,
-        );
+
       // Extensions
       const extraEditorExtensionComponents = editorStore.pluginManager
         .getApplicationPlugins()
@@ -276,40 +275,31 @@ export const ProjectViewer = withEditorStore(
         .map((config) => (
           <Fragment key={config.key}>{config.renderer(editorStore)}</Fragment>
         ));
-      // Resize
-      const { ref, width, height } = useResizeDetector<HTMLDivElement>();
-      // Hotkeys
-      const keyMap = {
-        [LEGEND_STUDIO_HOTKEY.OPEN_ELEMENT]: [
-          LEGEND_STUDIO_HOTKEY_MAP.OPEN_ELEMENT,
-        ],
-        [LEGEND_STUDIO_HOTKEY.TOGGLE_TEXT_MODE]: [
-          LEGEND_STUDIO_HOTKEY_MAP.TOGGLE_TEXT_MODE,
-        ],
-      };
-      const handlers = {
-        [LEGEND_STUDIO_HOTKEY.OPEN_ELEMENT]:
-          editorStore.createGlobalHotKeyAction(() =>
-            editorStore.searchElementCommandState.open(),
-          ),
-        [LEGEND_STUDIO_HOTKEY.TOGGLE_TEXT_MODE]:
-          editorStore.createGlobalHotKeyAction(() => {
-            flowResult(editorStore.toggleTextMode()).catch(
-              applicationStore.alertUnhandledError,
-            );
-          }),
-      };
 
+      // layout
+      const resizeSideBar = (handleProps: ResizablePanelHandlerProps): void =>
+        editorStore.sideBarDisplayState.setSize(
+          (handleProps.domElement as HTMLDivElement).getBoundingClientRect()
+            .width,
+        );
+      const sideBarCollapsiblePanelGroupProps = getCollapsiblePanelGroupProps(
+        editorStore.sideBarDisplayState.size === 0,
+        {
+          onStopResize: resizeSideBar,
+          size: editorStore.sideBarDisplayState.size,
+        },
+      );
+      const { ref, width, height } = useResizeDetector<HTMLDivElement>();
       useEffect(() => {
         if (ref.current) {
           editorStore.auxPanelDisplayState.setMaxSize(ref.current.offsetHeight);
         }
       }, [ref, editorStore, width, height]);
 
+      // initialize
       useEffect(() => {
         viewerStore.internalizeEntityPath(params);
       }, [viewerStore, params]);
-
       // NOTE: since we internalize the entity path in the route, we should not re-initialize the graph
       // on the second call when we remove entity path from the route
       useEffect(() => {
@@ -318,43 +308,40 @@ export const ProjectViewer = withEditorStore(
         );
       }, [applicationStore, viewerStore, params]);
 
+      useCommands(editorStore);
+
       return (
         <div className="app__page">
           <div className="editor viewer">
-            <GlobalHotKeys keyMap={keyMap} handlers={handlers}>
-              <div className="editor__body">
-                <ProjectViewerActivityBar />
-                <div ref={ref} className="editor__content-container">
-                  <div className="editor__content">
-                    <ResizablePanelGroup orientation="vertical">
-                      <ResizablePanel
-                        {...getControlledResizablePanelProps(
-                          editorStore.sideBarDisplayState.size === 0,
-                          {
-                            onStopResize: resizeSideBar,
-                            size: editorStore.sideBarDisplayState.size,
-                          },
-                        )}
-                        direction={1}
-                      >
-                        <ProjectViewerSideBar />
-                      </ResizablePanel>
-                      <ResizablePanelSplitter />
-                      <ResizablePanel minSize={300}>
-                        {editorStore.isInFormMode && <EditPanel />}
-                        {editorStore.isInGrammarTextMode && (
-                          <GrammarTextEditor />
-                        )}
-                      </ResizablePanel>
-                    </ResizablePanelGroup>
-                  </div>
+            <div className="editor__body">
+              <ProjectViewerActivityBar />
+              <div ref={ref} className="editor__content-container">
+                <div className="editor__content">
+                  <ResizablePanelGroup orientation="vertical">
+                    <ResizablePanel
+                      {...sideBarCollapsiblePanelGroupProps.collapsiblePanel}
+                      direction={1}
+                    >
+                      <ProjectViewerSideBar />
+                    </ResizablePanel>
+                    <ResizablePanelSplitter />
+                    <ResizablePanel
+                      {...sideBarCollapsiblePanelGroupProps.remainingPanel}
+                      minSize={300}
+                    >
+                      {editorStore.isInFormMode && <EditPanel />}
+                      {editorStore.isInGrammarTextMode && <GrammarTextEditor />}
+                    </ResizablePanel>
+                  </ResizablePanelGroup>
                 </div>
               </div>
-              {allowOpeningElement && <ProjectSearchCommand />}
-              <ProjectViewerStatusBar />
-              <EmbeddedQueryBuilder />
-              {extraEditorExtensionComponents}
-            </GlobalHotKeys>
+            </div>
+            {editorStore.graphManagerState.graphBuildState.hasSucceeded && (
+              <ProjectSearchCommand />
+            )}
+            <ProjectViewerStatusBar />
+            <EmbeddedQueryBuilder />
+            {extraEditorExtensionComponents}
           </div>
         </div>
       );

package/src/components/shared/DiffView.tsx

@@ -16,16 +16,16 @@
 
 import { useEffect, useState, useRef } from 'react';
 import { observer } from 'mobx-react-lite';
-import { editor as monacoEditorAPI, KeyCode } from 'monaco-editor';
+import { editor as monacoEditorAPI } from 'monaco-editor';
 import {
   EDITOR_THEME,
   EDITOR_LANGUAGE,
   TAB_SIZE,
   useApplicationStore,
+  createPassThroughOnKeyHandler,
 } from '@finos/legend-application';
 import {
   disposeDiffEditor,
-  disableEditorHotKeys,
   baseTextEditorSettings,
   useResizeDetector,
 } from '@finos/legend-art';
@@ -35,7 +35,6 @@ import {
   tryToFormatJSONString,
   tryToFormatLosslessJSONString,
 } from '@finos/legend-shared';
-import { flowResult } from 'mobx';
 import { useEditorStore } from '../editor/EditorStoreProvider.js';
 
 export const TextDiffView = observer(
@@ -69,25 +68,7 @@ export const TextDiffView = observer(
           theme: EDITOR_THEME.LEGEND,
           readOnly: true,
         });
-        _editor.getOriginalEditor().onKeyDown((event) => {
-          if (event.keyCode === KeyCode.F8) {
-            event.preventDefault();
-            event.stopPropagation();
-            flowResult(editorStore.toggleTextMode()).catch(
-              applicationStore.alertUnhandledError,
-            );
-          }
-        });
-        _editor.getModifiedEditor().onKeyDown((event) => {
-          if (event.keyCode === KeyCode.F8) {
-            event.preventDefault();
-            event.stopPropagation();
-            flowResult(editorStore.toggleTextMode()).catch(
-              applicationStore.alertUnhandledError,
-            );
-          }
-        });
-        disableEditorHotKeys(_editor);
+        _editor.getOriginalEditor().onKeyDown(createPassThroughOnKeyHandler());
         setEditor(_editor);
       }
     }, [applicationStore, editorStore, editor]);

package/src/components/workspace-review/WorkspaceReview.tsx

@@ -25,7 +25,7 @@ import { WorkspaceReviewPanel } from './WorkspaceReviewPanel.js';
 import { ACTIVITY_MODE } from '../../stores/EditorConfig.js';
 import {
   type ResizablePanelHandlerProps,
-  getControlledResizablePanelProps,
+  getCollapsiblePanelGroupProps,
   clsx,
   PanelLoadingIndicator,
   ResizablePanel,
@@ -84,8 +84,10 @@ const WorkspaceReviewStatusBar = observer(() => {
             title="Go back to workspace setup using the specified project"
             tabIndex={-1}
             onClick={(): void =>
-              applicationStore.navigator.goToLocation(
-                generateSetupRoute(reviewStore.projectId),
+              applicationStore.navigator.visitAddress(
+                applicationStore.navigator.generateAddress(
+                  generateSetupRoute(reviewStore.projectId),
+                ),
               )
             }
           >
@@ -97,11 +99,13 @@ const WorkspaceReviewStatusBar = observer(() => {
             title="Go back to workspace setup using the specified workspace"
             tabIndex={-1}
             onClick={(): void =>
-              applicationStore.navigator.goToLocation(
-                generateSetupRoute(
-                  reviewStore.projectId,
-                  review.workspaceId,
-                  review.workspaceType,
+              applicationStore.navigator.visitAddress(
+                applicationStore.navigator.generateAddress(
+                  generateSetupRoute(
+                    reviewStore.projectId,
+                    review.workspaceId,
+                    review.workspaceType,
+                  ),
                 ),
               )
             }
@@ -148,10 +152,19 @@ const WorkspaceReviewExplorer = observer(() => {
   const reviewStore = useWorkspaceReviewStore();
   const editorStore = useEditorStore();
   const applicationStore = useApplicationStore();
+
+  // layout
   const resizeSideBar = (handleProps: ResizablePanelHandlerProps): void =>
     editorStore.sideBarDisplayState.setSize(
       (handleProps.domElement as HTMLDivElement).getBoundingClientRect().width,
     );
+  const sideBarCollapsiblePanelGroupProps = getCollapsiblePanelGroupProps(
+    editorStore.sideBarDisplayState.size === 0,
+    {
+      onStopResize: resizeSideBar,
+      size: editorStore.sideBarDisplayState.size,
+    },
+  );
 
   useEffect(() => {
     flowResult(reviewStore.fetchReviewComparison()).catch(
@@ -162,19 +175,16 @@ const WorkspaceReviewExplorer = observer(() => {
   return (
     <ResizablePanelGroup orientation="vertical">
       <ResizablePanel
-        {...getControlledResizablePanelProps(
-          editorStore.sideBarDisplayState.size === 0,
-          {
-            onStopResize: resizeSideBar,
-            size: editorStore.sideBarDisplayState.size,
-          },
-        )}
+        {...sideBarCollapsiblePanelGroupProps.collapsiblePanel}
         direction={1}
       >
         <WorkspaceReviewSideBar />
       </ResizablePanel>
       <ResizablePanelSplitter />
-      <ResizablePanel minSize={300}>
+      <ResizablePanel
+        {...sideBarCollapsiblePanelGroupProps.remainingPanel}
+        minSize={300}
+      >
         <WorkspaceReviewPanel />
       </ResizablePanel>
     </ResizablePanelGroup>

package/src/components/workspace-review/WorkspaceReviewPanel.tsx

@@ -149,7 +149,8 @@ export const WorkspaceReviewPanel = observer(() => {
         </div>
         <div className="workspace-review-panel__header__actions">
           <DropdownMenu
-            className="workspace-review-panel__element-view"
+            className="workspace-review-panel__element-view__type"
+            title="View as..."
             content={
               <div className="workspace-review-panel__element-view__options">
                 <div
@@ -171,14 +172,9 @@ export const WorkspaceReviewPanel = observer(() => {
               transformOrigin: { vertical: 'top', horizontal: 'right' },
             }}
           >
-            <button
-              className="workspace-review-panel__element-view__type"
-              title="View as..."
-            >
-              <div className="workspace-review-panel__element-view__type__label">
-                {currentEditorState.diffMode}
-              </div>
-            </button>
+            <div className="workspace-review-panel__element-view__type__label">
+              {currentEditorState.diffMode}
+            </div>
           </DropdownMenu>
         </div>
       </ContextMenu>

package/src/components/workspace-review/WorkspaceReviewSideBar.tsx

@@ -26,7 +26,6 @@ import {
   InfoCircleIcon,
   PanelContent,
 } from '@finos/legend-art';
-import { formatDistanceToNow } from 'date-fns';
 import { EntityDiffViewState } from '../../stores/editor-state/entity-diff-editor-state/EntityDiffViewState.js';
 import { LEGEND_STUDIO_TEST_ID } from '../LegendStudioTestID.js';
 import { flowResult } from 'mobx';
@@ -35,6 +34,7 @@ import { entityDiffSorter } from '../../stores/EditorSDLCState.js';
 import { useWorkspaceReviewStore } from './WorkspaceReviewStoreProvider.js';
 import { useEditorStore } from '../editor/EditorStoreProvider.js';
 import { useApplicationStore } from '@finos/legend-application';
+import { formatDistanceToNow } from '@finos/legend-shared';
 
 export const WorkspaceReviewSideBar = observer(() => {
   const reviewStore = useWorkspaceReviewStore();

package/src/components/workspace-setup/CreateProjectModal.tsx

@@ -124,10 +124,7 @@ const CreateNewProjectTab = observer(() => {
   const disableSubmit =
     dispatchingActions || !projectName || !artifactId || !groupId;
 
-  const handleSubmit = (
-    event: React.FormEvent<HTMLFormElement | HTMLButtonElement>,
-  ): void => {
-    event.preventDefault();
+  const handleSubmit = (): void => {
     if (projectName && groupId && artifactId) {
       if (allowCreatingNewProject) {
         flowResult(
@@ -158,7 +155,12 @@ const CreateNewProjectTab = observer(() => {
     );
   }
   return (
-    <form onSubmit={handleSubmit}>
+    <form
+      onSubmit={(event) => {
+        event.preventDefault();
+        handleSubmit();
+      }}
+    >
       <PanelLoadingIndicator
         isLoading={setupStore.createOrImportProjectState.isInProgress}
       />
@@ -437,10 +439,7 @@ const ImportProjectTab = observer(() => {
   const disableSubmit =
     dispatchingActions || !projectIdentifier || !artifactId || !groupId;
 
-  const handleSubmit = (
-    event: React.FormEvent<HTMLFormElement | HTMLButtonElement>,
-  ): void => {
-    event.preventDefault();
+  const handleSubmit = (): void => {
     if (importProjectSuccessReport) {
       applicationStore.navigator.visitAddress(
         importProjectSuccessReport.reviewUrl,
@@ -455,7 +454,12 @@ const ImportProjectTab = observer(() => {
   };
 
   return (
-    <form onSubmit={handleSubmit}>
+    <form
+      onSubmit={(event) => {
+        event.preventDefault();
+        handleSubmit();
+      }}
+    >
       <PanelLoadingIndicator
         isLoading={setupStore.createOrImportProjectState.isInProgress}
       />

package/src/components/workspace-setup/CreateWorkspaceModal.tsx

@@ -78,10 +78,6 @@ export const CreateWorkspaceModal = observer(
     const onClose = (): void => {
       setupStore.setShowCreateWorkspaceModal(false);
     };
-    const handleSubmit = (event: React.FormEvent<HTMLFormElement>): void => {
-      event.preventDefault();
-      createWorkspace();
-    };
 
     return (
       <Dialog
@@ -103,7 +99,12 @@ export const CreateWorkspaceModal = observer(
               }
             />
           </div>
-          <form onSubmit={handleSubmit}>
+          <form
+            onSubmit={(event) => {
+              event.preventDefault();
+              createWorkspace();
+            }}
+          >
             <PanelLoadingIndicator
               isLoading={setupStore.createWorkspaceState.isInProgress}
             />

package/src/components/workspace-setup/WorkspaceSetup.tsx

@@ -227,7 +227,12 @@ export const WorkspaceSetup = withWorkspaceSetupStore(
                     </div>
                   )}
                 </div>
-                <form onSubmit={handleProceed}>
+                <form
+                  onSubmit={(event) => {
+                    event.preventDefault();
+                    handleProceed();
+                  }}
+                >
                   <div className="workspace-setup__selector">
                     <div
                       className="workspace-setup__selector__icon"

package/src/index.ts

@@ -60,7 +60,6 @@ export * from './components/shared/ProjectSelectorUtils.js';
 export * from './components/shared/WorkspaceSelectorUtils.js';
 export { ClassFormEditor } from './components/editor/edit-panel/uml-editor/ClassEditor.js';
 export { TypeTree } from './components/shared/TypeTree.js';
-export { StudioTextInputEditor } from './components/shared/StudioTextInputEditor.js';
 
 // test
 export {

package/src/stores/EditorConfig.ts

@@ -14,36 +14,6 @@
  * limitations under the License.
  */
 
-export enum LEGEND_STUDIO_HOTKEY {
-  SYNC_WITH_WORKSPACE = 'SYNC_WITH_WORKSPACE',
-  CREATE_ELEMENT = 'CREATE_ELEMENT',
-  OPEN_ELEMENT = 'OPEN_ELEMENT',
-  TOGGLE_TEXT_MODE = 'TOGGLE_TEXT_MODE',
-  GENERATE = 'GENERATE',
-  COMPILE = 'COMPILE',
-  TOGGLE_AUX_PANEL = 'TOGGLE_AUX_PANEL',
-  TOGGLE_MODEL_LOADER = 'TOGGLE_MODEL_LOADER',
-  TOGGLE_SIDEBAR_EXPLORER = 'TOGGLE_SIDEBAR_EXPLORER',
-  TOGGLE_SIDEBAR_CHANGES = 'TOGGLE_SIDEBAR_CHANGES',
-  TOGGLE_SIDEBAR_WORKSPACE_REVIEW = 'TOGGLE_SIDEBAR_WORKSPACE_REVIEW',
-  TOGGLE_SIDEBAR_WORKSPACE_UPDATER = 'TOGGLE_SIDEBAR_WORKSPACE_UPDATER',
-}
-
-export const LEGEND_STUDIO_HOTKEY_MAP = Object.freeze({
-  [LEGEND_STUDIO_HOTKEY.SYNC_WITH_WORKSPACE]: 'ctrl+s',
-  [LEGEND_STUDIO_HOTKEY.CREATE_ELEMENT]: 'ctrl+shift+n',
-  [LEGEND_STUDIO_HOTKEY.OPEN_ELEMENT]: 'ctrl+p',
-  [LEGEND_STUDIO_HOTKEY.TOGGLE_MODEL_LOADER]: 'f2',
-  [LEGEND_STUDIO_HOTKEY.TOGGLE_TEXT_MODE]: 'f8',
-  [LEGEND_STUDIO_HOTKEY.COMPILE]: 'f9',
-  [LEGEND_STUDIO_HOTKEY.GENERATE]: 'f10',
-  [LEGEND_STUDIO_HOTKEY.TOGGLE_AUX_PANEL]: 'ctrl+`',
-  [LEGEND_STUDIO_HOTKEY.TOGGLE_SIDEBAR_EXPLORER]: 'ctrl+shift+x',
-  [LEGEND_STUDIO_HOTKEY.TOGGLE_SIDEBAR_CHANGES]: 'ctrl+shift+g',
-  [LEGEND_STUDIO_HOTKEY.TOGGLE_SIDEBAR_WORKSPACE_REVIEW]: 'ctrl+shift+m',
-  [LEGEND_STUDIO_HOTKEY.TOGGLE_SIDEBAR_WORKSPACE_UPDATER]: 'ctrl+shift+u',
-});
-
 export enum EDITOR_MODE {
   STANDARD = 'STANDARD',
   CONFLICT_RESOLUTION = 'CONFLICT_RESOLUTION',

package/src/stores/EditorGraphState.ts

@@ -362,7 +362,7 @@ export class EditorGraphState {
 
   private redirectToModelImporterForDebugging(error: Error): void {
     if (this.editorStore.isInConflictResolutionMode) {
-      this.editorStore.setBlockingAlert({
+      this.editorStore.applicationStore.setBlockingAlert({
         message: `Can't de-serialize graph model from entities`,
         prompt: `Please refresh the application and abort conflict resolution`,
       });
@@ -641,7 +641,7 @@ export class EditorGraphState {
     try {
       this.isApplicationLeavingTextMode = true;
       this.clearCompilationError();
-      this.editorStore.setBlockingAlert({
+      this.editorStore.applicationStore.setBlockingAlert({
         message: 'Compiling graph before leaving text mode...',
         showLoading: true,
       });
@@ -653,9 +653,12 @@ export class EditorGraphState {
             // surpress the modal to reveal error properly in the text editor
             // if the blocking modal is not dismissed, the edior will not be able to gain focus as modal has a focus trap
             // therefore, the editor will not be able to get the focus
-            { onError: () => this.editorStore.setBlockingAlert(undefined) },
+            {
+              onError: () =>
+                this.editorStore.applicationStore.setBlockingAlert(undefined),
+            },
           )) as Entity[];
-        this.editorStore.setBlockingAlert({
+        this.editorStore.applicationStore.setBlockingAlert({
           message: 'Leaving text mode and rebuilding graph...',
           showLoading: true,
         });
@@ -685,13 +688,11 @@ export class EditorGraphState {
           this.editorStore.applicationStore.notifyWarning(
             `Compilation failed: ${error.message}`,
           );
-          this.editorStore.setActionAlertInfo({
+          this.editorStore.applicationStore.setActionAlertInfo({
             message: 'Project is not in a compiled state',
             prompt:
               'All changes made since the last time the graph was built successfully will be lost',
             type: ActionAlertType.CAUTION,
-            onEnter: (): void => this.editorStore.setBlockGlobalHotkeys(true),
-            onClose: (): void => this.editorStore.setBlockGlobalHotkeys(false),
             actions: [
               {
                 label: 'Discard Changes',
@@ -716,7 +717,7 @@ export class EditorGraphState {
       );
     } finally {
       this.isApplicationLeavingTextMode = false;
-      this.editorStore.setBlockingAlert(undefined);
+      this.editorStore.applicationStore.setBlockingAlert(undefined);
     }
   }
 

package/src/stores/EditorSDLCState.ts

@@ -297,12 +297,14 @@ export class EditorSDLCState {
       (error instanceof NetworkClientError &&
         error.response.status === HttpStatus.NOT_FOUND)
     ) {
-      this.editorStore.setBlockingAlert({
+      this.editorStore.applicationStore.setBlockingAlert({
         message: 'Current project or workspace no longer exists',
         prompt: 'Please refresh the application',
       });
     } else {
-      this.editorStore.setBlockingAlert({ message: error.message });
+      this.editorStore.applicationStore.setBlockingAlert({
+        message: error.message,
+      });
     }
   }