1 files changed, 3 insertions, 19 deletions
diff --git a/app/assets/javascripts/vue_shared/components/runner_instructions/runner_instructions.vue b/app/assets/javascripts/vue_shared/components/runner_instructions/runner_instructions.vue
index 5d144c0d699..06852f511bf 100644
--- a/app/assets/javascripts/vue_shared/components/runner_instructions/runner_instructions.vue
+++ b/app/assets/javascripts/vue_shared/components/runner_instructions/runner_instructions.vue
@@ -9,35 +9,19 @@ export default {
     RunnerInstructionsModal,
   },
   directives: {
-    GlModalDirective,
+    GlModal: GlModalDirective,
   },
   modalId: 'runner-instructions-modal',
   i18n: {
     buttonText: s__('Runners|Show runner installation instructions'),
   },
-  data() {
-    return {
-      opened: false,
-    };
-  },
-  methods: {
-    onClick() {
-      // lazily mount modal to prevent premature instructions requests
-      this.opened = true;
-    },
-  },
 };
 </script>
 <template>
   <div>
-    <gl-button
-      v-gl-modal-directive="$options.modalId"
-      class="gl-mt-4"
-      data-testid="show-modal-button"
-      @click="onClick"
-    >
+    <gl-button v-gl-modal="$options.modalId" class="gl-mt-4" data-testid="show-modal-button">
       {{ $options.i18n.buttonText }}
     </gl-button>
-    <runner-instructions-modal v-if="opened" :modal-id="$options.modalId" />
+    <runner-instructions-modal :modal-id="$options.modalId" />
   </div>
 </template>