feat: connect model generator to UI

3 files changed, 153 insertions, 2 deletions

diff --git a/subprojects/frontend/src/editor/EditorStore.ts b/subprojects/frontend/src/editor/EditorStore.ts
index b5989ad1..f9a9a7da 100644
--- a/subprojects/frontend/src/editor/EditorStore.ts
+++ b/subprojects/frontend/src/editor/EditorStore.ts
@@ -32,6 +32,7 @@ import type XtextClient from '../xtext/XtextClient';
 import type { SemanticsSuccessResult } from '../xtext/xtextServiceResults';
 
 import EditorErrors from './EditorErrors';
+import GeneratedModelStore from './GeneratedModelStore';
 import LintPanelStore from './LintPanelStore';
 import SearchPanelStore from './SearchPanelStore';
 import createEditorState from './createEditorState';
@@ -69,6 +70,10 @@ export default class EditorStore {
 
   graph: GraphStore;
 
+  generatedModels = new Map<string, GeneratedModelStore>();
+
+  selectedGeneratedModel: string | undefined;
+
   constructor(initialValue: string, pwaStore: PWAStore) {
     this.id = nanoid();
     this.state = createEditorState(initialValue, this);
@@ -307,4 +312,84 @@ export default class EditorStore {
     this.delayedErrors.dispose();
     this.disposed = true;
   }
+
+  startModelGeneration(): void {
+    this.client
+      ?.startModelGeneration()
+      ?.catch((error) => log.error('Could not start model generation', error));
+  }
+
+  addGeneratedModel(uuid: string): void {
+    this.generatedModels.set(uuid, new GeneratedModelStore());
+    this.selectGeneratedModel(uuid);
+  }
+
+  cancelModelGeneration(): void {
+    this.client
+      ?.cancelModelGeneration()
+      ?.catch((error) => log.error('Could not start model generation', error));
+  }
+
+  selectGeneratedModel(uuid: string | undefined): void {
+    if (uuid === undefined) {
+      this.selectedGeneratedModel = uuid;
+      return;
+    }
+    if (this.generatedModels.has(uuid)) {
+      this.selectedGeneratedModel = uuid;
+      return;
+    }
+    this.selectedGeneratedModel = undefined;
+  }
+
+  deleteGeneratedModel(uuid: string | undefined): void {
+    if (uuid === undefined) {
+      return;
+    }
+    if (this.selectedGeneratedModel === uuid) {
+      let previous: string | undefined;
+      let found: string | undefined;
+      this.generatedModels.forEach((_value, key) => {
+        if (key === uuid) {
+          found = previous;
+        }
+        previous = key;
+      });
+      this.selectGeneratedModel(found);
+    }
+    const generatedModel = this.generatedModels.get(uuid);
+    if (generatedModel !== undefined && generatedModel.running) {
+      this.cancelModelGeneration();
+    }
+    this.generatedModels.delete(uuid);
+  }
+
+  modelGenerationCancelled(): void {
+    this.generatedModels.forEach((value) =>
+      value.setError('Model generation cancelled'),
+    );
+  }
+
+  setGeneratedModelMessage(uuid: string, message: string): void {
+    this.generatedModels.get(uuid)?.setMessage(message);
+  }
+
+  setGeneratedModelError(uuid: string, message: string): void {
+    this.generatedModels.get(uuid)?.setError(message);
+  }
+
+  setGeneratedModelSemantics(
+    uuid: string,
+    semantics: SemanticsSuccessResult,
+  ): void {
+    this.generatedModels.get(uuid)?.setSemantics(semantics);
+  }
+
+  get generating(): boolean {
+    let generating = false;
+    this.generatedModels.forEach((value) => {
+      generating = generating || value.running;
+    });
+    return generating;
+  }
 }
diff --git a/subprojects/frontend/src/editor/GenerateButton.tsx b/subprojects/frontend/src/editor/GenerateButton.tsx
index 5bac0464..b8dcd531 100644
--- a/subprojects/frontend/src/editor/GenerateButton.tsx
+++ b/subprojects/frontend/src/editor/GenerateButton.tsx
@@ -5,6 +5,7 @@
  */
 
 import CancelIcon from '@mui/icons-material/Cancel';
+import CloseIcon from '@mui/icons-material/Close';
 import PlayArrowIcon from '@mui/icons-material/PlayArrow';
 import { observer } from 'mobx-react-lite';
 
@@ -28,8 +29,10 @@ const GenerateButton = observer(function GenerateButton({
     );
   }
 
-  const { analyzing, errorCount, warningCount, semanticsError } =
-    editorStore.delayedErrors;
+  const {
+    delayedErrors: { analyzing, errorCount, warningCount, semanticsError },
+    generating,
+  } = editorStore;
 
   if (analyzing) {
     return (
@@ -39,6 +42,18 @@ const GenerateButton = observer(function GenerateButton({
     );
   }
 
+  if (generating) {
+    return (
+      <AnimatedButton
+        color="inherit"
+        onClick={() => editorStore.cancelModelGeneration()}
+        startIcon={<CloseIcon />}
+      >
+        Cancel
+      </AnimatedButton>
+    );
+  }
+
   if (semanticsError !== undefined && editorStore.opened) {
     return (
       <AnimatedButton
@@ -83,6 +98,7 @@ const GenerateButton = observer(function GenerateButton({
       disabled={!editorStore.opened}
       color={warningCount > 0 ? 'warning' : 'primary'}
       startIcon={<PlayArrowIcon />}
+      onClick={() => editorStore.startModelGeneration()}
     >
       {summary === '' ? GENERATE_LABEL : `${GENERATE_LABEL} (${summary})`}
     </AnimatedButton>
diff --git a/subprojects/frontend/src/editor/GeneratedModelStore.ts b/subprojects/frontend/src/editor/GeneratedModelStore.ts
new file mode 100644
index 00000000..d0181eed
--- /dev/null
+++ b/subprojects/frontend/src/editor/GeneratedModelStore.ts
@@ -0,0 +1,50 @@
+/*
+ * SPDX-FileCopyrightText: 2021-2023 The Refinery Authors <https://refinery.tools/>
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ */
+
+import { makeAutoObservable } from 'mobx';
+
+import GraphStore from '../graph/GraphStore';
+import type { SemanticsSuccessResult } from '../xtext/xtextServiceResults';
+
+export default class GeneratedModelStore {
+  title: string;
+
+  message = 'Waiting for server';
+
+  error = false;
+
+  graph: GraphStore | undefined;
+
+  constructor() {
+    const time = new Date().toLocaleTimeString(undefined, { hour12: false });
+    this.title = `Generated at ${time}`;
+    makeAutoObservable(this);
+  }
+
+  get running(): boolean {
+    return !this.error && this.graph === undefined;
+  }
+
+  setMessage(message: string): void {
+    if (this.running) {
+      this.message = message;
+    }
+  }
+
+  setError(message: string): void {
+    if (this.running) {
+      this.error = true;
+      this.message = message;
+    }
+  }
+
+  setSemantics(semantics: SemanticsSuccessResult): void {
+    if (this.running) {
+      this.graph = new GraphStore();
+      this.graph.setSemantics(semantics);
+    }
+  }
+}