Move captcha field to the end.

frontend/packages/volto-form-block/src/index.js

@@ -35,7 +35,9 @@ import {
 import { schemaFormBlockSchema } from 'volto-form-block/schemaFormBlock/schema';
 import schemaFormBlockEdit from 'volto-form-block/schemaFormBlock/EditSchemaForm';
 import schemaFormBlockView from 'volto-form-block/schemaFormBlock/ViewSchemaForm';
-import HoneypotCaptchaWidget from 'volto-form-block/schemaFormBlock/HoneypotCaptchaWidget';
+
+import HoneypotCaptchaWidget from 'volto-form-block/schemaFormBlock/Widgets/HoneypotCaptchaWidget';
+import NorobotsCaptchaWidget from 'volto-form-block/schemaFormBlock/Widgets/NorobotsCaptchaWidget';
 
 export {
   submitForm,
@@ -78,6 +80,7 @@ defineMessages({
 
 const applyConfig = (config) => {
   config.widgets.widget.honeypot = HoneypotCaptchaWidget;
+  config.widgets.widget['norobots-captcha'] = NorobotsCaptchaWidget;
 
   config.blocks.blocksConfig = {
     ...config.blocks.blocksConfig,

frontend/packages/volto-form-block/src/schemaFormBlock/ViewSchemaForm.jsx

@@ -8,7 +8,7 @@ import { toast } from 'react-toastify';
 import { Toast } from '@plone/volto/components';
 import { useLocation } from 'react-router-dom';
 import qs from 'query-string';
-import { includes, keys, pickBy } from 'lodash';
+import { includes, keys, map, pickBy, without } from 'lodash';
 import config from '@plone/volto/registry';
 
 const messages = defineMessages({
@@ -88,7 +88,15 @@ const FormBlockView = ({ data, id, properties, metadata, path }) => {
         <p className="documentDescription">{data.description}</p>
       )}
       <Form
-        schema={data.schema}
+        schema={{
+          ...data.schema,
+          fieldsets: map(data.schema.fieldsets, (fieldset) => ({
+            ...fieldset,
+            fields: includes(fieldset.fields, 'captchaWidget')
+              ? [...without(fieldset.fields, 'captchaWidget'), 'captchaWidget']
+              : fieldset.fields,
+          })),
+        }}
         formData={initialData}
         onSubmit={onSubmit}
         resetOnCancel={true}

frontend/packages/volto-form-block/src/schemaFormBlock/HoneypotCaptchaWidget.jsx → frontend/packages/volto-form-block/src/schemaFormBlock/Widgets/HoneypotCaptchaWidget.jsx

@@ -19,7 +19,9 @@ const HoneypotCaptchaWidget = ({ id, value, onChange, captcha_props }) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  return (
+  return onEdit ? (
+    <></>
+  ) : (
     <div className="honey-wrapper2" key={'honeypot-captcha'}>
       <TextWidget
         id={captcha_props.id}

frontend/packages/volto-form-block/src/schemaFormBlock/Widgets/NorobotsCaptchaWidget.jsx

@@ -0,0 +1,59 @@
+import { useEffect, useRef } from 'react';
+import PropTypes from 'prop-types';
+
+const NorobotsCaptchaWidget = (props) => {
+  const {
+    id,
+    value,
+    onChange,
+    onBlur,
+    onClick,
+    icon,
+    iconAction,
+    isDisabled,
+    focus,
+    onEdit,
+  } = props;
+
+  return onEdit ? <></> : <></>;
+};
+
+export default NorobotsCaptchaWidget;
+
+NorobotsCaptchaWidget.propTypes = {
+  id: PropTypes.string.isRequired,
+  title: PropTypes.string.isRequired,
+  description: PropTypes.string,
+  required: PropTypes.bool,
+  error: PropTypes.arrayOf(PropTypes.string),
+  value: PropTypes.string,
+  focus: PropTypes.bool,
+  onChange: PropTypes.func,
+  onBlur: PropTypes.func,
+  onClick: PropTypes.func,
+  onEdit: PropTypes.func,
+  onDelete: PropTypes.func,
+  icon: PropTypes.shape({
+    xmlns: PropTypes.string,
+    viewBox: PropTypes.string,
+    content: PropTypes.string,
+  }),
+  iconAction: PropTypes.func,
+  wrapped: PropTypes.bool,
+  placeholder: PropTypes.string,
+};
+
+NorobotsCaptchaWidget.defaultProps = {
+  description: null,
+  required: false,
+  error: [],
+  value: null,
+  onChange: () => {},
+  onBlur: () => {},
+  onClick: () => {},
+  onEdit: null,
+  onDelete: null,
+  focus: false,
+  icon: null,
+  iconAction: null,
+};