1682 Removes reset and cancel button overrides. Removes form history cache when a form flow is finished

Author: ricardovdheijden

frontend/apps/example/src/app/page.tsx

@@ -53,14 +53,6 @@ export default function Home() {
         });
     };
 
-    const ResetButtonAlternative = () => (
-        <button type="button">Alternative reset</button>
-    );
-
-    const CancelButtonAlternative = () => (
-        <button type="button">Alternative cancel</button>
-    );
-
     const componentMatcher = (
         currentMatchers: PydanticComponentMatcher[],
     ): PydanticComponentMatcher[] => {
@@ -98,8 +90,6 @@ export default function Home() {
                     apiProvider: pydanticFormApiProvider,
                     labelProvider: pydanticLabelProvider,
                     customDataProvider: pydanticCustomDataProvider,
-                    resetButtonAlternative: ResetButtonAlternative(),
-                    cancelButton: CancelButtonAlternative(),
                     componentMatcher: componentMatcher,
                 }}
             />

frontend/apps/example/src/fields/TextArea.tsx

@@ -16,7 +16,7 @@ export const TextArea: PydanticFormControlledElement = ({
 }: PydanticFormControlledElementProps) => {
     return (
         <textarea
-            defaultValue={value}
+            value={value}
             onChange={(e) => onChange(e.target.value)}
             style={{
                 width: '450px',

frontend/package.json

@@ -1,7 +1,7 @@
 {
     "private": true,
     "scripts": {
-        "dev": "turbo dev --filter=example",
+        "dev": "turbo dev",
         "test": "turbo test",
         "tsc": "turbo run tsc",
         "lint": "turbo lint",

frontend/packages/pydantic-forms/src/components/form/Footer.tsx

@@ -39,7 +39,6 @@ const Footer = () => {
                         onClick={(e) => {
                             resetForm(e);
                         }}
-                        disabled={!rhf.formState.isDirty}
                         style={{ padding: '4px' }}
                     >
                         Reset

frontend/packages/pydantic-forms/src/core/PydanticFormContextProvider.tsx

@@ -103,15 +103,10 @@ function PydanticFormContextProvider({
 
     const updateHistory = async (formInput: object, previousSteps: object[]) => {
         const hashOfPreviousSteps = await getHashForArray(previousSteps);
-
-        console.log('Saving combination', {hashOfPreviousSteps, formInput})
-
         setFormInputHistory((prevState) => prevState.set(hashOfPreviousSteps, formInput));
-
     }
 
     const goToPreviousStep = (formInput: object) => {
-        console.log('Going back one step');
         setFormInputData((prevState) => {
             updateHistory(formInput, prevState)
             return prevState.slice(0, -1);
@@ -120,7 +115,6 @@ function PydanticFormContextProvider({
 
     const addFormInputData = (formInput: object) => {
         setFormInputData((currentInputs) => {
-            console.log('addFormInputData', { formInput, currentInputs });
             updateHistory(formInput, currentInputs)
             return [...currentInputs, formInput];
         });
@@ -220,6 +214,7 @@ function PydanticFormContextProvider({
             }
         }
 
+        setFormInputHistory(new Map<string, object>());
         rhf.reset();
     }, [apiResponse, isFullFilled, onSuccess, rhf, skipSuccessNotice]);
 
@@ -267,12 +262,13 @@ function PydanticFormContextProvider({
             const currentStepFromHistory = formInputHistory.get(hash);
 
             if(currentStepFromHistory) {
-                console.log('Found history', {currentStepFromHistory})
-
-                Object.entries(currentStepFromHistory).forEach(([fieldName, fieldValue]) => {
-                    console.log('forEach loop:', {fieldName, fieldValue})
-                    rhf.setValue(fieldName, fieldValue, { shouldDirty: true, shouldTouch: true, shouldValidate: true });
-                })
+                Object.entries(currentStepFromHistory)
+                    .forEach(([fieldName, fieldValue]) => rhf.setValue(fieldName, fieldValue, {
+                        shouldDirty: true,
+                        shouldTouch: true,
+                        shouldValidate: true
+                    }
+                ))
             }
         })
     }, [resetFormData]);
@@ -313,6 +309,7 @@ function PydanticFormContextProvider({
 
     const resetForm = useCallback(
         (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
+            // todo reset the history for the current page -- clear all and jump to step 1
             e.preventDefault();
             resetFormData();
             setErrorDetails(undefined);