diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-10-21 18:10:28 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-10-21 18:10:28 +0300 |
commit | 63324f9cfd863cda2f717835efc933cdd5ade792 (patch) | |
tree | 65717323c2d3f1f35ebff2441823f16aa9e27eb0 /app/assets/javascripts/profile | |
parent | 4944e9e5a9a3f57998c5033b10cdfa2975b71227 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/profile')
-rw-r--r-- | app/assets/javascripts/profile/account/components/update_username.vue | 44 |
1 files changed, 30 insertions, 14 deletions
diff --git a/app/assets/javascripts/profile/account/components/update_username.vue b/app/assets/javascripts/profile/account/components/update_username.vue index 200e5ba255f..5feac7485ad 100644 --- a/app/assets/javascripts/profile/account/components/update_username.vue +++ b/app/assets/javascripts/profile/account/components/update_username.vue @@ -1,17 +1,19 @@ <script> -/* eslint-disable vue/no-v-html */ import { escape } from 'lodash'; -import { GlButton } from '@gitlab/ui'; +import { GlSafeHtmlDirective as SafeHtml, GlButton, GlModal, GlModalDirective } from '@gitlab/ui'; import axios from '~/lib/utils/axios_utils'; -import DeprecatedModal2 from '~/vue_shared/components/deprecated_modal_2.vue'; import { s__, sprintf } from '~/locale'; import { deprecatedCreateFlash as Flash } from '~/flash'; export default { components: { - GlModal: DeprecatedModal2, + GlModal, GlButton, }, + directives: { + GlModalDirective, + SafeHtml, + }, props: { actionUrl: { type: String, @@ -54,6 +56,21 @@ Please update your Git repository remotes as soon as possible.`), false, ); }, + primaryProps() { + return { + text: s__('Update username'), + attributes: [ + { variant: 'warning' }, + { category: 'primary' }, + { disabled: this.isRequestPending }, + ], + }; + }, + cancelProps() { + return { + text: s__('Cancel'), + }; + }, }, methods: { onConfirm() { @@ -103,22 +120,21 @@ Please update your Git repository remotes as soon as possible.`), <p class="form-text text-muted">{{ path }}</p> </div> <gl-button - :data-target="`#${$options.modalId}`" + v-gl-modal-directive="$options.modalId" :disabled="isRequestPending || newUsername === username" category="primary" variant="warning" - data-toggle="modal" + data-testid="username-change-confirmation-modal" + >{{ $options.buttonText }}</gl-button > - {{ $options.buttonText }} - </gl-button> <gl-modal - :id="$options.modalId" - :header-title-text="s__('Profiles|Change username') + '?'" - :footer-primary-button-text="$options.buttonText" - footer-primary-button-variant="warning" - @submit="onConfirm" + :modal-id="$options.modalId" + :title="s__('Profiles|Change username') + '?'" + :action-primary="primaryProps" + :action-cancel="cancelProps" + @primary="onConfirm" > - <span v-html="modalText"></span> + <span v-safe-html="modalText"></span> </gl-modal> </div> </template> |