diff options
Diffstat (limited to 'app/assets/javascripts/deploy_tokens/components/revoke_button.vue')
-rw-r--r-- | app/assets/javascripts/deploy_tokens/components/revoke_button.vue | 81 |
1 files changed, 81 insertions, 0 deletions
diff --git a/app/assets/javascripts/deploy_tokens/components/revoke_button.vue b/app/assets/javascripts/deploy_tokens/components/revoke_button.vue new file mode 100644 index 00000000000..e026391ae22 --- /dev/null +++ b/app/assets/javascripts/deploy_tokens/components/revoke_button.vue @@ -0,0 +1,81 @@ +<script> +import { GlButton, GlModal, GlModalDirective, GlSprintf } from '@gitlab/ui'; + +export default { + components: { + GlModal, + GlSprintf, + GlButton, + }, + directives: { + GlModal: GlModalDirective, + }, + inject: { + token: { + default: null, + }, + revokePath: { + default: '', + }, + buttonClass: { + default: '', + }, + }, + computed: { + modalId() { + return `revoke-modal-${this.token.id}`; + }, + }, + methods: { + cancelHandler() { + this.$refs.modal.hide(); + }, + }, +}; +</script> + +<template> + <div> + <gl-button + v-gl-modal="modalId" + :class="buttonClass" + category="primary" + variant="danger" + class="float-right" + data-testid="revoke-button" + >{{ s__('DeployTokens|Revoke') }}</gl-button + > + <gl-modal ref="modal" :modal-id="modalId"> + <template #modal-title> + <gl-sprintf :message="s__(`DeployTokens|Revoke %{boldStart}${token.name}%{boldEnd}?`)"> + <template #bold="{ content }" + ><b>{{ content }}</b></template + > + </gl-sprintf> + </template> + <gl-sprintf + :message="s__(`DeployTokens|You are about to revoke %{boldStart}${token.name}%{boldEnd}.`)" + > + <template #bold="{ content }"> + <b>{{ content }}</b> + </template> + </gl-sprintf> + {{ s__('DeployTokens|This action cannot be undone.') }} + <template #modal-footer> + <gl-button category="secondary" @click="cancelHandler">{{ s__('Cancel') }}</gl-button> + <gl-button + category="primary" + variant="danger" + :href="revokePath" + data-method="put" + class="text-truncate" + data-testid="primary-revoke-btn" + > + <gl-sprintf :message="s__('DeployTokens|Revoke %{name}')"> + <template #name>{{ token.name }}</template> + </gl-sprintf> + </gl-button> + </template> + </gl-modal> + </div> +</template> |