Simplify Inertia Form

Author: pushpak1300

package-lock.json

@@ -25,7 +25,7 @@
     },
     "dependencies": {
         "@headlessui/react": "^2.2.0",
-        "@inertiajs/react": "^2.1.0",
+        "@inertiajs/react": "^2.1.4",
         "@radix-ui/react-avatar": "^1.1.3",
         "@radix-ui/react-checkbox": "^1.1.4",
         "@radix-ui/react-collapsible": "^1.1.3",

package.json

@@ -174,13 +174,14 @@ export default function TwoFactorSetupModal({
                             </div>
                         </>
                     ) : (
-                        <Form {...confirm.form()} onSuccess={() => onClose()} resetOnError transform={(data) => ({ ...data, code })}>
+                        <Form {...confirm.form()} onSuccess={() => onClose()} resetOnError resetOnSuccess>
                             {({ processing, errors }: { processing: boolean; errors?: { confirmTwoFactorAuthentication?: { code?: string } } }) => (
                                 <>
                                     <div ref={pinInputContainerRef} className="relative w-full space-y-3">
                                         <div className="flex w-full flex-col items-center justify-center space-y-3 py-2">
                                             <InputOTP
                                                 id="otp"
+                                                name="code"
                                                 maxLength={OTP_MAX_LENGTH}
                                                 onChange={(value) => setCode(value)}
                                                 disabled={processing}

resources/js/components/two-factor-setup-modal.tsx

@@ -42,12 +42,13 @@ export default function TwoFactorChallenge() {
 
             <div className="space-y-6">
                 {!showRecoveryInput ? (
-                    <Form {...store.form()} className="space-y-4" resetOnError transform={(data) => ({ ...data, code })}>
+                    <Form {...store.form()} className="space-y-4" resetOnError resetOnSuccess>
                         {({ errors, processing, clearErrors }) => (
                             <>
                                 <div className="flex flex-col items-center justify-center space-y-3 text-center">
                                     <div className="flex w-full items-center justify-center">
                                         <InputOTP
+                                            name="code"
                                             maxLength={OTP_MAX_LENGTH}
                                             value={code}
                                             onChange={(value) => setCode(value)}