From e46356051316d621d257cda66d7d3f2458d3dc30 Mon Sep 17 00:00:00 2001
From: Tai Sakuma <tai.sakuma@gmail.com>
Date: Thu, 29 Jun 2023 14:34:53 -0400
Subject: [PATCH] add a dialog to confirm the run

---
 components.d.ts            |  2 ++
 src/components/RunCtrl.vue | 34 ++++++++++++++++++++++++++++++++--
 2 files changed, 34 insertions(+), 2 deletions(-)

diff --git a/components.d.ts b/components.d.ts
index 0c9a7c1..c1f783e 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -30,6 +30,7 @@ declare module '@vue/runtime-core' {
     VBreadcrumbs: typeof import('vuetify/lib')['VBreadcrumbs']
     VBtn: typeof import('vuetify/lib')['VBtn']
     VCard: typeof import('vuetify/lib')['VCard']
+    VCardAction: typeof import('vuetify/lib')['VCardAction']
     VCardActions: typeof import('vuetify/lib')['VCardActions']
     VCardSubtitle: typeof import('vuetify/lib')['VCardSubtitle']
     VCardText: typeof import('vuetify/lib')['VCardText']
@@ -38,6 +39,7 @@ declare module '@vue/runtime-core' {
     VCol: typeof import('vuetify/lib')['VCol']
     VContainer: typeof import('vuetify/lib')['VContainer']
     VDataTable: typeof import('vuetify/lib')['VDataTable']
+    VDialog: typeof import('vuetify/lib')['VDialog']
     VDivider: typeof import('vuetify/lib')['VDivider']
     VIcon: typeof import('vuetify/lib')['VIcon']
     VList: typeof import('vuetify/lib')['VList']
diff --git a/src/components/RunCtrl.vue b/src/components/RunCtrl.vue
index d67e6ff..83f4a83 100644
--- a/src/components/RunCtrl.vue
+++ b/src/components/RunCtrl.vue
@@ -62,11 +62,24 @@
         </v-list-item>
       </v-list>
     </v-menu>
+    <v-dialog v-model="dialog" max-width="290">
+      <v-card>
+        <v-card-title> Start running the script? </v-card-title>
+        <v-card-text> Are you sure to start? </v-card-text>
+        <v-card-actions>
+          <v-btn text color="grey darken-2" @click="dialog = false">
+            Cancel
+          </v-btn>
+          <v-spacer></v-spacer>
+          <v-btn text color="primary" @click="onStartConfirmed"> Start </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
   </v-card-actions>
 </template>
 
 <script setup lang="ts">
-import { ref, computed } from "vue";
+import { watch, ref, computed } from "vue";
 
 import { useStore } from "@/stores/main";
 
@@ -173,7 +186,7 @@ const chip = computed(
 
 async function onClick(method: Method) {
   if (method === "run") {
-    await executeExec({});
+    showConfirmationDialog();
   } else if (method === "reset") {
     await executeReset({});
   } else if (method === "interrupt") {
@@ -190,4 +203,21 @@ const { executeMutation: executeReset } = useResetMutation();
 const { executeMutation: executeInterrupt } = useInterruptMutation();
 const { executeMutation: executeTerminate } = useTerminateMutation();
 const { executeMutation: executeKill } = useKillMutation();
+
+function showConfirmationDialog() {
+  dialog.value = true;
+}
+
+async function onStartConfirmed() {
+  dialog.value = false;
+  await executeExec({});
+}
+
+watch(nextlineState, () => {
+  if (nextlineState.value !== "initialized") {
+    dialog.value = false;
+  }
+});
+
+const dialog = ref(false);
 </script>