Add latest changes from gitlab-org/gitlab@master

6 files changed, 79 insertions, 5 deletions

diff --git a/app/assets/javascripts/environments/components/delete_environment_modal.vue b/app/assets/javascripts/environments/components/delete_environment_modal.vue
index 26ec882472b..d3d4c7d23d8 100644
--- a/app/assets/javascripts/environments/components/delete_environment_modal.vue
+++ b/app/assets/javascripts/environments/components/delete_environment_modal.vue
@@ -1,7 +1,9 @@
 <script>
 import { GlTooltipDirective, GlModal } from '@gitlab/ui';
+import createFlash from '~/flash';
 import { __, s__, sprintf } from '~/locale';
 import eventHub from '../event_hub';
+import deleteEnvironmentMutation from '../graphql/mutations/delete_environment.mutation.graphql';
 
 export default {
   id: 'delete-environment-modal',
@@ -17,6 +19,11 @@ export default {
       type: Object,
       required: true,
     },
+    graphql: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
   },
   computed: {
     primaryProps() {
@@ -49,7 +56,29 @@ export default {
   },
   methods: {
     onSubmit() {
-      eventHub.$emit('deleteEnvironment', this.environment);
+      if (this.graphql) {
+        this.$apollo
+          .mutate({
+            mutation: deleteEnvironmentMutation,
+            variables: { environment: this.environment },
+          })
+          .then(([message]) => {
+            if (message) {
+              createFlash({ message });
+            }
+          })
+          .catch((error) =>
+            createFlash({
+              message: s__(
+                'Environments|An error occurred while deleting the environment. Check if the environment stopped; if not, stop it and try again.',
+              ),
+              error,
+              captureError: true,
+            }),
+          );
+      } else {
+        eventHub.$emit('deleteEnvironment', this.environment);
+      }
     },
   },
 };
diff --git a/app/assets/javascripts/environments/components/environment_delete.vue b/app/assets/javascripts/environments/components/environment_delete.vue
index 8609503e486..63169b790c7 100644
--- a/app/assets/javascripts/environments/components/environment_delete.vue
+++ b/app/assets/javascripts/environments/components/environment_delete.vue
@@ -7,6 +7,7 @@
 import { GlDropdownItem, GlModalDirective } from '@gitlab/ui';
 import { s__ } from '~/locale';
 import eventHub from '../event_hub';
+import setEnvironmentToDelete from '../graphql/mutations/set_environment_to_delete.mutation.graphql';
 
 export default {
   components: {
@@ -20,6 +21,11 @@ export default {
       type: Object,
       required: true,
     },
+    graphql: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
   },
   data() {
     return {
@@ -30,14 +36,25 @@ export default {
     title: s__('Environments|Delete environment'),
   },
   mounted() {
-    eventHub.$on('deleteEnvironment', this.onDeleteEnvironment);
+    if (!this.graphql) {
+      eventHub.$on('deleteEnvironment', this.onDeleteEnvironment);
+    }
   },
   beforeDestroy() {
-    eventHub.$off('deleteEnvironment', this.onDeleteEnvironment);
+    if (!this.graphql) {
+      eventHub.$off('deleteEnvironment', this.onDeleteEnvironment);
+    }
   },
   methods: {
     onClick() {
-      eventHub.$emit('requestDeleteEnvironment', this.environment);
+      if (this.graphql) {
+        this.$apollo.mutate({
+          mutation: setEnvironmentToDelete,
+          variables: { environment: this.environment },
+        });
+      } else {
+        eventHub.$emit('requestDeleteEnvironment', this.environment);
+      }
     },
     onDeleteEnvironment(environment) {
       if (this.environment.id === environment.id) {
diff --git a/app/assets/javascripts/environments/graphql/mutations/set_environment_to_delete.mutation.graphql b/app/assets/javascripts/environments/graphql/mutations/set_environment_to_delete.mutation.graphql
new file mode 100644
index 00000000000..ea72067bd37
--- /dev/null
+++ b/app/assets/javascripts/environments/graphql/mutations/set_environment_to_delete.mutation.graphql
@@ -0,0 +1,3 @@
+mutation SetEnvironmentToDelete($environment: Environment) {
+  setEnvironmentToDelete(environment: $environment) @client
+}
diff --git a/app/assets/javascripts/environments/graphql/queries/environment_to_delete.query.graphql b/app/assets/javascripts/environments/graphql/queries/environment_to_delete.query.graphql
new file mode 100644
index 00000000000..5d39de8a0f1
--- /dev/null
+++ b/app/assets/javascripts/environments/graphql/queries/environment_to_delete.query.graphql
@@ -0,0 +1,7 @@
+query environmentToDelete {
+  environmentToDelete @client {
+    id
+    name
+    deletePath
+  }
+}
diff --git a/app/assets/javascripts/environments/graphql/resolvers.js b/app/assets/javascripts/environments/graphql/resolvers.js
index b8d570a2d78..6b70d4126ce 100644
--- a/app/assets/javascripts/environments/graphql/resolvers.js
+++ b/app/assets/javascripts/environments/graphql/resolvers.js
@@ -3,6 +3,7 @@ import { s__ } from '~/locale';
 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
 import pollIntervalQuery from './queries/poll_interval.query.graphql';
 import environmentToRollbackQuery from './queries/environment_to_rollback.query.graphql';
+import environmentToDeleteQuery from './queries/environment_to_delete.query.graphql';
 
 const buildErrors = (errors = []) => ({
   errors,
@@ -67,7 +68,16 @@ export const resolvers = (endpoint) => ({
         });
     },
     deleteEnvironment(_, { environment: { deletePath } }) {
-      return axios.delete(deletePath);
+      return axios
+        .delete(deletePath)
+        .then(() => buildErrors())
+        .catch(() =>
+          buildErrors([
+            s__(
+              'Environments|An error occurred while deleting the environment. Check if the environment stopped; if not, stop it and try again.',
+            ),
+          ]),
+        );
     },
     rollbackEnvironment(_, { environment, isLastDeployment }) {
       return axios
@@ -85,6 +95,12 @@ export const resolvers = (endpoint) => ({
           ]);
         });
     },
+    setEnvironmentToDelete(_, { environment }, { client }) {
+      client.writeQuery({
+        query: environmentToDeleteQuery,
+        data: { environmentToDelete: environment },
+      });
+    },
     setEnvironmentToRollback(_, { environment }, { client }) {
       client.writeQuery({
         query: environmentToRollbackQuery,
diff --git a/app/assets/javascripts/environments/graphql/typedefs.graphql b/app/assets/javascripts/environments/graphql/typedefs.graphql
index 9c205a6b7b3..ff664a2d4e2 100644
--- a/app/assets/javascripts/environments/graphql/typedefs.graphql
+++ b/app/assets/javascripts/environments/graphql/typedefs.graphql
@@ -58,6 +58,7 @@ type LocalErrors {
 extend type Query {
   environmentApp: LocalEnvironmentApp
   folder(environment: NestedLocalEnvironmentInput): LocalEnvironmentFolder
+  environmentToDelete: LocalEnvironment
   environmentToRollback: LocalEnvironment
   isLastDeployment: Boolean
 }
@@ -67,5 +68,6 @@ extend type Mutation {
   deleteEnvironment(environment: LocalEnvironmentInput): LocalErrors
   rollbackEnvironment(environment: LocalEnvironmentInput): LocalErrors
   cancelAutoStop(environment: LocalEnvironmentInput): LocalErrors
+  setEnvironmentToDelete(environment: LocalEnvironmentInput): LocalErrors
   setEnvironmentToRollback(environment: LocalEnvironmentInput): LocalErrors
 }