diff --git a/frontend/src/Editor/Components/Form/Form.jsx b/frontend/src/Editor/Components/Form/Form.jsx
index 09a8daf64c..b7441409a3 100644
--- a/frontend/src/Editor/Components/Form/Form.jsx
+++ b/frontend/src/Editor/Components/Form/Form.jsx
@@ -80,7 +80,7 @@ export const Form = function Form(props) {
};
setExposedVariables(exposedVariables);
// eslint-disable-next-line react-hooks/exhaustive-deps
- }, [isValid]);
+ }, [isValid, formEvents]);
const extractData = (data) => {
const result = {};
@@ -183,7 +183,7 @@ export const Form = function Form(props) {
document.addEventListener('submitForm', handleFormSubmission);
return () => document.removeEventListener('submitForm', handleFormSubmission);
// eslint-disable-next-line react-hooks/exhaustive-deps
- }, [buttonToSubmit, isValid, advanced, JSON.stringify(uiComponents)]);
+ }, [buttonToSubmit, isValid, advanced, JSON.stringify(uiComponents), formEvents]);
const handleSubmit = (event) => {
event.preventDefault();
diff --git a/frontend/src/Editor/ControlledComponentToRender.jsx b/frontend/src/Editor/ControlledComponentToRender.jsx
index c491a05fee..b93d772683 100644
--- a/frontend/src/Editor/ControlledComponentToRender.jsx
+++ b/frontend/src/Editor/ControlledComponentToRender.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState, useCallback } from 'react';
import { getComponentToRender } from '@/_helpers/editorHelpers';
import _ from 'lodash';
@@ -36,9 +36,18 @@ export const shouldUpdate = (prevProps, nextProps) => {
};
const ComponentWrapper = React.memo(({ componentName, ...props }) => {
+ const [key, setKey] = useState(Math.random());
+
+ const resetComponent = useCallback(() => {
+ setKey(Math.random());
+ }, []);
+
const ComponentToRender = getComponentToRender(componentName);
if (ComponentToRender === null) return;
+ if (componentName === 'Form') {
+ return ;
+ }
return ;
}, shouldUpdate);