Rename recaptcha-dialog to recaptcha-modal

app/assets/javascripts/issue_show/components/app.vue

@@ -9,7 +9,7 @@ import titleComponent from './title.vue';
 import descriptionComponent from './description.vue';
 import editedComponent from './edited.vue';
 import formComponent from './form.vue';
-import RecaptchaDialogImplementor from '../../vue_shared/mixins/recaptcha_dialog_implementor';
+import recaptchaModalImplementor from '../../vue_shared/mixins/recaptcha_modal_implementor';
 export default {
   props: {
@@ -152,7 +152,7 @@ export default {
   },
   mixins: [
-    RecaptchaDialogImplementor,
+    recaptchaModalImplementor,
   ],
   methods: {
@@ -197,7 +197,7 @@ export default {
         });
     },
-    closeRecaptchaDialog() {
+    closeRecaptchaModal() {
       this.store.setFormState({
         updateLoading: false,
       });
@@ -273,10 +273,10 @@ export default {
       :enable-autocomplete="enableAutocomplete"
     />
-    <recaptcha-dialog
+    <recaptcha-modal
       v-show="showRecaptcha"
       :html="recaptchaHTML"
-      @close="closeRecaptchaDialog"
+      @close="closeRecaptchaModal"
     />
   </div>
   <div v-else>

app/assets/javascripts/issue_show/components/description.vue

 <script>
   import animateMixin from '../mixins/animate';
   import TaskList from '../../task_list';
-  import RecaptchaDialogImplementor from '../../vue_shared/mixins/recaptcha_dialog_implementor';
+  import recaptchaModalImplementor from '../../vue_shared/mixins/recaptcha_modal_implementor';
   export default {
     mixins: [
       animateMixin,
-      RecaptchaDialogImplementor,
+      recaptchaModalImplementor,
     ],
     props: {
@@ -126,7 +126,7 @@
     >
     </textarea>
-    <recaptcha-dialog
+    <recaptcha-modal
       v-show="showRecaptcha"
       :html="recaptchaHTML"
       @close="closeRecaptcha"

app/assets/javascripts/vue_shared/components/recaptcha_dialog.vue → app/assets/javascripts/vue_shared/components/recaptcha_modal.vue

@@ -2,7 +2,7 @@
 import modal from './modal.vue';
 export default {
-  name: 'recaptcha-dialog',
+  name: 'recaptcha-modal',
   props: {
     html: {
@@ -67,7 +67,7 @@ export default {
 <template>
 <modal
   kind="warning"
-  class="recaptcha-dialog js-recaptcha-dialog"
+  class="recaptcha-modal js-recaptcha-modal"
   :hide-footer="true"
   :title="__('Please solve the reCAPTCHA')"
   @toggle="close"

app/assets/javascripts/vue_shared/mixins/recaptcha_dialog_implementor.js → app/assets/javascripts/vue_shared/mixins/recaptcha_modal_implementor.js

-import RecaptchaDialog from '../components/recaptcha_dialog.vue';
+import recaptchaModal from '../components/recaptcha_modal.vue';
 export default {
   data() {
@@ -9,7 +9,7 @@ export default {
   },
   components: {
-    RecaptchaDialog,
+    recaptchaModal,
   },
   methods: {

app/assets/stylesheets/framework/modal.scss

@@ -55,7 +55,7 @@ body.modal-open {
   }
 }
-.recaptcha-dialog .recaptcha-form {
+.recaptcha-modal .recaptcha-form {
   display: inline-block;
   .recaptcha {

spec/javascripts/issue_show/components/app_spec.js

@@ -272,10 +272,10 @@ describe('Issuable output', () => {
     });
   });
-  it('opens recaptcha dialog if update rejected as spam', (done) => {
+  it('opens recaptcha modal if update rejected as spam', (done) => {
     function mockScriptSrc() {
       const recaptchaChild = vm.$children
-        .find(child => child.$options._componentTag === 'recaptcha-dialog'); // eslint-disable-line no-underscore-dangle
+        .find(child => child.$options._componentTag === 'recaptcha-modal'); // eslint-disable-line no-underscore-dangle
       recaptchaChild.scriptSrc = '//scriptsrc';
     }
@@ -302,7 +302,7 @@ describe('Issuable output', () => {
       .then(promise)
       .then(() => setTimeoutPromise())
       .then(() => {
-        modal = vm.$el.querySelector('.js-recaptcha-dialog');
+        modal = vm.$el.querySelector('.js-recaptcha-modal');
         expect(modal.style.display).not.toEqual('none');
         expect(modal.querySelector('.g-recaptcha').textContent).toEqual('recaptcha_html');

spec/javascripts/issue_show/components/description_spec.js

@@ -54,7 +54,7 @@ describe('Description component', () => {
   it('opens recaptcha dialog if update rejected as spam', (done) => {
     let modal;
     const recaptchaChild = vm.$children
-      .find(child => child.$options._componentTag === 'recaptcha-dialog'); // eslint-disable-line no-underscore-dangle
+      .find(child => child.$options._componentTag === 'recaptcha-modal'); // eslint-disable-line no-underscore-dangle
     recaptchaChild.scriptSrc = '//scriptsrc';
@@ -64,7 +64,7 @@ describe('Description component', () => {
     vm.$nextTick()
       .then(() => {
-        modal = vm.$el.querySelector('.js-recaptcha-dialog');
+        modal = vm.$el.querySelector('.js-recaptcha-modal');
         expect(modal.style.display).not.toEqual('none');
         expect(modal.querySelector('.g-recaptcha').textContent).toEqual('recaptcha_html');