Editor initial version for workflows and tasks

ui/.gitignore

@@ -21,4 +21,5 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-yarn.lock
+yarn.lock
+/conductor-orkes/

ui/package.json

@@ -6,6 +6,7 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "^4.0.0-alpha.57",
     "@material-ui/styles": "^4.10.0",
+    "@monaco-editor/react": "^4.3.1",
     "clsx": "^1.1.1",
     "d3": "^6.2.0",
     "dagre-d3": "^0.6.4",

ui/src/App.jsx

@@ -11,9 +11,9 @@ import TaskSearch from "./pages/executions/TaskSearch";
 
 import Execution from "./pages/execution/Execution";
 import WorkflowDefinitions from "./pages/definitions/Workflow";
-import WorkflowDefinition from "./pages/definition/Workflow";
+import WorkflowDefinition from "./pages/definition/WorkflowDefinition";
 import TaskDefinitions from "./pages/definitions/Task";
-import TaskDefinition from "./pages/definition/Task";
+import TaskDefinition from "./pages/definition/TaskDefinition";
 import EventHandlerDefinitions from "./pages/definitions/EventHandler";
 import EventHandlerDefinition from "./pages/definition/EventHandler";
 import TaskQueue from "./pages/misc/TaskQueue";
@@ -59,6 +59,12 @@ export default function App() {
           <Button component={NavLink} path="/taskQueue">
             Task Queues
           </Button>
+          <Button component={NavLink} path="/newWorkflowDef">
+            Define Workflow
+          </Button>
+          <Button component={NavLink} path="/newTaskDef">
+            Define Task
+          </Button>
 
           <div className={classes.toolbarRight}>
             <AppBarModules />
@@ -82,12 +88,18 @@ export default function App() {
           <Route exact path="/workflowDef/:name/:version?">
             <WorkflowDefinition />
           </Route>
+          <Route exact path="/newWorkflowDef">
+            <WorkflowDefinition />
+          </Route>
           <Route exact path="/taskDef">
             <TaskDefinitions />
           </Route>
           <Route exact path="/taskDef/:name">
             <TaskDefinition />
           </Route>
+          <Route exact path="/newTaskDef">
+            <TaskDefinition />
+          </Route>
           <Route exact path="/eventHandlerDef">
             <EventHandlerDefinitions />
           </Route>

ui/src/codegen/CodeEditorUtils.js

@@ -0,0 +1,24 @@
+import { WORKFLOW_SCHEMA } from "./JSONSchemaWorkflow";
+
+export const JSON_FILE_NAME = "file:///main.json";
+export const JSON_FILE_TASK_NAME = "file:///mainTask.json";
+
+export function configureMonaco(monaco) {
+  monaco.languages.typescript.javascriptDefaults.setEagerModelSync(true);
+  // noinspection JSUnresolvedVariable
+  monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
+    target: monaco.languages.typescript.ScriptTarget.ES6,
+    allowNonTsExtensions: true
+  });
+  let modelUri = monaco.Uri.parse(JSON_FILE_NAME);
+  monaco.languages.json.jsonDefaults.setDiagnosticsOptions({
+    validate: true,
+    schemas: [
+      {
+        uri: 'http://orkes.io/workflow-schema.json', // id of the first schema
+        fileMatch: [modelUri.toString()], // associate with our model
+        schema: WORKFLOW_SCHEMA
+      }
+    ]
+  });
+}