fix: fixed auth form

This commit is contained in:
Théo 2023-07-05 19:04:40 +02:00
parent ad66016115
commit 08ef306495
3 changed files with 14 additions and 3 deletions

View file

@ -1,4 +1,5 @@
import UserAuthForm from '@/components/ui/UserAuthForm';
import Link from 'next/link';
export default function Page() {
return (

View file

@ -10,7 +10,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
<input
type={type}
className={cn(
'flex h-10 w-full rounded-md border border-highlight-primary bg-highlight-primary px-3 py-2 text-sm ring-offset-highlight-primary file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
'flex h-10 w-full rounded-md border border-primary-600 bg-highlight-primary px-3 py-2 text-sm ring-offset-highlight-primary file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted focus:bg-primary-800 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
className
)}
ref={ref}

View file

@ -2,12 +2,13 @@
import { zodResolver } from '@hookform/resolvers/zod';
import cookies from 'js-cookie';
import { Loader2 } from 'lucide-react';
import { usePathname, useRouter } from 'next/navigation';
import { useState } from 'react';
import { useForm } from 'react-hook-form';
import * as z from 'zod';
import { Loader2 } from 'lucide-react';
import AppLink from '@/components/ui/AppLink';
import { Button } from '@/components/ui/Button';
import {
Form,
@ -106,7 +107,10 @@ export default function UserAuthForm() {
return (
<Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
<form
onSubmit={form.handleSubmit(onSubmit)}
className="flex w-52 flex-col justify-center space-y-4 sm:w-72"
>
{!isSignIn && (
<>
<FormField
@ -180,6 +184,12 @@ export default function UserAuthForm() {
{isLoading && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
{isSignIn ? 'Se connecter' : "S'inscrire"}
</Button>
<p className="flex flex-col items-center text-sm text-muted">
{isSignIn ? "Vous n'avez pas de compte?" : 'Vous possédez un compte?'}{' '}
<AppLink className="text-brand underline" href={isSignIn ? '/sign-up' : '/sign-in'}>
{isSignIn ? "S'inscrire maintenant" : 'Se connecter'}
</AppLink>
</p>
</form>
</Form>
);