feat: add form reset functionality and ref to login form
This commit is contained in:
parent
386d72d914
commit
9183117a20
1 changed files with 8 additions and 2 deletions
|
@ -4,15 +4,18 @@ import LabeledInput from '@/components/labeled-input';
|
||||||
import { Button } from '@/components/custom-ui/button';
|
import { Button } from '@/components/custom-ui/button';
|
||||||
import { AuthError } from 'next-auth';
|
import { AuthError } from 'next-auth';
|
||||||
import { redirect } from 'next/navigation';
|
import { redirect } from 'next/navigation';
|
||||||
import { useState } from 'react';
|
import { useRef, useState } from 'react';
|
||||||
|
|
||||||
const SIGNIN_ERROR_URL = '/error';
|
const SIGNIN_ERROR_URL = '/error';
|
||||||
|
|
||||||
export default function LoginForm() {
|
export default function LoginForm() {
|
||||||
const [isSignUp, setIsSignUp] = useState(false);
|
const [isSignUp, setIsSignUp] = useState(false);
|
||||||
|
|
||||||
|
const formRef = useRef<HTMLFormElement>(null);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<form
|
<form
|
||||||
|
ref={formRef}
|
||||||
className='flex flex-col gap-5 w-full'
|
className='flex flex-col gap-5 w-full'
|
||||||
action={async (formData) => {
|
action={async (formData) => {
|
||||||
'use client';
|
'use client';
|
||||||
|
@ -91,7 +94,10 @@ export default function LoginForm() {
|
||||||
<Button
|
<Button
|
||||||
type='button'
|
type='button'
|
||||||
variant='outline_primary'
|
variant='outline_primary'
|
||||||
onClick={() => setIsSignUp((v) => !v)}
|
onClick={() => {
|
||||||
|
formRef.current?.reset();
|
||||||
|
setIsSignUp((v) => !v);
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
{isSignUp ? 'Back to Login' : 'Sign Up'}
|
{isSignUp ? 'Back to Login' : 'Sign Up'}
|
||||||
</Button>
|
</Button>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue