1 files changed, 71 insertions, 0 deletions

diff --git a/app/assets/javascripts/issues/show/components/delete_issue_modal.vue b/app/assets/javascripts/issues/show/components/delete_issue_modal.vue
new file mode 100644
index 00000000000..26862346b86
--- /dev/null
+++ b/app/assets/javascripts/issues/show/components/delete_issue_modal.vue
@@ -0,0 +1,71 @@
+<script>
+import { GlModal } from '@gitlab/ui';
+import csrf from '~/lib/utils/csrf';
+import { capitalizeFirstCharacter } from '~/lib/utils/text_utility';
+import { __, sprintf } from '~/locale';
+
+export default {
+  actionCancel: { text: __('Cancel') },
+  csrf,
+  components: {
+    GlModal,
+  },
+  props: {
+    issuePath: {
+      type: String,
+      required: true,
+    },
+    issueType: {
+      type: String,
+      required: true,
+    },
+    modalId: {
+      type: String,
+      required: true,
+    },
+    title: {
+      type: String,
+      required: true,
+    },
+  },
+  computed: {
+    actionPrimary() {
+      return {
+        attributes: { variant: 'danger' },
+        text: this.title,
+      };
+    },
+    bodyText() {
+      return this.issueType.toLowerCase() === 'epic'
+        ? __('Delete this epic and all descendants?')
+        : sprintf(__('%{issuableType} will be removed! Are you sure?'), {
+            issuableType: capitalizeFirstCharacter(this.issueType),
+          });
+    },
+  },
+  methods: {
+    submitForm() {
+      this.$emit('delete');
+      this.$refs.form.submit();
+    },
+  },
+};
+</script>
+
+<template>
+  <gl-modal
+    :action-cancel="$options.actionCancel"
+    :action-primary="actionPrimary"
+    :modal-id="modalId"
+    size="sm"
+    :title="title"
+    @primary="submitForm"
+  >
+    <form ref="form" :action="issuePath" method="post">
+      <input type="hidden" name="_method" value="delete" />
+      <input type="hidden" name="authenticity_token" :value="$options.csrf.token" />
+      <input type="hidden" name="destroy_confirm" value="true" />
+      {{ bodyText }}
+    </form>
+  </gl-modal>
+</template>