diff --git a/invenio.cfg b/invenio.cfg
index 8d134b45..cc00618b 100644
--- a/invenio.cfg
+++ b/invenio.cfg
@@ -51,6 +51,16 @@ APP_DEFAULT_SECURE_HEADERS = {
"blob:", # for pdf preview
# Add your own policies here (e.g. analytics)
],
+ "frame-src": [
+ "'self'",
+ "https://www.google.com/recaptcha/",
+ "https://recaptcha.google.com/recaptcha/",
+ ],
+ "script-src": [
+ "'self'",
+ "https://www.google.com/recaptcha/",
+ "https://www.gstatic.com/recaptcha/",
+ ],
},
'content_security_policy_report_only': False,
'content_security_policy_report_uri': None,
@@ -283,3 +293,6 @@ RDM_CUSTOM_FIELDS = [
# obo
RelationshipListCF(name='obo:RO_0002453'),
]
+
+# Google recaptcha client key
+RECAPTCHA_CLIENT_KEY = "CHANGE ME"
\ No newline at end of file
diff --git a/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/SupportForm.js b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/SupportForm.js
index ec970aaa..00fc7cb2 100644
--- a/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/SupportForm.js
+++ b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/SupportForm.js
@@ -5,11 +5,11 @@ import { Form as SemanticForm, Button, Modal } from "semantic-ui-react";
import { http, TextField, TextAreaField, ToggleField } from "react-invenio-forms";
import { remove, set } from "lodash";
import CategoryDropdown from "./CategoryDropdown";
+import ReCAPTCHA from "react-google-recaptcha";
import FileUploader from './FileUploader';
// TODO translations
// TODO implement error notification
-// TODO implement recaptcha
// TODO required fields are highlighted by the component and not Formik
const requestConfig = {
@@ -76,7 +76,7 @@ class SupportForm extends Component {
if (apiResponse) {
const apiErrors = apiResponse.errors || [];
const deserializedErrors = this.deserializeFieldErrors(apiErrors);
-
+
// Highlight errors using formik
formikBag.setErrors(deserializedErrors);
errorMessage = apiResponse.message || errorMessage;
@@ -87,7 +87,6 @@ class SupportForm extends Component {
}
}
-
render() {
const {
categories,
@@ -96,7 +95,8 @@ class SupportForm extends Component {
userBrowser,
userPlatform,
userMail,
- maxFileSize
+ maxFileSize,
+ recaptchaClientKey
} = this.props;
const defaultCategory = categories.length > 0 ? categories[0].key : '';
@@ -106,7 +106,8 @@ class SupportForm extends Component {
name: name,
category: defaultCategory,
sysInfo: false,
- files: []
+ files: [],
+ recaptcha: recaptchaClientKey ? false : true
}
const sysInfo = `Browser: ${userBrowser} Operating System: ${userPlatform}`;
@@ -202,7 +203,17 @@ class SupportForm extends Component {
-
+ {
+ recaptchaClientKey &&
+
+ {
+ setFieldValue('recaptcha', true);
+ }}
+ />
+
+ }