auto submit pin

proofgeist · Nov 14, 2024 · c79bc05 · c79bc05
1 parent c2b4b06
commit c79bc05
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/cli/template/extras/proofkit-auth/app/auth/reset-password/verify-email/verify-email-form.tsx b/cli/template/extras/proofkit-auth/app/auth/reset-password/verify-email/verify-email-form.tsx
@@ -23,20 +23,21 @@ export default function VerifyEmailForm() {
             {...form.register("code")}
             onChange={(value) => {
               form.setValue("code", value);
+              if (value.length === 8) {
+                handleSubmitWithAction();
+              }
             }}
             error={!!form.formState.errors.code?.message}
             autoFocus
           />
           {form.formState.errors.code?.message && (
             <Text>{form.formState.errors.code.message}</Text>
           )}
-
           {action.result.data?.error ? (
             <Text c="red">{action.result.data.error}</Text>
           ) : action.hasErrored ? (
             <Text c="red">An error occured</Text>
           ) : null}
-
           <Button fullWidth type="submit" loading={action.isPending}>
             Continue
           </Button>

diff --git a/cli/template/extras/proofkit-auth/app/auth/verify-email/email-verification-form.tsx b/cli/template/extras/proofkit-auth/app/auth/verify-email/email-verification-form.tsx
@@ -3,7 +3,7 @@ import { useHookFormAction } from "@next-safe-action/adapter-react-hook-form/hoo
 import { emailVerificationSchema } from "./schema";
 import { verifyEmailAction } from "./actions";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { Anchor, Button, Group, Paper, PinInput, Text } from "@mantine/core";
+import { Button, Paper, PinInput, Text } from "@mantine/core";
 import { Stack } from "@mantine/core";
 
 export default function LoginForm() {
@@ -22,7 +22,12 @@ export default function LoginForm() {
             autoFocus
             oneTimeCode
             {...form.register("code")}
-            onChange={(value) => form.setValue("code", value)}
+            onChange={(value) => {
+              form.setValue("code", value);
+              if (value.length === 8) {
+                handleSubmitWithAction();
+              }
+            }}
           />
 
           {action.result.data?.error ? (