diff --git a/src/components/Field.jsx b/src/components/Field.jsx
index 9eb8916..3c18033 100644
--- a/src/components/Field.jsx
+++ b/src/components/Field.jsx
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
import { useIntl, defineMessages } from 'react-intl';
import WysiwygWidget from '@plone/volto/components/manage/Widgets/WysiwygWidget';
-
import EmailWidget from './Widget/EmailWidget';
import FileWidget from './Widget/FileWidget';
import DatetimeWidget from './Widget/DatetimeWidget';
diff --git a/src/components/View.jsx b/src/components/View.jsx
index de33449..dbd45f8 100644
--- a/src/components/View.jsx
+++ b/src/components/View.jsx
@@ -137,10 +137,13 @@ const View = ({ data, id, path }) => {
.then(() => {
if (isValidForm()) {
let attachments = {};
- const captcha = {
+ let captcha = {
provider: data.captcha,
token: captchaToken.current,
};
+ if (data.captcha === 'honeypot') {
+ captcha.value = formData[data.captcha_props.id]?.value ?? '';
+ }
let formattedFormData = { ...formData };
data.subblocks.forEach((subblock) => {
@@ -194,6 +197,7 @@ const View = ({ data, id, path }) => {
captchaToken,
captcha: data.captcha,
captcha_props: data.captcha_props,
+ onChangeFormData,
});
useEffect(() => {
diff --git a/src/components/Widget/Captcha.jsx b/src/components/Widget/Captcha.jsx
index c5421ac..b9119cd 100644
--- a/src/components/Widget/Captcha.jsx
+++ b/src/components/Widget/Captcha.jsx
@@ -2,6 +2,7 @@ import React, { createRef } from 'react';
import GoogleReCaptchaWidget from './GoogleReCaptchaWidget';
import HCaptchaWidget from './HCaptchaWidget';
import NoRobotsCaptchaWidget from './NoRobotsCaptchaWidget';
+import HoneypotCaptchaWidget from './HoneypotCaptchaWidget';
class Captcha extends React.Component {
constructor(props) {
@@ -39,7 +40,13 @@ class Captcha extends React.Component {
}
render() {
- const { captchaToken, captcha, captcha_props } = this.props;
+ const {
+ captchaToken,
+ captcha,
+ captcha_props,
+ onChangeFormData,
+ } = this.props;
+
const captchaRef = this.captchaRef;
if (captcha === 'recaptcha') {
return (
@@ -77,6 +84,16 @@ class Captcha extends React.Component {
captchaToken={captchaToken}
>
);
+ } else if (captcha === 'honeypot') {
+ return (
+
+ );
} else {
return null;
}
diff --git a/src/components/Widget/HoneypotCaptchaWidget.css b/src/components/Widget/HoneypotCaptchaWidget.css
new file mode 100644
index 0000000..bf44dcb
--- /dev/null
+++ b/src/components/Widget/HoneypotCaptchaWidget.css
@@ -0,0 +1,3 @@
+.public-ui .ui.grid > .row.honey-wrapper {
+ display: none;
+}
diff --git a/src/components/Widget/HoneypotCaptchaWidget.jsx b/src/components/Widget/HoneypotCaptchaWidget.jsx
new file mode 100644
index 0000000..92d31b6
--- /dev/null
+++ b/src/components/Widget/HoneypotCaptchaWidget.jsx
@@ -0,0 +1,62 @@
+/**
+ * HoneypotCaptchaWidget component.
+ * @module components/manage/Widgets/HoneypotCaptchaWidget
+ */
+
+import React, { useState, useEffect } from 'react';
+
+import TextWidget from '@plone/volto/components/manage/Widgets/TextWidget';
+import { Grid } from 'semantic-ui-react';
+import './HoneypotCaptchaWidget.css';
+
+/**
+ * HoneypotCaptchaWidget component class.
+ * @function HoneypotCaptchaWidget
+ * @returns {string} Markup of the component.
+ */
+
+/*By default, captcha token is setted, and becames empty if user/bot fills the field.
+ */
+const HoneypotCaptchaWidget = ({
+ id,
+ title,
+ captchaToken,
+ onChangeFormData,
+}) => {
+ const createToken = (id, value) => {
+ const token = {
+ id: id,
+ value: value,
+ };
+ return JSON.stringify(token);
+ };
+
+ useEffect(() => {
+ captchaToken.current = createToken(id, new Date().toString());
+ }, [captchaToken, id]);
+
+ useEffect(() => {
+ onChangeFormData(id, id, '', { label: id });
+ }, []);
+
+ const [value, setValue] = useState();
+ return (
+
+ {
+ //captchaToken.current = createToken(id, value);
+ captchaToken.current = undefined;
+ setValue(value);
+ onChangeFormData(id, field, value, {});
+ }}
+ value={value}
+ />
+
+ );
+};
+
+export default HoneypotCaptchaWidget;