Add PromptDialog to replace window.prompt (#1104)

* Save file prompt dialog

* Don't download if dialog dismissed

* refactor

* style dialog

* nit

* Autofocus

src/components/dialog/GlobalDialog.vue

@@ -11,6 +11,7 @@
     @hide="dialogStore.closeDialog"
     @maximize="onMaximize"
     @unmaximize="onUnmaximize"
+    :pt="{ header: 'pb-0' }"
   >
     <template #header>
       <component
@@ -30,7 +31,9 @@ import { useDialogStore } from '@/stores/dialogStore'
 import Dialog from 'primevue/dialog'
 
 const dialogStore = useDialogStore()
-const maximizable = computed(() => dialogStore.props.maximizable ?? false)
+const maximizable = computed(
+  () => dialogStore.dialogComponentProps.maximizable ?? false
+)
 const maximized = ref(false)
 
 const onMaximize = () => {

src/components/dialog/content/ExecutionErrorDialogContent.vue

@@ -191,8 +191,4 @@ const openNewGithubIssue = async () => {
   white-space: pre-wrap;
   word-wrap: break-word;
 }
-
-.no-results-placeholder {
-  padding-top: 0;
-}
 </style>

src/components/dialog/content/PromptDialogContent.vue

@@ -0,0 +1,43 @@
+<template>
+  <div class="prompt-dialog-content flex flex-col gap-2 pt-8">
+    <FloatLabel>
+      <InputText
+        ref="inputRef"
+        v-model="inputValue"
+        @keyup.enter="onConfirm"
+        @focus="selectAllText"
+        autofocus
+      />
+      <label>{{ message }}</label>
+    </FloatLabel>
+    <Button @click="onConfirm">{{ $t('confirm') }}</Button>
+  </div>
+</template>
+
+<script setup lang="ts">
+import Button from 'primevue/button'
+import InputText from 'primevue/inputtext'
+import FloatLabel from 'primevue/floatlabel'
+import { ref } from 'vue'
+import { useDialogStore } from '@/stores/dialogStore'
+
+const props = defineProps<{
+  message: string
+  defaultValue: string
+  onConfirm: (value: string) => void
+}>()
+
+const inputValue = ref<string>(props.defaultValue)
+
+const onConfirm = () => {
+  props.onConfirm(inputValue.value)
+  useDialogStore().closeDialog()
+}
+
+const inputRef = ref(null)
+const selectAllText = () => {
+  if (!inputRef.value) return
+  const inputElement = inputRef.value.$el
+  inputElement.setSelectionRange(0, inputElement.value.length)
+}
+</script>

src/components/templates/TemplateWorkflowsContent.vue

@@ -1,6 +1,6 @@
 <template>
   <div
-    class="flex flex-wrap content-around justify-around gap-4"
+    class="flex flex-wrap content-around justify-around gap-4 mt-4"
     data-testid="template-workflows-content"
   >
     <div