add routes

apps/id.saladeaula.digital/app/routes/forgot.tsx

@@ -62,8 +62,8 @@ export default function Forgot({}: Route.ComponentProps) {
             Redefinir senha
           </h1>
           <p className="text-white/50 text-sm">
-            Digite seu email e lhe enviaremos um email com as instruções para
-            redefinir sua senha.
+            Digite seu endereço de email ou cpf e lhe enviaremos um email com as
+            instruções para redefinir sua senha.
           </p>
         </div>
 
@@ -101,7 +101,7 @@ export default function Forgot({}: Route.ComponentProps) {
         <p className="text-white/50 text-xs text-center">
           Lembrou da senha?{' '}
           <Link to="/" className="underline hover:no-underline">
-            Faça login
+            Fazer login
           </Link>
           .
         </p>

apps/id.saladeaula.digital/app/routes/layout.tsx

@@ -11,7 +11,7 @@ export default function Layout() {
         <ChevronLeftIcon className="size-5" /> Página inicial
       </a>
 
-      <div className="w-full max-w-xs relative z-1 max-lg:mt-8">
+      <div className="w-full max-w-xs relative z-1 max-lg:mt-8 space-y-6">
         <Outlet />
       </div>
 

apps/id.saladeaula.digital/app/routes/register/cpf.tsx

@@ -3,8 +3,15 @@ import { useRequest } from 'ahooks'
 import { z } from 'zod'
 import { zodResolver } from '@hookform/resolvers/zod'
 import { useForm } from 'react-hook-form'
+import { AlertCircleIcon } from 'lucide-react'
+import { Link } from 'react-router'
 
 import { Button } from '@repo/ui/components/ui/button'
+import {
+  Alert,
+  AlertDescription,
+  AlertTitle
+} from '@repo/ui/components/ui/alert'
 import {
   Form,
   FormControl,
@@ -17,7 +24,7 @@ import { Input } from '@repo/ui/components/ui/input'
 import { Spinner } from '@repo/ui/components/ui/spinner'
 import { cpf, type RegisterContextProps, type User } from './data'
 import { RegisterContext } from './data'
-import { use } from 'react'
+import { use, useState } from 'react'
 
 const formSchema = z.object({
   cpf: cpf
@@ -27,10 +34,11 @@ type Schema = z.infer<typeof formSchema>
 
 export function Cpf() {
   const { setUser } = use(RegisterContext) as RegisterContextProps
+  const [isOnboarded, setIsOnboarded] = useState<Boolean>(false)
   const form = useForm({
     resolver: zodResolver(formSchema)
   })
-  const { control, handleSubmit, formState } = form
+  const { control, handleSubmit, formState, setError } = form
   const { runAsync } = useRequest(
     async ({ cpf }) => {
       return await fetch(`/lookup?cpf=${cpf}`, {
@@ -43,8 +51,15 @@ export function Cpf() {
 
   const onSubmit = async ({ cpf }: Schema) => {
     const r = await runAsync({ cpf })
-    const user = (await r.json()) as any
-    setUser({ cpf, ...user })
+    const data = (await r.json()) as any
+
+    if (r.ok) {
+      setUser({ cpf, ...data })
+    }
+
+    if (r.status === 409) {
+      setIsOnboarded(true)
+    }
   }
 
   return (
@@ -52,6 +67,27 @@ export function Cpf() {
       <Form {...form}>
         <form onSubmit={handleSubmit(onSubmit)}>
           <fieldset disabled={formState.isSubmitting} className="grid gap-6">
+            {isOnboarded && (
+              <Alert variant="destructive">
+                <AlertCircleIcon />
+                <AlertTitle>Você já está cadastrado.</AlertTitle>
+                <AlertDescription>
+                  <p>
+                    Por favor, siga as instruções abaixo para acessar sua conta:
+                  </p>
+                  <ul className="list-disc text-sm mt-2.5 [&_a]:underline [&_a]:hover:no-underline">
+                    <li>
+                      Você lembra da sua senha? <Link to="/">Fazer login</Link>
+                    </li>
+                    <li>
+                      Esqueceu a senha?{' '}
+                      <Link to="/forgot">Recuperar minha senha</Link>
+                    </li>
+                  </ul>
+                </AlertDescription>
+              </Alert>
+            )}
+
             <FormField
               control={control}
               name="cpf"

apps/id.saladeaula.digital/app/routes/register/data.ts

@@ -9,6 +9,7 @@ export type User = {
   cpf: string
   name: string
   email: string
+  never_logged?: boolean
 }
 
 export const cpf = z
@@ -16,19 +17,25 @@ export const cpf = z
   .nonempty('Digite seu CPF')
   .refine(isValidCPF, 'Deve ser um CPF válido')
 
-export const formSchema = z.object({
-  name: z
-    .string()
-    .trim()
-    .nonempty('Digite seu nome')
-    .refine(isName, { message: 'Nome inválido' }),
-  email: z.email('Digite seu email'),
-  password: z
-    .string()
-    .nonempty('Digite sua senha')
-    .min(6, 'Deve ter no mínimo 6 caracteres'),
-  cpf: cpf
-})
+export const formSchema = z
+  .object({
+    name: z
+      .string()
+      .trim()
+      .nonempty('Digite seu nome')
+      .refine(isName, { message: 'Nome inválido' }),
+    email: z.email('Digite seu email'),
+    password: z
+      .string()
+      .nonempty('Digite sua senha')
+      .min(6, 'Deve ter no mínimo 6 caracteres'),
+    confirm_password: z.string(),
+    cpf: cpf
+  })
+  .refine((data) => data.password === data.confirm_password, {
+    message: 'As senhas não coincidem',
+    path: ['confirm_password']
+  })
 
 export type Schema = z.infer<typeof formSchema>
 

apps/id.saladeaula.digital/app/routes/register/index.tsx

@@ -2,7 +2,8 @@ import type { Route } from '../+types'
 
 import { PatternFormat } from 'react-number-format'
 import { zodResolver } from '@hookform/resolvers/zod'
-import { useState, createContext, type ReactNode, use } from 'react'
+import { useState } from 'react'
+import { CheckCircle2Icon } from 'lucide-react'
 import { useForm } from 'react-hook-form'
 
 import { Button } from '@repo/ui/components/ui/button'
@@ -20,6 +21,11 @@ import { Label } from '@repo/ui/components/ui/label'
 
 import { Cpf } from './cpf'
 import { formSchema, type Schema, RegisterContext, type User } from './data'
+import {
+  Alert,
+  AlertDescription,
+  AlertTitle
+} from '@repo/ui/components/ui/alert'
 
 export function meta({}: Route.MetaArgs) {
   return [{ title: 'Criar conta · EDUSEG®' }]
@@ -44,6 +50,17 @@ export default function Signup({}: Route.ComponentProps) {
       {user ? (
         <Form {...form}>
           <form onSubmit={handleSubmit(onSubmit)} className="grid gap-6">
+            {user?.never_logged && (
+              <Alert>
+                <CheckCircle2Icon />
+                <AlertTitle>Confirme seus dados</AlertTitle>
+                <AlertDescription>
+                  Revise suas informações e edite o que precisar antes de
+                  continuar.
+                </AlertDescription>
+              </Alert>
+            )}
+
             <FormField
               control={control}
               name="name"
@@ -109,7 +126,25 @@ export default function Signup({}: Route.ComponentProps) {
                   <FormControl>
                     <Input
                       type={show ? 'text' : 'password'}
-                      placeholder="••••••••"
+                      autoComplete="false"
+                      {...field}
+                    />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={control}
+              name="password"
+              defaultValue=""
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>Confirmar senha</FormLabel>
+                  <FormControl>
+                    <Input
+                      type={show ? 'text' : 'password'}
                       autoComplete="false"
                       {...field}
                     />