From c0ed64ad378fd4b19205cf153ec6340c604ec89d Mon Sep 17 00:00:00 2001
From: Vinzenz Aubry <vinzenzaubry@gmail.com>
Date: Thu, 21 Sep 2023 22:28:04 -0400
Subject: [PATCH] forward to new graph on create

---
 .../src/components/DialogAddGraph.vue         | 71 ++++++++++---------
 1 file changed, 38 insertions(+), 33 deletions(-)

diff --git a/caster-editor/src/components/DialogAddGraph.vue b/caster-editor/src/components/DialogAddGraph.vue
index 3c5306c7..23d3648d 100644
--- a/caster-editor/src/components/DialogAddGraph.vue
+++ b/caster-editor/src/components/DialogAddGraph.vue
@@ -1,34 +1,6 @@
-<template>
-  <div>
-    <ElDialog
-      v-model="showDialog"
-      title="Create graph"
-      :show-close="false"
-      align-center
-    >
-      <ElInput
-        id="graphNameInput"
-        v-model="newGraphDialogName"
-        placeholder="Name of graph"
-      />
-      <template #footer>
-        <span class="dialog-footer">
-          <ElButton
-            type="danger"
-            @click="() => emit('aborted')"
-          >Cancel</ElButton>
-          <ElButton
-            type="primary"
-            @click="createGraph()"
-          > Confirm </ElButton>
-        </span>
-      </template>
-    </ElDialog>
-  </div>
-</template>
-
 <script setup lang="ts">
 import { ref, type Ref } from "vue";
+import { useRouter } from "vue-router";
 import {
   useCreateGraphMutation,
   StreamAssignmentPolicy,
@@ -40,6 +12,7 @@ const emit = defineEmits<{
   (e: "created"): void;
 }>();
 
+const router = useRouter();
 const newGraphDialogName: Ref<string> = ref("");
 const showDialog: Ref<boolean> = ref(true);
 const createGraphMutation = useCreateGraphMutation();
@@ -55,8 +28,8 @@ const slugify = (str: string): string => {
 };
 
 const createGraph = async () => {
-  const { error: createGraphError } = await createGraphMutation.executeMutation(
-    {
+  const { error: createGraphError, data } =
+    await createGraphMutation.executeMutation({
       graphInput: {
         name: newGraphDialogName.value,
         displayName: newGraphDialogName.value,
@@ -65,14 +38,46 @@ const createGraph = async () => {
         streamAssignmentPolicy: StreamAssignmentPolicy.OneUserOneStream,
         templateName: GraphDetailTemplate.Default,
       },
-    },
-  );
+    });
 
   if (createGraphError) {
     alert("Could not create graph: " + createGraphError.message);
     return;
   }
+
+  // route to graph
+  router.push({ name: "graph", params: { uuid: data?.addGraph.uuid } });
+
   newGraphDialogName.value = "";
   emit("created");
 };
 </script>
+
+<template>
+  <div>
+    <ElDialog
+      v-model="showDialog"
+      title="Create graph"
+      :show-close="false"
+      align-center
+    >
+      <ElInput
+        id="graphNameInput"
+        v-model="newGraphDialogName"
+        placeholder="Name of graph"
+      />
+      <template #footer>
+        <span class="dialog-footer">
+          <ElButton
+            type="danger"
+            @click="() => emit('aborted')"
+          >Cancel</ElButton>
+          <ElButton
+            type="primary"
+            @click="createGraph()"
+          > Confirm </ElButton>
+        </span>
+      </template>
+    </ElDialog>
+  </div>
+</template>