diff --git a/app/controllers/api/payment/braintree_controller.rb b/app/controllers/api/payment/braintree_controller.rb
index 484e81d5d..abbdd9f0c 100644
--- a/app/controllers/api/payment/braintree_controller.rb
+++ b/app/controllers/api/payment/braintree_controller.rb
@@ -92,7 +92,7 @@ def valid_user?(user)
def verify_bot
action = 'donate/' + params[:page_id]
- @captcha = Recaptcha3.new(token: params[:recaptacha_token], action: action)
+ @captcha = Recaptcha3.new(token: params[:recaptcha_token], action: action)
unless @captcha.human?
msg = @captcha.errors.present? ? @captcha.errors : 'Invalid request'
diff --git a/app/javascript/components/DonationBands/__snapshots__/DonationBands.test.js.snap b/app/javascript/components/DonationBands/__snapshots__/DonationBands.test.js.snap
index 7c1bb9530..10b7836a8 100644
--- a/app/javascript/components/DonationBands/__snapshots__/DonationBands.test.js.snap
+++ b/app/javascript/components/DonationBands/__snapshots__/DonationBands.test.js.snap
@@ -202,6 +202,7 @@ Thanks so much for everything you do!",
"petition.sign_it": "Sign the petition",
"petition.target_prefix": "TO",
"petition.thank_you": "Thanks for adding your name to \\"{petition_title}\\"",
+ "recaptcha_branding_html": "This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.",
"recommend_pages.actions": "{action_count} actions",
"recommend_pages.learn_more": "learn more",
"recommend_pages.recommend_pages_title": "Here are other similar campaigns we need your support on!",
@@ -645,6 +646,7 @@ Thanks so much for everything you do!",
"petition.sign_it": "Sign the petition",
"petition.target_prefix": "TO",
"petition.thank_you": "Thanks for adding your name to \\"{petition_title}\\"",
+ "recaptcha_branding_html": "This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.",
"recommend_pages.actions": "{action_count} actions",
"recommend_pages.learn_more": "learn more",
"recommend_pages.recommend_pages_title": "Here are other similar campaigns we need your support on!",
diff --git a/app/javascript/components/Payment/Payment.css b/app/javascript/components/Payment/Payment.css
index f8726034b..3ffeb5b68 100644
--- a/app/javascript/components/Payment/Payment.css
+++ b/app/javascript/components/Payment/Payment.css
@@ -46,6 +46,10 @@
padding-bottom: 15px;
}
+.Payment__fine-print .ReCaptchaBranding {
+ margin-top: 5px;
+}
+
.Payment .gpay-button {
width: 100%;
height: 60px;
@@ -91,8 +95,8 @@
box-shadow: none;
}
-@media(max-width: 700px) {
+@media (max-width: 700px) {
.PaymentExpressDonationConflict {
width: 100%;
}
-}
\ No newline at end of file
+}
diff --git a/app/javascript/components/Payment/Payment.js b/app/javascript/components/Payment/Payment.js
index 2f78ec1ed..38b413221 100644
--- a/app/javascript/components/Payment/Payment.js
+++ b/app/javascript/components/Payment/Payment.js
@@ -6,6 +6,7 @@ import braintreeClient from 'braintree-web/client';
import dataCollector from 'braintree-web/data-collector';
import { isEmpty } from 'lodash';
import ee from '../../shared/pub_sub';
+import captcha from '../../shared/recaptcha';
import PayPal from '../Braintree/PayPal';
import BraintreeCardFields from '../Braintree/BraintreeCardFields';
@@ -14,6 +15,7 @@ import WelcomeMember from '../WelcomeMember/WelcomeMember';
import DonateButton from '../DonateButton';
import Checkbox from '../Checkbox/Checkbox';
import ShowIf from '../ShowIf';
+import ReCaptchaBranding from '../ReCaptchaBranding';
import { resetMember } from '../../state/member/reducer';
import {
changeStep,
@@ -26,7 +28,6 @@ import ExpressDonation from '../ExpressDonation/ExpressDonation';
// Styles
import './Payment.css';
-const RECAPTCHA_SITE_KEY = window.champaign.configuration.recaptcha3.siteKey;
const BRAINTREE_TOKEN_URL =
process.env.BRAINTREE_TOKEN_URL || '/api/payment/braintree/token';
@@ -48,7 +49,6 @@ export class Payment extends Component {
},
errors: [],
waitingForGoCardless: false,
- recaptacha_token: null,
};
}
@@ -85,27 +85,8 @@ export class Payment extends Component {
console.warn('could not fetch Braintree token');
});
this.bindGlobalEvents();
- if (RECAPTCHA_SITE_KEY) this.loadReCaptcha();
}
- loadReCaptcha() {
- try {
- grecaptcha
- .execute(RECAPTCHA_SITE_KEY, { action: `donate/${this.props.page.id}` })
- .then(
- token => {
- this.setState({
- recaptacha_token: token,
- });
- },
- error => {
- console.warn('Error fetching recaptcha token ', error);
- }
- );
- } catch (error) {
- console.warn('Error trying to execute grecaptcha.', error);
- }
- }
bindGlobalEvents() {
ee.on('fundraiser:actions:make_payment', this.makePayment);
}
@@ -252,13 +233,16 @@ export class Payment extends Component {
}
};
- submit = data => {
+ submit = async data => {
+ const recaptcha_action = `donate/${this.props.page.id}`;
+ const recaptcha_token = await captcha.execute({ action: recaptcha_action });
+
const payload = {
...this.donationData(),
payment_method_nonce: data.nonce,
device_data: this.state.deviceData,
- recaptacha_token: this.state.recaptacha_token,
- recaptacha_action: `donate/${this.props.page.id}`,
+ recaptcha_token,
+ recaptcha_action,
};
this.emitTransactionSubmitted();
@@ -327,7 +311,6 @@ export class Payment extends Component {
} else {
errors = [
+
Nous demandons aux membres SumOfUs de confirmer qu’ils/elles souhaitent toujours recevoir nos courriels à ce sujet et concernant d’autres campagnes urgentes.
Souhaitez-vous confirmer aujourd’hui?
" decline: "Pas maintenant" accept: "Oui" - cookie_consent: message: 'Les cookies sont importants pour le bon fonctionnement de notre site.' dismiss_button_text: 'Accepter et continuer' privacy_policy_link_text: 'Mentions Légales' + recaptcha_branding_html: "Ce site est protégé par reCAPTCHA. Les règles de confidentialité et les conditions d'utilisation de Google s'appliquent." \ No newline at end of file