Ensure event listener is only bound once (#9)

laravel · Jun 5, 2023 · 13fe572 · 13fe572
1 parent 1018801
commit 13fe572
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 13 deletions.
diff --git a/packages/react-inertia/package.json b/packages/react-inertia/package.json
@@ -28,7 +28,8 @@
         "node": ">=14"
     },
     "peerDependencies": {
-        "@inertiajs/react": "^1.0.0"
+        "@inertiajs/react": "^1.0.0",
+        "react": "^18.0.0"
     },
     "dependencies": {
         "laravel-precognition": "^0.2.0",

diff --git a/packages/react-inertia/src/index.ts b/packages/react-inertia/src/index.ts
@@ -1,8 +1,11 @@
 import { Config, NamedInputEvent, RequestMethod, SimpleValidationErrors, toSimpleValidationErrors, ValidationConfig, ValidationErrors } from 'laravel-precognition'
 import { useForm as usePrecognitiveForm } from 'laravel-precognition-react'
 import { useForm as useInertiaForm } from '@inertiajs/react'
+import { useRef } from 'react'
 
 export const useForm = <Data extends Record<string, unknown>>(method: RequestMethod, url: string, inputs: Data, config: ValidationConfig = {}): any => {
+    const booted = useRef<boolean>(false)
+
     /**
      * The Inertia form.
      */
@@ -13,18 +16,6 @@ export const useForm = <Data extends Record<string, unknown>>(method: RequestMet
      */
     const precognitiveForm = usePrecognitiveForm(method, url, inputs, config)
 
-    /**
-     * Setup event listeners.
-     */
-    precognitiveForm.validator().on('errorsChanged', () => {
-        inertiaClearErrors()
-
-        inertiaSetError(
-            // @ts-expect-error
-            toSimpleValidationErrors(precognitiveForm.validator().errors())
-        )
-    })
-
     /**
      * The Inertia submit function.
      */
@@ -50,6 +41,22 @@ export const useForm = <Data extends Record<string, unknown>>(method: RequestMet
      */
     const inertiaSetData = inertiaForm.setData.bind(inertiaForm)
 
+    if (! booted.current) {
+        /**
+         * Setup event listeners.
+         */
+        precognitiveForm.validator().on('errorsChanged', () => {
+            inertiaClearErrors()
+
+            inertiaSetError(
+                // @ts-expect-error
+                toSimpleValidationErrors(precognitiveForm.validator().errors())
+            )
+        })
+
+        booted.current = true
+    }
+
     /**
      * Patch the form.
      */