From 2121e67bd04c169d7e930bb23c8f4df2b48022b5 Mon Sep 17 00:00:00 2001
From: Sean McGivern <sean@mcgivern.me.uk>
Date: Fri, 8 Dec 2017 12:26:40 +0000
Subject: Merge branch
 '29483-no-feedback-when-checking-on-checklist-if-potential-spam-was-detected'
 into 'master'
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Resolve "No feedback when checking on checklist if potential spam was detected"

Closes #29483

See merge request gitlab-org/gitlab-ce!15408

(cherry picked from commit d32032de08585476c3b303803a307ff94d910ebd)

efc86c26 Mock spam?
8e9a9030 Merge remote-tracking branch 'origin/master' into…
019db0fd TEMP mock askismet spam check
11e51be6 respond_to json with json version of verify view in recaptcha_check_with_fallback
18955cdc Differentiate between spam related error and other update errors
9dcf093c Start recaptcha modal and render partial instead
64b13133 Append and remove api script when reCAPTCHA is needed
c9a67fab put-over-post the recaptcha form
cb22ae66 remove comments
20517d64 remove comments
e174d02e Review changes
7a7d4a2a Add spec
8f617b45 Added changelog
db3f1a47 Review changes
4d0c78de Add to tasklist
36ea921b Remove duplicate TaskList
6bffe620 Add app_spec for spam
d95350bc Finished specs
cf951cba FOR REVIEWERS
6c50e850 FOR MERGE
25931f73 Allow script src to be mockable
c3463e00 Merge remote-tracking branch 'origin/master' into…
2c170b8d fix eslint
a318c757 Fix redirect
8a02fbd0 BE review changes
dda03f4d Fix spec
910c7205 Fix spec
fafbd7e5 remove duplicate destroy
---
 .../vue_shared/components/popup_dialog.vue         |  6 +-
 .../vue_shared/components/recaptcha_dialog.vue     | 85 ++++++++++++++++++++++
 2 files changed, 89 insertions(+), 2 deletions(-)
 create mode 100644 app/assets/javascripts/vue_shared/components/recaptcha_dialog.vue

(limited to 'app/assets/javascripts/vue_shared/components')

diff --git a/app/assets/javascripts/vue_shared/components/popup_dialog.vue b/app/assets/javascripts/vue_shared/components/popup_dialog.vue
index 47efee64c6e..6d15bbd84ba 100644
--- a/app/assets/javascripts/vue_shared/components/popup_dialog.vue
+++ b/app/assets/javascripts/vue_shared/components/popup_dialog.vue
@@ -38,7 +38,8 @@ export default {
     },
     primaryButtonLabel: {
       type: String,
-      required: true,
+      required: false,
+      default: '',
     },
     submitDisabled: {
       type: Boolean,
@@ -113,8 +114,9 @@ export default {
             {{ closeButtonLabel }}
           </button>
           <button
+            v-if="primaryButtonLabel"
             type="button"
-            class="btn pull-right"
+            class="btn pull-right js-primary-button"
             :disabled="submitDisabled"
             :class="btnKindClass"
             @click="emitSubmit(true)">
diff --git a/app/assets/javascripts/vue_shared/components/recaptcha_dialog.vue b/app/assets/javascripts/vue_shared/components/recaptcha_dialog.vue
new file mode 100644
index 00000000000..3ec50f14eb4
--- /dev/null
+++ b/app/assets/javascripts/vue_shared/components/recaptcha_dialog.vue
@@ -0,0 +1,85 @@
+<script>
+import PopupDialog from './popup_dialog.vue';
+
+export default {
+  name: 'recaptcha-dialog',
+
+  props: {
+    html: {
+      type: String,
+      required: false,
+      default: '',
+    },
+  },
+
+  data() {
+    return {
+      script: {},
+      scriptSrc: 'https://www.google.com/recaptcha/api.js',
+    };
+  },
+
+  components: {
+    PopupDialog,
+  },
+
+  methods: {
+    appendRecaptchaScript() {
+      this.removeRecaptchaScript();
+
+      const script = document.createElement('script');
+      script.src = this.scriptSrc;
+      script.classList.add('js-recaptcha-script');
+      script.async = true;
+      script.defer = true;
+
+      this.script = script;
+
+      document.body.appendChild(script);
+    },
+
+    removeRecaptchaScript() {
+      if (this.script instanceof Element) this.script.remove();
+    },
+
+    close() {
+      this.removeRecaptchaScript();
+      this.$emit('close');
+    },
+
+    submit() {
+      this.$el.querySelector('form').submit();
+    },
+  },
+
+  watch: {
+    html() {
+      this.appendRecaptchaScript();
+    },
+  },
+
+  mounted() {
+    window.recaptchaDialogCallback = this.submit.bind(this);
+  },
+};
+</script>
+
+<template>
+<popup-dialog
+  kind="warning"
+  class="recaptcha-dialog js-recaptcha-dialog"
+  :hide-footer="true"
+  :title="__('Please solve the reCAPTCHA')"
+  @toggle="close"
+>
+  <div slot="body">
+    <p>
+      {{__('We want to be sure it is you, please confirm you are not a robot.')}}
+    </p>
+    <div
+      ref="recaptcha"
+      v-html="html"
+    ></div>
+  </div>
+</popup-dialog>
+</template>
-- 
cgit v1.2.3