1 files changed, 14 insertions, 1 deletions
diff --git a/app/assets/javascripts/environments/components/environment_pin.vue b/app/assets/javascripts/environments/components/environment_pin.vue
index 0b753d53ee3..f5a83b97552 100644
--- a/app/assets/javascripts/environments/components/environment_pin.vue
+++ b/app/assets/javascripts/environments/components/environment_pin.vue
@@ -6,6 +6,7 @@
 import { GlDropdownItem } from '@gitlab/ui';
 import { __ } from '~/locale';
 import eventHub from '../event_hub';
+import cancelAutoStopMutation from '../graphql/mutations/cancel_auto_stop.mutation.graphql';
 
 export default {
   components: {
@@ -16,10 +17,22 @@ export default {
       type: String,
       required: true,
     },
+    graphql: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
   },
   methods: {
     onPinClick() {
-      eventHub.$emit('cancelAutoStop', this.autoStopUrl);
+      if (this.graphql) {
+        this.$apollo.mutate({
+          mutation: cancelAutoStopMutation,
+          variables: { autoStopUrl: this.autoStopUrl },
+        });
+      } else {
+        eventHub.$emit('cancelAutoStop', this.autoStopUrl);
+      }
     },
   },
   title: __('Prevent auto-stopping'),