From 30b1fde6ec729448e0e628f38efadc808b79debf Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Wed, 21 Jan 2026 16:41:43 -0300
Subject: [PATCH 01/77] refactor(auth): keep one sign-in page with type option

---
 src/app/conta/entrar/admin/page.tsx    | 21 ----------------
 src/app/conta/entrar/page.tsx          |  4 +--
 src/app/globals.css                    |  2 +-
 src/components/form/checkbox-input.tsx |  5 +++-
 src/components/ui/checkbox.tsx         |  2 +-
 src/components/ui/input.tsx            |  9 +++----
 src/components/ui/nav-link.tsx         |  5 ++--
 src/modules/auth/sign-in-form.tsx      | 35 +++++++++++++++++++-------
 8 files changed, 39 insertions(+), 44 deletions(-)
 delete mode 100644 src/app/conta/entrar/admin/page.tsx

diff --git a/src/app/conta/entrar/admin/page.tsx b/src/app/conta/entrar/admin/page.tsx
deleted file mode 100644
index 8f30356e..00000000
--- a/src/app/conta/entrar/admin/page.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import image from '@images/brand/icon.svg'
-import type { Metadata } from 'next'
-
-import { AuthCard } from '@/components/auth/auth-card'
-import { SignInForm } from '@/modules/auth/sign-in-form'
-
-export const metadata: Metadata = {
-  title: 'Acessar painel administrativo',
-}
-
-export default function Page() {
-  return (
-    <AuthCard
-      image={image}
-      title='Painel administrativo'
-      description='Insira seus dados para entrar na sua conta'
-    >
-      <SignInForm type='user' />
-    </AuthCard>
-  )
-}
diff --git a/src/app/conta/entrar/page.tsx b/src/app/conta/entrar/page.tsx
index a47b493f..615c5815 100644
--- a/src/app/conta/entrar/page.tsx
+++ b/src/app/conta/entrar/page.tsx
@@ -18,7 +18,7 @@ export default function Page() {
       title='Bem vindo(a)'
       description='Insira seus dados para entrar na sua conta'
     >
-      <SignInForm type='patient' />
+      <SignInForm />
 
       <Divider text='ou' />
 
@@ -28,7 +28,7 @@ export default function Page() {
           href={ROUTES.auth.signUp}
           className='text-foreground font-medium whitespace-nowrap'
         >
-          Crie sua conta aqui
+          Registre-se como paciente aqui
         </NavLink>
       </p>
     </AuthCard>
diff --git a/src/app/globals.css b/src/app/globals.css
index 3504c5d9..692c8a45 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -27,7 +27,7 @@
   --color-warning: #a16207;
   --color-error: #df1c41;
 
-  --color-ring: #008b62;
+  --color-ring: #036246;
 
   --inset-shadow-md: inset 0 1px 6px rgba(0, 0, 0, 0.1);
 
diff --git a/src/components/form/checkbox-input.tsx b/src/components/form/checkbox-input.tsx
index dab41b65..9126e6af 100644
--- a/src/components/form/checkbox-input.tsx
+++ b/src/components/form/checkbox-input.tsx
@@ -46,7 +46,10 @@ export function CheckboxInput({
               {...props}
               {...field}
             />
-            <Label htmlFor={name} className='font-normal'>
+            <Label
+              htmlFor={name}
+              className='font-normal peer-disabled:pointer-events-none hover:cursor-pointer'
+            >
               {label}
               {isRequired && <RequiredInput />}
             </Label>
diff --git a/src/components/ui/checkbox.tsx b/src/components/ui/checkbox.tsx
index 11d2d80c..d12f7250 100644
--- a/src/components/ui/checkbox.tsx
+++ b/src/components/ui/checkbox.tsx
@@ -12,7 +12,7 @@ export function Checkbox({ size = 'sm', ...props }: Readonly<CheckboxProps>) {
   return (
     <CheckboxPrimitive.Root
       className={cn(
-        'peer border-border focus-visible:ring-ring data-[state=checked]:border-primary data-[state=checked]:text-primary-foreground data-[state=checked]:bg-primary data-[state=checked]:inset-shadow-md shrink-0 rounded border-2 shadow-xs focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50',
+        'peer border-border data-[state=checked]:border-primary data-[state=checked]:text-primary-foreground data-[state=checked]:bg-primary hover:bg-background-soft outline-ring shrink-0 rounded border-2 shadow-xs outline-offset-4 transition-colors hover:cursor-pointer disabled:pointer-events-none disabled:opacity-50',
         size === 'sm' && 'size-4.5',
         size === 'md' && 'size-5',
       )}
diff --git a/src/components/ui/input.tsx b/src/components/ui/input.tsx
index 7caf961c..e9543322 100644
--- a/src/components/ui/input.tsx
+++ b/src/components/ui/input.tsx
@@ -4,12 +4,12 @@ import type { LucideIcon } from 'lucide-react'
 import { cn } from '@/utils/class-name-merge'
 
 export const inputVariants = cva(
-  'ring-offset-background focus-visible:ring-ring bg-background h-10 w-full shrink-0 rounded-lg border px-3 shadow-xs transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none read-only:focus-visible:ring-0 read-only:focus-visible:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50',
+  'bg-background outline-ring w-full shrink-0 rounded-lg border px-3 shadow-xs outline-offset-4 transition-colors read-only:focus-visible:ring-0 read-only:focus-visible:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50',
   {
     variants: {
       variant: {
         default: 'border-border text-foreground placeholder:text-disabled',
-        error: 'border-error focus-visible:ring-error',
+        error: 'border-error outline-error',
       },
       size: {
         default: 'h-10',
@@ -23,10 +23,7 @@ export const inputVariants = cva(
   },
 )
 
-export type InputProps = Omit<
-  React.InputHTMLAttributes<HTMLInputElement>,
-  'size'
-> &
+export type InputProps = Omit<React.ComponentProps<'input'>, 'size'> &
   VariantProps<typeof inputVariants> & {
     icon?: LucideIcon
   }
diff --git a/src/components/ui/nav-link.tsx b/src/components/ui/nav-link.tsx
index 87da6286..e23545d9 100644
--- a/src/components/ui/nav-link.tsx
+++ b/src/components/ui/nav-link.tsx
@@ -2,14 +2,13 @@ import Link, { type LinkProps } from 'next/link'
 
 import { cn } from '@/utils/class-name-merge'
 
-type NavLinkProps = LinkProps &
-  Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'>
+type NavLinkProps = LinkProps & Omit<React.ComponentProps<'a'>, 'href'>
 
 export function NavLink({ className, ...props }: Readonly<NavLinkProps>) {
   return (
     <Link
       className={cn(
-        'hover:text-primary ring-offset-background focus-visible:ring-ring underline underline-offset-3 transition-colors focus-visible:rounded focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none',
+        'hover:text-primary outline-ring underline underline-offset-2 outline-offset-4 transition-colors focus-visible:rounded',
         className,
       )}
       {...props}
diff --git a/src/modules/auth/sign-in-form.tsx b/src/modules/auth/sign-in-form.tsx
index 739dd177..711f1463 100644
--- a/src/modules/auth/sign-in-form.tsx
+++ b/src/modules/auth/sign-in-form.tsx
@@ -11,6 +11,7 @@ import { CheckboxInput } from '@/components/form/checkbox-input'
 import { FormContainer } from '@/components/form/form-container'
 import { FormField } from '@/components/form/form-field'
 import { PasswordInput } from '@/components/form/password-input'
+import { SelectInput } from '@/components/form/select-input'
 import { TextInput } from '@/components/form/text-input'
 import { Alert } from '@/components/ui/alert'
 import { Button } from '@/components/ui/button'
@@ -22,25 +23,32 @@ export const signInFormSchema = z.object({
   email: z.string().email('Insira um e-mail válido'),
   password: z.string().min(8, 'Sua senha deve conter 8 ou mais caracteres'),
   keepLoggedIn: z.boolean().optional(),
+  type: z.enum(['patient', 'user']),
 })
 export type SignInFormSchema = z.infer<typeof signInFormSchema>
 
-interface SignInFormProps {
-  type: 'patient' | 'user'
-}
-
-export function SignInForm({ type }: Readonly<SignInFormProps>) {
+export function SignInForm() {
   const [isPending, startTransition] = useTransition()
   const router = useRouter()
 
   const formMethods = useForm<SignInFormSchema>({
     resolver: zodResolver(signInFormSchema),
-    defaultValues: { email: '', password: '', keepLoggedIn: false },
+    defaultValues: {
+      email: '',
+      password: '',
+      keepLoggedIn: false,
+      type: 'user',
+    },
     mode: 'onBlur',
   })
   const formErrorMessage = formMethods.formState.errors.root?.message
 
-  async function signIn({ email, password, keepLoggedIn }: SignInFormSchema) {
+  async function signIn({
+    email,
+    password,
+    keepLoggedIn,
+    type,
+  }: SignInFormSchema) {
     startTransition(async () => {
       const response = await api('/login', {
         method: 'POST',
@@ -64,7 +72,7 @@ export function SignInForm({ type }: Readonly<SignInFormProps>) {
   return (
     <FormProvider {...formMethods}>
       <FormContainer onSubmit={formMethods.handleSubmit(signIn)}>
-        <FormField>
+        <FormField className='gap-4'>
           <TextInput
             name='email'
             label='E-mail'
@@ -76,9 +84,18 @@ export function SignInForm({ type }: Readonly<SignInFormProps>) {
             label='Senha'
             placeholder='Digite sua senha'
           />
+          <SelectInput
+            name='type'
+            label='Tipo de acesso'
+            options={[
+              { label: 'Paciente', value: 'patient' },
+              { label: 'Administração', value: 'user' },
+            ]}
+            className='sm:col-span-2'
+          />
         </FormField>
 
-        <div className='flex items-center justify-between gap-x-3 gap-y-5 text-sm max-[26rem]:flex-col'>
+        <div className='flex items-center justify-between gap-x-3 gap-y-5 text-sm max-[28rem]:flex-col'>
           <CheckboxInput name='keepLoggedIn' label='Manter conectado' />
 
           <NavLink

From 100fa25804f681b99a4795cdc0de53d6f271cbd7 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Wed, 21 Jan 2026 23:42:15 -0300
Subject: [PATCH 02/77] refactor(sidebar): adjust size and structure

---
 src/actions/auth.ts                           |  6 +--
 src/app/(dashboard)/_header/index.tsx         | 38 --------------
 .../layout.tsx                                |  0
 .../listagem}/page.tsx                        |  0
 .../listagem}/referrals-skeleton.tsx          |  0
 .../listagem}/referrals-table.tsx             |  0
 .../page.tsx                                  |  0
 .../(dashboard)/{suporte => equipe}/page.tsx  |  9 ++--
 .../equipes/especialistas/page.tsx            |  9 ----
 src/app/(dashboard)/equipes/layout.tsx        | 27 ----------
 src/app/(dashboard)/equipes/page.tsx          | 11 -----
 src/app/(dashboard)/layout.tsx                | 14 +++---
 src/components/dashboard/header.tsx           | 49 +++++++++++++++++++
 src/components/dashboard/wrapper.tsx          | 21 ++++++++
 .../sidebar}/account.tsx                      |  9 ++--
 .../sidebar}/container.tsx                    | 11 ++---
 .../sidebar}/header.tsx                       |  0
 .../_sidebar => components/sidebar}/index.tsx | 27 +++++-----
 .../sidebar}/menu-section.tsx                 | 18 +++----
 src/config/env.ts                             |  2 -
 src/constants/breadcrumbs/dashboard.ts        |  4 +-
 src/constants/page-titles.ts                  | 10 ++++
 src/constants/routes.ts                       | 19 ++++---
 src/types/users.ts                            | 13 ++---
 24 files changed, 138 insertions(+), 159 deletions(-)
 delete mode 100644 src/app/(dashboard)/_header/index.tsx
 rename src/app/(dashboard)/{encaminhados => encaminhamentos}/layout.tsx (100%)
 rename src/app/(dashboard)/{encaminhados/encaminhamentos => encaminhamentos/listagem}/page.tsx (100%)
 rename src/app/(dashboard)/{encaminhados/encaminhamentos => encaminhamentos/listagem}/referrals-skeleton.tsx (100%)
 rename src/app/(dashboard)/{encaminhados/encaminhamentos => encaminhamentos/listagem}/referrals-table.tsx (100%)
 rename src/app/(dashboard)/{encaminhados => encaminhamentos}/page.tsx (100%)
 rename src/app/(dashboard)/{suporte => equipe}/page.tsx (74%)
 delete mode 100644 src/app/(dashboard)/equipes/especialistas/page.tsx
 delete mode 100644 src/app/(dashboard)/equipes/layout.tsx
 delete mode 100644 src/app/(dashboard)/equipes/page.tsx
 create mode 100644 src/components/dashboard/header.tsx
 create mode 100644 src/components/dashboard/wrapper.tsx
 rename src/{app/(dashboard)/_sidebar => components/sidebar}/account.tsx (92%)
 rename src/{app/(dashboard)/_sidebar => components/sidebar}/container.tsx (70%)
 rename src/{app/(dashboard)/_sidebar => components/sidebar}/header.tsx (100%)
 rename src/{app/(dashboard)/_sidebar => components/sidebar}/index.tsx (69%)
 rename src/{app/(dashboard)/_sidebar => components/sidebar}/menu-section.tsx (78%)
 create mode 100644 src/constants/page-titles.ts

diff --git a/src/actions/auth.ts b/src/actions/auth.ts
index bb26f218..020baf2c 100644
--- a/src/actions/auth.ts
+++ b/src/actions/auth.ts
@@ -9,13 +9,13 @@ import type { Action, Subject } from '@/lib/permissions/schemas'
 import { getUserFromToken } from './token'
 
 export async function canUser(action: Action, subject: Subject) {
-  const data = await getUserFromToken()
+  const user = await getUserFromToken()
 
-  if (!data || !data.role) {
+  if (!user || !user.role) {
     redirect(ROUTES.auth.signOut)
   }
 
-  const { can } = definePermissionsFor(data.role)
+  const { can } = definePermissionsFor(user.role)
 
   return can(action, subject)
 }
diff --git a/src/app/(dashboard)/_header/index.tsx b/src/app/(dashboard)/_header/index.tsx
deleted file mode 100644
index 5bc39b04..00000000
--- a/src/app/(dashboard)/_header/index.tsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import { BellIcon, CircleHelpIcon } from 'lucide-react'
-
-import { Breadcrumbs } from '@/components/breadcrumbs'
-import { Button } from '@/components/ui/button'
-import { Divider } from '@/components/ui/divider'
-
-export function DashboardHeader() {
-  return (
-    <>
-      <header className='flex items-center gap-4 px-8 py-4'>
-        <h1 className='text-xl font-medium'>Visão Geral</h1>
-        <Divider orientation='vertical' height='h-5' />
-        <Breadcrumbs />
-
-        <section className='ml-auto flex items-center gap-2'>
-          <Button
-            size='icon'
-            variant='outline'
-            className='rounded-full'
-            aria-label='Ajuda'
-          >
-            <CircleHelpIcon className='text-foreground-soft' />
-          </Button>
-
-          <Button
-            size='icon'
-            variant='outline'
-            className='rounded-full'
-            aria-label='Notificações'
-          >
-            <BellIcon className='text-foreground-soft' />
-          </Button>
-        </section>
-      </header>
-      <Divider />
-    </>
-  )
-}
diff --git a/src/app/(dashboard)/encaminhados/layout.tsx b/src/app/(dashboard)/encaminhamentos/layout.tsx
similarity index 100%
rename from src/app/(dashboard)/encaminhados/layout.tsx
rename to src/app/(dashboard)/encaminhamentos/layout.tsx
diff --git a/src/app/(dashboard)/encaminhados/encaminhamentos/page.tsx b/src/app/(dashboard)/encaminhamentos/listagem/page.tsx
similarity index 100%
rename from src/app/(dashboard)/encaminhados/encaminhamentos/page.tsx
rename to src/app/(dashboard)/encaminhamentos/listagem/page.tsx
diff --git a/src/app/(dashboard)/encaminhados/encaminhamentos/referrals-skeleton.tsx b/src/app/(dashboard)/encaminhamentos/listagem/referrals-skeleton.tsx
similarity index 100%
rename from src/app/(dashboard)/encaminhados/encaminhamentos/referrals-skeleton.tsx
rename to src/app/(dashboard)/encaminhamentos/listagem/referrals-skeleton.tsx
diff --git a/src/app/(dashboard)/encaminhados/encaminhamentos/referrals-table.tsx b/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
similarity index 100%
rename from src/app/(dashboard)/encaminhados/encaminhamentos/referrals-table.tsx
rename to src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
diff --git a/src/app/(dashboard)/encaminhados/page.tsx b/src/app/(dashboard)/encaminhamentos/page.tsx
similarity index 100%
rename from src/app/(dashboard)/encaminhados/page.tsx
rename to src/app/(dashboard)/encaminhamentos/page.tsx
diff --git a/src/app/(dashboard)/suporte/page.tsx b/src/app/(dashboard)/equipe/page.tsx
similarity index 74%
rename from src/app/(dashboard)/suporte/page.tsx
rename to src/app/(dashboard)/equipe/page.tsx
index 8483aa01..d7b1d200 100644
--- a/src/app/(dashboard)/suporte/page.tsx
+++ b/src/app/(dashboard)/equipe/page.tsx
@@ -1,15 +1,16 @@
 import type { Metadata } from 'next'
 
+import { DashboardContainer } from '@/components/dashboard/container'
+import { TeamListTable } from '@/modules/teams/table'
+
 export const metadata: Metadata = {
-  title: 'Suporte',
+  title: 'Equipe',
 }
 
-import { DashboardContainer } from '@/components/dashboard/container'
-
 export default function Page() {
   return (
     <DashboardContainer className='flex flex-col gap-6'>
-      Suporte
+      <TeamListTable />
     </DashboardContainer>
   )
 }
diff --git a/src/app/(dashboard)/equipes/especialistas/page.tsx b/src/app/(dashboard)/equipes/especialistas/page.tsx
deleted file mode 100644
index ce1bad3a..00000000
--- a/src/app/(dashboard)/equipes/especialistas/page.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import type { Metadata } from 'next'
-
-export const metadata: Metadata = {
-  title: 'Especialistas',
-}
-
-export default function Page() {
-  return <p>Página de Especialistas</p>
-}
diff --git a/src/app/(dashboard)/equipes/layout.tsx b/src/app/(dashboard)/equipes/layout.tsx
deleted file mode 100644
index 526c1949..00000000
--- a/src/app/(dashboard)/equipes/layout.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { DashboardContainer } from '@/components/dashboard/container'
-import { DashboardTabButtons } from '@/components/dashboard/tab-buttons'
-import { ROUTES } from '@/constants/routes'
-
-export default function Layout({
-  children,
-}: Readonly<{ children: React.ReactNode }>) {
-  const tabButtons = [
-    {
-      title: 'Todos',
-      path: ROUTES.dashboard.teams.main,
-    },
-    {
-      title: 'Especialistas',
-      path: ROUTES.dashboard.teams.specialists,
-    },
-  ]
-
-  return (
-    <>
-      <DashboardTabButtons buttons={tabButtons} />
-      <DashboardContainer className='flex flex-col gap-6'>
-        {children}
-      </DashboardContainer>
-    </>
-  )
-}
diff --git a/src/app/(dashboard)/equipes/page.tsx b/src/app/(dashboard)/equipes/page.tsx
deleted file mode 100644
index 3491eecc..00000000
--- a/src/app/(dashboard)/equipes/page.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import type { Metadata } from 'next'
-
-import { TeamListTable } from '@/modules/teams/table'
-
-export const metadata: Metadata = {
-  title: 'Equipe',
-}
-
-export default function Page() {
-  return <TeamListTable />
-}
diff --git a/src/app/(dashboard)/layout.tsx b/src/app/(dashboard)/layout.tsx
index 82ed90c5..d5e92d39 100644
--- a/src/app/(dashboard)/layout.tsx
+++ b/src/app/(dashboard)/layout.tsx
@@ -1,11 +1,11 @@
 import { redirect } from 'next/navigation'
 
 import { canUser } from '@/actions/auth'
-import { DashboardSidebar } from '@/app/(dashboard)/_sidebar'
+import { DashboardHeader } from '@/components/dashboard/header'
+import { DashboardWrapper } from '@/components/dashboard/wrapper'
+import { DashboardSidebar } from '@/components/sidebar'
 import { ROUTES } from '@/constants/routes'
 
-import { DashboardHeader } from './_header'
-
 export default async function Layout({
   children,
 }: Readonly<{ children: React.ReactNode }>) {
@@ -16,13 +16,13 @@ export default async function Layout({
   }
 
   return (
-    <div className='flex min-h-svh'>
+    <>
       <DashboardSidebar />
 
-      <div className='flex flex-1 flex-col overflow-hidden'>
+      <DashboardWrapper>
         <DashboardHeader />
         {children}
-      </div>
-    </div>
+      </DashboardWrapper>
+    </>
   )
 }
diff --git a/src/components/dashboard/header.tsx b/src/components/dashboard/header.tsx
new file mode 100644
index 00000000..4ec675fb
--- /dev/null
+++ b/src/components/dashboard/header.tsx
@@ -0,0 +1,49 @@
+'use client'
+
+import { usePathname } from 'next/navigation'
+
+import { Breadcrumbs } from '@/components/breadcrumbs'
+import { Divider } from '@/components/ui/divider'
+import { PAGE_TITLES, type PageTitle } from '@/constants/page-titles'
+
+export function DashboardHeader() {
+  const pathname = usePathname()
+
+  const showBreadcrumbs = pathname !== '/'
+
+  const page = pathname.split('/')[1] as PageTitle
+  const pageTitle = PAGE_TITLES[page || 'default']
+
+  return (
+    <header className='border-border flex items-center gap-4 border-b px-8 py-4'>
+      <h1 className='text-xl font-medium'>{pageTitle}</h1>
+
+      {showBreadcrumbs && (
+        <>
+          <Divider orientation='vertical' height='h-5' />
+          <Breadcrumbs />
+        </>
+      )}
+
+      {/* <section className='ml-auto flex items-center gap-2'>
+        <Button
+          size='icon'
+          variant='outline'
+          className='rounded-full'
+          aria-label='Ajuda'
+        >
+          <CircleHelpIcon className='text-foreground-soft' />
+        </Button>
+
+        <Button
+          size='icon'
+          variant='outline'
+          className='rounded-full'
+          aria-label='Notificações'
+        >
+          <BellIcon className='text-foreground-soft' />
+        </Button>
+      </section> */}
+    </header>
+  )
+}
diff --git a/src/components/dashboard/wrapper.tsx b/src/components/dashboard/wrapper.tsx
new file mode 100644
index 00000000..0312a789
--- /dev/null
+++ b/src/components/dashboard/wrapper.tsx
@@ -0,0 +1,21 @@
+'use client'
+
+import { useSidebar } from '@/store/sidebar'
+import { cn } from '@/utils/class-name-merge'
+
+export function DashboardWrapper({
+  children,
+}: Readonly<{ children: React.ReactNode }>) {
+  const expanded = useSidebar((state) => state.expanded)
+
+  return (
+    <div
+      className={cn(
+        'flex min-h-svh flex-col overflow-hidden transition-all duration-500',
+        expanded ? 'pl-64' : 'pl-18',
+      )}
+    >
+      {children}
+    </div>
+  )
+}
diff --git a/src/app/(dashboard)/_sidebar/account.tsx b/src/components/sidebar/account.tsx
similarity index 92%
rename from src/app/(dashboard)/_sidebar/account.tsx
rename to src/components/sidebar/account.tsx
index d7b5a194..241060eb 100644
--- a/src/app/(dashboard)/_sidebar/account.tsx
+++ b/src/components/sidebar/account.tsx
@@ -6,7 +6,6 @@ import { useTransition } from 'react'
 import { toast } from 'sonner'
 
 import { revalidateCache } from '@/actions/cache'
-import { getUserFromToken } from '@/actions/token'
 import { Avatar } from '@/components/ui/avatar'
 import { DropdownMenu } from '@/components/ui/dropdown'
 import { DropdownMenuContent } from '@/components/ui/dropdown/content'
@@ -19,7 +18,7 @@ import { useSidebar } from '@/store/sidebar'
 import type { User } from '@/types/users'
 
 interface SidebarAccountProps {
-  user: User
+  user?: User | null
 }
 
 export function SidebarAccount({ user }: Readonly<SidebarAccountProps>) {
@@ -30,8 +29,6 @@ export function SidebarAccount({ user }: Readonly<SidebarAccountProps>) {
 
   async function logout() {
     startTransition(async () => {
-      const user = await getUserFromToken()
-
       if (!user?.id) return
 
       const response = await api('/logout', { method: 'POST' })
@@ -55,8 +52,8 @@ export function SidebarAccount({ user }: Readonly<SidebarAccountProps>) {
         data-visible={expanded}
         className='space-y-1 truncate pr-8 opacity-0 transition-opacity duration-750 data-[visible=true]:opacity-100'
       >
-        <p className='truncate text-sm whitespace-nowrap'>{user.name}</p>
-        <p className='text-foreground-soft truncate text-xs'>{user.email}</p>
+        <p className='truncate text-sm whitespace-nowrap'>{user?.name}</p>
+        <p className='text-foreground-soft truncate text-xs'>{user?.email}</p>
       </div>
 
       <DropdownMenu>
diff --git a/src/app/(dashboard)/_sidebar/container.tsx b/src/components/sidebar/container.tsx
similarity index 70%
rename from src/app/(dashboard)/_sidebar/container.tsx
rename to src/components/sidebar/container.tsx
index bf7f9e2c..d32ef552 100644
--- a/src/app/(dashboard)/_sidebar/container.tsx
+++ b/src/components/sidebar/container.tsx
@@ -7,7 +7,7 @@ import { Button } from '@/components/ui/button'
 import { useSidebar } from '@/store/sidebar'
 import { cn } from '@/utils/class-name-merge'
 
-export function DashboardSidebarContainer({
+export function SidebarContainer({
   className,
   ...props
 }: Readonly<React.ComponentProps<'aside'>>) {
@@ -15,12 +15,12 @@ export function DashboardSidebarContainer({
   const toogleSidebar = useSidebar((state) => state.toogleSidebar)
 
   return (
-    <div className='relative'>
+    <div className='bg-background fixed z-10'>
       <aside
         className={cn(
           'border-border flex h-screen shrink-0 flex-col gap-8 overflow-x-hidden overflow-y-auto border-r py-6 transition-all duration-500',
           className,
-          expanded ? 'w-60 px-6' : 'w-18 px-4',
+          expanded ? 'w-64 px-6' : 'w-18 px-4',
         )}
         {...props}
       />
@@ -29,11 +29,8 @@ export function DashboardSidebarContainer({
         size='icon'
         variant='outline'
         data-expanded={expanded}
-        className={cn(
-          'text-disabled hover:text-foreground-soft absolute top-20 -right-4 z-10 size-8 rounded-full transition-all delay-75 duration-300 [&_svg]:size-5',
-          'data-[expanded=true]:rotate-180',
-        )}
         onClick={toogleSidebar}
+        className='text-disabled hover:text-foreground-soft absolute top-20 -right-4 z-10 size-8 rounded-full transition-all delay-75 duration-300 data-[expanded=true]:rotate-180 [&_svg]:size-5'
       >
         <ChevronRightIcon />
       </Button>
diff --git a/src/app/(dashboard)/_sidebar/header.tsx b/src/components/sidebar/header.tsx
similarity index 100%
rename from src/app/(dashboard)/_sidebar/header.tsx
rename to src/components/sidebar/header.tsx
diff --git a/src/app/(dashboard)/_sidebar/index.tsx b/src/components/sidebar/index.tsx
similarity index 69%
rename from src/app/(dashboard)/_sidebar/index.tsx
rename to src/components/sidebar/index.tsx
index 58523cf9..fe220d82 100644
--- a/src/app/(dashboard)/_sidebar/index.tsx
+++ b/src/components/sidebar/index.tsx
@@ -12,34 +12,34 @@ import { Divider } from '@/components/ui/divider'
 import { ROUTES } from '@/constants/routes'
 
 import { SidebarAccount } from './account'
-import { DashboardSidebarContainer } from './container'
+import { SidebarContainer } from './container'
 import { SidebarHeader } from './header'
-import { DashboardSidebarMenuSection } from './menu-section'
+import { SidebarMenuSection } from './menu-section'
 
 export async function DashboardSidebar() {
   const user = await getCurrentUser()
 
   return (
-    <DashboardSidebarContainer>
+    <SidebarContainer>
       <SidebarHeader />
 
       <Divider />
 
-      <DashboardSidebarMenuSection sections={SIDEBAR_SECTIONS} />
+      <SidebarMenuSection sections={SIDEBAR_SECTIONS} />
 
       <Divider />
 
-      <SidebarAccount user={user!} />
-    </DashboardSidebarContainer>
+      <SidebarAccount user={user} />
+    </SidebarContainer>
   )
 }
 
 const SIDEBAR_SECTIONS = [
   {
-    id: 'common',
+    id: 'main',
     links: [
       {
-        label: 'Visão Geral',
+        label: 'Visão geral',
         icon: <LayoutDashboardIcon />,
         path: ROUTES.dashboard.main,
       },
@@ -49,7 +49,7 @@ const SIDEBAR_SECTIONS = [
         path: ROUTES.dashboard.patients.main,
       },
       {
-        label: 'Encaminhados',
+        label: 'Encaminhamentos',
         icon: <Share2Icon />,
         path: ROUTES.dashboard.referrals.main,
       },
@@ -61,23 +61,18 @@ const SIDEBAR_SECTIONS = [
       {
         label: 'Equipe',
         icon: <HeartHandshakeIcon />,
-        path: ROUTES.dashboard.teams.main,
+        path: ROUTES.dashboard.team.main,
       },
     ],
   },
   {
-    id: 'others',
+    id: 'utils',
     links: [
       {
         label: 'Configurações',
         icon: <BoltIcon />,
         path: ROUTES.dashboard.settings.main,
       },
-      // {
-      //   label: 'Suporte',
-      //   icon: <HeadsetIcon />,
-      //   path: ROUTES.dashboard.support.main,
-      // },
     ],
   },
 ]
diff --git a/src/app/(dashboard)/_sidebar/menu-section.tsx b/src/components/sidebar/menu-section.tsx
similarity index 78%
rename from src/app/(dashboard)/_sidebar/menu-section.tsx
rename to src/components/sidebar/menu-section.tsx
index e0746f8b..6feb894b 100644
--- a/src/app/(dashboard)/_sidebar/menu-section.tsx
+++ b/src/components/sidebar/menu-section.tsx
@@ -6,20 +6,16 @@ import { NavButton } from '@/components/ui/nav-button'
 import { useSidebar } from '@/store/sidebar'
 import { cn } from '@/utils/class-name-merge'
 
-interface DashboardSidebarMenuSectionProps {
-  sections: {
+interface SidebarMenuSectionProps {
+  sections: Array<{
     id: string
-    links: {
-      label: string
-      icon: React.ReactNode
-      path: string
-    }[]
-  }[]
+    links: Array<{ label: string; icon: React.ReactNode; path: string }>
+  }>
 }
 
-export function DashboardSidebarMenuSection({
+export function SidebarMenuSection({
   sections,
-}: Readonly<DashboardSidebarMenuSectionProps>) {
+}: Readonly<SidebarMenuSectionProps>) {
   const expanded = useSidebar((state) => state.expanded)
   const pathname = usePathname()
 
@@ -40,7 +36,7 @@ export function DashboardSidebarMenuSection({
                   className={cn(
                     '[&_svg]:text-disabled text-foreground-soft size-10 justify-start gap-3 px-2.5 text-base transition-all duration-300',
                     'data-[visible=true]:w-full',
-                    'data-[active=true]:bg-accent data-[active=true]:text-primary data-[active=true]:[&_svg]:text-primary data-[active=true]:pointer-events-none data-[active=true]:size-10',
+                    'data-[active=true]:bg-background-soft data-[active=true]:text-primary data-[active=true]:[&_svg]:text-primary data-[active=true]:pointer-events-none data-[active=true]:size-10',
                   )}
                 >
                   {link.icon}
diff --git a/src/config/env.ts b/src/config/env.ts
index ea4b3eee..4e22a4ef 100644
--- a/src/config/env.ts
+++ b/src/config/env.ts
@@ -3,7 +3,6 @@ import { z } from 'zod'
 const envSchema = z.object({
   // APIs
   NEXT_PUBLIC_API_URL: z.string().url(),
-  NEXT_PUBLIC_API_IBGE: z.string().url(),
 
   // Environment
   NODE_ENV: z
@@ -13,5 +12,4 @@ const envSchema = z.object({
 
 export const env = envSchema.parse({
   NEXT_PUBLIC_API_URL: process.env.NEXT_PUBLIC_API_URL,
-  NEXT_PUBLIC_API_IBGE: process.env.NEXT_PUBLIC_API_IBGE,
 })
diff --git a/src/constants/breadcrumbs/dashboard.ts b/src/constants/breadcrumbs/dashboard.ts
index f5ef20ea..f17609e5 100644
--- a/src/constants/breadcrumbs/dashboard.ts
+++ b/src/constants/breadcrumbs/dashboard.ts
@@ -37,10 +37,10 @@ export const DASHBOARD_BREADCRUMBS: Breadcrumbs = {
     name: 'Cadastrar novo paciente',
     path: ROUTES.dashboard.patients.new,
   },
-  equipes: {
+  equipe: {
     icon: UserCog2Icon,
     name: 'Equipes',
-    path: ROUTES.dashboard.teams.main,
+    path: ROUTES.dashboard.team.main,
   },
   aprovacoes: {
     icon: UserRoundCheckIcon,
diff --git a/src/constants/page-titles.ts b/src/constants/page-titles.ts
new file mode 100644
index 00000000..7778199e
--- /dev/null
+++ b/src/constants/page-titles.ts
@@ -0,0 +1,10 @@
+export const PAGE_TITLES = {
+  default: 'Visão geral',
+  pacientes: 'Pacientes',
+  encaminhamentos: 'Encaminhamentos',
+  aprovacoes: 'Aprovações',
+  equipe: 'Equipe',
+  configuracoes: 'Configurações',
+  profile: 'Perfil',
+}
+export type PageTitle = keyof typeof PAGE_TITLES
diff --git a/src/constants/routes.ts b/src/constants/routes.ts
index 5ea7ae73..bf811aee 100644
--- a/src/constants/routes.ts
+++ b/src/constants/routes.ts
@@ -3,6 +3,8 @@ export const ROUTES = {
     signIn: '/conta/entrar',
     signUp: '/conta/cadastrar',
     forgotPassword: '/conta/recuperar-senha',
+    resetPassword: '/conta/nova-senha',
+    registerUser: '/conta/cadastrar/usuario',
     signOut: '/api/sair',
   },
   patient: {
@@ -29,24 +31,25 @@ export const ROUTES = {
       },
     },
     referrals: {
-      main: '/encaminhados',
-      list: '/encaminhados/encaminhamentos',
+      main: '/encaminhamentos',
+      list: '/encaminhamentos/listagem',
+    },
+    appointments: {
+      main: '/atendimentos',
+      list: '/atendimentos/listagem',
     },
     approvals: {
       main: '/aprovacoes',
       pending: '/aprovacoes/pendentes',
       approved: '/aprovacoes/aprovados',
     },
-    teams: {
-      main: '/equipes',
-      specialists: '/equipes/especialistas',
+    team: {
+      main: '/equipe',
     },
     settings: {
       main: '/configuracoes',
       fontSize: '/configuracoes/fontes',
     },
-    support: {
-      main: '/suporte',
-    },
+    profile: '/perfil',
   },
 }
diff --git a/src/types/users.ts b/src/types/users.ts
index dfbaac03..5ffc56da 100644
--- a/src/types/users.ts
+++ b/src/types/users.ts
@@ -1,14 +1,12 @@
-import type { Patient } from './patients'
-
 export type User = {
   id: string
   name: string
   email: string
-  role: UserRole
   avatar_url: string | null
-  created_at: Date
+  status: UserStatus
+  role: UserRole
   updated_at: Date
-  patient: Patient | null
+  created_at: Date
 }
 
 export const USER_ROLES = {
@@ -16,12 +14,11 @@ export const USER_ROLES = {
   nurse: 'Enfermagem',
   specialist: 'Especialista',
   manager: 'Manager',
-  patient: 'Paciente',
 }
 export type UserRole = keyof typeof USER_ROLES
 
-export const USER_STATUS = {
+export const USER_STATUSES = {
   active: 'Ativo',
   inactive: 'Inativo',
 }
-export type UserStatus = keyof typeof USER_STATUS
+export type UserStatus = keyof typeof USER_STATUSES

From d6bfa8969b02089bf88c2f2b3df4fc8475a9f9f6 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Wed, 21 Jan 2026 23:50:43 -0300
Subject: [PATCH 03/77] refactor(header): rename page titles to section titles

---
 src/components/dashboard/header.tsx                 | 12 ++++++------
 src/constants/{page-titles.ts => section-titles.ts} |  4 ++--
 2 files changed, 8 insertions(+), 8 deletions(-)
 rename src/constants/{page-titles.ts => section-titles.ts} (69%)

diff --git a/src/components/dashboard/header.tsx b/src/components/dashboard/header.tsx
index 4ec675fb..f5221ff6 100644
--- a/src/components/dashboard/header.tsx
+++ b/src/components/dashboard/header.tsx
@@ -4,19 +4,19 @@ import { usePathname } from 'next/navigation'
 
 import { Breadcrumbs } from '@/components/breadcrumbs'
 import { Divider } from '@/components/ui/divider'
-import { PAGE_TITLES, type PageTitle } from '@/constants/page-titles'
+import { SECTION_TITLES, type SectionTitle } from '@/constants/section-titles'
 
 export function DashboardHeader() {
-  const pathname = usePathname()
+  const pathnames = usePathname().split('/')
 
-  const showBreadcrumbs = pathname !== '/'
+  const section = pathnames[1] as SectionTitle
+  const sectionTitle = SECTION_TITLES[section || 'default']
 
-  const page = pathname.split('/')[1] as PageTitle
-  const pageTitle = PAGE_TITLES[page || 'default']
+  const showBreadcrumbs = !!pathnames[2]
 
   return (
     <header className='border-border flex items-center gap-4 border-b px-8 py-4'>
-      <h1 className='text-xl font-medium'>{pageTitle}</h1>
+      <h1 className='text-xl font-medium'>{sectionTitle}</h1>
 
       {showBreadcrumbs && (
         <>
diff --git a/src/constants/page-titles.ts b/src/constants/section-titles.ts
similarity index 69%
rename from src/constants/page-titles.ts
rename to src/constants/section-titles.ts
index 7778199e..08324c07 100644
--- a/src/constants/page-titles.ts
+++ b/src/constants/section-titles.ts
@@ -1,4 +1,4 @@
-export const PAGE_TITLES = {
+export const SECTION_TITLES = {
   default: 'Visão geral',
   pacientes: 'Pacientes',
   encaminhamentos: 'Encaminhamentos',
@@ -7,4 +7,4 @@ export const PAGE_TITLES = {
   configuracoes: 'Configurações',
   profile: 'Perfil',
 }
-export type PageTitle = keyof typeof PAGE_TITLES
+export type SectionTitle = keyof typeof SECTION_TITLES

From 398d860b6338dd83c96a3e22a521b33841ed4b4a Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Thu, 22 Jan 2026 00:39:28 -0300
Subject: [PATCH 04/77] chore(breadcrumbs): reorganize component and approvals
 pages

---
 .../aprovacoes/aprovacoes-pendentes/page.tsx  | 11 +++
 .../{pendentes => envios-pendentes}/page.tsx  |  0
 src/app/(dashboard)/aprovacoes/layout.tsx     |  2 +-
 src/app/(dashboard)/aprovacoes/page.tsx       |  7 +-
 src/components/breadcrumbs.tsx                | 16 +++-
 src/components/sidebar/index.tsx              |  2 +-
 src/constants/breadcrumbs/dashboard.ts        | 92 ++++++++++++-------
 src/constants/breadcrumbs/index.ts            | 20 ++--
 src/constants/routes.ts                       |  3 +-
 9 files changed, 102 insertions(+), 51 deletions(-)
 create mode 100644 src/app/(dashboard)/aprovacoes/aprovacoes-pendentes/page.tsx
 rename src/app/(dashboard)/aprovacoes/{pendentes => envios-pendentes}/page.tsx (100%)

diff --git a/src/app/(dashboard)/aprovacoes/aprovacoes-pendentes/page.tsx b/src/app/(dashboard)/aprovacoes/aprovacoes-pendentes/page.tsx
new file mode 100644
index 00000000..52dfda76
--- /dev/null
+++ b/src/app/(dashboard)/aprovacoes/aprovacoes-pendentes/page.tsx
@@ -0,0 +1,11 @@
+import type { Metadata } from 'next'
+
+import { UnderReviewPatientRequirements } from '@/modules/patient-requirements/under-review-requirements'
+
+export const metadata: Metadata = {
+  title: 'Aprovações pendentes',
+}
+
+export default function Page() {
+  return <UnderReviewPatientRequirements />
+}
diff --git a/src/app/(dashboard)/aprovacoes/pendentes/page.tsx b/src/app/(dashboard)/aprovacoes/envios-pendentes/page.tsx
similarity index 100%
rename from src/app/(dashboard)/aprovacoes/pendentes/page.tsx
rename to src/app/(dashboard)/aprovacoes/envios-pendentes/page.tsx
diff --git a/src/app/(dashboard)/aprovacoes/layout.tsx b/src/app/(dashboard)/aprovacoes/layout.tsx
index 910f2fb1..2fa8967c 100644
--- a/src/app/(dashboard)/aprovacoes/layout.tsx
+++ b/src/app/(dashboard)/aprovacoes/layout.tsx
@@ -12,7 +12,7 @@ export default function Layout({
     },
     {
       title: 'Envios pendentes',
-      path: ROUTES.dashboard.approvals.pending,
+      path: ROUTES.dashboard.approvals.pendingSubmissions,
     },
     {
       title: 'Aprovados',
diff --git a/src/app/(dashboard)/aprovacoes/page.tsx b/src/app/(dashboard)/aprovacoes/page.tsx
index 52dfda76..1ee4d2e2 100644
--- a/src/app/(dashboard)/aprovacoes/page.tsx
+++ b/src/app/(dashboard)/aprovacoes/page.tsx
@@ -1,11 +1,12 @@
 import type { Metadata } from 'next'
+import { redirect } from 'next/navigation'
 
-import { UnderReviewPatientRequirements } from '@/modules/patient-requirements/under-review-requirements'
+import { ROUTES } from '@/constants/routes'
 
 export const metadata: Metadata = {
-  title: 'Aprovações pendentes',
+  title: 'Aprovações',
 }
 
 export default function Page() {
-  return <UnderReviewPatientRequirements />
+  redirect(ROUTES.dashboard.approvals.pendingApprovals)
 }
diff --git a/src/components/breadcrumbs.tsx b/src/components/breadcrumbs.tsx
index 0ee8366c..6ab3b15e 100644
--- a/src/components/breadcrumbs.tsx
+++ b/src/components/breadcrumbs.tsx
@@ -5,16 +5,28 @@ import Link from 'next/link'
 import { usePathname } from 'next/navigation'
 import React from 'react'
 
-import { BREADCRUMBS, type BreadcrumbType } from '@/constants/breadcrumbs'
+import {
+  type Breadcrumb,
+  BREADCRUMBS,
+  type Breadcrumbs,
+  type BreadcrumbSection,
+} from '@/constants/breadcrumbs'
 import { cn } from '@/utils/class-name-merge'
 
 export function Breadcrumbs() {
   const pathnames = usePathname().split('/')
 
+  const section = pathnames[1]
+  const breadcrumbSection = BREADCRUMBS[section as BreadcrumbSection]
+
+  if (!breadcrumbSection) {
+    return null
+  }
+
   const breadcrumbs = []
 
   for (const path of pathnames) {
-    const breadcrumb = BREADCRUMBS[path as BreadcrumbType]
+    const breadcrumb = breadcrumbSection[path as Breadcrumb]
     if (breadcrumb) {
       breadcrumbs.push(breadcrumb)
     }
diff --git a/src/components/sidebar/index.tsx b/src/components/sidebar/index.tsx
index fe220d82..d9f5db5f 100644
--- a/src/components/sidebar/index.tsx
+++ b/src/components/sidebar/index.tsx
@@ -56,7 +56,7 @@ const SIDEBAR_SECTIONS = [
       {
         label: 'Aprovações',
         icon: <UserRoundCheckIcon />,
-        path: ROUTES.dashboard.approvals.main,
+        path: ROUTES.dashboard.approvals.pendingApprovals,
       },
       {
         label: 'Equipe',
diff --git a/src/constants/breadcrumbs/dashboard.ts b/src/constants/breadcrumbs/dashboard.ts
index f17609e5..f60bc0f3 100644
--- a/src/constants/breadcrumbs/dashboard.ts
+++ b/src/constants/breadcrumbs/dashboard.ts
@@ -1,8 +1,12 @@
 import {
+  ClipboardCheckIcon,
+  ClipboardClockIcon,
+  ClipboardListIcon,
+  ClockArrowUpIcon,
   HistoryIcon,
   PaperclipIcon,
+  Share2Icon,
   User2Icon,
-  UserCog2Icon,
   UserRoundCheckIcon,
   UserRoundPlusIcon,
   Users2Icon,
@@ -13,38 +17,64 @@ import type { Breadcrumbs } from '.'
 
 export const DASHBOARD_BREADCRUMBS: Breadcrumbs = {
   pacientes: {
-    icon: Users2Icon,
-    name: 'Pacientes',
-    path: ROUTES.dashboard.patients.main,
+    pacientes: {
+      icon: Users2Icon,
+      name: 'Pacientes',
+      path: ROUTES.dashboard.patients.main,
+    },
+    informacoes: {
+      icon: User2Icon,
+      name: 'Informações do paciente',
+      path: ROUTES.dashboard.patients.main,
+    },
+    historico: {
+      icon: HistoryIcon,
+      name: 'Histórico do paciente',
+      path: ROUTES.dashboard.patients.main,
+    },
+    documentos: {
+      icon: PaperclipIcon,
+      name: 'Documentos',
+      path: ROUTES.dashboard.patients.main,
+    },
+    cadastrar: {
+      icon: UserRoundPlusIcon,
+      name: 'Cadastrar novo paciente',
+      path: ROUTES.dashboard.patients.new,
+    },
   },
-  informacoes: {
-    icon: User2Icon,
-    name: 'Informações do paciente',
-    path: ROUTES.dashboard.patients.main,
-  },
-  documentos: {
-    icon: PaperclipIcon,
-    name: 'Documentos',
-    path: ROUTES.dashboard.patients.main,
-  },
-  historico: {
-    icon: HistoryIcon,
-    name: 'Histórico do paciente',
-    path: ROUTES.dashboard.patients.main,
-  },
-  cadastrar: {
-    icon: UserRoundPlusIcon,
-    name: 'Cadastrar novo paciente',
-    path: ROUTES.dashboard.patients.new,
-  },
-  equipe: {
-    icon: UserCog2Icon,
-    name: 'Equipes',
-    path: ROUTES.dashboard.team.main,
+  referrals: {
+    encaminhamentos: {
+      icon: Share2Icon,
+      name: 'Encaminhamentos',
+      path: ROUTES.dashboard.referrals.main,
+    },
+    listagem: {
+      icon: ClipboardListIcon,
+      name: 'Lista de encaminhamentos',
+      path: ROUTES.dashboard.referrals.list,
+    },
   },
   aprovacoes: {
-    icon: UserRoundCheckIcon,
-    name: 'Aprovações',
-    path: ROUTES.dashboard.approvals.main,
+    aprovacoes: {
+      icon: UserRoundCheckIcon,
+      name: 'Aprovações',
+      path: ROUTES.dashboard.approvals.main,
+    },
+    'aprovacoes-pendentes': {
+      icon: ClipboardClockIcon,
+      name: 'Aprovações pendentes',
+      path: ROUTES.dashboard.approvals.pendingApprovals,
+    },
+    'envios-pendentes': {
+      icon: ClockArrowUpIcon,
+      name: 'Envios pendentes',
+      path: ROUTES.dashboard.approvals.pendingSubmissions,
+    },
+    aprovados: {
+      icon: ClipboardCheckIcon,
+      name: 'Aprovados',
+      path: ROUTES.dashboard.approvals.approved,
+    },
   },
 }
diff --git a/src/constants/breadcrumbs/index.ts b/src/constants/breadcrumbs/index.ts
index e23cd9fa..672ec1a2 100644
--- a/src/constants/breadcrumbs/index.ts
+++ b/src/constants/breadcrumbs/index.ts
@@ -1,25 +1,21 @@
-import { HomeIcon, type LucideIcon } from 'lucide-react'
+import { type LucideIcon } from 'lucide-react'
 
-import { ROUTES } from '../routes'
 import { DASHBOARD_BREADCRUMBS } from './dashboard'
-import { PATIENT_BREADCRUMBS } from './patient'
 
-type BreadcrumbDataType = {
+type BreadcrumbItem = {
   icon: LucideIcon
   name: string
   path: string
 }
 
-export type Breadcrumbs = Record<string, BreadcrumbDataType>
+export type Breadcrumbs = Record<string, Record<string, BreadcrumbItem>>
 
 export const BREADCRUMBS: Breadcrumbs = {
-  home: {
-    icon: HomeIcon,
-    name: 'Início',
-    path: ROUTES.dashboard.main,
-  },
-  ...PATIENT_BREADCRUMBS,
   ...DASHBOARD_BREADCRUMBS,
+  // ...PATIENT_BREADCRUMBS,
 }
 
-export type BreadcrumbType = keyof typeof BREADCRUMBS
+export type BreadcrumbSection = keyof typeof BREADCRUMBS
+export type Breadcrumb = {
+  [K in keyof typeof DASHBOARD_BREADCRUMBS]: keyof (typeof DASHBOARD_BREADCRUMBS)[K]
+}[keyof typeof DASHBOARD_BREADCRUMBS]
diff --git a/src/constants/routes.ts b/src/constants/routes.ts
index bf811aee..284b0859 100644
--- a/src/constants/routes.ts
+++ b/src/constants/routes.ts
@@ -40,7 +40,8 @@ export const ROUTES = {
     },
     approvals: {
       main: '/aprovacoes',
-      pending: '/aprovacoes/pendentes',
+      pendingApprovals: '/aprovacoes/aprovacoes-pendentes',
+      pendingSubmissions: '/aprovacoes/envios-pendentes',
       approved: '/aprovacoes/aprovados',
     },
     team: {

From 505ecf6b9e71fb97b84311a0162d4c63f25e2a9e Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Thu, 22 Jan 2026 00:41:31 -0300
Subject: [PATCH 05/77] chore(patient): hide all patient area pages

---
 src/app/{paciente => _paciente}/_action-help/index.tsx        | 0
 src/app/{paciente => _paciente}/_components/documents-tab.tsx | 0
 .../_header/accessibility-dropdown.tsx                        | 0
 src/app/{paciente => _paciente}/_header/index.tsx             | 4 ++--
 src/app/{paciente => _paciente}/_header/user-dropdown.tsx     | 0
 src/app/{paciente => _paciente}/documentos/enviados/page.tsx  | 0
 src/app/{paciente => _paciente}/documentos/enviados/table.tsx | 0
 src/app/{paciente => _paciente}/documentos/layout.tsx         | 0
 src/app/{paciente => _paciente}/documentos/pendentes/page.tsx | 0
 src/app/{paciente => _paciente}/layout.tsx                    | 2 +-
 src/app/{paciente => _paciente}/page.tsx                      | 0
 src/app/{paciente => _paciente}/triagem/hooks.ts              | 0
 .../triagem/laudo-medico/medical-report-form-schema.tsx       | 0
 .../triagem/laudo-medico/medical-report-form.tsx              | 0
 src/app/{paciente => _paciente}/triagem/laudo-medico/page.tsx | 0
 src/app/{paciente => _paciente}/triagem/layout.tsx            | 0
 src/app/{paciente => _paciente}/triagem/progress.tsx          | 0
 .../{paciente => _paciente}/triagem/rede-de-apoio/page.tsx    | 0
 .../triagem/rede-de-apoio/support-network-cards.tsx           | 2 +-
 .../triagem/rede-de-apoio/support-network-form-schema.ts      | 0
 .../triagem/rede-de-apoio/support-network-form.tsx            | 2 +-
 src/app/{paciente => _paciente}/triagem/seus-dados/page.tsx   | 0
 .../triagem/seus-dados/patient-data-form-schema.tsx           | 0
 .../triagem/seus-dados/patient-data-form.tsx                  | 0
 24 files changed, 5 insertions(+), 5 deletions(-)
 rename src/app/{paciente => _paciente}/_action-help/index.tsx (100%)
 rename src/app/{paciente => _paciente}/_components/documents-tab.tsx (100%)
 rename src/app/{paciente => _paciente}/_header/accessibility-dropdown.tsx (100%)
 rename src/app/{paciente => _paciente}/_header/index.tsx (88%)
 rename src/app/{paciente => _paciente}/_header/user-dropdown.tsx (100%)
 rename src/app/{paciente => _paciente}/documentos/enviados/page.tsx (100%)
 rename src/app/{paciente => _paciente}/documentos/enviados/table.tsx (100%)
 rename src/app/{paciente => _paciente}/documentos/layout.tsx (100%)
 rename src/app/{paciente => _paciente}/documentos/pendentes/page.tsx (100%)
 rename src/app/{paciente => _paciente}/layout.tsx (90%)
 rename src/app/{paciente => _paciente}/page.tsx (100%)
 rename src/app/{paciente => _paciente}/triagem/hooks.ts (100%)
 rename src/app/{paciente => _paciente}/triagem/laudo-medico/medical-report-form-schema.tsx (100%)
 rename src/app/{paciente => _paciente}/triagem/laudo-medico/medical-report-form.tsx (100%)
 rename src/app/{paciente => _paciente}/triagem/laudo-medico/page.tsx (100%)
 rename src/app/{paciente => _paciente}/triagem/layout.tsx (100%)
 rename src/app/{paciente => _paciente}/triagem/progress.tsx (100%)
 rename src/app/{paciente => _paciente}/triagem/rede-de-apoio/page.tsx (100%)
 rename src/app/{paciente => _paciente}/triagem/rede-de-apoio/support-network-cards.tsx (91%)
 rename src/app/{paciente => _paciente}/triagem/rede-de-apoio/support-network-form-schema.ts (100%)
 rename src/app/{paciente => _paciente}/triagem/rede-de-apoio/support-network-form.tsx (97%)
 rename src/app/{paciente => _paciente}/triagem/seus-dados/page.tsx (100%)
 rename src/app/{paciente => _paciente}/triagem/seus-dados/patient-data-form-schema.tsx (100%)
 rename src/app/{paciente => _paciente}/triagem/seus-dados/patient-data-form.tsx (100%)

diff --git a/src/app/paciente/_action-help/index.tsx b/src/app/_paciente/_action-help/index.tsx
similarity index 100%
rename from src/app/paciente/_action-help/index.tsx
rename to src/app/_paciente/_action-help/index.tsx
diff --git a/src/app/paciente/_components/documents-tab.tsx b/src/app/_paciente/_components/documents-tab.tsx
similarity index 100%
rename from src/app/paciente/_components/documents-tab.tsx
rename to src/app/_paciente/_components/documents-tab.tsx
diff --git a/src/app/paciente/_header/accessibility-dropdown.tsx b/src/app/_paciente/_header/accessibility-dropdown.tsx
similarity index 100%
rename from src/app/paciente/_header/accessibility-dropdown.tsx
rename to src/app/_paciente/_header/accessibility-dropdown.tsx
diff --git a/src/app/paciente/_header/index.tsx b/src/app/_paciente/_header/index.tsx
similarity index 88%
rename from src/app/paciente/_header/index.tsx
rename to src/app/_paciente/_header/index.tsx
index 9ffd7333..7107f2be 100644
--- a/src/app/paciente/_header/index.tsx
+++ b/src/app/_paciente/_header/index.tsx
@@ -4,8 +4,8 @@ import Image from 'next/image'
 import Link from 'next/link'
 
 import { getCurrentUser } from '@/actions/users'
-import { PatientHeaderAccessibilityDropdown } from '@/app/paciente/_header/accessibility-dropdown'
-import { PatientHeaderUserDropdown } from '@/app/paciente/_header/user-dropdown'
+import { PatientHeaderAccessibilityDropdown } from '@/app/_paciente/_header/accessibility-dropdown'
+import { PatientHeaderUserDropdown } from '@/app/_paciente/_header/user-dropdown'
 import { Breadcrumbs } from '@/components/breadcrumbs'
 import { Button } from '@/components/ui/button'
 import { ROUTES } from '@/constants/routes'
diff --git a/src/app/paciente/_header/user-dropdown.tsx b/src/app/_paciente/_header/user-dropdown.tsx
similarity index 100%
rename from src/app/paciente/_header/user-dropdown.tsx
rename to src/app/_paciente/_header/user-dropdown.tsx
diff --git a/src/app/paciente/documentos/enviados/page.tsx b/src/app/_paciente/documentos/enviados/page.tsx
similarity index 100%
rename from src/app/paciente/documentos/enviados/page.tsx
rename to src/app/_paciente/documentos/enviados/page.tsx
diff --git a/src/app/paciente/documentos/enviados/table.tsx b/src/app/_paciente/documentos/enviados/table.tsx
similarity index 100%
rename from src/app/paciente/documentos/enviados/table.tsx
rename to src/app/_paciente/documentos/enviados/table.tsx
diff --git a/src/app/paciente/documentos/layout.tsx b/src/app/_paciente/documentos/layout.tsx
similarity index 100%
rename from src/app/paciente/documentos/layout.tsx
rename to src/app/_paciente/documentos/layout.tsx
diff --git a/src/app/paciente/documentos/pendentes/page.tsx b/src/app/_paciente/documentos/pendentes/page.tsx
similarity index 100%
rename from src/app/paciente/documentos/pendentes/page.tsx
rename to src/app/_paciente/documentos/pendentes/page.tsx
diff --git a/src/app/paciente/layout.tsx b/src/app/_paciente/layout.tsx
similarity index 90%
rename from src/app/paciente/layout.tsx
rename to src/app/_paciente/layout.tsx
index d9798bbc..5b4aba6a 100644
--- a/src/app/paciente/layout.tsx
+++ b/src/app/_paciente/layout.tsx
@@ -1,7 +1,7 @@
 import { redirect } from 'next/navigation'
 
 import { canUser } from '@/actions/auth'
-import { PatientHeader } from '@/app/paciente/_header'
+import { PatientHeader } from '@/app/_paciente/_header'
 import { Divider } from '@/components/ui/divider'
 import { ROUTES } from '@/constants/routes'
 
diff --git a/src/app/paciente/page.tsx b/src/app/_paciente/page.tsx
similarity index 100%
rename from src/app/paciente/page.tsx
rename to src/app/_paciente/page.tsx
diff --git a/src/app/paciente/triagem/hooks.ts b/src/app/_paciente/triagem/hooks.ts
similarity index 100%
rename from src/app/paciente/triagem/hooks.ts
rename to src/app/_paciente/triagem/hooks.ts
diff --git a/src/app/paciente/triagem/laudo-medico/medical-report-form-schema.tsx b/src/app/_paciente/triagem/laudo-medico/medical-report-form-schema.tsx
similarity index 100%
rename from src/app/paciente/triagem/laudo-medico/medical-report-form-schema.tsx
rename to src/app/_paciente/triagem/laudo-medico/medical-report-form-schema.tsx
diff --git a/src/app/paciente/triagem/laudo-medico/medical-report-form.tsx b/src/app/_paciente/triagem/laudo-medico/medical-report-form.tsx
similarity index 100%
rename from src/app/paciente/triagem/laudo-medico/medical-report-form.tsx
rename to src/app/_paciente/triagem/laudo-medico/medical-report-form.tsx
diff --git a/src/app/paciente/triagem/laudo-medico/page.tsx b/src/app/_paciente/triagem/laudo-medico/page.tsx
similarity index 100%
rename from src/app/paciente/triagem/laudo-medico/page.tsx
rename to src/app/_paciente/triagem/laudo-medico/page.tsx
diff --git a/src/app/paciente/triagem/layout.tsx b/src/app/_paciente/triagem/layout.tsx
similarity index 100%
rename from src/app/paciente/triagem/layout.tsx
rename to src/app/_paciente/triagem/layout.tsx
diff --git a/src/app/paciente/triagem/progress.tsx b/src/app/_paciente/triagem/progress.tsx
similarity index 100%
rename from src/app/paciente/triagem/progress.tsx
rename to src/app/_paciente/triagem/progress.tsx
diff --git a/src/app/paciente/triagem/rede-de-apoio/page.tsx b/src/app/_paciente/triagem/rede-de-apoio/page.tsx
similarity index 100%
rename from src/app/paciente/triagem/rede-de-apoio/page.tsx
rename to src/app/_paciente/triagem/rede-de-apoio/page.tsx
diff --git a/src/app/paciente/triagem/rede-de-apoio/support-network-cards.tsx b/src/app/_paciente/triagem/rede-de-apoio/support-network-cards.tsx
similarity index 91%
rename from src/app/paciente/triagem/rede-de-apoio/support-network-cards.tsx
rename to src/app/_paciente/triagem/rede-de-apoio/support-network-cards.tsx
index d032a8e2..f3332a1a 100644
--- a/src/app/paciente/triagem/rede-de-apoio/support-network-cards.tsx
+++ b/src/app/_paciente/triagem/rede-de-apoio/support-network-cards.tsx
@@ -1,6 +1,6 @@
 import { Trash2Icon } from 'lucide-react'
 
-import type { ScreeningSupportNetworkFormSchema } from '@/app/paciente/triagem/rede-de-apoio/support-network-form-schema'
+import type { ScreeningSupportNetworkFormSchema } from '@/app/_paciente/triagem/rede-de-apoio/support-network-form-schema'
 import { Avatar } from '@/components/ui/avatar'
 import { Button } from '@/components/ui/button'
 import { Card } from '@/components/ui/card'
diff --git a/src/app/paciente/triagem/rede-de-apoio/support-network-form-schema.ts b/src/app/_paciente/triagem/rede-de-apoio/support-network-form-schema.ts
similarity index 100%
rename from src/app/paciente/triagem/rede-de-apoio/support-network-form-schema.ts
rename to src/app/_paciente/triagem/rede-de-apoio/support-network-form-schema.ts
diff --git a/src/app/paciente/triagem/rede-de-apoio/support-network-form.tsx b/src/app/_paciente/triagem/rede-de-apoio/support-network-form.tsx
similarity index 97%
rename from src/app/paciente/triagem/rede-de-apoio/support-network-form.tsx
rename to src/app/_paciente/triagem/rede-de-apoio/support-network-form.tsx
index 18b135ad..6e98f166 100644
--- a/src/app/paciente/triagem/rede-de-apoio/support-network-form.tsx
+++ b/src/app/_paciente/triagem/rede-de-apoio/support-network-form.tsx
@@ -7,7 +7,7 @@ import { useEffect, useState, useTransition } from 'react'
 import { FormProvider, useForm } from 'react-hook-form'
 import { toast } from 'sonner'
 
-import { ScreeningSupportNetworkCards } from '@/app/paciente/triagem/rede-de-apoio/support-network-cards'
+import { ScreeningSupportNetworkCards } from '@/app/_paciente/triagem/rede-de-apoio/support-network-cards'
 import { FormContainer } from '@/components/form/form-container'
 import { TextInput } from '@/components/form/text-input'
 import { Button } from '@/components/ui/button'
diff --git a/src/app/paciente/triagem/seus-dados/page.tsx b/src/app/_paciente/triagem/seus-dados/page.tsx
similarity index 100%
rename from src/app/paciente/triagem/seus-dados/page.tsx
rename to src/app/_paciente/triagem/seus-dados/page.tsx
diff --git a/src/app/paciente/triagem/seus-dados/patient-data-form-schema.tsx b/src/app/_paciente/triagem/seus-dados/patient-data-form-schema.tsx
similarity index 100%
rename from src/app/paciente/triagem/seus-dados/patient-data-form-schema.tsx
rename to src/app/_paciente/triagem/seus-dados/patient-data-form-schema.tsx
diff --git a/src/app/paciente/triagem/seus-dados/patient-data-form.tsx b/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
similarity index 100%
rename from src/app/paciente/triagem/seus-dados/patient-data-form.tsx
rename to src/app/_paciente/triagem/seus-dados/patient-data-form.tsx

From 364a7b30f62c92b01478ddd80837a379d56584e0 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Thu, 22 Jan 2026 19:55:48 -0300
Subject: [PATCH 06/77] refactor(dashboard): create global dashboard tab
 buttons

---
 src/app/(dashboard)/aprovacoes/layout.tsx     |  32 ----
 .../(dashboard)/configuracoes/fontes/page.tsx |  10 +-
 .../(dashboard)/encaminhamentos/layout.tsx    |  28 ----
 src/app/(dashboard)/equipe/page.tsx           |   7 +-
 src/app/(dashboard)/layout.tsx                |   7 +-
 src/app/(dashboard)/pacientes/[id]/layout.tsx |  39 -----
 .../(dashboard)/pacientes/cadastrar/page.tsx  |   5 +-
 src/app/(dashboard)/pacientes/page.tsx        |   9 +-
 src/app/(dashboard)/page.tsx                  |  27 ++--
 src/app/(dashboard)/perfil/page.tsx           | 137 +++++++++---------
 src/components/dashboard/container.tsx        |  13 --
 src/components/dashboard/tab-buttons.tsx      |  38 ++++-
 src/constants/section-tab-buttons.ts          |  48 ++++++
 13 files changed, 172 insertions(+), 228 deletions(-)
 delete mode 100644 src/app/(dashboard)/aprovacoes/layout.tsx
 delete mode 100644 src/app/(dashboard)/encaminhamentos/layout.tsx
 delete mode 100644 src/app/(dashboard)/pacientes/[id]/layout.tsx
 delete mode 100644 src/components/dashboard/container.tsx
 create mode 100644 src/constants/section-tab-buttons.ts

diff --git a/src/app/(dashboard)/aprovacoes/layout.tsx b/src/app/(dashboard)/aprovacoes/layout.tsx
deleted file mode 100644
index 2fa8967c..00000000
--- a/src/app/(dashboard)/aprovacoes/layout.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import { DashboardContainer } from '@/components/dashboard/container'
-import { DashboardTabButtons } from '@/components/dashboard/tab-buttons'
-import { ROUTES } from '@/constants/routes'
-
-export default function Layout({
-  children,
-}: Readonly<{ children: React.ReactNode }>) {
-  const tabButtons = [
-    {
-      title: 'Aprovações pendentes',
-      path: ROUTES.dashboard.approvals.main,
-    },
-    {
-      title: 'Envios pendentes',
-      path: ROUTES.dashboard.approvals.pendingSubmissions,
-    },
-    {
-      title: 'Aprovados',
-      path: ROUTES.dashboard.approvals.approved,
-    },
-  ]
-
-  return (
-    <>
-      <DashboardTabButtons buttons={tabButtons} />
-
-      <DashboardContainer className='flex flex-col gap-6'>
-        {children}
-      </DashboardContainer>
-    </>
-  )
-}
diff --git a/src/app/(dashboard)/configuracoes/fontes/page.tsx b/src/app/(dashboard)/configuracoes/fontes/page.tsx
index 61cb28ad..e0911549 100644
--- a/src/app/(dashboard)/configuracoes/fontes/page.tsx
+++ b/src/app/(dashboard)/configuracoes/fontes/page.tsx
@@ -1,17 +1,11 @@
 import type { Metadata } from 'next'
 
-import { SettingsContainer } from '@/modules/settings/layout/settings-container'
-
-import { FontSizeCards } from '../../../../modules/settings/cards/fontsize/fontsize-cards'
+import { FontSizeCards } from '@/modules/settings/cards/fontsize/fontsize-cards'
 
 export const metadata: Metadata = {
   title: 'Tamanho da fonte',
 }
 
 export default function Page() {
-  return (
-    <SettingsContainer className='flex flex-col gap-6'>
-      <FontSizeCards />
-    </SettingsContainer>
-  )
+  return <FontSizeCards />
 }
diff --git a/src/app/(dashboard)/encaminhamentos/layout.tsx b/src/app/(dashboard)/encaminhamentos/layout.tsx
deleted file mode 100644
index 971fba1b..00000000
--- a/src/app/(dashboard)/encaminhamentos/layout.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import { DashboardContainer } from '@/components/dashboard/container'
-import { DashboardTabButtons } from '@/components/dashboard/tab-buttons'
-import { ROUTES } from '@/constants/routes'
-
-export default function Layout({
-  children,
-}: Readonly<{ children: React.ReactNode }>) {
-  const tabButtons = [
-    {
-      title: 'Dados gerais',
-      path: ROUTES.dashboard.referrals.main,
-    },
-    {
-      title: 'Encaminhamentos',
-      path: ROUTES.dashboard.referrals.list,
-    },
-  ]
-
-  return (
-    <>
-      <DashboardTabButtons buttons={tabButtons} />
-
-      <DashboardContainer className='flex flex-col gap-6'>
-        {children}
-      </DashboardContainer>
-    </>
-  )
-}
diff --git a/src/app/(dashboard)/equipe/page.tsx b/src/app/(dashboard)/equipe/page.tsx
index d7b1d200..3491eecc 100644
--- a/src/app/(dashboard)/equipe/page.tsx
+++ b/src/app/(dashboard)/equipe/page.tsx
@@ -1,6 +1,5 @@
 import type { Metadata } from 'next'
 
-import { DashboardContainer } from '@/components/dashboard/container'
 import { TeamListTable } from '@/modules/teams/table'
 
 export const metadata: Metadata = {
@@ -8,9 +7,5 @@ export const metadata: Metadata = {
 }
 
 export default function Page() {
-  return (
-    <DashboardContainer className='flex flex-col gap-6'>
-      <TeamListTable />
-    </DashboardContainer>
-  )
+  return <TeamListTable />
 }
diff --git a/src/app/(dashboard)/layout.tsx b/src/app/(dashboard)/layout.tsx
index d5e92d39..b507ec3f 100644
--- a/src/app/(dashboard)/layout.tsx
+++ b/src/app/(dashboard)/layout.tsx
@@ -2,6 +2,7 @@ import { redirect } from 'next/navigation'
 
 import { canUser } from '@/actions/auth'
 import { DashboardHeader } from '@/components/dashboard/header'
+import { DashboardTabButtons } from '@/components/dashboard/tab-buttons'
 import { DashboardWrapper } from '@/components/dashboard/wrapper'
 import { DashboardSidebar } from '@/components/sidebar'
 import { ROUTES } from '@/constants/routes'
@@ -21,7 +22,11 @@ export default async function Layout({
 
       <DashboardWrapper>
         <DashboardHeader />
-        {children}
+        <DashboardTabButtons />
+
+        <main className='bg-background-soft flex flex-1 flex-col gap-6 p-8'>
+          {children}
+        </main>
       </DashboardWrapper>
     </>
   )
diff --git a/src/app/(dashboard)/pacientes/[id]/layout.tsx b/src/app/(dashboard)/pacientes/[id]/layout.tsx
deleted file mode 100644
index f1df025b..00000000
--- a/src/app/(dashboard)/pacientes/[id]/layout.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-import { DashboardContainer } from '@/components/dashboard/container'
-import { DashboardTabButtons } from '@/components/dashboard/tab-buttons'
-import { ROUTES } from '@/constants/routes'
-
-interface LayoutProps {
-  params: Promise<{ id: string }>
-  children: React.ReactNode
-}
-
-export default async function Layout({
-  params,
-  children,
-}: Readonly<LayoutProps>) {
-  const patientId = (await params).id
-
-  const tabButtons = [
-    {
-      title: 'Informações do paciente',
-      path: ROUTES.dashboard.patients.details.info(patientId),
-    },
-    {
-      title: 'Histórico do paciente',
-      path: ROUTES.dashboard.patients.details.history(patientId),
-    },
-    {
-      title: 'Documentos',
-      path: ROUTES.dashboard.patients.details.documents(patientId),
-    },
-  ]
-
-  return (
-    <>
-      <DashboardTabButtons buttons={tabButtons} />
-      <DashboardContainer className='flex flex-col gap-6'>
-        {children}
-      </DashboardContainer>
-    </>
-  )
-}
diff --git a/src/app/(dashboard)/pacientes/cadastrar/page.tsx b/src/app/(dashboard)/pacientes/cadastrar/page.tsx
index 3b9124c6..be748e73 100644
--- a/src/app/(dashboard)/pacientes/cadastrar/page.tsx
+++ b/src/app/(dashboard)/pacientes/cadastrar/page.tsx
@@ -1,7 +1,6 @@
 import { UserRoundPlusIcon } from 'lucide-react'
 import type { Metadata } from 'next'
 
-import { DashboardContainer } from '@/components/dashboard/container'
 import { PatientForm } from '@/modules/patients/form'
 
 export const metadata: Metadata = {
@@ -10,7 +9,7 @@ export const metadata: Metadata = {
 
 export default function Page() {
   return (
-    <DashboardContainer className='flex flex-col gap-6'>
+    <>
       <div className='flex items-center gap-4'>
         <span className='bg-border/50 rounded-lg p-2'>
           <UserRoundPlusIcon className='text-primary size-5.5' />
@@ -20,6 +19,6 @@ export default function Page() {
       </div>
 
       <PatientForm mode='create' />
-    </DashboardContainer>
+    </>
   )
 }
diff --git a/src/app/(dashboard)/pacientes/page.tsx b/src/app/(dashboard)/pacientes/page.tsx
index db02417c..c25d7e47 100644
--- a/src/app/(dashboard)/pacientes/page.tsx
+++ b/src/app/(dashboard)/pacientes/page.tsx
@@ -1,7 +1,6 @@
 import type { Metadata } from 'next'
 import { Suspense } from 'react'
 
-import { DashboardContainer } from '@/components/dashboard/container'
 import { PatientsListTable } from '@/modules/patients/list/table'
 
 export const metadata: Metadata = {
@@ -10,10 +9,8 @@ export const metadata: Metadata = {
 
 export default function Page() {
   return (
-    <DashboardContainer className='flex flex-col gap-6'>
-      <Suspense fallback={<div>Carregando...</div>}>
-        <PatientsListTable />
-      </Suspense>
-    </DashboardContainer>
+    <Suspense fallback={<div>Carregando...</div>}>
+      <PatientsListTable />
+    </Suspense>
   )
 }
diff --git a/src/app/(dashboard)/page.tsx b/src/app/(dashboard)/page.tsx
index 3bb85f53..52e170ac 100644
--- a/src/app/(dashboard)/page.tsx
+++ b/src/app/(dashboard)/page.tsx
@@ -1,6 +1,5 @@
 import { Suspense } from 'react'
 
-import { DashboardContainer } from '@/components/dashboard/container'
 import { Skeleton } from '@/components/ui/skeleton'
 import AppointmentsCard from '@/modules/dashboard/appointments-card'
 import { PatientsByCityCard } from '@/modules/dashboard/patients-by-city-card'
@@ -11,21 +10,19 @@ export const dynamic = 'force-dynamic'
 
 export default function Page() {
   return (
-    <DashboardContainer>
-      <div className='grid grid-cols-1 gap-6 sm:grid-cols-6'>
-        <Suspense
-          fallback={
-            <Skeleton quantity={3} className='h-28 rounded-2xl sm:col-span-2' />
-          }
-        >
-          <PatientsByStatusCards />
-        </Suspense>
+    <div className='grid grid-cols-1 gap-6 sm:grid-cols-6'>
+      <Suspense
+        fallback={
+          <Skeleton quantity={3} className='h-28 rounded-2xl sm:col-span-2' />
+        }
+      >
+        <PatientsByStatusCards />
+      </Suspense>
 
-        <PatientsByGenderCard className='sm:col-span-3' />
-        <PatientsByCityCard className='sm:col-span-3' />
+      <PatientsByGenderCard className='sm:col-span-3' />
+      <PatientsByCityCard className='sm:col-span-3' />
 
-        <AppointmentsCard />
-      </div>
-    </DashboardContainer>
+      <AppointmentsCard />
+    </div>
   )
 }
diff --git a/src/app/(dashboard)/perfil/page.tsx b/src/app/(dashboard)/perfil/page.tsx
index 5d9d0513..8d09832e 100644
--- a/src/app/(dashboard)/perfil/page.tsx
+++ b/src/app/(dashboard)/perfil/page.tsx
@@ -4,7 +4,6 @@ import { ArrowLeftIcon, Loader2 } from 'lucide-react'
 import { useEffect, useState } from 'react'
 
 import { getCurrentUser } from '@/actions/users'
-import { DashboardContainer } from '@/components/dashboard/container'
 import { Avatar } from '@/components/ui/avatar'
 import { Button } from '@/components/ui/button'
 import { DatePicker } from '@/components/ui/date-picker'
@@ -78,79 +77,77 @@ export default function Page() {
 
   return (
     <div className='mx-auto max-w-3xl p-6'>
-      <DashboardContainer className='flex flex-col gap-6'>
-        <NavButton
-          href=''
-          variant='ghost'
-          className='text-foreground-soft mr-auto'
-        >
-          <ArrowLeftIcon />
-          Voltar
-        </NavButton>
-        <div className='flex gap-3'>
-          <div className='flex flex-col items-center gap-1'>
-            <Avatar className='size-16' />
-            <Button variant='outline'>Escolher</Button>
-          </div>
-          <div className='flex flex-col'>
-            <span>Imagem</span>
-            <span className='text-foreground-soft text-sm'>
-              Min 400x400px, PNG ou JPEG
-            </span>
+      <NavButton
+        href=''
+        variant='ghost'
+        className='text-foreground-soft mr-auto'
+      >
+        <ArrowLeftIcon />
+        Voltar
+      </NavButton>
+      <div className='flex gap-3'>
+        <div className='flex flex-col items-center gap-1'>
+          <Avatar className='size-16' />
+          <Button variant='outline'>Escolher</Button>
+        </div>
+        <div className='flex flex-col'>
+          <span>Imagem</span>
+          <span className='text-foreground-soft text-sm'>
+            Min 400x400px, PNG ou JPEG
+          </span>
+        </div>
+        <div>
+          <div>
+            <label className='text-muted-foreground text-sm'>
+              Data de entrada
+            </label>
+            <DatePicker
+              value={new Date().toLocaleDateString('pt-BR')}
+              readOnly
+            />
           </div>
+
           <div>
-            <div>
-              <label className='text-muted-foreground text-sm'>
-                Data de entrada
-              </label>
-              <DatePicker
-                value={new Date().toLocaleDateString('pt-BR')}
-                readOnly
-              />
-            </div>
-
-            <div>
-              <label className='text-muted-foreground text-sm'>
-                Profissional
-              </label>
-              <Input value={user.role ?? ''} readOnly />
-            </div>
-
-            {isEspecialist && (
-              <>
-                <div>
-                  <label className='text-muted-foreground text-sm'>
-                    Categoria
-                  </label>
-                  <Input
-                    value={user.category ?? ''}
-                    placeholder='Não informado'
-                    readOnly
-                  />
-                </div>
-
-                <div>
-                  <label className='text-muted-foreground text-sm'>
-                    Registro
-                  </label>
-                  <Input
-                    value={user.register ?? ''}
-                    placeholder='Não informado'
-                    readOnly
-                  />
-                </div>
-              </>
-            )}
-
-            <div className='pt-4'>
-              <ChangePasswordButton />
-            </div>
+            <label className='text-muted-foreground text-sm'>
+              Profissional
+            </label>
+            <Input value={user.role ?? ''} readOnly />
+          </div>
+
+          {isEspecialist && (
+            <>
+              <div>
+                <label className='text-muted-foreground text-sm'>
+                  Categoria
+                </label>
+                <Input
+                  value={user.category ?? ''}
+                  placeholder='Não informado'
+                  readOnly
+                />
+              </div>
+
+              <div>
+                <label className='text-muted-foreground text-sm'>
+                  Registro
+                </label>
+                <Input
+                  value={user.register ?? ''}
+                  placeholder='Não informado'
+                  readOnly
+                />
+              </div>
+            </>
+          )}
+
+          <div className='pt-4'>
+            <ChangePasswordButton />
           </div>
         </div>
-        <ProfileForm />
-        <Divider />
-        <ChangePasswordButton />
-      </DashboardContainer>
+      </div>
+      <ProfileForm />
+      <Divider />
+      <ChangePasswordButton />
     </div>
   )
 }
diff --git a/src/components/dashboard/container.tsx b/src/components/dashboard/container.tsx
deleted file mode 100644
index 44c26a58..00000000
--- a/src/components/dashboard/container.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { cn } from '@/utils/class-name-merge'
-
-export function DashboardContainer({
-  className,
-  ...props
-}: Readonly<React.ComponentProps<'main'>>) {
-  return (
-    <main
-      className={cn('bg-background-soft flex-1 p-8', className)}
-      {...props}
-    />
-  )
-}
diff --git a/src/components/dashboard/tab-buttons.tsx b/src/components/dashboard/tab-buttons.tsx
index f64648d3..6223a7aa 100644
--- a/src/components/dashboard/tab-buttons.tsx
+++ b/src/components/dashboard/tab-buttons.tsx
@@ -1,16 +1,40 @@
+'use client'
+
+import { usePathname } from 'next/navigation'
+
+import {
+  SECTION_TAB_BUTTONS,
+  type SectionTabButton,
+} from '@/constants/section-tab-buttons'
+
 import { Divider } from '../ui/divider'
 import { TabButtons } from '../ui/tab-buttons'
 
-interface DashboardTabButtonsProps {
-  buttons: Array<{ title: string; path: string }>
-}
+export function DashboardTabButtons() {
+  const segments = usePathname().split('/').filter(Boolean)
+  const section = segments[0]
+
+  const buttons = SECTION_TAB_BUTTONS[section as SectionTabButton]
+
+  const hidePatientDetailsButtons =
+    section === 'pacientes' && segments.length < 2
+
+  if (!buttons || hidePatientDetailsButtons) {
+    return null
+  }
+
+  // Resolve dynamic paths (e.g., for patients section with patient ID)
+  const resolvedButtons = buttons.map((button) => ({
+    title: button.title,
+    path:
+      typeof button.path === 'function'
+        ? button.path(segments[1])
+        : button.path,
+  }))
 
-export function DashboardTabButtons({
-  buttons,
-}: Readonly<DashboardTabButtonsProps>) {
   return (
     <>
-      <TabButtons buttons={buttons} className='px-8' />
+      <TabButtons buttons={resolvedButtons} className='px-8' />
       <Divider />
     </>
   )
diff --git a/src/constants/section-tab-buttons.ts b/src/constants/section-tab-buttons.ts
new file mode 100644
index 00000000..2a95c5ee
--- /dev/null
+++ b/src/constants/section-tab-buttons.ts
@@ -0,0 +1,48 @@
+import { ROUTES } from './routes'
+
+type TabButton = {
+  title: string
+  path: string | ((param: string) => string)
+}
+
+export const SECTION_TAB_BUTTONS: Record<string, Array<TabButton>> = {
+  pacientes: [
+    {
+      title: 'Informações do paciente',
+      path: ROUTES.dashboard.patients.details.info,
+    },
+    {
+      title: 'Histórico do paciente',
+      path: ROUTES.dashboard.patients.details.history,
+    },
+    {
+      title: 'Documentos',
+      path: ROUTES.dashboard.patients.details.documents,
+    },
+  ],
+  encaminhamentos: [
+    {
+      title: 'Visão geral',
+      path: ROUTES.dashboard.referrals.main,
+    },
+    {
+      title: 'Lista de encaminhamentos',
+      path: ROUTES.dashboard.referrals.list,
+    },
+  ],
+  aprovacoes: [
+    {
+      title: 'Aprovações pendentes',
+      path: ROUTES.dashboard.approvals.pendingApprovals,
+    },
+    {
+      title: 'Envios pendentes',
+      path: ROUTES.dashboard.approvals.pendingSubmissions,
+    },
+    {
+      title: 'Aprovados',
+      path: ROUTES.dashboard.approvals.approved,
+    },
+  ],
+}
+export type SectionTabButton = keyof typeof SECTION_TAB_BUTTONS

From e7d293db4f4b02d4a320ff813cea2857373ad8c1 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 23 Jan 2026 23:28:06 -0300
Subject: [PATCH 07/77] refactor(dashboard): reorganize files structure and
 update summary cards

---
 src/actions/appointments/get-appointments.ts  |  37 ++++
 .../statistics/get-total-appointments.ts      |  42 ++++
 .../get-total-patients.ts}                    |  22 ++-
 src/actions/statistics/get-total-referrals.ts |  39 ++++
 src/app/(dashboard)/page.tsx                  |  22 +--
 src/components/dashboard/cards/chart.tsx      |   5 +-
 src/components/select-period.tsx              |   6 +-
 src/components/summary-card.tsx               |  37 ++++
 src/components/ui/select.tsx                  |  40 ++--
 src/components/ui/table.tsx                   |  35 ++++
 src/constants/cache.ts                        |  20 +-
 src/enums/appointments.ts                     |  16 ++
 src/{types => enums}/queries.ts               |   6 +-
 src/enums/referrals.ts                        |  15 ++
 src/enums/shared.ts                           |  19 ++
 src/hooks/use-patient-otions.ts               |   7 +-
 .../appointments/appointment-modal.tsx        |  43 +++--
 src/modules/dashboard/appointments-card.tsx   | 182 ++++++++++--------
 .../dashboard/patients-by-city-card.tsx       |  10 +-
 .../dashboard/patients-by-gender-card.tsx     |  10 +-
 .../dashboard/patients-by-status-cards.tsx    |  15 +-
 src/modules/dashboard/summary-cards.tsx       |  37 ++++
 src/modules/patients/inactivate-modal.tsx     |   2 +-
 src/modules/patients/list/table.tsx           |   9 +-
 src/modules/referrals/referrals-modal.tsx     |   9 +-
 src/types/appointments.d.ts                   |  22 +++
 src/types/referrals.d.ts                      |  22 +++
 src/types/referrals.ts                        |  57 ------
 28 files changed, 550 insertions(+), 236 deletions(-)
 create mode 100644 src/actions/appointments/get-appointments.ts
 create mode 100644 src/actions/statistics/get-total-appointments.ts
 rename src/actions/{patients/statistics/get-total-patients-by-status.ts => statistics/get-total-patients.ts} (52%)
 create mode 100644 src/actions/statistics/get-total-referrals.ts
 create mode 100644 src/components/summary-card.tsx
 create mode 100644 src/enums/appointments.ts
 rename src/{types => enums}/queries.ts (71%)
 create mode 100644 src/enums/referrals.ts
 create mode 100644 src/enums/shared.ts
 create mode 100644 src/modules/dashboard/summary-cards.tsx
 create mode 100644 src/types/appointments.d.ts
 create mode 100644 src/types/referrals.d.ts
 delete mode 100644 src/types/referrals.ts

diff --git a/src/actions/appointments/get-appointments.ts b/src/actions/appointments/get-appointments.ts
new file mode 100644
index 00000000..c94111cb
--- /dev/null
+++ b/src/actions/appointments/get-appointments.ts
@@ -0,0 +1,37 @@
+'use server'
+
+import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import { api } from '@/lib/api'
+import type { Appointment } from '@/types/appointments'
+
+type GetAppointmentsParams = {
+  limit?: number
+}
+
+export async function getAppointments(params?: GetAppointmentsParams) {
+  const REVALIDATE_IN_SECONDS = 3600
+
+  try {
+    const response = await api<{ appointments: Appointment[]; total: number }>(
+      '/appointments',
+      {
+        params,
+        includeCookies: true,
+        cache: 'force-cache',
+        next: {
+          revalidate: REVALIDATE_IN_SECONDS,
+          tags: [NEXT_CACHE_TAGS.appointments(JSON.stringify(params))],
+        },
+      },
+    )
+
+    if (!response.data) {
+      return null
+    }
+
+    return response.data
+  } catch (error) {
+    console.error('Failed to fetch appointments:', error)
+    return null
+  }
+}
diff --git a/src/actions/statistics/get-total-appointments.ts b/src/actions/statistics/get-total-appointments.ts
new file mode 100644
index 00000000..ddc00e30
--- /dev/null
+++ b/src/actions/statistics/get-total-appointments.ts
@@ -0,0 +1,42 @@
+'use server'
+
+import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import { api } from '@/lib/api'
+
+type GetTotalAppointmentsParams = {
+  period?: string
+}
+
+export async function getTotalAppointments(
+  params?: GetTotalAppointmentsParams,
+) {
+  const REVALIDATE_IN_SECONDS = 3600
+
+  try {
+    const response = await api<{ total: number }>(
+      '/statistics/appointments-total',
+      {
+        params,
+        includeCookies: true,
+        cache: 'force-cache',
+        next: {
+          revalidate: REVALIDATE_IN_SECONDS,
+          tags: [
+            NEXT_CACHE_TAGS.statistics.totalAppointments(
+              JSON.stringify(params),
+            ),
+          ],
+        },
+      },
+    )
+
+    if (!response.data) {
+      return null
+    }
+
+    return response.data
+  } catch (error) {
+    console.error('Failed to fetch total appointments statistic:', error)
+    return null
+  }
+}
diff --git a/src/actions/patients/statistics/get-total-patients-by-status.ts b/src/actions/statistics/get-total-patients.ts
similarity index 52%
rename from src/actions/patients/statistics/get-total-patients-by-status.ts
rename to src/actions/statistics/get-total-patients.ts
index 0ad2ac8e..1fcf29b3 100644
--- a/src/actions/patients/statistics/get-total-patients-by-status.ts
+++ b/src/actions/statistics/get-total-patients.ts
@@ -3,20 +3,27 @@
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { api } from '@/lib/api'
 
-type StatisticType = 'total' | 'active' | 'inactive'
+type Status = 'total' | 'active' | 'inactive'
 
-export async function getTotalPatientsByStatus() {
+type GetTotalPatientsParams = {
+  period?: string
+}
+
+export async function getTotalPatients(params?: GetTotalPatientsParams) {
   const REVALIDATE_IN_SECONDS = 3600
 
   try {
-    const response = await api<Record<StatisticType, number>>(
-      '/statistics/patients/total',
+    const response = await api<Record<Status, number>>(
+      '/statistics/patients-total',
       {
+        params,
         includeCookies: true,
         cache: 'force-cache',
         next: {
           revalidate: REVALIDATE_IN_SECONDS,
-          tags: [NEXT_CACHE_TAGS.statistics.totalPatientsByStatus],
+          tags: [
+            NEXT_CACHE_TAGS.statistics.totalPatients(JSON.stringify(params)),
+          ],
         },
       },
     )
@@ -25,10 +32,7 @@ export async function getTotalPatientsByStatus() {
       return null
     }
 
-    return Object.entries(response.data).map(([label, value]) => ({
-      label: label as StatisticType,
-      value,
-    }))
+    return response.data
   } catch (error) {
     console.error('Failed to fetch patients statistics:', error)
     return null
diff --git a/src/actions/statistics/get-total-referrals.ts b/src/actions/statistics/get-total-referrals.ts
new file mode 100644
index 00000000..9d24e7fe
--- /dev/null
+++ b/src/actions/statistics/get-total-referrals.ts
@@ -0,0 +1,39 @@
+'use server'
+
+import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import type { QueryPeriod } from '@/enums/queries'
+import { api } from '@/lib/api'
+
+type GetTotalReferralsParams = {
+  period?: QueryPeriod
+}
+
+export async function getTotalReferrals(params?: GetTotalReferralsParams) {
+  const REVALIDATE_IN_SECONDS = 3600
+
+  try {
+    const response = await api<{ total: number }>(
+      '/statistics/referrals-total',
+      {
+        params,
+        includeCookies: true,
+        cache: 'force-cache',
+        next: {
+          revalidate: REVALIDATE_IN_SECONDS,
+          tags: [
+            NEXT_CACHE_TAGS.statistics.totalReferrals(JSON.stringify(params)),
+          ],
+        },
+      },
+    )
+
+    if (!response.data) {
+      return null
+    }
+
+    return response.data
+  } catch (error) {
+    console.error('Failed to fetch total referrals statistic:', error)
+    return null
+  }
+}
diff --git a/src/app/(dashboard)/page.tsx b/src/app/(dashboard)/page.tsx
index 52e170ac..0ec52b9f 100644
--- a/src/app/(dashboard)/page.tsx
+++ b/src/app/(dashboard)/page.tsx
@@ -1,28 +1,26 @@
 import { Suspense } from 'react'
 
 import { Skeleton } from '@/components/ui/skeleton'
-import AppointmentsCard from '@/modules/dashboard/appointments-card'
-import { PatientsByCityCard } from '@/modules/dashboard/patients-by-city-card'
-import { PatientsByGenderCard } from '@/modules/dashboard/patients-by-gender-card'
-import { PatientsByStatusCards } from '@/modules/dashboard/patients-by-status-cards'
-
-export const dynamic = 'force-dynamic'
+import { DashboardAppointmentsCard } from '@/modules/dashboard/appointments-card'
+import { DashboardPatientsByCityCard } from '@/modules/dashboard/patients-by-city-card'
+import { DashboardPatientsByGenderCard } from '@/modules/dashboard/patients-by-gender-card'
+import { DashboardSummaryCards } from '@/modules/dashboard/summary-cards'
 
 export default function Page() {
   return (
-    <div className='grid grid-cols-1 gap-6 sm:grid-cols-6'>
+    <div className='grid gap-6 sm:grid-cols-6'>
       <Suspense
         fallback={
-          <Skeleton quantity={3} className='h-28 rounded-2xl sm:col-span-2' />
+          <Skeleton quantity={3} className='h-30 rounded-2xl sm:col-span-2' />
         }
       >
-        <PatientsByStatusCards />
+        <DashboardSummaryCards />
       </Suspense>
 
-      <PatientsByGenderCard className='sm:col-span-3' />
-      <PatientsByCityCard className='sm:col-span-3' />
+      <DashboardPatientsByGenderCard />
+      <DashboardPatientsByCityCard />
 
-      <AppointmentsCard />
+      <DashboardAppointmentsCard />
     </div>
   )
 }
diff --git a/src/components/dashboard/cards/chart.tsx b/src/components/dashboard/cards/chart.tsx
index 95d8d12a..d9eb9644 100644
--- a/src/components/dashboard/cards/chart.tsx
+++ b/src/components/dashboard/cards/chart.tsx
@@ -20,11 +20,12 @@ export function DashboardCardChart({
   ...props
 }: Readonly<DashboardCardChartProps>) {
   const Icon = icon
+
   return (
     <Card className={cn('flex flex-col gap-3 p-6', className)} {...props}>
       <header className='flex items-center gap-2'>
-        <Icon className='size-5' />
-        <h3 className='text-lg font-medium'>{title}</h3>
+        <Icon className='text-disabled size-6' />
+        <h3 className='text-xl font-medium'>{title}</h3>
 
         {menu && <div className='ml-auto'>{menu}</div>}
       </header>
diff --git a/src/components/select-period.tsx b/src/components/select-period.tsx
index e17c9736..3bef23c0 100644
--- a/src/components/select-period.tsx
+++ b/src/components/select-period.tsx
@@ -1,6 +1,6 @@
 'use client'
 
-import { QUERY_PERIODS_OPTIONS, type QueryPeriod } from '@/types/queries'
+import { QUERY_PERIODS_OPTIONS, type QueryPeriod } from '@/enums/queries'
 
 import { Select, type SelectOption } from './ui/select'
 
@@ -26,10 +26,12 @@ export function SelectPeriod({
 
   return (
     <Select
+      size='sm'
+      align='end'
       value={period}
       options={options}
-      onValueChange={handleValueChange}
       disabled={disabled}
+      onValueChange={handleValueChange}
     />
   )
 }
diff --git a/src/components/summary-card.tsx b/src/components/summary-card.tsx
new file mode 100644
index 00000000..afab3fee
--- /dev/null
+++ b/src/components/summary-card.tsx
@@ -0,0 +1,37 @@
+import type { LucideIcon } from 'lucide-react'
+
+import { cn } from '@/utils/class-name-merge'
+
+import { Card, type CardProps } from './ui/card'
+
+interface SummaryCardProps extends CardProps {
+  label: string
+  icon: LucideIcon
+  value?: number | string
+}
+
+export function SummaryCard({
+  label,
+  icon: Icon,
+  value = 0,
+  className,
+  ...props
+}: Readonly<SummaryCardProps>) {
+  return (
+    <Card
+      className={cn(
+        'flex min-h-30 flex-col justify-between gap-3 p-6',
+        className,
+      )}
+      {...props}
+    >
+      <div className='flex items-center justify-between'>
+        <span className='text-4xl font-semibold'>{value}</span>
+        <div className='border-border text-primary rounded-full border p-2 [&_svg]:size-5'>
+          <Icon />
+        </div>
+      </div>
+      <p className='text-foreground-soft text-sm uppercase'>{label}</p>
+    </Card>
+  )
+}
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
index 2ef10502..bec1b9aa 100644
--- a/src/components/ui/select.tsx
+++ b/src/components/ui/select.tsx
@@ -2,8 +2,10 @@
 
 import {
   Select as BaseSelect,
+  type SelectPositionerProps,
   type SelectRootProps,
 } from '@base-ui-components/react/select'
+import { cva, type VariantProps } from 'class-variance-authority'
 import { CheckIcon, ChevronsUpDownIcon } from 'lucide-react'
 
 import { cn } from '@/utils/class-name-merge'
@@ -14,14 +16,33 @@ export type SelectOption = {
   description?: string
 }
 
-export type SelectProps = Omit<SelectRootProps<string, false>, 'items'> & {
-  options: SelectOption[]
-  className?: string
-  placeholder?: string
-}
+const selectTriggerVariants = cva(
+  'border-border bg-background hover:bg-accent focus-visible:outline-ring data-[placeholder]:text-disabled flex cursor-pointer items-center justify-between gap-2 rounded-lg border pr-2 pl-3 shadow-xs outline-offset-4 outline-transparent transition-colors disabled:pointer-events-none disabled:opacity-50 aria-[readonly]:pointer-events-none',
+  {
+    variants: {
+      size: {
+        default: 'h-10',
+        sm: 'h-9',
+      },
+    },
+    defaultVariants: {
+      size: 'default',
+    },
+  },
+)
+
+export type SelectProps = Omit<SelectRootProps<string, false>, 'items'> &
+  VariantProps<typeof selectTriggerVariants> & {
+    options: SelectOption[]
+    align?: SelectPositionerProps['align']
+    className?: string
+    placeholder?: string
+  }
 
 export function Select({
+  size,
   value,
+  align,
   options,
   className,
   placeholder = 'Selecione uma opção',
@@ -32,13 +53,7 @@ export function Select({
   return (
     <BaseSelect.Root value={value} items={options} {...props}>
       <BaseSelect.Trigger
-        className={cn(
-          'border-border bg-background hover:bg-accent flex h-10 w-full cursor-pointer items-center justify-between gap-2 rounded-lg border pr-2 pl-3 shadow-xs transition-colors',
-          'focus-visible:outline-ring outline-offset-4 outline-transparent',
-          'disabled:pointer-events-none disabled:opacity-50 aria-[readonly]:pointer-events-none',
-          'data-[placeholder]:text-disabled',
-          className,
-        )}
+        className={cn('w-full', selectTriggerVariants({ size, className }))}
       >
         <BaseSelect.Value>
           {() => (selectedOption ? selectedOption.label : placeholder)}
@@ -49,6 +64,7 @@ export function Select({
       </BaseSelect.Trigger>
       <BaseSelect.Portal>
         <BaseSelect.Positioner
+          align={align}
           sideOffset={4}
           alignItemWithTrigger={false}
           className='z-50'
diff --git a/src/components/ui/table.tsx b/src/components/ui/table.tsx
index 9865afa6..9e000653 100644
--- a/src/components/ui/table.tsx
+++ b/src/components/ui/table.tsx
@@ -1,3 +1,5 @@
+import Link, { type LinkProps } from 'next/link'
+
 import { cn } from '@/utils/class-name-merge'
 
 export function Table({
@@ -65,6 +67,21 @@ export function TableCell({
   )
 }
 
+export function TableEmptyCell({
+  className,
+  ...props
+}: Readonly<React.ComponentProps<'td'>>) {
+  return (
+    <td
+      className={cn(
+        'border-border rounded-b-lg border px-4 py-6 text-center',
+        className,
+      )}
+      {...props}
+    />
+  )
+}
+
 export function TableButton({
   className,
   ...props
@@ -79,3 +96,21 @@ export function TableButton({
     />
   )
 }
+
+export function TableLink({
+  className,
+  children,
+  ...props
+}: Readonly<LinkProps & { className?: string; children: React.ReactNode }>) {
+  return (
+    <Link
+      className={cn(
+        'outline-ring flex cursor-pointer items-center gap-2 rounded-lg outline-offset-4',
+        className,
+      )}
+      {...props}
+    >
+      {children}
+    </Link>
+  )
+}
diff --git a/src/constants/cache.ts b/src/constants/cache.ts
index 53136848..df9b6d10 100644
--- a/src/constants/cache.ts
+++ b/src/constants/cache.ts
@@ -1,17 +1,26 @@
 export const NEXT_CACHE_TAGS = {
   user: (id: string) => `user/${id}`,
   patient: (id: string) => `patient/${id}`,
+  appointments: (query: string) => `appointments/${query}`,
   statistics: {
-    totalPatientsByStatus: 'total-patients-by-status',
+    totalPatients: (query: string) => `total-patients/${query}`,
+    totalReferrals: (query: string) => `total-referrals/${query}`,
+    totalAppointments: (query: string) => `total-appointments/${query}`,
   },
 }
 
 export const QUERY_CACHE_KEYS = {
-  profile: 'profile',
+  dashboard: {
+    patientsByGender: 'dashboard-patients-by-gender',
+    patientsByCity: 'dashboard-patients-by-city',
+  },
   patients: {
-    allActive: 'patients-all-active',
+    allOptions: 'patients-all-options',
     list: 'patients-list',
   },
+  appointments: {
+    list: 'appointments-list',
+  },
   referrals: {
     list: 'referrals-list',
   },
@@ -19,8 +28,5 @@ export const QUERY_CACHE_KEYS = {
     pending: 'approvals-pending',
     approved: 'approvals-approved',
   },
-  dashboard: {
-    patientsByGender: 'dashboard-patients-by-gender',
-    patientsByCity: 'dashboard-patients-by-city',
-  },
+  profile: 'profile',
 }
diff --git a/src/enums/appointments.ts b/src/enums/appointments.ts
new file mode 100644
index 00000000..1e6e19fe
--- /dev/null
+++ b/src/enums/appointments.ts
@@ -0,0 +1,16 @@
+import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
+
+export const APPOINTMENT_STATUSES = {
+  scheduled: 'Agendado',
+  canceled: 'Cancelado',
+  completed: 'Concluído',
+  no_show: 'Não compareceu',
+} as const
+export type AppointmentStatus = keyof typeof APPOINTMENT_STATUSES
+
+export const APPOINTMENT_STATUS_OPTIONS =
+  convertObjectToOptions(APPOINTMENT_STATUSES)
+
+export const APPOINTMENT_STATUS_ENUM = Object.keys(APPOINTMENT_STATUSES) as [
+  AppointmentStatus,
+]
diff --git a/src/types/queries.ts b/src/enums/queries.ts
similarity index 71%
rename from src/types/queries.ts
rename to src/enums/queries.ts
index dd55879f..7834ee8b 100644
--- a/src/types/queries.ts
+++ b/src/enums/queries.ts
@@ -2,9 +2,9 @@ import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
 
 export const QUERY_PERIODS = {
   today: 'Hoje',
-  'last-year': 'No último ano',
-  'last-month': 'No último mês',
-  'last-week': 'Na última semana',
+  'last-week': 'Última semana',
+  'last-month': 'Último mês',
+  'last-year': 'Último ano',
 }
 export type QueryPeriod = keyof typeof QUERY_PERIODS
 
diff --git a/src/enums/referrals.ts b/src/enums/referrals.ts
new file mode 100644
index 00000000..81b52785
--- /dev/null
+++ b/src/enums/referrals.ts
@@ -0,0 +1,15 @@
+import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
+
+export const REFERRAL_STATUSES = {
+  scheduled: 'Agendado',
+  canceled: 'Cancelado',
+  completed: 'Concluído',
+  no_show: 'Não compareceu',
+} as const
+export type ReferralStatus = keyof typeof REFERRAL_STATUSES
+
+export const REFERRAL_STATUS_OPTIONS = convertObjectToOptions(REFERRAL_STATUSES)
+
+export const REFERRAL_STATUS_ENUM = Object.keys(REFERRAL_STATUSES) as [
+  ReferralStatus,
+]
diff --git a/src/enums/shared.ts b/src/enums/shared.ts
new file mode 100644
index 00000000..7d1735f0
--- /dev/null
+++ b/src/enums/shared.ts
@@ -0,0 +1,19 @@
+import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
+
+export const SPECIALTIES = {
+  medical_care: 'Medicina',
+  legal: 'Jurídico',
+  nursing: 'Enfermagem',
+  psychology: 'Psicologia',
+  nutrition: 'Nutrição',
+  physical_training: 'Preparação Física',
+  social_work: 'Serviço Social',
+  psychiatry: 'Psiquiatria',
+  neurology: 'Neurologia',
+  ophthalmology: 'Oftalmologia',
+} as const
+export type Specialty = keyof typeof SPECIALTIES
+
+export const SPECIALTIES_OPTIONS = convertObjectToOptions(SPECIALTIES)
+
+export const SPECIALTIES_ENUM = Object.keys(SPECIALTIES) as [Specialty]
diff --git a/src/hooks/use-patient-otions.ts b/src/hooks/use-patient-otions.ts
index 6719f55d..aa9764b1 100644
--- a/src/hooks/use-patient-otions.ts
+++ b/src/hooks/use-patient-otions.ts
@@ -9,11 +9,8 @@ import { formatCpfNumber } from '@/utils/formatters/format-cpf-number'
 
 export function usePatientOptions() {
   const { data: response } = useQuery({
-    queryKey: [QUERY_CACHE_KEYS.patients.allActive],
-    queryFn: () =>
-      api<{ patients: Patient[] }>('/patients', {
-        params: { all: true, status: 'active' },
-      }),
+    queryKey: [QUERY_CACHE_KEYS.patients.allOptions],
+    queryFn: () => api<{ patients: Patient[] }>('/patients/options'),
   })
 
   const patientOptions =
diff --git a/src/modules/appointments/appointment-modal.tsx b/src/modules/appointments/appointment-modal.tsx
index dacc71a4..8f496f58 100644
--- a/src/modules/appointments/appointment-modal.tsx
+++ b/src/modules/appointments/appointment-modal.tsx
@@ -24,6 +24,7 @@ import {
   DialogTitle,
 } from '@/components/ui/dialog'
 import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
+import { SPECIALTIES_ENUM, SPECIALTIES_OPTIONS } from '@/enums/shared'
 import { usePatientOptions } from '@/hooks/use-patient-otions'
 import { api } from '@/lib/api'
 import { queryClient } from '@/lib/tanstack-query'
@@ -35,10 +36,7 @@ import {
 const appointmentFormSchema = z.object({
   patient_id: z.string().uuid('Paciente é obrigatório'),
   date: z.string().datetime('A data é obrigatória'),
-  referred_to: z
-    .string()
-    .nullable()
-    .transform((value) => (!value ? null : value)),
+  category: z.enum(SPECIALTIES_ENUM, { message: 'Categoria é obrigatório' }),
   condition: z.enum(PATIENT_CONDITION_ENUM, {
     message: 'O quadro é obrigatório',
   }),
@@ -47,6 +45,10 @@ const appointmentFormSchema = z.object({
     .max(500)
     .nullable()
     .transform((value) => (!value ? null : value)),
+  professional_name: z
+    .string()
+    .nullable()
+    .transform((value) => (!value ? null : value)),
 })
 type AppointmentFormSchema = z.infer<typeof appointmentFormSchema>
 
@@ -62,9 +64,10 @@ export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
     defaultValues: {
       patient_id: '',
       date: '',
-      referred_to: '',
+      category: '',
       condition: '',
       annotation: '',
+      professional_name: '',
     } as unknown as AppointmentFormSchema,
     mode: 'onBlur',
   })
@@ -81,7 +84,7 @@ export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
     }
 
     queryClient.invalidateQueries({
-      queryKey: [QUERY_CACHE_KEYS.referrals.list],
+      queryKey: [QUERY_CACHE_KEYS.appointments.list],
     })
     revalidateCache(NEXT_CACHE_TAGS.patient(data.patient_id))
     toast.success(response.message)
@@ -89,7 +92,7 @@ export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
   }
 
   return (
-    <DialogContainer className='max-w-2xl'>
+    <DialogContainer className='max-w-xl'>
       <DialogHeader icon={<DialogIcon icon={SmilePlusIcon} />}>
         <DialogTitle>Novo atendimento</DialogTitle>
       </DialogHeader>
@@ -97,13 +100,13 @@ export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
       <DialogContent>
         <FormProvider {...formMethods}>
           <FormContainer
-            className='grid gap-4 sm:grid-cols-5'
+            className='grid gap-4 sm:grid-cols-2'
             onSubmit={formMethods.handleSubmit(submitForm)}
           >
             <ComboboxInput
               name='patient_id'
               label='Paciente'
-              className='sm:col-span-3'
+              className='sm:col-span-full'
               placeholder='Selecione um paciente'
               options={patientOptions}
               isRequired
@@ -111,20 +114,28 @@ export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
             <DateInput
               name='date'
               label='Data do atendimento'
-              wrapperClassName='sm:col-span-2'
+              wrapperClassName='sm:col-span-1'
               allowFutureDates
               isRequired
             />
-            <TextInput
-              name='referred_to'
-              label='Profissional responsável'
-              wrapperClassName='sm:col-span-3'
+            <SelectInput
+              name='category'
+              label='Categoria'
+              options={SPECIALTIES_OPTIONS}
+              className='sm:col-span-1'
+              isRequired
             />
             <SelectInput
               name='condition'
               label='Quadro geral'
               options={PATIENT_CONDITION_OPTIONS}
-              className='sm:col-span-2'
+              className='sm:col-span-1'
+              isRequired
+            />
+            <TextInput
+              name='professional_name'
+              label='Profissional responsável'
+              wrapperClassName='sm:col-span-1'
             />
             <TextareaInput
               rows={8}
@@ -132,7 +143,7 @@ export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
               name='annotation'
               label='Observações'
               placeholder='Insira observações sobre o paciente'
-              wrapperClassName='sm:col-span-5'
+              wrapperClassName='sm:col-span-full'
             />
           </FormContainer>
         </FormProvider>
diff --git a/src/modules/dashboard/appointments-card.tsx b/src/modules/dashboard/appointments-card.tsx
index 353e40d7..b2b3df46 100644
--- a/src/modules/dashboard/appointments-card.tsx
+++ b/src/modules/dashboard/appointments-card.tsx
@@ -1,5 +1,3 @@
-'use client'
-
 import {
   ClipboardCheckIcon,
   ClipboardListIcon,
@@ -8,38 +6,43 @@ import {
   Users2Icon,
   XCircleIcon,
 } from 'lucide-react'
-import { useRouter } from 'next/navigation'
 
+import { getAppointments } from '@/actions/appointments/get-appointments'
 import { DataTableHeader } from '@/components/data-table/header'
 import { DataTableHeaderActions } from '@/components/data-table/header/actions'
 import { DataTableHeaderInfo } from '@/components/data-table/header/info'
 import { Avatar } from '@/components/ui/avatar'
-import { Button } from '@/components/ui/button'
 import { Card } from '@/components/ui/card'
 import { Divider } from '@/components/ui/divider'
 import { DropdownMenu } from '@/components/ui/dropdown'
 import { DropdownMenuContent } from '@/components/ui/dropdown/content'
 import { DropdownMenuItem } from '@/components/ui/dropdown/item'
 import { DropdownMenuTrigger } from '@/components/ui/dropdown/trigger'
+import { NavButton } from '@/components/ui/nav-button'
 import {
   Table,
   TableBody,
-  TableButton,
   TableCell,
+  TableEmptyCell,
   TableHead,
   TableHeader,
+  TableLink,
   TableRow,
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
 import { ROUTES } from '@/constants/routes'
+import { SPECIALTIES } from '@/enums/shared'
 import { NewAppointmentButton } from '@/modules/appointments/new-appointment-button'
 import { PATIENT_CONDITIONS } from '@/types/patients'
 import { formatDate } from '@/utils/formatters/format-date'
-import { QUEUE_SERVICE_PATIENTS_MOCK } from '@/utils/mock/queue-service-patients'
 
-export default function AppointmentsCard() {
-  const patients = QUEUE_SERVICE_PATIENTS_MOCK
-  const router = useRouter()
+// TODO: update dropdown menu
+
+export async function DashboardAppointmentsCard() {
+  const response = await getAppointments({ limit: 5 })
+
+  const appointments = response?.appointments
+  const showAppointments = appointments && appointments.length > 0
 
   return (
     <Card className='p-6 sm:col-span-6'>
@@ -51,9 +54,13 @@ export default function AppointmentsCard() {
         />
 
         <DataTableHeaderActions>
-          <Button size='sm' variant='outline'>
+          <NavButton
+            size='sm'
+            variant='outline'
+            href={ROUTES.dashboard.appointments.list}
+          >
             Ver todos
-          </Button>
+          </NavButton>
 
           <NewAppointmentButton size='sm' />
         </DataTableHeaderActions>
@@ -63,86 +70,97 @@ export default function AppointmentsCard() {
         <TableHeader>
           <TableRow>
             <TableHead className='w-64'>Paciente</TableHead>
-            <TableHead>Data de atendimento</TableHead>
+            <TableHead className='w-36'>Data</TableHead>
+            <TableHead className='w-44'>Categoria</TableHead>
             <TableHead>Profissional</TableHead>
-            <TableHead>Especialidade</TableHead>
-            <TableHead>Quadro Geral</TableHead>
-            <TableHead>Ações</TableHead>
+            <TableHead className='w-36'>Quadro geral</TableHead>
+            <TableHead className='w-20 text-center'>Ações</TableHead>
           </TableRow>
         </TableHeader>
 
-        <TableBody>
-          {patients.map((patient) => {
-            const condition = PATIENT_CONDITIONS[patient.general_condition]
-            const ConditionIcon = condition.icon
-            return (
-              <TableRow key={patient.id}>
-                <TableCell>
-                  <TableButton
-                    className='w-64'
-                    onClick={() =>
-                      router.push(
-                        ROUTES.dashboard.patients.details.info(
-                          patient.id.toString(),
-                        ),
-                      )
-                    }
-                  >
-                    <Avatar className='size-9' />
-                    <span className='truncate'>{patient.name}</span>
-                  </TableButton>
-                </TableCell>
-                <TableCell>{formatDate(patient.appointmentDate)}</TableCell>
-                <TableCell>{patient.professional}</TableCell>
-                <TableCell>{patient.specialty}</TableCell>
-                <TableCell>
-                  <Tag variant={condition.variant} size='sm'>
-                    <ConditionIcon />
-                    {condition.label}
-                  </Tag>
-                </TableCell>
+        {showAppointments && (
+          <TableBody>
+            {appointments.map((appointment) => {
+              const condition = PATIENT_CONDITIONS[appointment.condition]
+              const Icon = condition.icon
 
-                <TableCell className='text-center'>
-                  <DropdownMenu>
-                    <DropdownMenuTrigger
-                      indicator={false}
-                      size='icon'
-                      variant='ghost'
-                      className='size-8'
+              return (
+                <TableRow key={appointment.id}>
+                  <TableCell>
+                    <TableLink
+                      className='w-64'
+                      href={ROUTES.dashboard.patients.details.info(
+                        appointment.patient_id,
+                      )}
                     >
-                      <EllipsisIcon />
-                    </DropdownMenuTrigger>
+                      <Avatar
+                        className='size-9'
+                        src={appointment.patient.avatar_url}
+                      />
+                      <span className='truncate'>
+                        {appointment.patient.name}
+                      </span>
+                    </TableLink>
+                  </TableCell>
+                  <TableCell>{formatDate(appointment.date)}</TableCell>
+                  <TableCell>{SPECIALTIES[appointment.category]}</TableCell>
+                  <TableCell>{appointment.professional_name ?? '-'}</TableCell>
+                  <TableCell>
+                    <Tag variant={condition.variant} size='sm'>
+                      <Icon />
+                      {condition.label}
+                    </Tag>
+                  </TableCell>
 
-                    <DropdownMenuContent align='end'>
-                      <DropdownMenuItem>
-                        <ClipboardPenIcon />
-                        Editar
-                      </DropdownMenuItem>
-                      <DropdownMenuItem>
-                        <ClipboardListIcon />
-                        Informações do paciente
-                      </DropdownMenuItem>
-                      <DropdownMenuItem>
-                        <ClipboardCheckIcon />
-                        Histórico do paciente
-                      </DropdownMenuItem>
+                  <TableCell className='text-center'>
+                    <DropdownMenu>
+                      <DropdownMenuTrigger
+                        indicator={false}
+                        size='icon'
+                        variant='ghost'
+                        className='size-8'
+                      >
+                        <EllipsisIcon />
+                      </DropdownMenuTrigger>
 
-                      <Divider />
+                      <DropdownMenuContent align='end'>
+                        <DropdownMenuItem>
+                          <ClipboardPenIcon />
+                          Editar
+                        </DropdownMenuItem>
+                        <DropdownMenuItem>
+                          <ClipboardListIcon />
+                          Informações do paciente
+                        </DropdownMenuItem>
+                        <DropdownMenuItem>
+                          <ClipboardCheckIcon />
+                          Histórico do paciente
+                        </DropdownMenuItem>
 
-                      <DropdownMenuItem
-                        variant='destructive'
-                        className='text-center'
-                      >
-                        <XCircleIcon />
-                        Cancelar
-                      </DropdownMenuItem>
-                    </DropdownMenuContent>
-                  </DropdownMenu>
-                </TableCell>
-              </TableRow>
-            )
-          })}
-        </TableBody>
+                        <Divider />
+
+                        <DropdownMenuItem variant='destructive'>
+                          <XCircleIcon />
+                          Cancelar
+                        </DropdownMenuItem>
+                      </DropdownMenuContent>
+                    </DropdownMenu>
+                  </TableCell>
+                </TableRow>
+              )
+            })}
+          </TableBody>
+        )}
+
+        {!showAppointments && (
+          <TableBody>
+            <TableRow>
+              <TableEmptyCell colSpan={6}>
+                Nenhum atendimento encontrado
+              </TableEmptyCell>
+            </TableRow>
+          </TableBody>
+        )}
       </Table>
     </Card>
   )
diff --git a/src/modules/dashboard/patients-by-city-card.tsx b/src/modules/dashboard/patients-by-city-card.tsx
index f180de57..f989f2d4 100644
--- a/src/modules/dashboard/patients-by-city-card.tsx
+++ b/src/modules/dashboard/patients-by-city-card.tsx
@@ -9,12 +9,10 @@ import { DashboardCardChart } from '@/components/dashboard/cards/chart'
 import { SelectPeriod } from '@/components/select-period'
 import { Skeleton } from '@/components/ui/skeleton'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { type QueryPeriod } from '@/enums/queries'
 import { api } from '@/lib/api'
-import { type QueryPeriod } from '@/types/queries'
 
-export function PatientsByCityCard(
-  props: Readonly<React.ComponentProps<'div'>>,
-) {
+export function DashboardPatientsByCityCard() {
   const [period, setPeriod] = useState<QueryPeriod>('last-year')
 
   const limit = 6
@@ -52,8 +50,9 @@ export function PatientsByCityCard(
 
   return (
     <DashboardCardChart
-      icon={ChartPieIcon}
       title='Cidades'
+      icon={ChartPieIcon}
+      className='sm:col-span-3'
       menu={
         <SelectPeriod
           period={period}
@@ -61,7 +60,6 @@ export function PatientsByCityCard(
           onSelect={(value) => setPeriod(value)}
         />
       }
-      {...props}
     >
       <div className='flex h-full min-h-44 items-center justify-center'>
         {isLoading && <Skeleton className='bg-border/75 size-full' />}
diff --git a/src/modules/dashboard/patients-by-gender-card.tsx b/src/modules/dashboard/patients-by-gender-card.tsx
index d5e40267..bb678477 100644
--- a/src/modules/dashboard/patients-by-gender-card.tsx
+++ b/src/modules/dashboard/patients-by-gender-card.tsx
@@ -9,13 +9,11 @@ import { DashboardCardChart } from '@/components/dashboard/cards/chart'
 import { SelectPeriod } from '@/components/select-period'
 import { Skeleton } from '@/components/ui/skeleton'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { type QueryPeriod } from '@/enums/queries'
 import { api } from '@/lib/api'
 import { type Gender, GENDERS } from '@/types/patients'
-import { type QueryPeriod } from '@/types/queries'
 
-export function PatientsByGenderCard(
-  props: Readonly<React.ComponentProps<'div'>>,
-) {
+export function DashboardPatientsByGenderCard() {
   const [period, setPeriod] = useState<QueryPeriod>('last-year')
 
   const { data: response, isLoading } = useQuery({
@@ -39,8 +37,9 @@ export function PatientsByGenderCard(
 
   return (
     <DashboardCardChart
-      icon={ChartBarDecreasingIcon}
       title='Gêneros'
+      icon={ChartBarDecreasingIcon}
+      className='sm:col-span-3'
       menu={
         <SelectPeriod
           period={period}
@@ -48,7 +47,6 @@ export function PatientsByGenderCard(
           onSelect={(value) => setPeriod(value)}
         />
       }
-      {...props}
     >
       <div className='flex h-full min-h-44 items-center justify-center'>
         {isLoading && <Skeleton className='bg-border/75 size-full' />}
diff --git a/src/modules/dashboard/patients-by-status-cards.tsx b/src/modules/dashboard/patients-by-status-cards.tsx
index 981292fd..355d86d2 100644
--- a/src/modules/dashboard/patients-by-status-cards.tsx
+++ b/src/modules/dashboard/patients-by-status-cards.tsx
@@ -1,10 +1,11 @@
 import { CheckCircle2Icon, CircleXIcon, Users2Icon } from 'lucide-react'
 
-import { getTotalPatientsByStatus } from '@/actions/patients/statistics/get-total-patients-by-status'
+import { getTotalPatients } from '@/actions/statistics/get-total-patients'
 import { Card } from '@/components/ui/card'
+import { cn } from '@/utils/class-name-merge'
 
 export async function PatientsByStatusCards() {
-  const statistics = await getTotalPatientsByStatus()
+  const statistics = await getTotalPatients()
 
   if (!statistics) {
     return (
@@ -16,22 +17,26 @@ export async function PatientsByStatusCards() {
 
   return statistics.map((statistic) => {
     const data = STATISTICS_MAPPING[statistic.label]
+
     if (!data) return null
 
     return (
       <Card
         key={statistic.label}
-        className='flex min-h-28 flex-col justify-between gap-3 p-6 sm:col-span-2'
+        className='flex min-h-32 flex-col justify-between gap-3 p-6 sm:col-span-2'
       >
         <div className='flex items-center justify-between'>
           <span className='text-4xl font-semibold'>{statistic.value}</span>
           <div
-            className={`border-border rounded-full border p-2 [&_svg]:size-5 ${data.iconColor}`}
+            className={cn(
+              'border-border rounded-full border p-2 [&_svg]:size-5',
+              data.iconColor,
+            )}
           >
             <data.icon />
           </div>
         </div>
-        <p className='text-foreground-soft text-xs uppercase'>{data.title}</p>
+        <p className='text-foreground-soft text-sm uppercase'>{data.title}</p>
       </Card>
     )
   })
diff --git a/src/modules/dashboard/summary-cards.tsx b/src/modules/dashboard/summary-cards.tsx
new file mode 100644
index 00000000..5e835176
--- /dev/null
+++ b/src/modules/dashboard/summary-cards.tsx
@@ -0,0 +1,37 @@
+import { ClipboardListIcon, ClipboardPasteIcon, Users2Icon } from 'lucide-react'
+
+import { getTotalAppointments } from '@/actions/statistics/get-total-appointments'
+import { getTotalPatients } from '@/actions/statistics/get-total-patients'
+import { getTotalReferrals } from '@/actions/statistics/get-total-referrals'
+import { SummaryCard } from '@/components/summary-card'
+
+export async function DashboardSummaryCards() {
+  const [patients, referrals, appointments] = await Promise.all([
+    getTotalPatients(),
+    getTotalReferrals(),
+    getTotalAppointments(),
+  ])
+
+  return (
+    <>
+      <SummaryCard
+        icon={Users2Icon}
+        label='Pacientes'
+        value={patients?.total}
+        className='sm:col-span-2'
+      />
+      <SummaryCard
+        icon={ClipboardPasteIcon}
+        label='Encaminhamentos'
+        value={referrals?.total}
+        className='sm:col-span-2'
+      />
+      <SummaryCard
+        icon={ClipboardListIcon}
+        label='Atendimentos'
+        value={appointments?.total}
+        className='sm:col-span-2'
+      />
+    </>
+  )
+}
diff --git a/src/modules/patients/inactivate-modal.tsx b/src/modules/patients/inactivate-modal.tsx
index e5cdcd6c..2920e038 100644
--- a/src/modules/patients/inactivate-modal.tsx
+++ b/src/modules/patients/inactivate-modal.tsx
@@ -62,7 +62,7 @@ export function InactivatePatientModal({
       queryKey: [QUERY_CACHE_KEYS.patients.list],
     })
     queryClient.invalidateQueries({
-      queryKey: [QUERY_CACHE_KEYS.patients.allActive],
+      queryKey: [QUERY_CACHE_KEYS.patients.allOptions],
     })
     revalidateCache(NEXT_CACHE_TAGS.patient(id))
     toast.success(response.message)
diff --git a/src/modules/patients/list/table.tsx b/src/modules/patients/list/table.tsx
index 6f452f3f..bd525cfa 100644
--- a/src/modules/patients/list/table.tsx
+++ b/src/modules/patients/list/table.tsx
@@ -23,6 +23,7 @@ import {
   TableBody,
   TableButton,
   TableCell,
+  TableEmptyCell,
   TableHead,
   TableHeader,
   TableRow,
@@ -159,11 +160,9 @@ export function PatientsListTable() {
           {!isLoading && isPatientsEmpty && (
             <TableBody>
               <TableRow>
-                <TableCell colSpan={6}>
-                  <div className='p-2 text-center'>
-                    Nenhum paciente encontrado
-                  </div>
-                </TableCell>
+                <TableEmptyCell colSpan={6}>
+                  Nenhum paciente encontrado
+                </TableEmptyCell>
               </TableRow>
             </TableBody>
           )}
diff --git a/src/modules/referrals/referrals-modal.tsx b/src/modules/referrals/referrals-modal.tsx
index 3c8a22de..5fe29638 100644
--- a/src/modules/referrals/referrals-modal.tsx
+++ b/src/modules/referrals/referrals-modal.tsx
@@ -24,6 +24,7 @@ import {
   DialogTitle,
 } from '@/components/ui/dialog'
 import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
+import { SPECIALTIES_ENUM, SPECIALTIES_OPTIONS } from '@/enums/shared'
 import { usePatientOptions } from '@/hooks/use-patient-otions'
 import { api } from '@/lib/api'
 import { queryClient } from '@/lib/tanstack-query'
@@ -31,10 +32,6 @@ import {
   PATIENT_CONDITION_ENUM,
   PATIENT_CONDITION_OPTIONS,
 } from '@/types/patients'
-import {
-  REFERRAL_CATEGORY_ENUM,
-  REFERRAL_CATEGORY_OPTIONS,
-} from '@/types/referrals'
 
 interface ReferralModalProps {
   onClose(): void
@@ -46,7 +43,7 @@ export function ReferralPatientModal({ onClose, id }: ReferralModalProps) {
   const referralFormSchema = z.object({
     patient_id: z.string().uuid('Paciente é obrigatório'),
     date: z.string().datetime('A data é obrigatória'),
-    category: z.enum(REFERRAL_CATEGORY_ENUM, {
+    category: z.enum(SPECIALTIES_ENUM, {
       message: 'Categoria é obrigatório',
     }),
     condition: z.enum(PATIENT_CONDITION_ENUM, {
@@ -137,7 +134,7 @@ export function ReferralPatientModal({ onClose, id }: ReferralModalProps) {
             <SelectInput
               name='category'
               label='Categoria'
-              options={REFERRAL_CATEGORY_OPTIONS}
+              options={SPECIALTIES_OPTIONS}
               className='sm:col-span-2'
               isRequired
             />
diff --git a/src/types/appointments.d.ts b/src/types/appointments.d.ts
new file mode 100644
index 00000000..e8ceb97f
--- /dev/null
+++ b/src/types/appointments.d.ts
@@ -0,0 +1,22 @@
+import type { AppointmentStatus } from '@/enums/appointments'
+import type { Specialty } from '@/enums/shared'
+
+import type { PatientCondition } from './patients'
+
+export type Appointment = {
+  id: string
+  patient_id: string
+  date: string
+  status: AppointmentStatus
+  category: Specialty
+  condition: PatientCondition
+  annotation: string | null
+  professional_name: string | null
+  created_at: string
+  updated_at: string
+  patient: {
+    id: string
+    name: string
+    avatar_url: string | null
+  }
+}
diff --git a/src/types/referrals.d.ts b/src/types/referrals.d.ts
new file mode 100644
index 00000000..d584d77d
--- /dev/null
+++ b/src/types/referrals.d.ts
@@ -0,0 +1,22 @@
+import type { ReferralStatus } from '@/enums/referrals'
+import type { Specialty } from '@/enums/shared'
+
+import type { PatientCondition } from './patients'
+
+export type Referral = {
+  id: string
+  patient_id: string
+  date: string
+  status: ReferralStatus
+  category: Specialty
+  condition: PatientCondition
+  annotation: string | null
+  professional_name: string | null
+  created_at: string
+  updated_at: string
+  patient: {
+    id: string
+    name: string
+    avatar_url: string | null
+  }
+}
diff --git a/src/types/referrals.ts b/src/types/referrals.ts
deleted file mode 100644
index 40c55183..00000000
--- a/src/types/referrals.ts
+++ /dev/null
@@ -1,57 +0,0 @@
-import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
-
-import type { PatientCondition } from './patients'
-
-export type Referral = {
-  id: string
-  patient_id: string
-  date: string
-  category: ReferralCategory
-  condition: PatientCondition
-  annotation: string | null
-  status: string
-  referred_to: string | null
-  referred_by: string | null
-  created_at: string
-  updated_at: string
-  patient: {
-    id: string
-    name: string
-    avatar_url: string | null
-  }
-}
-
-export const REFERRAL_STATUSES = {
-  scheduled: 'Agendado',
-  canceled: 'Cancelado',
-  completed: 'Concluído',
-  no_show: 'Não compareceu',
-} as const
-export type ReferralStatus = keyof typeof REFERRAL_STATUSES
-
-export const REFERRAL_STATUS_OPTIONS = convertObjectToOptions(REFERRAL_STATUSES)
-
-export const REFERRAL_STATUS_ENUM = Object.keys(REFERRAL_STATUSES) as [
-  ReferralStatus,
-]
-
-export const REFERRAL_CATEGORIES = {
-  medical_care: 'Medicina',
-  legal: 'Jurídico',
-  nursing: 'Enfermagem',
-  psychology: 'Psicologia',
-  nutrition: 'Nutrição',
-  physical_training: 'Preparação Física',
-  social_work: 'Serviço Social',
-  psychiatry: 'Psiquiatria',
-  neurology: 'Neurologia',
-  ophthalmology: 'Oftalmologia',
-} as const
-export type ReferralCategory = keyof typeof REFERRAL_CATEGORIES
-
-export const REFERRAL_CATEGORY_OPTIONS =
-  convertObjectToOptions(REFERRAL_CATEGORIES)
-
-export const REFERRAL_CATEGORY_ENUM = Object.keys(REFERRAL_CATEGORIES) as [
-  ReferralCategory,
-]

From ddbf17083cff05d140001ee078245ca1610be70e Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 23 Jan 2026 23:52:50 -0300
Subject: [PATCH 08/77] refactor(enums/types): move enums from types to enums
 folder

---
 src/actions/ibge.ts                           | 25 -----
 src/actions/patients/get-patient.ts           |  2 +-
 src/actions/users.ts                          |  2 +-
 .../listagem/referrals-table.tsx              |  9 +-
 src/app/_paciente/_header/user-dropdown.tsx   |  2 +-
 .../_paciente/documentos/pendentes/page.tsx   |  2 +-
 .../triagem/seus-dados/patient-data-form.tsx  |  4 +-
 src/components/sidebar/account.tsx            |  2 +-
 src/constants/breadcrumbs/patient.ts          | 92 ++++++++-----------
 src/{types => enums}/patient-requirements.ts  | 15 ---
 src/{types => enums}/patients.ts              | 55 +----------
 src/enums/referrals.ts                        | 12 +++
 src/{types/teams.ts => enums/team.ts}         |  0
 src/{types => enums}/users.ts                 | 11 ---
 src/hooks/use-patient-otions.ts               |  2 +-
 .../appointments/appointment-modal.tsx        |  8 +-
 src/modules/dashboard/appointments-card.tsx   |  2 +-
 .../dashboard/patients-by-gender-card.tsx     |  6 +-
 .../dashboard/patients-by-status-cards.tsx    | 73 ---------------
 .../approved-list-table-actions.tsx           |  2 +-
 .../approved-list-table.tsx                   | 10 +-
 .../pending-requirements.tsx                  | 12 +--
 .../requirement-modal.tsx                     |  8 +-
 .../under-review-requirements.tsx             | 12 +--
 .../cards/patient-requirement-card.tsx        |  2 +-
 src/modules/patients/documents.tsx            |  2 +-
 src/modules/patients/form.tsx                 |  5 +-
 src/modules/patients/inactivate-button.tsx    |  2 +-
 src/modules/patients/list/actions.tsx         |  2 +-
 src/modules/patients/list/table.tsx           | 10 +-
 src/modules/referrals/referrals-modal.tsx     |  8 +-
 src/modules/teams/table.tsx                   |  2 +-
 src/types/appointments.d.ts                   |  3 +-
 src/types/{order.ts => order.d.ts}            |  0
 src/types/patient-requirements.d.ts           | 19 ++++
 ...atient-support.ts => patient-support.d.ts} |  0
 src/types/patients.d.ts                       | 35 +++++++
 src/types/referrals.d.ts                      |  3 +-
 src/types/team.d.ts                           |  2 +
 src/types/users.d.ts                          | 12 +++
 src/utils/mock/patients.ts                    |  2 +-
 41 files changed, 184 insertions(+), 293 deletions(-)
 delete mode 100644 src/actions/ibge.ts
 rename src/{types => enums}/patient-requirements.ts (78%)
 rename src/{types => enums}/patients.ts (59%)
 rename src/{types/teams.ts => enums/team.ts} (100%)
 rename src/{types => enums}/users.ts (64%)
 delete mode 100644 src/modules/dashboard/patients-by-status-cards.tsx
 rename src/types/{order.ts => order.d.ts} (100%)
 create mode 100644 src/types/patient-requirements.d.ts
 rename src/types/{patient-support.ts => patient-support.d.ts} (100%)
 create mode 100644 src/types/patients.d.ts
 create mode 100644 src/types/team.d.ts
 create mode 100644 src/types/users.d.ts

diff --git a/src/actions/ibge.ts b/src/actions/ibge.ts
deleted file mode 100644
index bc652d14..00000000
--- a/src/actions/ibge.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-'use server'
-
-import { env } from '@/config/env'
-
-export async function getCitiesByUF(UF: string) {
-  const REVALIDATE_IN_SECONDS = 86400 // 24 hours
-
-  //Changed to /municipios as some districts may have the same name as the municipality
-  //What caused duplication of keys in the city select
-  const response: Array<{ nome: string }> = await fetch(
-    `${env.NEXT_PUBLIC_API_IBGE}/localidades/estados/${UF}/municipios`,
-    {
-      next: {
-        revalidate: REVALIDATE_IN_SECONDS,
-        tags: [`cities/${UF}`],
-      },
-    },
-  ).then(async (res) => await res.json())
-
-  if (!response) return null
-
-  const cities = response.map((city) => city.nome)
-
-  return cities
-}
diff --git a/src/actions/patients/get-patient.ts b/src/actions/patients/get-patient.ts
index 6d4825cb..924a003b 100644
--- a/src/actions/patients/get-patient.ts
+++ b/src/actions/patients/get-patient.ts
@@ -2,7 +2,7 @@
 
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { api } from '@/lib/api'
-import type { Patient } from '@/types/patients'
+import type { Patient } from '@/types/patients.d.ts'
 
 export async function getPatient(id: string) {
   const REVALIDATE_IN_SECONDS = 3600
diff --git a/src/actions/users.ts b/src/actions/users.ts
index 68f02607..73a2cae7 100644
--- a/src/actions/users.ts
+++ b/src/actions/users.ts
@@ -5,7 +5,7 @@ import { redirect } from 'next/navigation'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
 import { api } from '@/lib/api'
-import type { User } from '@/types/users'
+import type { User } from '@/types/users.d.ts'
 
 import { getUserFromToken } from './token'
 
diff --git a/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx b/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
index e647a61a..06507adf 100644
--- a/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
+++ b/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
@@ -19,11 +19,8 @@ import {
   TableRow,
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
-import {
-  PATIENT_CONDITIONS,
-  PatientCondition,
-  PATIENTS_REFERRALS_ORDER_OPTIONS,
-} from '@/types/patients'
+import { PATIENT_CONDITIONS, type PatientCondition } from '@/enums/patients'
+import { REFERRALS_ORDER_OPTIONS } from '@/enums/referrals'
 
 import ReferralsSkeleton from './referrals-skeleton'
 
@@ -139,7 +136,7 @@ export function ReferralsTable() {
         <TabSelect buttons={filterOptions} />
         <DataTableHeaderActions>
           <DataTableHeaderSearch placeholder='Pesquisar' />
-          <DataTableHeaderOrderBy options={PATIENTS_REFERRALS_ORDER_OPTIONS} />
+          <DataTableHeaderOrderBy options={REFERRALS_ORDER_OPTIONS} />
         </DataTableHeaderActions>
       </DataTableHeader>
 
diff --git a/src/app/_paciente/_header/user-dropdown.tsx b/src/app/_paciente/_header/user-dropdown.tsx
index d288ebb3..cb8ad9b9 100644
--- a/src/app/_paciente/_header/user-dropdown.tsx
+++ b/src/app/_paciente/_header/user-dropdown.tsx
@@ -16,7 +16,7 @@ import { DropdownMenuTrigger } from '@/components/ui/dropdown/trigger'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
 import { api } from '@/lib/api'
-import type { User } from '@/types/users'
+import type { User } from '@/types/users.d.ts'
 
 interface PatientHeaderUserDropdownProps {
   user: User
diff --git a/src/app/_paciente/documentos/pendentes/page.tsx b/src/app/_paciente/documentos/pendentes/page.tsx
index 1ed59ab7..7a52561e 100644
--- a/src/app/_paciente/documentos/pendentes/page.tsx
+++ b/src/app/_paciente/documentos/pendentes/page.tsx
@@ -3,7 +3,7 @@ import React from 'react'
 
 import { getCurrentUser } from '@/actions/users'
 import { PatientRequirementCard } from '@/modules/patients/cards/patient-requirement-card'
-import type { PatientRequirement } from '@/types/patient-requirements'
+import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 
 export const metadata: Metadata = {
   title: 'Pendentes',
diff --git a/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx b/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
index c29f5384..513895ea 100644
--- a/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
+++ b/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
@@ -13,8 +13,8 @@ import { Button } from '@/components/ui/button'
 import { BRAZILIAN_STATES_OPTIONS, type UF } from '@/constants/enums'
 import { ROUTES } from '@/constants/routes'
 import { PATIENT_STORAGE_KEYS } from '@/constants/storage-keys'
+import { PATIENT_GENDER_OPTIONS } from '@/enums/patients'
 import { useCities } from '@/hooks/cities'
-import { GENDER_OPTIONS } from '@/types/patients'
 
 import { useScreening } from '../hooks'
 import {
@@ -82,7 +82,7 @@ export function ScreeningPatientDataForm() {
         <SelectInput
           name='gender'
           label='Gênero'
-          options={GENDER_OPTIONS}
+          options={PATIENT_GENDER_OPTIONS}
           placeholder='Selecione seu gênero'
           isRequired
         />
diff --git a/src/components/sidebar/account.tsx b/src/components/sidebar/account.tsx
index 241060eb..4bbf9796 100644
--- a/src/components/sidebar/account.tsx
+++ b/src/components/sidebar/account.tsx
@@ -15,7 +15,7 @@ import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
 import { api } from '@/lib/api'
 import { useSidebar } from '@/store/sidebar'
-import type { User } from '@/types/users'
+import type { User } from '@/types/users.d.ts'
 
 interface SidebarAccountProps {
   user?: User | null
diff --git a/src/constants/breadcrumbs/patient.ts b/src/constants/breadcrumbs/patient.ts
index 6f00cae9..bf5ad5a5 100644
--- a/src/constants/breadcrumbs/patient.ts
+++ b/src/constants/breadcrumbs/patient.ts
@@ -1,56 +1,44 @@
-import {
-  CircleAlertIcon,
-  CircleCheckIcon,
-  ClipboardListIcon,
-  ClipboardTypeIcon,
-  ContactRoundIcon,
-  FilesIcon,
-  HomeIcon,
-  UsersRoundIcon,
-} from 'lucide-react'
-
-import { ROUTES } from '../routes'
 import type { Breadcrumbs } from '.'
 
 export const PATIENT_BREADCRUMBS: Breadcrumbs = {
-  paciente: {
-    icon: HomeIcon,
-    name: 'Início',
-    path: ROUTES.patient.main,
-  },
-  documentos: {
-    icon: FilesIcon,
-    name: 'Documentos',
-    path: ROUTES.patient.documents.pending,
-  },
-  pendentes: {
-    icon: CircleAlertIcon,
-    name: 'Pendentes',
-    path: ROUTES.patient.documents.pending,
-  },
-  enviados: {
-    icon: CircleCheckIcon,
-    name: 'Enviados',
-    path: ROUTES.patient.documents.pending,
-  },
-  triagem: {
-    icon: ClipboardTypeIcon,
-    name: 'Triagem',
-    path: ROUTES.patient.screening.patientData,
-  },
-  'seus-dados': {
-    icon: ContactRoundIcon,
-    name: 'Seus dados',
-    path: ROUTES.patient.screening.patientData,
-  },
-  'laudo-medico': {
-    icon: ClipboardListIcon,
-    name: 'Laudo médico',
-    path: ROUTES.patient.screening.medicalReport,
-  },
-  'rede-de-apoio': {
-    icon: UsersRoundIcon,
-    name: 'Rede de apoio',
-    path: ROUTES.patient.screening.supportNetwork,
-  },
+  // paciente: {
+  //   icon: HomeIcon,
+  //   name: 'Início',
+  //   path: ROUTES.patient.main,
+  // },
+  // documentos: {
+  //   icon: FilesIcon,
+  //   name: 'Documentos',
+  //   path: ROUTES.patient.documents.pending,
+  // },
+  // pendentes: {
+  //   icon: CircleAlertIcon,
+  //   name: 'Pendentes',
+  //   path: ROUTES.patient.documents.pending,
+  // },
+  // enviados: {
+  //   icon: CircleCheckIcon,
+  //   name: 'Enviados',
+  //   path: ROUTES.patient.documents.pending,
+  // },
+  // triagem: {
+  //   icon: ClipboardTypeIcon,
+  //   name: 'Triagem',
+  //   path: ROUTES.patient.screening.patientData,
+  // },
+  // 'seus-dados': {
+  //   icon: ContactRoundIcon,
+  //   name: 'Seus dados',
+  //   path: ROUTES.patient.screening.patientData,
+  // },
+  // 'laudo-medico': {
+  //   icon: ClipboardListIcon,
+  //   name: 'Laudo médico',
+  //   path: ROUTES.patient.screening.medicalReport,
+  // },
+  // 'rede-de-apoio': {
+  //   icon: UsersRoundIcon,
+  //   name: 'Rede de apoio',
+  //   path: ROUTES.patient.screening.supportNetwork,
+  // },
 }
diff --git a/src/types/patient-requirements.ts b/src/enums/patient-requirements.ts
similarity index 78%
rename from src/types/patient-requirements.ts
rename to src/enums/patient-requirements.ts
index 189f998d..bf150455 100644
--- a/src/types/patient-requirements.ts
+++ b/src/enums/patient-requirements.ts
@@ -1,20 +1,5 @@
 import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
 
-export type PatientRequirement = {
-  id: string
-  type: PatientRequirementType
-  status: PatientRequirementStatus
-  description: string | null
-  submitted_at: string | null
-  approved_at: string | null
-  created_at: string
-  patient: {
-    id: string
-    name: string
-    avatar_url: string | null
-  }
-}
-
 export const PATIENT_REQUIREMENTS_ORDERS = {
   name_asc: 'Nome (Crescente)',
   name_desc: 'Nome (Decrescente)',
diff --git a/src/types/patients.ts b/src/enums/patients.ts
similarity index 59%
rename from src/types/patients.ts
rename to src/enums/patients.ts
index 029d0bcc..cf749c27 100644
--- a/src/types/patients.ts
+++ b/src/enums/patients.ts
@@ -7,33 +7,7 @@ import {
 
 import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
 
-import { PatientSupport } from './patient-support'
-
-export type Patient = {
-  id: string
-  user_id: string
-  gender: Gender
-  date_of_birth: string
-  phone: string
-  status: PatientStatus
-  cpf: string
-  state: string
-  city: string
-  has_disability: boolean
-  disability_desc: string | null
-  need_legal_assistance: boolean
-  take_medication: boolean
-  medication_desc: string | null
-  has_nmo_diagnosis: boolean
-  created_at: string
-  updated_at: string
-  name: string
-  email: string
-  avatar_url: string | null
-  supports?: PatientSupport[]
-}
-
-export const GENDERS = {
+export const PATIENT_GENDERS = {
   male_cis: 'Homem (Cis)',
   female_cis: 'Mulher (Cis)',
   male_trans: 'Homem (Trans)',
@@ -42,9 +16,9 @@ export const GENDERS = {
   prefer_not_to_say: 'Prefiro não informar',
   other: 'Outro',
 }
-export type Gender = keyof typeof GENDERS
+export type PatientGender = keyof typeof PATIENT_GENDERS
 
-export const GENDER_OPTIONS = convertObjectToOptions(GENDERS)
+export const PATIENT_GENDER_OPTIONS = convertObjectToOptions(PATIENT_GENDERS)
 
 export const PATIENT_STATUSES = {
   active: {
@@ -103,26 +77,3 @@ export const PATIENTS_ORDERS = {
 export type PatientsOrder = keyof typeof PATIENTS_ORDERS
 
 export const PATIENTS_ORDER_OPTIONS = convertObjectToOptions(PATIENTS_ORDERS)
-
-export type PatientDocument = {
-  id: string
-  name: string
-  url: string
-  created_at: string
-  size: string
-}
-
-export const PATIENT_REFERRALS_ORDER = {
-  name_asc: 'Nome (Crescente)',
-  name_desc: 'Nome (Decrescente)',
-  date_asc: 'Data (Crescente)',
-  date_desc: 'Data (Decrescente)',
-  general_overview_asc: 'Em surto (Crescente)',
-  general_overview_desc: 'Estável (Decrescente)',
-}
-
-export type PatientsReferralsOrderType = keyof typeof PATIENT_REFERRALS_ORDER
-
-export const PATIENTS_REFERRALS_ORDER_OPTIONS = convertObjectToOptions(
-  PATIENT_REFERRALS_ORDER,
-)
diff --git a/src/enums/referrals.ts b/src/enums/referrals.ts
index 81b52785..79b10a33 100644
--- a/src/enums/referrals.ts
+++ b/src/enums/referrals.ts
@@ -13,3 +13,15 @@ export const REFERRAL_STATUS_OPTIONS = convertObjectToOptions(REFERRAL_STATUSES)
 export const REFERRAL_STATUS_ENUM = Object.keys(REFERRAL_STATUSES) as [
   ReferralStatus,
 ]
+
+export const REFERRALS_ORDER = {
+  name_asc: 'Nome (Crescente)',
+  name_desc: 'Nome (Decrescente)',
+  date_asc: 'Data (Crescente)',
+  date_desc: 'Data (Decrescente)',
+  condition_asc: 'Em surto (Crescente)',
+  condition_desc: 'Estável (Decrescente)',
+}
+export type ReferralsOrder = keyof typeof REFERRALS_ORDER
+
+export const REFERRALS_ORDER_OPTIONS = convertObjectToOptions(REFERRALS_ORDER)
diff --git a/src/types/teams.ts b/src/enums/team.ts
similarity index 100%
rename from src/types/teams.ts
rename to src/enums/team.ts
diff --git a/src/types/users.ts b/src/enums/users.ts
similarity index 64%
rename from src/types/users.ts
rename to src/enums/users.ts
index 5ffc56da..cdbc608f 100644
--- a/src/types/users.ts
+++ b/src/enums/users.ts
@@ -1,14 +1,3 @@
-export type User = {
-  id: string
-  name: string
-  email: string
-  avatar_url: string | null
-  status: UserStatus
-  role: UserRole
-  updated_at: Date
-  created_at: Date
-}
-
 export const USER_ROLES = {
   admin: 'Administração',
   nurse: 'Enfermagem',
diff --git a/src/hooks/use-patient-otions.ts b/src/hooks/use-patient-otions.ts
index aa9764b1..1f72d2c9 100644
--- a/src/hooks/use-patient-otions.ts
+++ b/src/hooks/use-patient-otions.ts
@@ -4,7 +4,7 @@ import { useQuery } from '@tanstack/react-query'
 
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
 import { api } from '@/lib/api'
-import type { Patient } from '@/types/patients'
+import type { Patient } from '@/types/patients.d.ts'
 import { formatCpfNumber } from '@/utils/formatters/format-cpf-number'
 
 export function usePatientOptions() {
diff --git a/src/modules/appointments/appointment-modal.tsx b/src/modules/appointments/appointment-modal.tsx
index 8f496f58..74159f1e 100644
--- a/src/modules/appointments/appointment-modal.tsx
+++ b/src/modules/appointments/appointment-modal.tsx
@@ -24,14 +24,14 @@ import {
   DialogTitle,
 } from '@/components/ui/dialog'
 import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
+import {
+  PATIENT_CONDITION_ENUM,
+  PATIENT_CONDITION_OPTIONS,
+} from '@/enums/patients'
 import { SPECIALTIES_ENUM, SPECIALTIES_OPTIONS } from '@/enums/shared'
 import { usePatientOptions } from '@/hooks/use-patient-otions'
 import { api } from '@/lib/api'
 import { queryClient } from '@/lib/tanstack-query'
-import {
-  PATIENT_CONDITION_ENUM,
-  PATIENT_CONDITION_OPTIONS,
-} from '@/types/patients'
 
 const appointmentFormSchema = z.object({
   patient_id: z.string().uuid('Paciente é obrigatório'),
diff --git a/src/modules/dashboard/appointments-card.tsx b/src/modules/dashboard/appointments-card.tsx
index b2b3df46..1c7705be 100644
--- a/src/modules/dashboard/appointments-card.tsx
+++ b/src/modules/dashboard/appointments-card.tsx
@@ -31,9 +31,9 @@ import {
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
 import { ROUTES } from '@/constants/routes'
+import { PATIENT_CONDITIONS } from '@/enums/patients'
 import { SPECIALTIES } from '@/enums/shared'
 import { NewAppointmentButton } from '@/modules/appointments/new-appointment-button'
-import { PATIENT_CONDITIONS } from '@/types/patients'
 import { formatDate } from '@/utils/formatters/format-date'
 
 // TODO: update dropdown menu
diff --git a/src/modules/dashboard/patients-by-gender-card.tsx b/src/modules/dashboard/patients-by-gender-card.tsx
index bb678477..67c82f33 100644
--- a/src/modules/dashboard/patients-by-gender-card.tsx
+++ b/src/modules/dashboard/patients-by-gender-card.tsx
@@ -9,9 +9,9 @@ import { DashboardCardChart } from '@/components/dashboard/cards/chart'
 import { SelectPeriod } from '@/components/select-period'
 import { Skeleton } from '@/components/ui/skeleton'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { PATIENT_GENDERS, type PatientGender } from '@/enums/patients'
 import { type QueryPeriod } from '@/enums/queries'
 import { api } from '@/lib/api'
-import { type Gender, GENDERS } from '@/types/patients'
 
 export function DashboardPatientsByGenderCard() {
   const [period, setPeriod] = useState<QueryPeriod>('last-year')
@@ -20,7 +20,7 @@ export function DashboardPatientsByGenderCard() {
     queryKey: [QUERY_CACHE_KEYS.dashboard.patientsByGender, period],
     queryFn: () =>
       api<{
-        genders: { gender: Gender; total: string }[]
+        genders: { gender: PatientGender; total: string }[]
         total: number
       }>('/statistics/patients-by-gender', {
         params: { period },
@@ -31,7 +31,7 @@ export function DashboardPatientsByGenderCard() {
   const isEmpty = genders.length === 0 && !isLoading
 
   const data = genders.map((item) => ({
-    label: GENDERS[item.gender],
+    label: PATIENT_GENDERS[item.gender],
     value: Number(item.total),
   }))
 
diff --git a/src/modules/dashboard/patients-by-status-cards.tsx b/src/modules/dashboard/patients-by-status-cards.tsx
deleted file mode 100644
index 355d86d2..00000000
--- a/src/modules/dashboard/patients-by-status-cards.tsx
+++ /dev/null
@@ -1,73 +0,0 @@
-import { CheckCircle2Icon, CircleXIcon, Users2Icon } from 'lucide-react'
-
-import { getTotalPatients } from '@/actions/statistics/get-total-patients'
-import { Card } from '@/components/ui/card'
-import { cn } from '@/utils/class-name-merge'
-
-export async function PatientsByStatusCards() {
-  const statistics = await getTotalPatients()
-
-  if (!statistics) {
-    return (
-      <Card className='text-foreground-soft text-center text-sm md:col-span-6'>
-        Não foi possível obter as estatísticas de pacientes por status.
-      </Card>
-    )
-  }
-
-  return statistics.map((statistic) => {
-    const data = STATISTICS_MAPPING[statistic.label]
-
-    if (!data) return null
-
-    return (
-      <Card
-        key={statistic.label}
-        className='flex min-h-32 flex-col justify-between gap-3 p-6 sm:col-span-2'
-      >
-        <div className='flex items-center justify-between'>
-          <span className='text-4xl font-semibold'>{statistic.value}</span>
-          <div
-            className={cn(
-              'border-border rounded-full border p-2 [&_svg]:size-5',
-              data.iconColor,
-            )}
-          >
-            <data.icon />
-          </div>
-        </div>
-        <p className='text-foreground-soft text-sm uppercase'>{data.title}</p>
-      </Card>
-    )
-  })
-}
-
-const STATISTICS_MAPPING = {
-  total: {
-    title: (
-      <>
-        <strong>Total</strong> de pacientes
-      </>
-    ),
-    icon: Users2Icon,
-    iconColor: 'text-primary',
-  },
-  active: {
-    title: (
-      <>
-        Total de pacientes <strong>ativos</strong>
-      </>
-    ),
-    icon: CheckCircle2Icon,
-    iconColor: 'text-success',
-  },
-  inactive: {
-    title: (
-      <>
-        Total de pacientes <strong>inativos</strong>
-      </>
-    ),
-    icon: CircleXIcon,
-    iconColor: 'text-error',
-  },
-}
diff --git a/src/modules/patient-requirements/approved-list-table-actions.tsx b/src/modules/patient-requirements/approved-list-table-actions.tsx
index f1268f7c..df3dd0df 100644
--- a/src/modules/patient-requirements/approved-list-table-actions.tsx
+++ b/src/modules/patient-requirements/approved-list-table-actions.tsx
@@ -9,7 +9,7 @@ import { DropdownMenuContent } from '@/components/ui/dropdown/content'
 import { DropdownMenuItem } from '@/components/ui/dropdown/item'
 import { DropdownMenuTrigger } from '@/components/ui/dropdown/trigger'
 import { ROUTES } from '@/constants/routes'
-import type { PatientRequirement } from '@/types/patient-requirements'
+import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 
 interface ApprovedPatientRequirementsListTableActionsProps {
   requirement: PatientRequirement
diff --git a/src/modules/patient-requirements/approved-list-table.tsx b/src/modules/patient-requirements/approved-list-table.tsx
index da91bd32..9a287ec0 100644
--- a/src/modules/patient-requirements/approved-list-table.tsx
+++ b/src/modules/patient-requirements/approved-list-table.tsx
@@ -23,15 +23,15 @@ import {
 import { Tag } from '@/components/ui/tag'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
 import { QUERY_PARAMS } from '@/constants/params'
-import { useParams } from '@/hooks/params'
-import { api } from '@/lib/api'
-import type { OrderMapping } from '@/types/order'
 import {
   PATIENT_REQUIREMENT_TYPES,
   PATIENT_REQUIREMENTS_ORDER_OPTIONS,
-  type PatientRequirement,
   type PatientRequirementsOrder,
-} from '@/types/patient-requirements'
+} from '@/enums/patient-requirements'
+import { useParams } from '@/hooks/params'
+import { api } from '@/lib/api'
+import type { OrderMapping } from '@/types/order.d.ts'
+import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 import { formatDate } from '@/utils/formatters/format-date'
 
 import { ApprovedPatientRequirementsListTableActions } from './approved-list-table-actions'
diff --git a/src/modules/patient-requirements/pending-requirements.tsx b/src/modules/patient-requirements/pending-requirements.tsx
index f64ab8c5..8092cf37 100644
--- a/src/modules/patient-requirements/pending-requirements.tsx
+++ b/src/modules/patient-requirements/pending-requirements.tsx
@@ -15,16 +15,16 @@ import { Skeleton } from '@/components/ui/skeleton'
 import { Tag } from '@/components/ui/tag'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
 import { QUERY_PARAMS } from '@/constants/params'
-import { getTimeDistanceToNow } from '@/helpers/get-time-distance-to-now'
-import { useParams } from '@/hooks/params'
-import { api } from '@/lib/api'
-import type { OrderMapping } from '@/types/order'
-import type { PatientRequirement } from '@/types/patient-requirements'
 import {
   PATIENT_REQUIREMENT_TYPES,
   PATIENT_REQUIREMENTS_ORDER_OPTIONS,
   type PatientRequirementsOrder,
-} from '@/types/patient-requirements'
+} from '@/enums/patient-requirements'
+import { getTimeDistanceToNow } from '@/helpers/get-time-distance-to-now'
+import { useParams } from '@/hooks/params'
+import { api } from '@/lib/api'
+import type { OrderMapping } from '@/types/order.d.ts'
+import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 import { cn } from '@/utils/class-name-merge'
 import { formatDate } from '@/utils/formatters/format-date'
 
diff --git a/src/modules/patient-requirements/requirement-modal.tsx b/src/modules/patient-requirements/requirement-modal.tsx
index 7db3cf1e..bdd40bbe 100644
--- a/src/modules/patient-requirements/requirement-modal.tsx
+++ b/src/modules/patient-requirements/requirement-modal.tsx
@@ -19,13 +19,13 @@ import {
   DialogTitle,
 } from '@/components/ui/dialog'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
-import { usePatientOptions } from '@/hooks/use-patient-otions'
-import { api } from '@/lib/api'
-import { queryClient } from '@/lib/tanstack-query'
 import {
   PATIENT_REQUIREMENT_TYPE_ENUM,
   PATIENT_REQUIREMENT_TYPE_OPTIONS,
-} from '@/types/patient-requirements'
+} from '@/enums/patient-requirements'
+import { usePatientOptions } from '@/hooks/use-patient-otions'
+import { api } from '@/lib/api'
+import { queryClient } from '@/lib/tanstack-query'
 
 const patientRequirementFormSchema = z.object({
   patient_id: z.string().uuid('Paciente é obrigatório'),
diff --git a/src/modules/patient-requirements/under-review-requirements.tsx b/src/modules/patient-requirements/under-review-requirements.tsx
index ddfd04a6..a034573c 100644
--- a/src/modules/patient-requirements/under-review-requirements.tsx
+++ b/src/modules/patient-requirements/under-review-requirements.tsx
@@ -14,16 +14,16 @@ import { Skeleton } from '@/components/ui/skeleton'
 import { Tag } from '@/components/ui/tag'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
 import { QUERY_PARAMS } from '@/constants/params'
-import { getTimeDistanceToNow } from '@/helpers/get-time-distance-to-now'
-import { useParams } from '@/hooks/params'
-import { api } from '@/lib/api'
-import type { OrderMapping } from '@/types/order'
-import type { PatientRequirement } from '@/types/patient-requirements'
 import {
   PATIENT_REQUIREMENT_TYPES,
   PATIENT_REQUIREMENTS_ORDER_OPTIONS,
   type PatientRequirementsOrder,
-} from '@/types/patient-requirements'
+} from '@/enums/patient-requirements'
+import { getTimeDistanceToNow } from '@/helpers/get-time-distance-to-now'
+import { useParams } from '@/hooks/params'
+import { api } from '@/lib/api'
+import type { OrderMapping } from '@/types/order.d.ts'
+import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 
 import { AddPatientRequirementButton } from './add-patient-requirement-button'
 
diff --git a/src/modules/patients/cards/patient-requirement-card.tsx b/src/modules/patients/cards/patient-requirement-card.tsx
index bd804a44..b2c190b5 100644
--- a/src/modules/patients/cards/patient-requirement-card.tsx
+++ b/src/modules/patients/cards/patient-requirement-card.tsx
@@ -1,6 +1,6 @@
 import { Button } from '@/components/ui/button'
 import { Card } from '@/components/ui/card'
-import type { PatientRequirement } from '@/types/patient-requirements'
+import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 import { formatDate } from '@/utils/formatters/format-date'
 
 type PatientRequirementCardProps = {
diff --git a/src/modules/patients/documents.tsx b/src/modules/patients/documents.tsx
index bb69d86b..4e3f12c7 100644
--- a/src/modules/patients/documents.tsx
+++ b/src/modules/patients/documents.tsx
@@ -15,7 +15,7 @@ import {
   DialogTrigger,
 } from '@/components/ui/dialog'
 import { NavLink } from '@/components/ui/nav-link'
-import type { PatientDocument } from '@/types/patients'
+import type { PatientDocument } from '@/types/patients.d.ts'
 import { formatDate } from '@/utils/formatters/format-date'
 
 interface PatientDocumentsProps {
diff --git a/src/modules/patients/form.tsx b/src/modules/patients/form.tsx
index 7e5136e2..872bb43c 100644
--- a/src/modules/patients/form.tsx
+++ b/src/modules/patients/form.tsx
@@ -28,10 +28,11 @@ import {
   YES_OR_NO_OPTIONS,
 } from '@/constants/enums'
 import { ROUTES } from '@/constants/routes'
+import { PATIENT_GENDER_OPTIONS } from '@/enums/patients'
 import { useCities } from '@/hooks/cities'
 import { api } from '@/lib/api'
 import { queryClient } from '@/lib/tanstack-query'
-import { GENDER_OPTIONS, Patient } from '@/types/patients'
+import type { Patient } from '@/types/patients.d.ts'
 import { formatCpfNumber } from '@/utils/formatters/format-cpf-number'
 import { formatPhoneNumber } from '@/utils/formatters/format-phone-number'
 import { removeNonNumbers } from '@/utils/sanitizers'
@@ -210,7 +211,7 @@ export function PatientForm({
         <SelectInput
           name='gender'
           label='Gênero'
-          options={GENDER_OPTIONS}
+          options={PATIENT_GENDER_OPTIONS}
           readOnly={isViewMode}
           isRequired={!isViewMode}
           placeholder='Selecione o gênero'
diff --git a/src/modules/patients/inactivate-button.tsx b/src/modules/patients/inactivate-button.tsx
index 9edf412e..e4c34743 100644
--- a/src/modules/patients/inactivate-button.tsx
+++ b/src/modules/patients/inactivate-button.tsx
@@ -5,7 +5,7 @@ import { useState } from 'react'
 
 import { Dialog, DialogTrigger } from '@/components/ui/dialog'
 import { InactivatePatientModal } from '@/modules/patients/inactivate-modal'
-import type { Patient } from '@/types/patients'
+import type { Patient } from '@/types/patients.d.ts'
 
 interface InactivatePatientButtonProps {
   patient: Patient
diff --git a/src/modules/patients/list/actions.tsx b/src/modules/patients/list/actions.tsx
index 7bf59f5d..c6e28b6b 100644
--- a/src/modules/patients/list/actions.tsx
+++ b/src/modules/patients/list/actions.tsx
@@ -15,7 +15,7 @@ import { DropdownMenuContent } from '@/components/ui/dropdown/content'
 import { DropdownMenuItem } from '@/components/ui/dropdown/item'
 import { DropdownMenuTrigger } from '@/components/ui/dropdown/trigger'
 import { InactivatePatientModal } from '@/modules/patients/inactivate-modal'
-import type { Patient } from '@/types/patients'
+import type { Patient } from '@/types/patients.d.ts'
 
 interface PatientsListTableActionsProps {
   patient: Patient
diff --git a/src/modules/patients/list/table.tsx b/src/modules/patients/list/table.tsx
index bd525cfa..1ede1ce8 100644
--- a/src/modules/patients/list/table.tsx
+++ b/src/modules/patients/list/table.tsx
@@ -32,16 +32,16 @@ import { Tag } from '@/components/ui/tag'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
 import { QUERY_PARAMS } from '@/constants/params'
 import { ROUTES } from '@/constants/routes'
-import { useParams } from '@/hooks/params'
-import { api } from '@/lib/api'
-import type { OrderMapping } from '@/types/order'
 import {
-  type Patient,
   PATIENT_STATUS_OPTIONS,
   PATIENT_STATUSES,
   PATIENTS_ORDER_OPTIONS,
   type PatientsOrder,
-} from '@/types/patients'
+} from '@/enums/patients'
+import { useParams } from '@/hooks/params'
+import { api } from '@/lib/api'
+import type { OrderMapping } from '@/types/order.d.ts'
+import type { Patient } from '@/types/patients.d.ts'
 import { formatDate } from '@/utils/formatters/format-date'
 import { formatPhoneNumber } from '@/utils/formatters/format-phone-number'
 
diff --git a/src/modules/referrals/referrals-modal.tsx b/src/modules/referrals/referrals-modal.tsx
index 5fe29638..94bfeef4 100644
--- a/src/modules/referrals/referrals-modal.tsx
+++ b/src/modules/referrals/referrals-modal.tsx
@@ -24,14 +24,14 @@ import {
   DialogTitle,
 } from '@/components/ui/dialog'
 import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
+import {
+  PATIENT_CONDITION_ENUM,
+  PATIENT_CONDITION_OPTIONS,
+} from '@/enums/patients'
 import { SPECIALTIES_ENUM, SPECIALTIES_OPTIONS } from '@/enums/shared'
 import { usePatientOptions } from '@/hooks/use-patient-otions'
 import { api } from '@/lib/api'
 import { queryClient } from '@/lib/tanstack-query'
-import {
-  PATIENT_CONDITION_ENUM,
-  PATIENT_CONDITION_OPTIONS,
-} from '@/types/patients'
 
 interface ReferralModalProps {
   onClose(): void
diff --git a/src/modules/teams/table.tsx b/src/modules/teams/table.tsx
index 055129ce..f877d22e 100644
--- a/src/modules/teams/table.tsx
+++ b/src/modules/teams/table.tsx
@@ -34,7 +34,7 @@ import {
   TableRow,
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
-import { TEAMS_ORDER_OPTIONS } from '@/types/teams'
+import { TEAMS_ORDER_OPTIONS } from '@/enums/team'
 import { formatDate } from '@/utils/formatters/format-date'
 import { TEAMS_MOCK } from '@/utils/mock/teams'
 
diff --git a/src/types/appointments.d.ts b/src/types/appointments.d.ts
index e8ceb97f..ad57d504 100644
--- a/src/types/appointments.d.ts
+++ b/src/types/appointments.d.ts
@@ -1,8 +1,7 @@
 import type { AppointmentStatus } from '@/enums/appointments'
+import type { PatientCondition } from '@/enums/patients'
 import type { Specialty } from '@/enums/shared'
 
-import type { PatientCondition } from './patients'
-
 export type Appointment = {
   id: string
   patient_id: string
diff --git a/src/types/order.ts b/src/types/order.d.ts
similarity index 100%
rename from src/types/order.ts
rename to src/types/order.d.ts
diff --git a/src/types/patient-requirements.d.ts b/src/types/patient-requirements.d.ts
new file mode 100644
index 00000000..3787e24e
--- /dev/null
+++ b/src/types/patient-requirements.d.ts
@@ -0,0 +1,19 @@
+import type {
+  PatientRequirementStatus,
+  PatientRequirementType,
+} from '@/enums/patient-requirements'
+
+export type PatientRequirement = {
+  id: string
+  type: PatientRequirementType
+  status: PatientRequirementStatus
+  description: string | null
+  submitted_at: string | null
+  approved_at: string | null
+  created_at: string
+  patient: {
+    id: string
+    name: string
+    avatar_url: string | null
+  }
+}
diff --git a/src/types/patient-support.ts b/src/types/patient-support.d.ts
similarity index 100%
rename from src/types/patient-support.ts
rename to src/types/patient-support.d.ts
diff --git a/src/types/patients.d.ts b/src/types/patients.d.ts
new file mode 100644
index 00000000..68bb3640
--- /dev/null
+++ b/src/types/patients.d.ts
@@ -0,0 +1,35 @@
+import type { PatientGender, PatientStatus } from '@/enums/patients'
+
+import type { PatientSupport } from './patient-support'
+
+export type Patient = {
+  id: string
+  user_id: string
+  gender: PatientGender
+  date_of_birth: string
+  phone: string
+  status: PatientStatus
+  cpf: string
+  state: string
+  city: string
+  has_disability: boolean
+  disability_desc: string | null
+  need_legal_assistance: boolean
+  take_medication: boolean
+  medication_desc: string | null
+  has_nmo_diagnosis: boolean
+  created_at: string
+  updated_at: string
+  name: string
+  email: string
+  avatar_url: string | null
+  supports?: PatientSupport[]
+}
+
+export type PatientDocument = {
+  id: string
+  name: string
+  url: string
+  created_at: string
+  size: string
+}
diff --git a/src/types/referrals.d.ts b/src/types/referrals.d.ts
index d584d77d..4fc7df4b 100644
--- a/src/types/referrals.d.ts
+++ b/src/types/referrals.d.ts
@@ -1,8 +1,7 @@
+import type { PatientCondition } from '@/enums/patients'
 import type { ReferralStatus } from '@/enums/referrals'
 import type { Specialty } from '@/enums/shared'
 
-import type { PatientCondition } from './patients'
-
 export type Referral = {
   id: string
   patient_id: string
diff --git a/src/types/team.d.ts b/src/types/team.d.ts
new file mode 100644
index 00000000..227c118c
--- /dev/null
+++ b/src/types/team.d.ts
@@ -0,0 +1,2 @@
+export type { TeamsOrder } from '@/enums/team'
+export { TEAMS_ORDER_OPTIONS, TEAMS_ORDERS } from '@/enums/team'
diff --git a/src/types/users.d.ts b/src/types/users.d.ts
new file mode 100644
index 00000000..09b56cc3
--- /dev/null
+++ b/src/types/users.d.ts
@@ -0,0 +1,12 @@
+import type { UserRole, UserStatus } from '@/enums/users'
+
+export type User = {
+  id: string
+  name: string
+  email: string
+  avatar_url: string | null
+  status: UserStatus
+  role: UserRole
+  updated_at: Date
+  created_at: Date
+}
diff --git a/src/utils/mock/patients.ts b/src/utils/mock/patients.ts
index ba395508..c6adaa5d 100644
--- a/src/utils/mock/patients.ts
+++ b/src/utils/mock/patients.ts
@@ -1,4 +1,4 @@
-import type { Patient } from '@/types/patients'
+import type { Patient } from '@/types/patients.d.ts'
 
 export const PATIENTS_MOCKS: Patient[] = [
   {

From 18e69924c89169abccfa967b5b058219314e036b Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sun, 25 Jan 2026 00:17:30 -0300
Subject: [PATCH 09/77] feat(components): create `Menu`

---
 src/components/ui/menu.tsx | 69 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 69 insertions(+)
 create mode 100644 src/components/ui/menu.tsx

diff --git a/src/components/ui/menu.tsx b/src/components/ui/menu.tsx
new file mode 100644
index 00000000..de292fe1
--- /dev/null
+++ b/src/components/ui/menu.tsx
@@ -0,0 +1,69 @@
+import {
+  Menu as BaseMenu,
+  type MenuItemProps,
+  type MenuPositionerProps,
+  type MenuRootProps,
+  type MenuTriggerProps as BaseMenuTriggerProps,
+} from '@base-ui-components/react'
+
+import { cn } from '@/utils/class-name-merge'
+
+import { type ButtonProps, buttonVariants } from './button'
+
+export function Menu(props: Readonly<MenuRootProps>) {
+  return <BaseMenu.Root {...props} />
+}
+
+interface MenuTriggerProps extends BaseMenuTriggerProps {
+  variant?: ButtonProps['variant']
+  size?: ButtonProps['size']
+}
+
+export function MenuTrigger({
+  variant = 'outline',
+  size,
+  className,
+  ...props
+}: Readonly<MenuTriggerProps>) {
+  return (
+    <BaseMenu.Trigger
+      className={cn(buttonVariants({ variant, size, className }))}
+      {...props}
+    />
+  )
+}
+
+export function MenuContent({
+  align = 'start',
+  sideOffset = 4,
+  children,
+  className,
+  ...props
+}: Readonly<MenuPositionerProps>) {
+  return (
+    <BaseMenu.Portal>
+      <BaseMenu.Positioner
+        align={align}
+        sideOffset={sideOffset}
+        className={cn('relative z-50 outline-none', className)}
+        {...props}
+      >
+        <BaseMenu.Popup className='bg-popover text-foreground border-border origin-[var(--transform-origin)] overflow-hidden rounded-xl border p-2 shadow-md transition-[translate,opacity] outline-none data-[ending-style]:-translate-y-2 data-[ending-style]:opacity-0 data-[starting-style]:-translate-y-2 data-[starting-style]:opacity-0'>
+          {children}
+        </BaseMenu.Popup>
+      </BaseMenu.Positioner>
+    </BaseMenu.Portal>
+  )
+}
+
+export function MenuItem({ className, ...props }: Readonly<MenuItemProps>) {
+  return (
+    <BaseMenu.Item
+      className={cn(
+        'data-[highlighted]:bg-primary data-[highlighted]:text-primary-foreground flex cursor-pointer items-center gap-2 rounded-md py-2 pr-6 pl-3 leading-tight transition-colors outline-none [&_svg]:size-5',
+        className,
+      )}
+      {...props}
+    />
+  )
+}

From bc33efb63743d57fd82d54e91edea911054ad667 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sun, 25 Jan 2026 00:18:04 -0300
Subject: [PATCH 10/77] refactor(sidebar): replace user menu with new component

---
 src/components/sidebar/account.tsx | 35 ++++++++++++++++--------------
 1 file changed, 19 insertions(+), 16 deletions(-)

diff --git a/src/components/sidebar/account.tsx b/src/components/sidebar/account.tsx
index 4bbf9796..be62d5b6 100644
--- a/src/components/sidebar/account.tsx
+++ b/src/components/sidebar/account.tsx
@@ -1,22 +1,21 @@
 'use client'
 
-import { EllipsisVerticalIcon, LogOutIcon } from 'lucide-react'
+import { EllipsisVerticalIcon, LogOutIcon, UserCircle2Icon } from 'lucide-react'
 import { useRouter } from 'next/navigation'
 import { useTransition } from 'react'
 import { toast } from 'sonner'
 
 import { revalidateCache } from '@/actions/cache'
 import { Avatar } from '@/components/ui/avatar'
-import { DropdownMenu } from '@/components/ui/dropdown'
-import { DropdownMenuContent } from '@/components/ui/dropdown/content'
-import { DropdownMenuItem } from '@/components/ui/dropdown/item'
-import { DropdownMenuTrigger } from '@/components/ui/dropdown/trigger'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
 import { api } from '@/lib/api'
 import { useSidebar } from '@/store/sidebar'
 import type { User } from '@/types/users.d.ts'
 
+import { Divider } from '../ui/divider'
+import { Menu, MenuContent, MenuItem, MenuTrigger } from '../ui/menu'
+
 interface SidebarAccountProps {
   user?: User | null
 }
@@ -56,24 +55,28 @@ export function SidebarAccount({ user }: Readonly<SidebarAccountProps>) {
         <p className='text-foreground-soft truncate text-xs'>{user?.email}</p>
       </div>
 
-      <DropdownMenu>
-        <DropdownMenuTrigger
-          size='icon'
+      <Menu>
+        <MenuTrigger
+          size='icon_sm'
           variant='ghost'
           data-visible={expanded}
           aria-label='Abrir menu'
-          className='absolute right-0 ml-auto size-10 opacity-0 transition-opacity duration-500 data-[visible=true]:size-8 data-[visible=true]:opacity-100 data-[visible=true]:delay-200'
+          className='absolute right-0 ml-auto opacity-0 transition-opacity duration-500 data-[visible=true]:opacity-100 data-[visible=true]:delay-200'
         >
           <EllipsisVerticalIcon className='text-foreground-soft' />
-        </DropdownMenuTrigger>
-
-        <DropdownMenuContent align='start' sideOffset={8} className='min-w-32'>
-          <DropdownMenuItem onClick={logout} disabled={isPending}>
+        </MenuTrigger>
+        <MenuContent sideOffset={8} className='min-w-32'>
+          <MenuItem onClick={() => router.push(ROUTES.dashboard.profile)}>
+            <UserCircle2Icon />
+            Perfil
+          </MenuItem>
+          <Divider className='my-1' />
+          <MenuItem onClick={logout} disabled={isPending}>
             <LogOutIcon />
             Sair
-          </DropdownMenuItem>
-        </DropdownMenuContent>
-      </DropdownMenu>
+          </MenuItem>
+        </MenuContent>
+      </Menu>
     </div>
   )
 }

From c768da2cf1fbbd863da0b6dbb33021d7dec4d1f1 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sun, 25 Jan 2026 00:39:00 -0300
Subject: [PATCH 11/77] refactor(dashboard): replace appointments dropdown
 actions with new component

---
 src/components/ui/menu.tsx                    | 30 ++++++--
 .../dashboard/appointments-card-actions.tsx   | 72 +++++++++++++++++++
 src/modules/dashboard/appointments-card.tsx   | 51 ++-----------
 3 files changed, 102 insertions(+), 51 deletions(-)
 create mode 100644 src/modules/dashboard/appointments-card-actions.tsx

diff --git a/src/components/ui/menu.tsx b/src/components/ui/menu.tsx
index de292fe1..0fcc5e32 100644
--- a/src/components/ui/menu.tsx
+++ b/src/components/ui/menu.tsx
@@ -5,6 +5,7 @@ import {
   type MenuRootProps,
   type MenuTriggerProps as BaseMenuTriggerProps,
 } from '@base-ui-components/react'
+import { cva, type VariantProps } from 'class-variance-authority'
 
 import { cn } from '@/utils/class-name-merge'
 
@@ -48,7 +49,7 @@ export function MenuContent({
         className={cn('relative z-50 outline-none', className)}
         {...props}
       >
-        <BaseMenu.Popup className='bg-popover text-foreground border-border origin-[var(--transform-origin)] overflow-hidden rounded-xl border p-2 shadow-md transition-[translate,opacity] outline-none data-[ending-style]:-translate-y-2 data-[ending-style]:opacity-0 data-[starting-style]:-translate-y-2 data-[starting-style]:opacity-0'>
+        <BaseMenu.Popup className='bg-popover text-foreground border-border flex origin-[var(--transform-origin)] flex-col gap-1 overflow-hidden rounded-xl border p-2 shadow-md transition-[translate,opacity] outline-none data-[ending-style]:-translate-y-2 data-[ending-style]:opacity-0 data-[starting-style]:-translate-y-2 data-[starting-style]:opacity-0'>
           {children}
         </BaseMenu.Popup>
       </BaseMenu.Positioner>
@@ -56,13 +57,30 @@ export function MenuContent({
   )
 }
 
-export function MenuItem({ className, ...props }: Readonly<MenuItemProps>) {
+const menuItemVariants = cva(
+  'data-[highlighted]:bg-primary data-[highlighted]:text-primary-foreground flex cursor-pointer items-center gap-2 rounded-md py-2 pr-6 pl-3 leading-tight transition-colors outline-none [&_svg]:size-5',
+  {
+    variants: {
+      variant: {
+        default: 'text-foreground-soft',
+        destructive:
+          'text-error data-[highlighted]:bg-error/10 data-[highlighted]:text-error',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+    },
+  },
+)
+
+export function MenuItem({
+  className,
+  variant,
+  ...props
+}: Readonly<MenuItemProps & VariantProps<typeof menuItemVariants>>) {
   return (
     <BaseMenu.Item
-      className={cn(
-        'data-[highlighted]:bg-primary data-[highlighted]:text-primary-foreground flex cursor-pointer items-center gap-2 rounded-md py-2 pr-6 pl-3 leading-tight transition-colors outline-none [&_svg]:size-5',
-        className,
-      )}
+      className={cn(menuItemVariants({ variant, className }))}
       {...props}
     />
   )
diff --git a/src/modules/dashboard/appointments-card-actions.tsx b/src/modules/dashboard/appointments-card-actions.tsx
new file mode 100644
index 00000000..0110bc8c
--- /dev/null
+++ b/src/modules/dashboard/appointments-card-actions.tsx
@@ -0,0 +1,72 @@
+'use client'
+
+import {
+  ClipboardCheckIcon,
+  ClipboardListIcon,
+  ClipboardPenIcon,
+  EllipsisIcon,
+  XCircleIcon,
+} from 'lucide-react'
+import { useRouter } from 'next/navigation'
+
+import { Divider } from '@/components/ui/divider'
+import { Menu, MenuContent, MenuItem, MenuTrigger } from '@/components/ui/menu'
+import { ROUTES } from '@/constants/routes'
+import type { Appointment } from '@/types/appointments'
+
+interface DashboardAppointmentsCardActionsProps {
+  appointment: Appointment
+}
+
+// TODO: create cancel appointment modal
+
+export function DashboardAppointmentsCardActions({
+  appointment,
+}: Readonly<DashboardAppointmentsCardActionsProps>) {
+  const router = useRouter()
+
+  return (
+    <Menu>
+      <MenuTrigger size='icon' variant='ghost' className='size-8'>
+        <EllipsisIcon />
+        <span className='sr-only'>Ações</span>
+      </MenuTrigger>
+
+      <MenuContent align='end'>
+        <MenuItem
+          onClick={() => router.push(ROUTES.dashboard.appointments.list)}
+        >
+          <ClipboardPenIcon />
+          Editar
+        </MenuItem>
+        <MenuItem
+          onClick={() =>
+            router.push(
+              ROUTES.dashboard.patients.details.info(appointment.patient_id),
+            )
+          }
+        >
+          <ClipboardListIcon />
+          Informações do paciente
+        </MenuItem>
+        <MenuItem
+          onClick={() =>
+            router.push(
+              ROUTES.dashboard.patients.details.history(appointment.patient_id),
+            )
+          }
+        >
+          <ClipboardCheckIcon />
+          Histórico do paciente
+        </MenuItem>
+
+        <Divider className='my-1' />
+
+        <MenuItem variant='destructive'>
+          <XCircleIcon />
+          Cancelar
+        </MenuItem>
+      </MenuContent>
+    </Menu>
+  )
+}
diff --git a/src/modules/dashboard/appointments-card.tsx b/src/modules/dashboard/appointments-card.tsx
index 1c7705be..f91c4164 100644
--- a/src/modules/dashboard/appointments-card.tsx
+++ b/src/modules/dashboard/appointments-card.tsx
@@ -1,11 +1,4 @@
-import {
-  ClipboardCheckIcon,
-  ClipboardListIcon,
-  ClipboardPenIcon,
-  EllipsisIcon,
-  Users2Icon,
-  XCircleIcon,
-} from 'lucide-react'
+import { Users2Icon } from 'lucide-react'
 
 import { getAppointments } from '@/actions/appointments/get-appointments'
 import { DataTableHeader } from '@/components/data-table/header'
@@ -13,11 +6,6 @@ import { DataTableHeaderActions } from '@/components/data-table/header/actions'
 import { DataTableHeaderInfo } from '@/components/data-table/header/info'
 import { Avatar } from '@/components/ui/avatar'
 import { Card } from '@/components/ui/card'
-import { Divider } from '@/components/ui/divider'
-import { DropdownMenu } from '@/components/ui/dropdown'
-import { DropdownMenuContent } from '@/components/ui/dropdown/content'
-import { DropdownMenuItem } from '@/components/ui/dropdown/item'
-import { DropdownMenuTrigger } from '@/components/ui/dropdown/trigger'
 import { NavButton } from '@/components/ui/nav-button'
 import {
   Table,
@@ -36,6 +24,8 @@ import { SPECIALTIES } from '@/enums/shared'
 import { NewAppointmentButton } from '@/modules/appointments/new-appointment-button'
 import { formatDate } from '@/utils/formatters/format-date'
 
+import { DashboardAppointmentsCardActions } from './appointments-card-actions'
+
 // TODO: update dropdown menu
 
 export async function DashboardAppointmentsCard() {
@@ -113,38 +103,9 @@ export async function DashboardAppointmentsCard() {
                   </TableCell>
 
                   <TableCell className='text-center'>
-                    <DropdownMenu>
-                      <DropdownMenuTrigger
-                        indicator={false}
-                        size='icon'
-                        variant='ghost'
-                        className='size-8'
-                      >
-                        <EllipsisIcon />
-                      </DropdownMenuTrigger>
-
-                      <DropdownMenuContent align='end'>
-                        <DropdownMenuItem>
-                          <ClipboardPenIcon />
-                          Editar
-                        </DropdownMenuItem>
-                        <DropdownMenuItem>
-                          <ClipboardListIcon />
-                          Informações do paciente
-                        </DropdownMenuItem>
-                        <DropdownMenuItem>
-                          <ClipboardCheckIcon />
-                          Histórico do paciente
-                        </DropdownMenuItem>
-
-                        <Divider />
-
-                        <DropdownMenuItem variant='destructive'>
-                          <XCircleIcon />
-                          Cancelar
-                        </DropdownMenuItem>
-                      </DropdownMenuContent>
-                    </DropdownMenu>
+                    <DashboardAppointmentsCardActions
+                      appointment={appointment}
+                    />
                   </TableCell>
                 </TableRow>
               )

From 0efb595c1417c6ea4bdb74ca0ce37bf57476ab3d Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sun, 25 Jan 2026 01:02:17 -0300
Subject: [PATCH 12/77] feat(dashboard): add cancel appointment modal

---
 .../appointments/cancel-appointment-modal.tsx |  82 ++++++++++++++
 .../dashboard/appointments-card-actions.tsx   | 100 +++++++++++-------
 2 files changed, 142 insertions(+), 40 deletions(-)
 create mode 100644 src/modules/appointments/cancel-appointment-modal.tsx

diff --git a/src/modules/appointments/cancel-appointment-modal.tsx b/src/modules/appointments/cancel-appointment-modal.tsx
new file mode 100644
index 00000000..8e676b8b
--- /dev/null
+++ b/src/modules/appointments/cancel-appointment-modal.tsx
@@ -0,0 +1,82 @@
+'use client'
+
+import { CircleXIcon } from 'lucide-react'
+import { useTransition } from 'react'
+import { toast } from 'sonner'
+
+import { revalidateCache } from '@/actions/cache'
+import { Button } from '@/components/ui/button'
+import {
+  DialogClose,
+  DialogContainer,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogIcon,
+  DialogTitle,
+} from '@/components/ui/dialog'
+import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
+import { api } from '@/lib/api'
+import { queryClient } from '@/lib/tanstack-query'
+import type { Appointment } from '@/types/appointments'
+import { formatDate } from '@/utils/formatters/format-date'
+
+interface CancelAppointmentModalProps {
+  appointment: Appointment
+  onClose: () => void
+}
+
+export function CancelAppointmentModal({
+  appointment,
+  onClose,
+}: Readonly<CancelAppointmentModalProps>) {
+  const [isPending, startTransition] = useTransition()
+
+  async function cancelAppointment() {
+    startTransition(async () => {
+      const response = await api(`/appointments/${appointment.id}/cancel`, {
+        method: 'PATCH',
+      })
+
+      if (!response.success) {
+        toast.error(response.message)
+        return
+      }
+
+      queryClient.invalidateQueries({
+        queryKey: [QUERY_CACHE_KEYS.appointments.list],
+      })
+      revalidateCache(NEXT_CACHE_TAGS.patient(appointment.patient_id))
+      toast.success(response.message)
+      onClose()
+    })
+  }
+
+  return (
+    <DialogContainer>
+      <DialogHeader icon={<DialogIcon icon={CircleXIcon} />}>
+        <DialogTitle>Cancelar atendimento</DialogTitle>
+      </DialogHeader>
+
+      <DialogContent>
+        Você tem certeza que deseja cancelar o atendimento de{' '}
+        <span className='font-medium'>{appointment.patient.name}</span>, dia{' '}
+        <span className='font-medium'>{formatDate(appointment.date)}</span>?
+      </DialogContent>
+
+      <DialogFooter>
+        <Button
+          className='flex-1'
+          loading={isPending}
+          variant='destructive'
+          onClick={cancelAppointment}
+        >
+          Confirmar cancelamento
+        </Button>
+        <DialogClose className='flex-1' disabled={isPending}>
+          Cancelar
+        </DialogClose>
+      </DialogFooter>
+    </DialogContainer>
+  )
+}
diff --git a/src/modules/dashboard/appointments-card-actions.tsx b/src/modules/dashboard/appointments-card-actions.tsx
index 0110bc8c..19e496ee 100644
--- a/src/modules/dashboard/appointments-card-actions.tsx
+++ b/src/modules/dashboard/appointments-card-actions.tsx
@@ -8,65 +8,85 @@ import {
   XCircleIcon,
 } from 'lucide-react'
 import { useRouter } from 'next/navigation'
+import { useState } from 'react'
 
+import { Dialog } from '@/components/ui/dialog'
 import { Divider } from '@/components/ui/divider'
 import { Menu, MenuContent, MenuItem, MenuTrigger } from '@/components/ui/menu'
 import { ROUTES } from '@/constants/routes'
 import type { Appointment } from '@/types/appointments'
 
+import { CancelAppointmentModal } from '../appointments/cancel-appointment-modal'
+
 interface DashboardAppointmentsCardActionsProps {
   appointment: Appointment
 }
 
-// TODO: create cancel appointment modal
+// TODO: add edit appointment functionality
 
 export function DashboardAppointmentsCardActions({
   appointment,
 }: Readonly<DashboardAppointmentsCardActionsProps>) {
+  const [cancelModalOpen, setCancelModalOpen] = useState(false)
+
   const router = useRouter()
 
   return (
-    <Menu>
-      <MenuTrigger size='icon' variant='ghost' className='size-8'>
-        <EllipsisIcon />
-        <span className='sr-only'>Ações</span>
-      </MenuTrigger>
+    <>
+      <Menu>
+        <MenuTrigger size='icon' variant='ghost' className='size-8'>
+          <EllipsisIcon />
+          <span className='sr-only'>Ações</span>
+        </MenuTrigger>
+
+        <MenuContent align='end'>
+          <MenuItem>
+            <ClipboardPenIcon />
+            Editar
+          </MenuItem>
+          <MenuItem
+            onClick={() =>
+              router.push(
+                ROUTES.dashboard.patients.details.info(appointment.patient_id),
+              )
+            }
+          >
+            <ClipboardListIcon />
+            Informações do paciente
+          </MenuItem>
+          <MenuItem
+            onClick={() =>
+              router.push(
+                ROUTES.dashboard.patients.details.history(
+                  appointment.patient_id,
+                ),
+              )
+            }
+          >
+            <ClipboardCheckIcon />
+            Histórico do paciente
+          </MenuItem>
 
-      <MenuContent align='end'>
-        <MenuItem
-          onClick={() => router.push(ROUTES.dashboard.appointments.list)}
-        >
-          <ClipboardPenIcon />
-          Editar
-        </MenuItem>
-        <MenuItem
-          onClick={() =>
-            router.push(
-              ROUTES.dashboard.patients.details.info(appointment.patient_id),
-            )
-          }
-        >
-          <ClipboardListIcon />
-          Informações do paciente
-        </MenuItem>
-        <MenuItem
-          onClick={() =>
-            router.push(
-              ROUTES.dashboard.patients.details.history(appointment.patient_id),
-            )
-          }
-        >
-          <ClipboardCheckIcon />
-          Histórico do paciente
-        </MenuItem>
+          <Divider className='my-1' />
 
-        <Divider className='my-1' />
+          <MenuItem
+            variant='destructive'
+            onClick={() => setCancelModalOpen(true)}
+          >
+            <XCircleIcon />
+            Cancelar
+          </MenuItem>
+        </MenuContent>
+      </Menu>
 
-        <MenuItem variant='destructive'>
-          <XCircleIcon />
-          Cancelar
-        </MenuItem>
-      </MenuContent>
-    </Menu>
+      {cancelModalOpen && (
+        <Dialog open={cancelModalOpen} onOpenChange={setCancelModalOpen}>
+          <CancelAppointmentModal
+            appointment={appointment}
+            onClose={() => setCancelModalOpen(false)}
+          />
+        </Dialog>
+      )}
+    </>
   )
 }

From d8caff1d2fdc1e146078ba78dc4645c47af226db Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sun, 25 Jan 2026 22:12:24 -0300
Subject: [PATCH 13/77] refactor(dashboard): update appointments cache
 revalidation

---
 src/actions/appointments/get-appointments.ts  | 23 ++++++++++++++-----
 src/actions/patients/get-patient.ts           |  5 ++--
 .../statistics/get-total-appointments.ts      |  5 ++--
 src/actions/statistics/get-total-patients.ts  |  5 ++--
 src/actions/statistics/get-total-referrals.ts |  5 ++--
 src/config/cache.ts                           |  1 +
 src/constants/cache.ts                        | 12 ++++++----
 .../appointments/appointment-modal.tsx        |  2 +-
 .../appointments/cancel-appointment-modal.tsx |  8 ++++---
 .../dashboard/appointments-card-actions.tsx   |  4 ++--
 src/modules/dashboard/appointments-card.tsx   |  8 ++++---
 src/modules/patients/inactivate-modal.tsx     |  2 +-
 src/modules/patients/list/table.tsx           |  2 +-
 src/modules/referrals/referrals-modal.tsx     |  2 +-
 14 files changed, 50 insertions(+), 34 deletions(-)
 create mode 100644 src/config/cache.ts

diff --git a/src/actions/appointments/get-appointments.ts b/src/actions/appointments/get-appointments.ts
index c94111cb..a5304025 100644
--- a/src/actions/appointments/get-appointments.ts
+++ b/src/actions/appointments/get-appointments.ts
@@ -1,26 +1,37 @@
 'use server'
 
+import { DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS } from '@/config/cache'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import type { AppointmentStatus } from '@/enums/appointments'
 import { api } from '@/lib/api'
 import type { Appointment } from '@/types/appointments'
 
-type GetAppointmentsParams = {
+type Params = {
+  status?: AppointmentStatus
   limit?: number
 }
 
-export async function getAppointments(params?: GetAppointmentsParams) {
-  const REVALIDATE_IN_SECONDS = 3600
+interface GetAppointmentsProps {
+  params?: Params
+  cacheKey?: string
+}
 
+export async function getAppointments({
+  params,
+  cacheKey,
+}: GetAppointmentsProps = {}) {
   try {
     const response = await api<{ appointments: Appointment[]; total: number }>(
       '/appointments',
       {
-        params,
         includeCookies: true,
         cache: 'force-cache',
+        params,
         next: {
-          revalidate: REVALIDATE_IN_SECONDS,
-          tags: [NEXT_CACHE_TAGS.appointments(JSON.stringify(params))],
+          revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
+          tags: cacheKey
+            ? [NEXT_CACHE_TAGS.appointments.main, cacheKey]
+            : [NEXT_CACHE_TAGS.appointments.main],
         },
       },
     )
diff --git a/src/actions/patients/get-patient.ts b/src/actions/patients/get-patient.ts
index 924a003b..4c1d3799 100644
--- a/src/actions/patients/get-patient.ts
+++ b/src/actions/patients/get-patient.ts
@@ -1,18 +1,17 @@
 'use server'
 
+import { DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS } from '@/config/cache'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { api } from '@/lib/api'
 import type { Patient } from '@/types/patients.d.ts'
 
 export async function getPatient(id: string) {
-  const REVALIDATE_IN_SECONDS = 3600
-
   try {
     const response = await api<Patient>(`/patients/${id}`, {
       includeCookies: true,
       cache: 'force-cache',
       next: {
-        revalidate: REVALIDATE_IN_SECONDS,
+        revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
         tags: [NEXT_CACHE_TAGS.patient(id)],
       },
     })
diff --git a/src/actions/statistics/get-total-appointments.ts b/src/actions/statistics/get-total-appointments.ts
index ddc00e30..f495aaa7 100644
--- a/src/actions/statistics/get-total-appointments.ts
+++ b/src/actions/statistics/get-total-appointments.ts
@@ -1,5 +1,6 @@
 'use server'
 
+import { DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS } from '@/config/cache'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { api } from '@/lib/api'
 
@@ -10,8 +11,6 @@ type GetTotalAppointmentsParams = {
 export async function getTotalAppointments(
   params?: GetTotalAppointmentsParams,
 ) {
-  const REVALIDATE_IN_SECONDS = 3600
-
   try {
     const response = await api<{ total: number }>(
       '/statistics/appointments-total',
@@ -20,7 +19,7 @@ export async function getTotalAppointments(
         includeCookies: true,
         cache: 'force-cache',
         next: {
-          revalidate: REVALIDATE_IN_SECONDS,
+          revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
           tags: [
             NEXT_CACHE_TAGS.statistics.totalAppointments(
               JSON.stringify(params),
diff --git a/src/actions/statistics/get-total-patients.ts b/src/actions/statistics/get-total-patients.ts
index 1fcf29b3..be2f4c94 100644
--- a/src/actions/statistics/get-total-patients.ts
+++ b/src/actions/statistics/get-total-patients.ts
@@ -1,5 +1,6 @@
 'use server'
 
+import { DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS } from '@/config/cache'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { api } from '@/lib/api'
 
@@ -10,8 +11,6 @@ type GetTotalPatientsParams = {
 }
 
 export async function getTotalPatients(params?: GetTotalPatientsParams) {
-  const REVALIDATE_IN_SECONDS = 3600
-
   try {
     const response = await api<Record<Status, number>>(
       '/statistics/patients-total',
@@ -20,7 +19,7 @@ export async function getTotalPatients(params?: GetTotalPatientsParams) {
         includeCookies: true,
         cache: 'force-cache',
         next: {
-          revalidate: REVALIDATE_IN_SECONDS,
+          revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
           tags: [
             NEXT_CACHE_TAGS.statistics.totalPatients(JSON.stringify(params)),
           ],
diff --git a/src/actions/statistics/get-total-referrals.ts b/src/actions/statistics/get-total-referrals.ts
index 9d24e7fe..89a2e1db 100644
--- a/src/actions/statistics/get-total-referrals.ts
+++ b/src/actions/statistics/get-total-referrals.ts
@@ -1,5 +1,6 @@
 'use server'
 
+import { DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS } from '@/config/cache'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import type { QueryPeriod } from '@/enums/queries'
 import { api } from '@/lib/api'
@@ -9,8 +10,6 @@ type GetTotalReferralsParams = {
 }
 
 export async function getTotalReferrals(params?: GetTotalReferralsParams) {
-  const REVALIDATE_IN_SECONDS = 3600
-
   try {
     const response = await api<{ total: number }>(
       '/statistics/referrals-total',
@@ -19,7 +18,7 @@ export async function getTotalReferrals(params?: GetTotalReferralsParams) {
         includeCookies: true,
         cache: 'force-cache',
         next: {
-          revalidate: REVALIDATE_IN_SECONDS,
+          revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
           tags: [
             NEXT_CACHE_TAGS.statistics.totalReferrals(JSON.stringify(params)),
           ],
diff --git a/src/config/cache.ts b/src/config/cache.ts
new file mode 100644
index 00000000..d4446cfd
--- /dev/null
+++ b/src/config/cache.ts
@@ -0,0 +1 @@
+export const DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS = 3600
diff --git a/src/constants/cache.ts b/src/constants/cache.ts
index df9b6d10..c995dbf3 100644
--- a/src/constants/cache.ts
+++ b/src/constants/cache.ts
@@ -1,7 +1,10 @@
 export const NEXT_CACHE_TAGS = {
   user: (id: string) => `user/${id}`,
   patient: (id: string) => `patient/${id}`,
-  appointments: (query: string) => `appointments/${query}`,
+  appointments: {
+    main: 'appointments',
+    dashboard: 'appointments-dashboard',
+  },
   statistics: {
     totalPatients: (query: string) => `total-patients/${query}`,
     totalReferrals: (query: string) => `total-referrals/${query}`,
@@ -15,16 +18,17 @@ export const QUERY_CACHE_KEYS = {
     patientsByCity: 'dashboard-patients-by-city',
   },
   patients: {
+    main: 'patients',
     allOptions: 'patients-all-options',
-    list: 'patients-list',
   },
   appointments: {
-    list: 'appointments-list',
+    main: 'appointments',
   },
   referrals: {
-    list: 'referrals-list',
+    main: 'referrals',
   },
   approvals: {
+    main: 'approvals',
     pending: 'approvals-pending',
     approved: 'approvals-approved',
   },
diff --git a/src/modules/appointments/appointment-modal.tsx b/src/modules/appointments/appointment-modal.tsx
index 74159f1e..05246fff 100644
--- a/src/modules/appointments/appointment-modal.tsx
+++ b/src/modules/appointments/appointment-modal.tsx
@@ -84,7 +84,7 @@ export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
     }
 
     queryClient.invalidateQueries({
-      queryKey: [QUERY_CACHE_KEYS.appointments.list],
+      queryKey: [QUERY_CACHE_KEYS.appointments.main],
     })
     revalidateCache(NEXT_CACHE_TAGS.patient(data.patient_id))
     toast.success(response.message)
diff --git a/src/modules/appointments/cancel-appointment-modal.tsx b/src/modules/appointments/cancel-appointment-modal.tsx
index 8e676b8b..c19c296e 100644
--- a/src/modules/appointments/cancel-appointment-modal.tsx
+++ b/src/modules/appointments/cancel-appointment-modal.tsx
@@ -44,9 +44,10 @@ export function CancelAppointmentModal({
       }
 
       queryClient.invalidateQueries({
-        queryKey: [QUERY_CACHE_KEYS.appointments.list],
+        queryKey: [QUERY_CACHE_KEYS.appointments.main],
       })
       revalidateCache(NEXT_CACHE_TAGS.patient(appointment.patient_id))
+      revalidateCache(NEXT_CACHE_TAGS.appointments.main)
       toast.success(response.message)
       onClose()
     })
@@ -60,8 +61,9 @@ export function CancelAppointmentModal({
 
       <DialogContent>
         Você tem certeza que deseja cancelar o atendimento de{' '}
-        <span className='font-medium'>{appointment.patient.name}</span>, dia{' '}
-        <span className='font-medium'>{formatDate(appointment.date)}</span>?
+        <span className='font-semibold'>{appointment.patient.name}</span>,
+        agendado para dia{' '}
+        <span className='font-semibold'>{formatDate(appointment.date)}</span>?
       </DialogContent>
 
       <DialogFooter>
diff --git a/src/modules/dashboard/appointments-card-actions.tsx b/src/modules/dashboard/appointments-card-actions.tsx
index 19e496ee..2015ffde 100644
--- a/src/modules/dashboard/appointments-card-actions.tsx
+++ b/src/modules/dashboard/appointments-card-actions.tsx
@@ -1,7 +1,7 @@
 'use client'
 
 import {
-  ClipboardCheckIcon,
+  ClipboardClockIcon,
   ClipboardListIcon,
   ClipboardPenIcon,
   EllipsisIcon,
@@ -63,7 +63,7 @@ export function DashboardAppointmentsCardActions({
               )
             }
           >
-            <ClipboardCheckIcon />
+            <ClipboardClockIcon />
             Histórico do paciente
           </MenuItem>
 
diff --git a/src/modules/dashboard/appointments-card.tsx b/src/modules/dashboard/appointments-card.tsx
index f91c4164..04d1025c 100644
--- a/src/modules/dashboard/appointments-card.tsx
+++ b/src/modules/dashboard/appointments-card.tsx
@@ -18,6 +18,7 @@ import {
   TableRow,
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
+import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
 import { PATIENT_CONDITIONS } from '@/enums/patients'
 import { SPECIALTIES } from '@/enums/shared'
@@ -26,10 +27,11 @@ import { formatDate } from '@/utils/formatters/format-date'
 
 import { DashboardAppointmentsCardActions } from './appointments-card-actions'
 
-// TODO: update dropdown menu
-
 export async function DashboardAppointmentsCard() {
-  const response = await getAppointments({ limit: 5 })
+  const response = await getAppointments({
+    params: { status: 'scheduled', limit: 5 },
+    cacheKey: NEXT_CACHE_TAGS.appointments.dashboard,
+  })
 
   const appointments = response?.appointments
   const showAppointments = appointments && appointments.length > 0
diff --git a/src/modules/patients/inactivate-modal.tsx b/src/modules/patients/inactivate-modal.tsx
index 2920e038..04b31e3b 100644
--- a/src/modules/patients/inactivate-modal.tsx
+++ b/src/modules/patients/inactivate-modal.tsx
@@ -59,7 +59,7 @@ export function InactivatePatientModal({
     }
 
     queryClient.invalidateQueries({
-      queryKey: [QUERY_CACHE_KEYS.patients.list],
+      queryKey: [QUERY_CACHE_KEYS.patients.main],
     })
     queryClient.invalidateQueries({
       queryKey: [QUERY_CACHE_KEYS.patients.allOptions],
diff --git a/src/modules/patients/list/table.tsx b/src/modules/patients/list/table.tsx
index 1ede1ce8..fa96bb85 100644
--- a/src/modules/patients/list/table.tsx
+++ b/src/modules/patients/list/table.tsx
@@ -72,7 +72,7 @@ export function PatientsListTable() {
   }
 
   const { data: response, isLoading } = useQuery({
-    queryKey: [QUERY_CACHE_KEYS.patients.list, filterQueries],
+    queryKey: [QUERY_CACHE_KEYS.patients.main, filterQueries],
     queryFn: () =>
       api<{ patients: Patient[]; total: number }>('/patients', {
         params: {
diff --git a/src/modules/referrals/referrals-modal.tsx b/src/modules/referrals/referrals-modal.tsx
index 94bfeef4..c7547c9b 100644
--- a/src/modules/referrals/referrals-modal.tsx
+++ b/src/modules/referrals/referrals-modal.tsx
@@ -84,7 +84,7 @@ export function ReferralPatientModal({ onClose, id }: ReferralModalProps) {
       return
     }
     queryClient.invalidateQueries({
-      queryKey: [QUERY_CACHE_KEYS.referrals.list],
+      queryKey: [QUERY_CACHE_KEYS.referrals.main],
     })
     revalidateCache(NEXT_CACHE_TAGS.patient(data.patient_id))
     toast.success(response.message)

From 9d2d4cad202e9623a6938ac760044f5daf089ad9 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sun, 25 Jan 2026 22:29:00 -0300
Subject: [PATCH 14/77] refactor(actions): reorganize cache tags

---
 src/actions/appointments/get-appointments.ts  |  4 +--
 .../statistics/get-total-appointments.ts      | 25 +++++++++++--------
 src/actions/statistics/get-total-patients.ts  | 21 +++++++++++-----
 src/actions/statistics/get-total-referrals.ts | 18 +++++++++----
 src/constants/cache.ts                        | 17 ++++++++++---
 src/modules/dashboard/appointments-card.tsx   | 14 ++++++++---
 6 files changed, 69 insertions(+), 30 deletions(-)

diff --git a/src/actions/appointments/get-appointments.ts b/src/actions/appointments/get-appointments.ts
index a5304025..9c02b14a 100644
--- a/src/actions/appointments/get-appointments.ts
+++ b/src/actions/appointments/get-appointments.ts
@@ -6,13 +6,13 @@ import type { AppointmentStatus } from '@/enums/appointments'
 import { api } from '@/lib/api'
 import type { Appointment } from '@/types/appointments'
 
-type Params = {
+export type GetAppointmentsParams = {
   status?: AppointmentStatus
   limit?: number
 }
 
 interface GetAppointmentsProps {
-  params?: Params
+  params?: GetAppointmentsParams
   cacheKey?: string
 }
 
diff --git a/src/actions/statistics/get-total-appointments.ts b/src/actions/statistics/get-total-appointments.ts
index f495aaa7..f3f277b2 100644
--- a/src/actions/statistics/get-total-appointments.ts
+++ b/src/actions/statistics/get-total-appointments.ts
@@ -2,29 +2,34 @@
 
 import { DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS } from '@/config/cache'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import type { QueryPeriod } from '@/enums/queries'
 import { api } from '@/lib/api'
 
 type GetTotalAppointmentsParams = {
-  period?: string
+  period?: QueryPeriod
 }
 
-export async function getTotalAppointments(
-  params?: GetTotalAppointmentsParams,
-) {
+interface GetTotalAppointmentsProps {
+  params?: GetTotalAppointmentsParams
+  cacheKey?: string
+}
+
+export async function getTotalAppointments({
+  params,
+  cacheKey,
+}: GetTotalAppointmentsProps = {}) {
   try {
     const response = await api<{ total: number }>(
       '/statistics/appointments-total',
       {
-        params,
         includeCookies: true,
         cache: 'force-cache',
+        params,
         next: {
           revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
-          tags: [
-            NEXT_CACHE_TAGS.statistics.totalAppointments(
-              JSON.stringify(params),
-            ),
-          ],
+          tags: cacheKey
+            ? [NEXT_CACHE_TAGS.statistics.totalAppointments.main, cacheKey]
+            : [NEXT_CACHE_TAGS.statistics.totalAppointments.main],
         },
       },
     )
diff --git a/src/actions/statistics/get-total-patients.ts b/src/actions/statistics/get-total-patients.ts
index be2f4c94..7672a78c 100644
--- a/src/actions/statistics/get-total-patients.ts
+++ b/src/actions/statistics/get-total-patients.ts
@@ -2,27 +2,36 @@
 
 import { DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS } from '@/config/cache'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import type { QueryPeriod } from '@/enums/queries'
 import { api } from '@/lib/api'
 
 type Status = 'total' | 'active' | 'inactive'
 
 type GetTotalPatientsParams = {
-  period?: string
+  period?: QueryPeriod
 }
 
-export async function getTotalPatients(params?: GetTotalPatientsParams) {
+interface GetTotalPatientsProps {
+  params?: GetTotalPatientsParams
+  cacheKey?: string
+}
+
+export async function getTotalPatients({
+  params,
+  cacheKey,
+}: GetTotalPatientsProps = {}) {
   try {
     const response = await api<Record<Status, number>>(
       '/statistics/patients-total',
       {
-        params,
         includeCookies: true,
         cache: 'force-cache',
+        params,
         next: {
           revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
-          tags: [
-            NEXT_CACHE_TAGS.statistics.totalPatients(JSON.stringify(params)),
-          ],
+          tags: cacheKey
+            ? [NEXT_CACHE_TAGS.statistics.totalPatients.main, cacheKey]
+            : [NEXT_CACHE_TAGS.statistics.totalPatients.main],
         },
       },
     )
diff --git a/src/actions/statistics/get-total-referrals.ts b/src/actions/statistics/get-total-referrals.ts
index 89a2e1db..d05a7d9f 100644
--- a/src/actions/statistics/get-total-referrals.ts
+++ b/src/actions/statistics/get-total-referrals.ts
@@ -9,19 +9,27 @@ type GetTotalReferralsParams = {
   period?: QueryPeriod
 }
 
-export async function getTotalReferrals(params?: GetTotalReferralsParams) {
+interface GetTotalReferralsProps {
+  params?: GetTotalReferralsParams
+  cacheKey?: string
+}
+
+export async function getTotalReferrals({
+  params,
+  cacheKey,
+}: GetTotalReferralsProps = {}) {
   try {
     const response = await api<{ total: number }>(
       '/statistics/referrals-total',
       {
-        params,
         includeCookies: true,
         cache: 'force-cache',
+        params,
         next: {
           revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
-          tags: [
-            NEXT_CACHE_TAGS.statistics.totalReferrals(JSON.stringify(params)),
-          ],
+          tags: cacheKey
+            ? [NEXT_CACHE_TAGS.statistics.totalReferrals.main, cacheKey]
+            : [NEXT_CACHE_TAGS.statistics.totalReferrals.main],
         },
       },
     )
diff --git a/src/constants/cache.ts b/src/constants/cache.ts
index c995dbf3..6ddf37e4 100644
--- a/src/constants/cache.ts
+++ b/src/constants/cache.ts
@@ -3,12 +3,21 @@ export const NEXT_CACHE_TAGS = {
   patient: (id: string) => `patient/${id}`,
   appointments: {
     main: 'appointments',
-    dashboard: 'appointments-dashboard',
+    query: (query: string) => `appointments/${query}`,
   },
   statistics: {
-    totalPatients: (query: string) => `total-patients/${query}`,
-    totalReferrals: (query: string) => `total-referrals/${query}`,
-    totalAppointments: (query: string) => `total-appointments/${query}`,
+    totalAppointments: {
+      main: 'total-appointments',
+      query: (query: string) => `total-appointments/${query}`,
+    },
+    totalPatients: {
+      main: 'total-patients',
+      query: (query: string) => `total-patients/${query}`,
+    },
+    totalReferrals: {
+      main: 'total-referrals',
+      query: (query: string) => `total-referrals/${query}`,
+    },
   },
 }
 
diff --git a/src/modules/dashboard/appointments-card.tsx b/src/modules/dashboard/appointments-card.tsx
index 04d1025c..78aac47e 100644
--- a/src/modules/dashboard/appointments-card.tsx
+++ b/src/modules/dashboard/appointments-card.tsx
@@ -1,6 +1,9 @@
 import { Users2Icon } from 'lucide-react'
 
-import { getAppointments } from '@/actions/appointments/get-appointments'
+import {
+  getAppointments,
+  type GetAppointmentsParams,
+} from '@/actions/appointments/get-appointments'
 import { DataTableHeader } from '@/components/data-table/header'
 import { DataTableHeaderActions } from '@/components/data-table/header/actions'
 import { DataTableHeaderInfo } from '@/components/data-table/header/info'
@@ -28,9 +31,14 @@ import { formatDate } from '@/utils/formatters/format-date'
 import { DashboardAppointmentsCardActions } from './appointments-card-actions'
 
 export async function DashboardAppointmentsCard() {
+  const params: GetAppointmentsParams = {
+    status: 'scheduled',
+    limit: 5,
+  }
+
   const response = await getAppointments({
-    params: { status: 'scheduled', limit: 5 },
-    cacheKey: NEXT_CACHE_TAGS.appointments.dashboard,
+    params,
+    cacheKey: NEXT_CACHE_TAGS.appointments.query(JSON.stringify(params)),
   })
 
   const appointments = response?.appointments

From b1dcc6b4bb493a735de1cf56421205b80f6a9cd4 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sun, 25 Jan 2026 23:54:10 -0300
Subject: [PATCH 15/77] feat(appointments): implements edit functionality

---
 .../appointments/appointment-modal.tsx        | 75 ++++++++++-----
 .../table/actions.tsx}                        | 40 +++++---
 src/modules/appointments/table/index.tsx      | 95 +++++++++++++++++++
 src/modules/dashboard/appointments-card.tsx   | 88 +----------------
 src/schemas/index.tsx                         | 17 ++++
 5 files changed, 194 insertions(+), 121 deletions(-)
 rename src/modules/{dashboard/appointments-card-actions.tsx => appointments/table/actions.tsx} (64%)
 create mode 100644 src/modules/appointments/table/index.tsx

diff --git a/src/modules/appointments/appointment-modal.tsx b/src/modules/appointments/appointment-modal.tsx
index 05246fff..03e77970 100644
--- a/src/modules/appointments/appointment-modal.tsx
+++ b/src/modules/appointments/appointment-modal.tsx
@@ -24,59 +24,81 @@ import {
   DialogTitle,
 } from '@/components/ui/dialog'
 import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
-import {
-  PATIENT_CONDITION_ENUM,
-  PATIENT_CONDITION_OPTIONS,
-} from '@/enums/patients'
-import { SPECIALTIES_ENUM, SPECIALTIES_OPTIONS } from '@/enums/shared'
+import { PATIENT_CONDITION_OPTIONS } from '@/enums/patients'
+import { SPECIALTIES_OPTIONS } from '@/enums/shared'
 import { usePatientOptions } from '@/hooks/use-patient-otions'
 import { api } from '@/lib/api'
 import { queryClient } from '@/lib/tanstack-query'
+import {
+  dateSchema,
+  patientConditionSchema,
+  professionalNameSchema,
+  specialtySchema,
+} from '@/schemas'
+import type { Appointment } from '@/types/appointments'
 
 const appointmentFormSchema = z.object({
   patient_id: z.string().uuid('Paciente é obrigatório'),
-  date: z.string().datetime('A data é obrigatória'),
-  category: z.enum(SPECIALTIES_ENUM, { message: 'Categoria é obrigatório' }),
-  condition: z.enum(PATIENT_CONDITION_ENUM, {
-    message: 'O quadro é obrigatório',
-  }),
+  date: dateSchema,
+  category: specialtySchema,
+  condition: patientConditionSchema,
   annotation: z
     .string()
     .max(500)
     .nullable()
     .transform((value) => (!value ? null : value)),
-  professional_name: z
-    .string()
-    .nullable()
-    .transform((value) => (!value ? null : value)),
+  professional_name: professionalNameSchema,
 })
 type AppointmentFormSchema = z.infer<typeof appointmentFormSchema>
 
 interface AppointmentModalProps {
+  appointment?: Appointment
   onClose: () => void
 }
 
-export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
+export function AppointmentModal({
+  appointment,
+  onClose,
+}: Readonly<AppointmentModalProps>) {
   const { patientOptions } = usePatientOptions()
 
+  const isEditMode = !!appointment
+
   const formMethods = useForm<AppointmentFormSchema>({
     resolver: zodResolver(appointmentFormSchema),
     defaultValues: {
-      patient_id: '',
-      date: '',
-      category: '',
-      condition: '',
-      annotation: '',
-      professional_name: '',
+      patient_id: appointment?.patient_id || '',
+      date: appointment?.date || '',
+      category: appointment?.category || '',
+      condition: appointment?.condition || '',
+      annotation: appointment?.annotation || '',
+      professional_name: appointment?.professional_name || '',
     } as unknown as AppointmentFormSchema,
     mode: 'onBlur',
   })
 
-  async function submitForm(data: AppointmentFormSchema) {
-    const response = await api('/appointments', {
+  function createAppointment(data: AppointmentFormSchema) {
+    return api('/appointments', {
       method: 'POST',
       body: JSON.stringify(data),
     })
+  }
+
+  function updateAppointment({
+    date,
+    condition,
+    annotation,
+  }: AppointmentFormSchema) {
+    return api(`/appointments/${appointment?.id}`, {
+      method: 'PUT',
+      body: JSON.stringify({ date, condition, annotation }),
+    })
+  }
+
+  async function submitForm(data: AppointmentFormSchema) {
+    const response = isEditMode
+      ? await updateAppointment(data)
+      : await createAppointment(data)
 
     if (!response.success) {
       toast.error(response.message)
@@ -87,6 +109,8 @@ export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
       queryKey: [QUERY_CACHE_KEYS.appointments.main],
     })
     revalidateCache(NEXT_CACHE_TAGS.patient(data.patient_id))
+    revalidateCache(NEXT_CACHE_TAGS.appointments.main)
+    revalidateCache(NEXT_CACHE_TAGS.statistics.totalAppointments.main)
     toast.success(response.message)
     onClose()
   }
@@ -109,6 +133,7 @@ export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
               className='sm:col-span-full'
               placeholder='Selecione um paciente'
               options={patientOptions}
+              readOnly={isEditMode}
               isRequired
             />
             <DateInput
@@ -123,6 +148,7 @@ export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
               label='Categoria'
               options={SPECIALTIES_OPTIONS}
               className='sm:col-span-1'
+              readOnly={isEditMode}
               isRequired
             />
             <SelectInput
@@ -136,6 +162,7 @@ export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
               name='professional_name'
               label='Profissional responsável'
               wrapperClassName='sm:col-span-1'
+              readOnly={isEditMode}
             />
             <TextareaInput
               rows={8}
@@ -155,7 +182,7 @@ export function AppointmentModal({ onClose }: Readonly<AppointmentModalProps>) {
           loading={formMethods.formState.isSubmitting}
           onClick={formMethods.handleSubmit(submitForm)}
         >
-          Cadastrar
+          {isEditMode ? 'Atualizar' : 'Cadastrar'}
         </Button>
         <DialogClose
           className='flex-1'
diff --git a/src/modules/dashboard/appointments-card-actions.tsx b/src/modules/appointments/table/actions.tsx
similarity index 64%
rename from src/modules/dashboard/appointments-card-actions.tsx
rename to src/modules/appointments/table/actions.tsx
index 2015ffde..d255d200 100644
--- a/src/modules/dashboard/appointments-card-actions.tsx
+++ b/src/modules/appointments/table/actions.tsx
@@ -16,18 +16,19 @@ import { Menu, MenuContent, MenuItem, MenuTrigger } from '@/components/ui/menu'
 import { ROUTES } from '@/constants/routes'
 import type { Appointment } from '@/types/appointments'
 
-import { CancelAppointmentModal } from '../appointments/cancel-appointment-modal'
+import { AppointmentModal } from '../appointment-modal'
+import { CancelAppointmentModal } from '../cancel-appointment-modal'
 
-interface DashboardAppointmentsCardActionsProps {
+type AppointmentModalMode = 'edit' | 'cancel'
+
+interface AppointmentsTableActionsProps {
   appointment: Appointment
 }
 
-// TODO: add edit appointment functionality
-
-export function DashboardAppointmentsCardActions({
+export function AppointmentsTableActions({
   appointment,
-}: Readonly<DashboardAppointmentsCardActionsProps>) {
-  const [cancelModalOpen, setCancelModalOpen] = useState(false)
+}: Readonly<AppointmentsTableActionsProps>) {
+  const [modalOpen, setModalOpen] = useState<AppointmentModalMode | null>(null)
 
   const router = useRouter()
 
@@ -40,7 +41,7 @@ export function DashboardAppointmentsCardActions({
         </MenuTrigger>
 
         <MenuContent align='end'>
-          <MenuItem>
+          <MenuItem onClick={() => setModalOpen('edit')}>
             <ClipboardPenIcon />
             Editar
           </MenuItem>
@@ -71,7 +72,7 @@ export function DashboardAppointmentsCardActions({
 
           <MenuItem
             variant='destructive'
-            onClick={() => setCancelModalOpen(true)}
+            onClick={() => setModalOpen('cancel')}
           >
             <XCircleIcon />
             Cancelar
@@ -79,11 +80,26 @@ export function DashboardAppointmentsCardActions({
         </MenuContent>
       </Menu>
 
-      {cancelModalOpen && (
-        <Dialog open={cancelModalOpen} onOpenChange={setCancelModalOpen}>
+      {modalOpen === 'edit' && (
+        <Dialog
+          open={modalOpen === 'edit'}
+          onOpenChange={(open) => setModalOpen(open ? 'edit' : null)}
+        >
+          <AppointmentModal
+            appointment={appointment}
+            onClose={() => setModalOpen(null)}
+          />
+        </Dialog>
+      )}
+
+      {modalOpen === 'cancel' && (
+        <Dialog
+          open={modalOpen === 'cancel'}
+          onOpenChange={(open) => setModalOpen(open ? 'cancel' : null)}
+        >
           <CancelAppointmentModal
             appointment={appointment}
-            onClose={() => setCancelModalOpen(false)}
+            onClose={() => setModalOpen(null)}
           />
         </Dialog>
       )}
diff --git a/src/modules/appointments/table/index.tsx b/src/modules/appointments/table/index.tsx
new file mode 100644
index 00000000..a5b3804f
--- /dev/null
+++ b/src/modules/appointments/table/index.tsx
@@ -0,0 +1,95 @@
+import { Avatar } from '@/components/ui/avatar'
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableEmptyCell,
+  TableHead,
+  TableHeader,
+  TableLink,
+  TableRow,
+} from '@/components/ui/table'
+import { Tag } from '@/components/ui/tag'
+import { ROUTES } from '@/constants/routes'
+import { PATIENT_CONDITIONS } from '@/enums/patients'
+import { SPECIALTIES } from '@/enums/shared'
+import type { Appointment } from '@/types/appointments'
+import { formatDate } from '@/utils/formatters/format-date'
+
+import { AppointmentsTableActions } from './actions'
+
+interface AppointmentsTableProps {
+  appointments: Appointment[]
+}
+
+export function AppointmentsTable({
+  appointments,
+}: Readonly<AppointmentsTableProps>) {
+  const showAppointments = appointments.length > 0
+
+  return (
+    <Table>
+      <TableHeader>
+        <TableRow>
+          <TableHead className='w-64'>Paciente</TableHead>
+          <TableHead className='w-36'>Data</TableHead>
+          <TableHead className='w-44'>Categoria</TableHead>
+          <TableHead>Profissional</TableHead>
+          <TableHead className='w-36'>Quadro geral</TableHead>
+          <TableHead className='w-20 text-center'>Ações</TableHead>
+        </TableRow>
+      </TableHeader>
+
+      {showAppointments && (
+        <TableBody>
+          {appointments.map((appointment) => {
+            const condition = PATIENT_CONDITIONS[appointment.condition]
+            const Icon = condition.icon
+
+            return (
+              <TableRow key={appointment.id}>
+                <TableCell>
+                  <TableLink
+                    className='w-64'
+                    href={ROUTES.dashboard.patients.details.info(
+                      appointment.patient_id,
+                    )}
+                  >
+                    <Avatar
+                      className='size-9'
+                      src={appointment.patient.avatar_url}
+                    />
+                    <span className='truncate'>{appointment.patient.name}</span>
+                  </TableLink>
+                </TableCell>
+                <TableCell>{formatDate(appointment.date)}</TableCell>
+                <TableCell>{SPECIALTIES[appointment.category]}</TableCell>
+                <TableCell>{appointment.professional_name ?? '-'}</TableCell>
+                <TableCell>
+                  <Tag variant={condition.variant} size='sm'>
+                    <Icon />
+                    {condition.label}
+                  </Tag>
+                </TableCell>
+
+                <TableCell className='text-center'>
+                  <AppointmentsTableActions appointment={appointment} />
+                </TableCell>
+              </TableRow>
+            )
+          })}
+        </TableBody>
+      )}
+
+      {!showAppointments && (
+        <TableBody>
+          <TableRow>
+            <TableEmptyCell colSpan={6}>
+              Nenhum atendimento encontrado
+            </TableEmptyCell>
+          </TableRow>
+        </TableBody>
+      )}
+    </Table>
+  )
+}
diff --git a/src/modules/dashboard/appointments-card.tsx b/src/modules/dashboard/appointments-card.tsx
index 78aac47e..cd10e7ca 100644
--- a/src/modules/dashboard/appointments-card.tsx
+++ b/src/modules/dashboard/appointments-card.tsx
@@ -7,28 +7,13 @@ import {
 import { DataTableHeader } from '@/components/data-table/header'
 import { DataTableHeaderActions } from '@/components/data-table/header/actions'
 import { DataTableHeaderInfo } from '@/components/data-table/header/info'
-import { Avatar } from '@/components/ui/avatar'
 import { Card } from '@/components/ui/card'
 import { NavButton } from '@/components/ui/nav-button'
-import {
-  Table,
-  TableBody,
-  TableCell,
-  TableEmptyCell,
-  TableHead,
-  TableHeader,
-  TableLink,
-  TableRow,
-} from '@/components/ui/table'
-import { Tag } from '@/components/ui/tag'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
-import { PATIENT_CONDITIONS } from '@/enums/patients'
-import { SPECIALTIES } from '@/enums/shared'
 import { NewAppointmentButton } from '@/modules/appointments/new-appointment-button'
-import { formatDate } from '@/utils/formatters/format-date'
 
-import { DashboardAppointmentsCardActions } from './appointments-card-actions'
+import { AppointmentsTable } from '../appointments/table'
 
 export async function DashboardAppointmentsCard() {
   const params: GetAppointmentsParams = {
@@ -41,8 +26,7 @@ export async function DashboardAppointmentsCard() {
     cacheKey: NEXT_CACHE_TAGS.appointments.query(JSON.stringify(params)),
   })
 
-  const appointments = response?.appointments
-  const showAppointments = appointments && appointments.length > 0
+  const appointments = response?.appointments ?? []
 
   return (
     <Card className='p-6 sm:col-span-6'>
@@ -66,73 +50,7 @@ export async function DashboardAppointmentsCard() {
         </DataTableHeaderActions>
       </DataTableHeader>
 
-      <Table>
-        <TableHeader>
-          <TableRow>
-            <TableHead className='w-64'>Paciente</TableHead>
-            <TableHead className='w-36'>Data</TableHead>
-            <TableHead className='w-44'>Categoria</TableHead>
-            <TableHead>Profissional</TableHead>
-            <TableHead className='w-36'>Quadro geral</TableHead>
-            <TableHead className='w-20 text-center'>Ações</TableHead>
-          </TableRow>
-        </TableHeader>
-
-        {showAppointments && (
-          <TableBody>
-            {appointments.map((appointment) => {
-              const condition = PATIENT_CONDITIONS[appointment.condition]
-              const Icon = condition.icon
-
-              return (
-                <TableRow key={appointment.id}>
-                  <TableCell>
-                    <TableLink
-                      className='w-64'
-                      href={ROUTES.dashboard.patients.details.info(
-                        appointment.patient_id,
-                      )}
-                    >
-                      <Avatar
-                        className='size-9'
-                        src={appointment.patient.avatar_url}
-                      />
-                      <span className='truncate'>
-                        {appointment.patient.name}
-                      </span>
-                    </TableLink>
-                  </TableCell>
-                  <TableCell>{formatDate(appointment.date)}</TableCell>
-                  <TableCell>{SPECIALTIES[appointment.category]}</TableCell>
-                  <TableCell>{appointment.professional_name ?? '-'}</TableCell>
-                  <TableCell>
-                    <Tag variant={condition.variant} size='sm'>
-                      <Icon />
-                      {condition.label}
-                    </Tag>
-                  </TableCell>
-
-                  <TableCell className='text-center'>
-                    <DashboardAppointmentsCardActions
-                      appointment={appointment}
-                    />
-                  </TableCell>
-                </TableRow>
-              )
-            })}
-          </TableBody>
-        )}
-
-        {!showAppointments && (
-          <TableBody>
-            <TableRow>
-              <TableEmptyCell colSpan={6}>
-                Nenhum atendimento encontrado
-              </TableEmptyCell>
-            </TableRow>
-          </TableBody>
-        )}
-      </Table>
+      <AppointmentsTable appointments={appointments} />
     </Card>
   )
 }
diff --git a/src/schemas/index.tsx b/src/schemas/index.tsx
index ef5d6c71..cdf55bbf 100644
--- a/src/schemas/index.tsx
+++ b/src/schemas/index.tsx
@@ -7,6 +7,8 @@ import {
   NON_SPECIAL_CHAR_REGEX,
   PHONE_REGEX,
 } from '@/constants/regex'
+import { PATIENT_CONDITION_ENUM } from '@/enums/patients'
+import { SPECIALTIES_ENUM } from '@/enums/shared'
 
 export const nameSchema = z
   .string()
@@ -61,3 +63,18 @@ export const kinshipSchema = z
 export const yesOrNoSchema = z.enum(YES_OR_NO_TUPLE, {
   message: 'Selecione "Sim" ou "Não"',
 })
+
+export const dateSchema = z.string().datetime('A data é obrigatória')
+
+export const specialtySchema = z.enum(SPECIALTIES_ENUM, {
+  message: 'Categoria é obrigatório',
+})
+
+export const patientConditionSchema = z.enum(PATIENT_CONDITION_ENUM, {
+  message: 'O quadro é obrigatório',
+})
+
+export const professionalNameSchema = z
+  .string()
+  .nullable()
+  .transform((value) => (!value ? null : value))

From 80150ac578c25cc31e2f1e286e704836f6e25276 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Wed, 4 Feb 2026 17:10:27 -0300
Subject: [PATCH 16/77] feat(components): create `SeactionHeader`

---
 src/components/section-header.tsx | 78 +++++++++++++++++++++++++++++++
 1 file changed, 78 insertions(+)
 create mode 100644 src/components/section-header.tsx

diff --git a/src/components/section-header.tsx b/src/components/section-header.tsx
new file mode 100644
index 00000000..7b93a3c3
--- /dev/null
+++ b/src/components/section-header.tsx
@@ -0,0 +1,78 @@
+import React from 'react'
+
+import { cn } from '@/utils/class-name-merge'
+
+export function SectionHeader({
+  className,
+  ...props
+}: Readonly<React.ComponentProps<'header'>>) {
+  return (
+    <header
+      className={cn('flex flex-wrap items-center gap-4', className)}
+      {...props}
+    />
+  )
+}
+
+interface SectionHeaderTitleProps {
+  title: string
+  icon: React.ReactNode
+  total?: number
+  className?: string
+}
+
+export function SectionHeaderTitle({
+  title,
+  icon,
+  total = 0,
+  className,
+}: Readonly<SectionHeaderTitleProps>) {
+  // Uncomment it when changing icon color is needed
+  // const iconElement = React.isValidElement<{ className?: string }>(icon)
+  //   ? React.cloneElement(icon, {
+  //       className: cn('text-primary', icon.props.className),
+  //     })
+  //   : icon
+
+  return (
+    <div className={cn('flex items-center gap-4', className)}>
+      <div className='bg-background border-border [&_svg]:text-primary flex size-10 items-center justify-center rounded-lg border shadow shadow-black/5'>
+        {icon}
+      </div>
+      <div className='flex items-center gap-2'>
+        {total > 0 && <span className='text-2xl font-semibold'>{total}</span>}
+        <p className='text-foreground-soft text-lg'>{title}</p>
+      </div>
+    </div>
+  )
+}
+
+interface SectionHeaderIconProps {
+  icon: React.ReactNode
+  className?: string
+}
+
+export function SectionHeaderIcon({
+  icon,
+  className,
+}: Readonly<SectionHeaderIconProps>) {
+  return (
+    <div
+      className={cn(
+        'bg-background border-border flex size-10 items-center justify-center rounded-lg border shadow shadow-black/5',
+        className,
+      )}
+    >
+      {icon}
+    </div>
+  )
+}
+
+export function SectionHeaderActions({
+  className,
+  ...props
+}: Readonly<React.ComponentProps<'div'>>) {
+  return (
+    <div className={cn('ml-auto flex flex-wrap gap-2', className)} {...props} />
+  )
+}

From c70e0efb060c02a0a75b0ba602aa04a0bca98ee6 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Wed, 4 Feb 2026 17:12:11 -0300
Subject: [PATCH 17/77] chore(dashboard): update appointments card header
 component

---
 .../appointments/appointment-modal.tsx        |  4 ++-
 src/modules/appointments/table/index.tsx      |  8 ++---
 src/modules/dashboard/appointments-card.tsx   | 31 +++++++++----------
 3 files changed, 21 insertions(+), 22 deletions(-)

diff --git a/src/modules/appointments/appointment-modal.tsx b/src/modules/appointments/appointment-modal.tsx
index 03e77970..65302a15 100644
--- a/src/modules/appointments/appointment-modal.tsx
+++ b/src/modules/appointments/appointment-modal.tsx
@@ -118,7 +118,9 @@ export function AppointmentModal({
   return (
     <DialogContainer className='max-w-xl'>
       <DialogHeader icon={<DialogIcon icon={SmilePlusIcon} />}>
-        <DialogTitle>Novo atendimento</DialogTitle>
+        <DialogTitle>
+          {isEditMode ? 'Atualizar atendimento' : 'Novo atendimento'}
+        </DialogTitle>
       </DialogHeader>
 
       <DialogContent>
diff --git a/src/modules/appointments/table/index.tsx b/src/modules/appointments/table/index.tsx
index a5b3804f..2227b045 100644
--- a/src/modules/appointments/table/index.tsx
+++ b/src/modules/appointments/table/index.tsx
@@ -25,7 +25,7 @@ interface AppointmentsTableProps {
 export function AppointmentsTable({
   appointments,
 }: Readonly<AppointmentsTableProps>) {
-  const showAppointments = appointments.length > 0
+  const isEmpty = appointments.length <= 0
 
   return (
     <Table>
@@ -40,7 +40,7 @@ export function AppointmentsTable({
         </TableRow>
       </TableHeader>
 
-      {showAppointments && (
+      {!isEmpty && (
         <TableBody>
           {appointments.map((appointment) => {
             const condition = PATIENT_CONDITIONS[appointment.condition]
@@ -81,11 +81,11 @@ export function AppointmentsTable({
         </TableBody>
       )}
 
-      {!showAppointments && (
+      {isEmpty && (
         <TableBody>
           <TableRow>
             <TableEmptyCell colSpan={6}>
-              Nenhum atendimento encontrado
+              Nenhum atendimento registrado
             </TableEmptyCell>
           </TableRow>
         </TableBody>
diff --git a/src/modules/dashboard/appointments-card.tsx b/src/modules/dashboard/appointments-card.tsx
index cd10e7ca..2038a158 100644
--- a/src/modules/dashboard/appointments-card.tsx
+++ b/src/modules/dashboard/appointments-card.tsx
@@ -1,12 +1,14 @@
-import { Users2Icon } from 'lucide-react'
+import { ClipboardListIcon } from 'lucide-react'
 
 import {
   getAppointments,
   type GetAppointmentsParams,
 } from '@/actions/appointments/get-appointments'
-import { DataTableHeader } from '@/components/data-table/header'
-import { DataTableHeaderActions } from '@/components/data-table/header/actions'
-import { DataTableHeaderInfo } from '@/components/data-table/header/info'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
 import { Card } from '@/components/ui/card'
 import { NavButton } from '@/components/ui/nav-button'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
@@ -16,28 +18,23 @@ import { NewAppointmentButton } from '@/modules/appointments/new-appointment-but
 import { AppointmentsTable } from '../appointments/table'
 
 export async function DashboardAppointmentsCard() {
-  const params: GetAppointmentsParams = {
-    status: 'scheduled',
-    limit: 5,
-  }
+  const params: GetAppointmentsParams = { status: 'scheduled', limit: 5 }
 
   const response = await getAppointments({
-    params,
     cacheKey: NEXT_CACHE_TAGS.appointments.query(JSON.stringify(params)),
+    params,
   })
 
   const appointments = response?.appointments ?? []
 
   return (
     <Card className='p-6 sm:col-span-6'>
-      <DataTableHeader className='mb-8'>
-        <DataTableHeaderInfo
-          icon={<Users2Icon />}
-          iconClassName='text-foreground-soft'
+      <SectionHeader className='mb-6'>
+        <SectionHeaderTitle
           title='Fila de atendimento'
+          icon={<ClipboardListIcon />}
         />
-
-        <DataTableHeaderActions>
+        <SectionHeaderActions>
           <NavButton
             size='sm'
             variant='outline'
@@ -47,8 +44,8 @@ export async function DashboardAppointmentsCard() {
           </NavButton>
 
           <NewAppointmentButton size='sm' />
-        </DataTableHeaderActions>
-      </DataTableHeader>
+        </SectionHeaderActions>
+      </SectionHeader>
 
       <AppointmentsTable appointments={appointments} />
     </Card>

From 94b634e6edb27553551f4bc014676c91e863734e Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Wed, 4 Feb 2026 17:23:25 -0300
Subject: [PATCH 18/77] fix(dashboard): get only upcoming appointments

---
 src/actions/appointments/get-appointments.ts | 1 +
 src/config/cache.ts                          | 2 +-
 src/modules/dashboard/appointments-card.tsx  | 6 +++++-
 3 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/actions/appointments/get-appointments.ts b/src/actions/appointments/get-appointments.ts
index 9c02b14a..8b5c5e45 100644
--- a/src/actions/appointments/get-appointments.ts
+++ b/src/actions/appointments/get-appointments.ts
@@ -8,6 +8,7 @@ import type { Appointment } from '@/types/appointments'
 
 export type GetAppointmentsParams = {
   status?: AppointmentStatus
+  startDate?: string
   limit?: number
 }
 
diff --git a/src/config/cache.ts b/src/config/cache.ts
index d4446cfd..61bb7466 100644
--- a/src/config/cache.ts
+++ b/src/config/cache.ts
@@ -1 +1 @@
-export const DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS = 3600
+export const DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS = 60
diff --git a/src/modules/dashboard/appointments-card.tsx b/src/modules/dashboard/appointments-card.tsx
index 2038a158..7d27c823 100644
--- a/src/modules/dashboard/appointments-card.tsx
+++ b/src/modules/dashboard/appointments-card.tsx
@@ -18,7 +18,11 @@ import { NewAppointmentButton } from '@/modules/appointments/new-appointment-but
 import { AppointmentsTable } from '../appointments/table'
 
 export async function DashboardAppointmentsCard() {
-  const params: GetAppointmentsParams = { status: 'scheduled', limit: 5 }
+  const params: GetAppointmentsParams = {
+    startDate: new Date().toISOString(),
+    status: 'scheduled',
+    limit: 5,
+  }
 
   const response = await getAppointments({
     cacheKey: NEXT_CACHE_TAGS.appointments.query(JSON.stringify(params)),

From 7d901f8f0bb9b918ba9789f86f622ec4a525f675 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Wed, 4 Feb 2026 21:41:26 -0300
Subject: [PATCH 19/77] chore: create shared order and order by types

---
 src/actions/appointments/get-appointments.ts       |  3 +++
 src/modules/dashboard/appointments-card.tsx        |  2 ++
 .../patient-requirements/approved-list-table.tsx   |  4 ++--
 .../patient-requirements/pending-requirements.tsx  |  4 ++--
 .../under-review-requirements.tsx                  |  4 ++--
 src/modules/patients/list/table.tsx                |  4 ++--
 src/types/order.d.ts                               |  4 ----
 src/types/orders.d.ts                              | 14 ++++++++++++++
 8 files changed, 27 insertions(+), 12 deletions(-)
 delete mode 100644 src/types/order.d.ts
 create mode 100644 src/types/orders.d.ts

diff --git a/src/actions/appointments/get-appointments.ts b/src/actions/appointments/get-appointments.ts
index 8b5c5e45..84b86bd8 100644
--- a/src/actions/appointments/get-appointments.ts
+++ b/src/actions/appointments/get-appointments.ts
@@ -5,9 +5,12 @@ import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import type { AppointmentStatus } from '@/enums/appointments'
 import { api } from '@/lib/api'
 import type { Appointment } from '@/types/appointments'
+import type { AppointmentsOrderBy, QueryOrder } from '@/types/orders'
 
 export type GetAppointmentsParams = {
   status?: AppointmentStatus
+  order?: QueryOrder
+  orderBy?: AppointmentsOrderBy
   startDate?: string
   limit?: number
 }
diff --git a/src/modules/dashboard/appointments-card.tsx b/src/modules/dashboard/appointments-card.tsx
index 7d27c823..f54da092 100644
--- a/src/modules/dashboard/appointments-card.tsx
+++ b/src/modules/dashboard/appointments-card.tsx
@@ -21,6 +21,8 @@ export async function DashboardAppointmentsCard() {
   const params: GetAppointmentsParams = {
     startDate: new Date().toISOString(),
     status: 'scheduled',
+    orderBy: 'date',
+    order: 'ASC',
     limit: 5,
   }
 
diff --git a/src/modules/patient-requirements/approved-list-table.tsx b/src/modules/patient-requirements/approved-list-table.tsx
index 9a287ec0..63e751ce 100644
--- a/src/modules/patient-requirements/approved-list-table.tsx
+++ b/src/modules/patient-requirements/approved-list-table.tsx
@@ -30,7 +30,7 @@ import {
 } from '@/enums/patient-requirements'
 import { useParams } from '@/hooks/params'
 import { api } from '@/lib/api'
-import type { OrderMapping } from '@/types/order.d.ts'
+import type { QueryOrderMapping } from '@/types/orders'
 import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 import { formatDate } from '@/utils/formatters/format-date'
 
@@ -45,7 +45,7 @@ export function ApprovedPatientRequirementsListTable() {
   const search = getParam(QUERY_PARAMS.search)
   const orderBy = getParam(QUERY_PARAMS.orderBy)
 
-  const ORDER_MAPPING: OrderMapping<PatientRequirementsOrder> = {
+  const ORDER_MAPPING: QueryOrderMapping<PatientRequirementsOrder> = {
     name_asc: { orderBy: 'name', order: 'ASC' },
     name_desc: { orderBy: 'name', order: 'DESC' },
     date_asc: { orderBy: 'approved_at', order: 'ASC' },
diff --git a/src/modules/patient-requirements/pending-requirements.tsx b/src/modules/patient-requirements/pending-requirements.tsx
index 8092cf37..992e4f89 100644
--- a/src/modules/patient-requirements/pending-requirements.tsx
+++ b/src/modules/patient-requirements/pending-requirements.tsx
@@ -23,7 +23,7 @@ import {
 import { getTimeDistanceToNow } from '@/helpers/get-time-distance-to-now'
 import { useParams } from '@/hooks/params'
 import { api } from '@/lib/api'
-import type { OrderMapping } from '@/types/order.d.ts'
+import type { QueryOrderMapping } from '@/types/orders'
 import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 import { cn } from '@/utils/class-name-merge'
 import { formatDate } from '@/utils/formatters/format-date'
@@ -40,7 +40,7 @@ export function PendingPatientRequirements() {
   const search = getParam(QUERY_PARAMS.search)
   const orderBy = getParam(QUERY_PARAMS.orderBy)
 
-  const ORDER_MAPPING: OrderMapping<PatientRequirementsOrder> = {
+  const ORDER_MAPPING: QueryOrderMapping<PatientRequirementsOrder> = {
     name_asc: { orderBy: 'name', order: 'ASC' },
     name_desc: { orderBy: 'name', order: 'DESC' },
     date_asc: { orderBy: 'date', order: 'ASC' },
diff --git a/src/modules/patient-requirements/under-review-requirements.tsx b/src/modules/patient-requirements/under-review-requirements.tsx
index a034573c..1101164c 100644
--- a/src/modules/patient-requirements/under-review-requirements.tsx
+++ b/src/modules/patient-requirements/under-review-requirements.tsx
@@ -22,7 +22,7 @@ import {
 import { getTimeDistanceToNow } from '@/helpers/get-time-distance-to-now'
 import { useParams } from '@/hooks/params'
 import { api } from '@/lib/api'
-import type { OrderMapping } from '@/types/order.d.ts'
+import type { QueryOrderMapping } from '@/types/orders'
 import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 
 import { AddPatientRequirementButton } from './add-patient-requirement-button'
@@ -37,7 +37,7 @@ export function UnderReviewPatientRequirements() {
   const search = getParam(QUERY_PARAMS.search)
   const orderBy = getParam(QUERY_PARAMS.orderBy)
 
-  const ORDER_MAPPING: OrderMapping<PatientRequirementsOrder> = {
+  const ORDER_MAPPING: QueryOrderMapping<PatientRequirementsOrder> = {
     name_asc: { orderBy: 'name', order: 'ASC' },
     name_desc: { orderBy: 'name', order: 'DESC' },
     date_asc: { orderBy: 'submitted_at', order: 'ASC' },
diff --git a/src/modules/patients/list/table.tsx b/src/modules/patients/list/table.tsx
index fa96bb85..ecd4a599 100644
--- a/src/modules/patients/list/table.tsx
+++ b/src/modules/patients/list/table.tsx
@@ -40,7 +40,7 @@ import {
 } from '@/enums/patients'
 import { useParams } from '@/hooks/params'
 import { api } from '@/lib/api'
-import type { OrderMapping } from '@/types/order.d.ts'
+import type { QueryOrderMapping } from '@/types/orders'
 import type { Patient } from '@/types/patients.d.ts'
 import { formatDate } from '@/utils/formatters/format-date'
 import { formatPhoneNumber } from '@/utils/formatters/format-phone-number'
@@ -62,7 +62,7 @@ export function PatientsListTable() {
   const endDate = getParam(QUERY_PARAMS.endDate)
   const filterQueries = [page, search, orderBy, status, startDate, endDate]
 
-  const ORDER_MAPPING: OrderMapping<PatientsOrder> = {
+  const ORDER_MAPPING: QueryOrderMapping<PatientsOrder> = {
     date_asc: { orderBy: 'date', order: 'ASC' },
     date_desc: { orderBy: 'date', order: 'DESC' },
     email_asc: { orderBy: 'email', order: 'ASC' },
diff --git a/src/types/order.d.ts b/src/types/order.d.ts
deleted file mode 100644
index 703e48ba..00000000
--- a/src/types/order.d.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export type OrderMapping<T extends string> = Record<
-  T,
-  { orderBy: string; order: string }
->
diff --git a/src/types/orders.d.ts b/src/types/orders.d.ts
new file mode 100644
index 00000000..227c08d3
--- /dev/null
+++ b/src/types/orders.d.ts
@@ -0,0 +1,14 @@
+export type QueryOrderMapping<T extends string> = Record<
+  T,
+  { orderBy: string; order: string }
+>
+
+export type QueryOrder = 'ASC' | 'DESC'
+
+export type AppointmentsOrderBy =
+  | 'date'
+  | 'patient'
+  | 'status'
+  | 'category'
+  | 'condition'
+  | 'professional'

From da114176f42550a3a192977b2246dba0d72f675e Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Wed, 4 Feb 2026 21:46:41 -0300
Subject: [PATCH 20/77] chore(settings): comment out the settings page to be
 refactored later

---
 .../fontes/page.tsx                           |  0
 .../layout.tsx                                |  0
 .../page.tsx                                  |  0
 src/components/data-table/header/info.tsx     |  4 ++--
 src/components/sidebar/index.tsx              | 21 +++++++++----------
 5 files changed, 12 insertions(+), 13 deletions(-)
 rename src/app/(dashboard)/{configuracoes => _configuracoes}/fontes/page.tsx (100%)
 rename src/app/(dashboard)/{configuracoes => _configuracoes}/layout.tsx (100%)
 rename src/app/(dashboard)/{configuracoes => _configuracoes}/page.tsx (100%)

diff --git a/src/app/(dashboard)/configuracoes/fontes/page.tsx b/src/app/(dashboard)/_configuracoes/fontes/page.tsx
similarity index 100%
rename from src/app/(dashboard)/configuracoes/fontes/page.tsx
rename to src/app/(dashboard)/_configuracoes/fontes/page.tsx
diff --git a/src/app/(dashboard)/configuracoes/layout.tsx b/src/app/(dashboard)/_configuracoes/layout.tsx
similarity index 100%
rename from src/app/(dashboard)/configuracoes/layout.tsx
rename to src/app/(dashboard)/_configuracoes/layout.tsx
diff --git a/src/app/(dashboard)/configuracoes/page.tsx b/src/app/(dashboard)/_configuracoes/page.tsx
similarity index 100%
rename from src/app/(dashboard)/configuracoes/page.tsx
rename to src/app/(dashboard)/_configuracoes/page.tsx
diff --git a/src/components/data-table/header/info.tsx b/src/components/data-table/header/info.tsx
index 1bb76479..be0b7b1d 100644
--- a/src/components/data-table/header/info.tsx
+++ b/src/components/data-table/header/info.tsx
@@ -16,13 +16,13 @@ export function DataTableHeaderInfo({
 }: Readonly<DataTableHeaderInfoProps>) {
   return (
     <div className='flex items-center gap-4'>
-      <div className='bg-border/50 flex size-10 items-center justify-center rounded-lg'>
+      <div className='bg-background border-border flex size-10 items-center justify-center rounded-lg border shadow shadow-black/5'>
         <Slot className={cn('text-primary size-5.5')}>{icon}</Slot>
       </div>
 
       <div className='flex items-center gap-2'>
         {total > 0 && <span className='text-2xl font-semibold'>{total}</span>}
-        <p className='text-foreground-soft'>{title}</p>
+        <p className='text-foreground-soft text-lg'>{title}</p>
       </div>
     </div>
   )
diff --git a/src/components/sidebar/index.tsx b/src/components/sidebar/index.tsx
index d9f5db5f..24fc44e7 100644
--- a/src/components/sidebar/index.tsx
+++ b/src/components/sidebar/index.tsx
@@ -1,5 +1,4 @@
 import {
-  BoltIcon,
   HeartHandshakeIcon,
   LayoutDashboardIcon,
   Share2Icon,
@@ -65,14 +64,14 @@ const SIDEBAR_SECTIONS = [
       },
     ],
   },
-  {
-    id: 'utils',
-    links: [
-      {
-        label: 'Configurações',
-        icon: <BoltIcon />,
-        path: ROUTES.dashboard.settings.main,
-      },
-    ],
-  },
+  // {
+  //   id: 'utils',
+  //   links: [
+  //     {
+  //       label: 'Configurações',
+  //       icon: <BoltIcon />,
+  //       path: ROUTES.dashboard.settings.main,
+  //     },
+  //   ],
+  // },
 ]

From 8494f296fc0e5d2adb3f9b85e9861514184dafbd Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Wed, 4 Feb 2026 22:06:28 -0300
Subject: [PATCH 21/77] refactor: add `orderBy` type to order mapping to ensure
 consistency

---
 src/app/(dashboard)/pacientes/page.tsx        |  7 +------
 .../approved-list-table.tsx                   | 21 ++++++++++++-------
 .../pending-requirements.tsx                  | 21 ++++++++++++-------
 .../under-review-requirements.tsx             | 21 ++++++++++++-------
 src/modules/patients/list/table.tsx           | 10 ++++-----
 src/types/orders.d.ts                         | 18 ++++++++++++----
 6 files changed, 59 insertions(+), 39 deletions(-)

diff --git a/src/app/(dashboard)/pacientes/page.tsx b/src/app/(dashboard)/pacientes/page.tsx
index c25d7e47..9c241627 100644
--- a/src/app/(dashboard)/pacientes/page.tsx
+++ b/src/app/(dashboard)/pacientes/page.tsx
@@ -1,5 +1,4 @@
 import type { Metadata } from 'next'
-import { Suspense } from 'react'
 
 import { PatientsListTable } from '@/modules/patients/list/table'
 
@@ -8,9 +7,5 @@ export const metadata: Metadata = {
 }
 
 export default function Page() {
-  return (
-    <Suspense fallback={<div>Carregando...</div>}>
-      <PatientsListTable />
-    </Suspense>
-  )
+  return <PatientsListTable />
 }
diff --git a/src/modules/patient-requirements/approved-list-table.tsx b/src/modules/patient-requirements/approved-list-table.tsx
index 63e751ce..5f51052e 100644
--- a/src/modules/patient-requirements/approved-list-table.tsx
+++ b/src/modules/patient-requirements/approved-list-table.tsx
@@ -30,7 +30,10 @@ import {
 } from '@/enums/patient-requirements'
 import { useParams } from '@/hooks/params'
 import { api } from '@/lib/api'
-import type { QueryOrderMapping } from '@/types/orders'
+import type {
+  PatientRequirementsOrderBy,
+  QueryOrderMapping,
+} from '@/types/orders'
 import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 import { formatDate } from '@/utils/formatters/format-date'
 
@@ -45,19 +48,21 @@ export function ApprovedPatientRequirementsListTable() {
   const search = getParam(QUERY_PARAMS.search)
   const orderBy = getParam(QUERY_PARAMS.orderBy)
 
-  const ORDER_MAPPING: QueryOrderMapping<PatientRequirementsOrder> = {
-    name_asc: { orderBy: 'name', order: 'ASC' },
-    name_desc: { orderBy: 'name', order: 'DESC' },
+  const ORDER_MAPPING: QueryOrderMapping<
+    PatientRequirementsOrder,
+    PatientRequirementsOrderBy
+  > = {
+    name_asc: { orderBy: 'patient', order: 'ASC' },
+    name_desc: { orderBy: 'patient', order: 'DESC' },
     date_asc: { orderBy: 'approved_at', order: 'ASC' },
     date_desc: { orderBy: 'approved_at', order: 'DESC' },
     type_asc: { orderBy: 'type', order: 'ASC' },
     type_desc: { orderBy: 'type', order: 'DESC' },
   }
 
-  const orderByQuery = ORDER_MAPPING[orderBy as PatientRequirementsOrder] ?? {
-    orderBy: 'name',
-    order: 'ASC',
-  }
+  const orderByQuery =
+    ORDER_MAPPING[orderBy as PatientRequirementsOrder] ??
+    ORDER_MAPPING['name_asc']
 
   const { data: response, isLoading } = useQuery({
     queryKey: [QUERY_CACHE_KEYS.approvals.approved, search, page, orderByQuery],
diff --git a/src/modules/patient-requirements/pending-requirements.tsx b/src/modules/patient-requirements/pending-requirements.tsx
index 992e4f89..5f9eb884 100644
--- a/src/modules/patient-requirements/pending-requirements.tsx
+++ b/src/modules/patient-requirements/pending-requirements.tsx
@@ -23,7 +23,10 @@ import {
 import { getTimeDistanceToNow } from '@/helpers/get-time-distance-to-now'
 import { useParams } from '@/hooks/params'
 import { api } from '@/lib/api'
-import type { QueryOrderMapping } from '@/types/orders'
+import type {
+  PatientRequirementsOrderBy,
+  QueryOrderMapping,
+} from '@/types/orders'
 import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 import { cn } from '@/utils/class-name-merge'
 import { formatDate } from '@/utils/formatters/format-date'
@@ -40,19 +43,21 @@ export function PendingPatientRequirements() {
   const search = getParam(QUERY_PARAMS.search)
   const orderBy = getParam(QUERY_PARAMS.orderBy)
 
-  const ORDER_MAPPING: QueryOrderMapping<PatientRequirementsOrder> = {
-    name_asc: { orderBy: 'name', order: 'ASC' },
-    name_desc: { orderBy: 'name', order: 'DESC' },
+  const ORDER_MAPPING: QueryOrderMapping<
+    PatientRequirementsOrder,
+    PatientRequirementsOrderBy
+  > = {
+    name_asc: { orderBy: 'patient', order: 'ASC' },
+    name_desc: { orderBy: 'patient', order: 'DESC' },
     date_asc: { orderBy: 'date', order: 'ASC' },
     date_desc: { orderBy: 'date', order: 'DESC' },
     type_asc: { orderBy: 'type', order: 'ASC' },
     type_desc: { orderBy: 'type', order: 'DESC' },
   }
 
-  const orderByQuery = ORDER_MAPPING[orderBy as PatientRequirementsOrder] ?? {
-    orderBy: 'date',
-    order: 'ASC',
-  }
+  const orderByQuery =
+    ORDER_MAPPING[orderBy as PatientRequirementsOrder] ??
+    ORDER_MAPPING['date_asc']
 
   const { data: response, isLoading } = useQuery({
     queryKey: [QUERY_CACHE_KEYS.approvals.pending, search, page, orderByQuery],
diff --git a/src/modules/patient-requirements/under-review-requirements.tsx b/src/modules/patient-requirements/under-review-requirements.tsx
index 1101164c..ac7fff62 100644
--- a/src/modules/patient-requirements/under-review-requirements.tsx
+++ b/src/modules/patient-requirements/under-review-requirements.tsx
@@ -22,7 +22,10 @@ import {
 import { getTimeDistanceToNow } from '@/helpers/get-time-distance-to-now'
 import { useParams } from '@/hooks/params'
 import { api } from '@/lib/api'
-import type { QueryOrderMapping } from '@/types/orders'
+import type {
+  PatientRequirementsOrderBy,
+  QueryOrderMapping,
+} from '@/types/orders'
 import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 
 import { AddPatientRequirementButton } from './add-patient-requirement-button'
@@ -37,19 +40,21 @@ export function UnderReviewPatientRequirements() {
   const search = getParam(QUERY_PARAMS.search)
   const orderBy = getParam(QUERY_PARAMS.orderBy)
 
-  const ORDER_MAPPING: QueryOrderMapping<PatientRequirementsOrder> = {
-    name_asc: { orderBy: 'name', order: 'ASC' },
-    name_desc: { orderBy: 'name', order: 'DESC' },
+  const ORDER_MAPPING: QueryOrderMapping<
+    PatientRequirementsOrder,
+    PatientRequirementsOrderBy
+  > = {
+    name_asc: { orderBy: 'patient', order: 'ASC' },
+    name_desc: { orderBy: 'patient', order: 'DESC' },
     date_asc: { orderBy: 'submitted_at', order: 'ASC' },
     date_desc: { orderBy: 'submitted_at', order: 'DESC' },
     type_asc: { orderBy: 'type', order: 'ASC' },
     type_desc: { orderBy: 'type', order: 'DESC' },
   }
 
-  const orderByQuery = ORDER_MAPPING[orderBy as PatientRequirementsOrder] ?? {
-    orderBy: 'submitted_at',
-    order: 'ASC',
-  }
+  const orderByQuery =
+    ORDER_MAPPING[orderBy as PatientRequirementsOrder] ??
+    ORDER_MAPPING['date_asc']
 
   const { data: response, isLoading } = useQuery({
     queryKey: [QUERY_CACHE_KEYS.approvals.pending, search, page, orderByQuery],
diff --git a/src/modules/patients/list/table.tsx b/src/modules/patients/list/table.tsx
index ecd4a599..1ffe1893 100644
--- a/src/modules/patients/list/table.tsx
+++ b/src/modules/patients/list/table.tsx
@@ -40,7 +40,7 @@ import {
 } from '@/enums/patients'
 import { useParams } from '@/hooks/params'
 import { api } from '@/lib/api'
-import type { QueryOrderMapping } from '@/types/orders'
+import type { PatientsOrderBy, QueryOrderMapping } from '@/types/orders'
 import type { Patient } from '@/types/patients.d.ts'
 import { formatDate } from '@/utils/formatters/format-date'
 import { formatPhoneNumber } from '@/utils/formatters/format-phone-number'
@@ -62,7 +62,7 @@ export function PatientsListTable() {
   const endDate = getParam(QUERY_PARAMS.endDate)
   const filterQueries = [page, search, orderBy, status, startDate, endDate]
 
-  const ORDER_MAPPING: QueryOrderMapping<PatientsOrder> = {
+  const ORDER_MAPPING: QueryOrderMapping<PatientsOrder, PatientsOrderBy> = {
     date_asc: { orderBy: 'date', order: 'ASC' },
     date_desc: { orderBy: 'date', order: 'DESC' },
     email_asc: { orderBy: 'email', order: 'ASC' },
@@ -87,7 +87,7 @@ export function PatientsListTable() {
   })
 
   const patients = response?.data?.patients ?? []
-  const isPatientsEmpty = patients.length === 0
+  const isEmpty = patients.length === 0
 
   // Update stable total only when we have actual data to prevent pagination flickering
   useEffect(() => {
@@ -157,7 +157,7 @@ export function PatientsListTable() {
 
           {isLoading && <PatientsListTableSkeleton />}
 
-          {!isLoading && isPatientsEmpty && (
+          {!isLoading && isEmpty && (
             <TableBody>
               <TableRow>
                 <TableEmptyCell colSpan={6}>
@@ -167,7 +167,7 @@ export function PatientsListTable() {
             </TableBody>
           )}
 
-          {!isLoading && !isPatientsEmpty && (
+          {!isLoading && !isEmpty && (
             <TableBody>
               {patients.map((patient) => {
                 const status = PATIENT_STATUSES[patient.status]
diff --git a/src/types/orders.d.ts b/src/types/orders.d.ts
index 227c08d3..4384dae3 100644
--- a/src/types/orders.d.ts
+++ b/src/types/orders.d.ts
@@ -1,10 +1,12 @@
-export type QueryOrderMapping<T extends string> = Record<
-  T,
-  { orderBy: string; order: string }
->
+export type QueryOrderMapping<
+  T extends string,
+  OrderByType extends string,
+> = Record<T, { orderBy: OrderByType; order: QueryOrder }>
 
 export type QueryOrder = 'ASC' | 'DESC'
 
+export type PatientsOrderBy = 'name' | 'email' | 'status' | 'date'
+
 export type AppointmentsOrderBy =
   | 'date'
   | 'patient'
@@ -12,3 +14,11 @@ export type AppointmentsOrderBy =
   | 'category'
   | 'condition'
   | 'professional'
+
+export type PatientRequirementsOrderBy =
+  | 'patient'
+  | 'status'
+  | 'type'
+  | 'date'
+  | 'approved_at'
+  | 'submitted_at'

From 5042741e3b1b1e2973797a0a5ca2d5ef8557ec44 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Thu, 5 Feb 2026 14:50:13 -0300
Subject: [PATCH 22/77] refactor(components): delete `data-table` and create
 `section-header` components

---
 .../listagem/referrals-table.tsx              | 26 +++---
 src/components/data-table/filters/index.tsx   | 36 --------
 src/components/data-table/filters/status.tsx  | 63 --------------
 src/components/data-table/header/actions.tsx  |  8 --
 src/components/data-table/header/index.tsx    | 13 ---
 src/components/data-table/header/info.tsx     | 29 -------
 src/components/data-table/header/order-by.tsx | 45 ----------
 src/components/data-table/header/search.tsx   | 63 --------------
 .../filters/clear-filters-button.tsx          | 31 +++++++
 .../{data-table => }/filters/container.tsx    |  7 +-
 .../{data-table => }/filters/date.tsx         | 15 ++--
 src/components/filters/filter-select.tsx      | 37 ++++++++
 .../{ui => filters}/search-input.tsx          | 20 +++--
 .../show-filter-button.tsx}                   |  2 +-
 src/components/section-header.tsx             |  4 +-
 src/components/ui/calendar/index.tsx          | 38 ++++++---
 src/components/ui/date-picker.tsx             |  4 +-
 src/components/ui/select.tsx                  | 21 ++++-
 src/hooks/params.ts                           |  5 ++
 .../approved-list-table.tsx                   | 36 ++++----
 .../pending-requirements.tsx                  | 33 ++++---
 .../under-review-requirements.tsx             | 33 ++++---
 src/modules/patients/list/table.tsx           | 85 ++++++++++---------
 src/modules/teams/table.tsx                   | 31 ++++---
 24 files changed, 291 insertions(+), 394 deletions(-)
 delete mode 100644 src/components/data-table/filters/index.tsx
 delete mode 100644 src/components/data-table/filters/status.tsx
 delete mode 100644 src/components/data-table/header/actions.tsx
 delete mode 100644 src/components/data-table/header/index.tsx
 delete mode 100644 src/components/data-table/header/info.tsx
 delete mode 100644 src/components/data-table/header/order-by.tsx
 delete mode 100644 src/components/data-table/header/search.tsx
 create mode 100644 src/components/filters/clear-filters-button.tsx
 rename src/components/{data-table => }/filters/container.tsx (61%)
 rename src/components/{data-table => }/filters/date.tsx (80%)
 create mode 100644 src/components/filters/filter-select.tsx
 rename src/components/{ui => filters}/search-input.tsx (79%)
 rename src/components/{data-table/header/filter-button.tsx => filters/show-filter-button.tsx} (90%)

diff --git a/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx b/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
index 06507adf..1dbceee9 100644
--- a/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
+++ b/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
@@ -2,11 +2,13 @@
 import { Eye } from 'lucide-react'
 import { useState } from 'react'
 
-import { DataTableHeader } from '@/components/data-table/header'
-import { DataTableHeaderActions } from '@/components/data-table/header/actions'
-import { DataTableHeaderOrderBy } from '@/components/data-table/header/order-by'
-import { DataTableHeaderSearch } from '@/components/data-table/header/search'
+import { FilterSelect } from '@/components/filters/filter-select'
+import { SearchInput } from '@/components/filters/search-input'
 import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+} from '@/components/section-header'
 import { Card } from '@/components/ui/card'
 import { TabSelect } from '@/components/ui/tab-select'
 import {
@@ -19,6 +21,7 @@ import {
   TableRow,
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
+import { QUERY_PARAMS } from '@/constants/params'
 import { PATIENT_CONDITIONS, type PatientCondition } from '@/enums/patients'
 import { REFERRALS_ORDER_OPTIONS } from '@/enums/referrals'
 
@@ -132,13 +135,16 @@ export function ReferralsTable() {
 
   return (
     <div className='space-y-6'>
-      <DataTableHeader>
+      <SectionHeader>
         <TabSelect buttons={filterOptions} />
-        <DataTableHeaderActions>
-          <DataTableHeaderSearch placeholder='Pesquisar' />
-          <DataTableHeaderOrderBy options={REFERRALS_ORDER_OPTIONS} />
-        </DataTableHeaderActions>
-      </DataTableHeader>
+        <SectionHeaderActions>
+          <SearchInput placeholder='Pesquisar' />
+          <FilterSelect
+            param={QUERY_PARAMS.orderBy}
+            options={REFERRALS_ORDER_OPTIONS}
+          />
+        </SectionHeaderActions>
+      </SectionHeader>
 
       <Card className='p-6'>
         <Table>
diff --git a/src/components/data-table/filters/index.tsx b/src/components/data-table/filters/index.tsx
deleted file mode 100644
index 04a97312..00000000
--- a/src/components/data-table/filters/index.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-'use client'
-
-import { XIcon } from 'lucide-react'
-
-import { Button } from '@/components/ui/button'
-import { useParams } from '@/hooks/params'
-import { cn } from '@/utils/class-name-merge'
-
-interface DataTableFiltersProps extends React.ComponentProps<'section'> {
-  queries: string[]
-}
-
-export function DataTableFilters({
-  queries,
-  className,
-  children,
-  ...props
-}: Readonly<DataTableFiltersProps>) {
-  const { updateParams } = useParams()
-
-  return (
-    <section className={cn('flex items-end gap-8', className)} {...props}>
-      {children}
-
-      <Button
-        size='sm'
-        variant='muted'
-        className='ml-auto'
-        onClick={() => updateParams({ remove: queries })}
-      >
-        <XIcon />
-        Limpar filtros
-      </Button>
-    </section>
-  )
-}
diff --git a/src/components/data-table/filters/status.tsx b/src/components/data-table/filters/status.tsx
deleted file mode 100644
index 8e984b8e..00000000
--- a/src/components/data-table/filters/status.tsx
+++ /dev/null
@@ -1,63 +0,0 @@
-'use client'
-
-import { type LucideIcon } from 'lucide-react'
-
-import { Select, type SelectOption } from '@/components/ui/select'
-import { QUERY_PARAMS } from '@/constants/params'
-import { useParams } from '@/hooks/params'
-import { cn } from '@/utils/class-name-merge'
-
-import {
-  DataTableFilterContainer,
-  type DataTableFilterContainerProps,
-} from './container'
-
-type StatusOption = SelectOption & {
-  icon?: LucideIcon
-  color?: string
-}
-
-interface DataTableFilterStatusProps
-  extends Omit<DataTableFilterContainerProps, 'title'> {
-  options: StatusOption[]
-}
-
-export function DataTableFilterStatus({
-  options,
-  className,
-  ...props
-}: Readonly<DataTableFilterStatusProps>) {
-  const { getParam, updateParams } = useParams()
-
-  const pageParam = QUERY_PARAMS.page
-  const statusParam = QUERY_PARAMS.status
-  const status = getParam(statusParam) || ''
-
-  function handleSelect(value: string) {
-    if (value === 'reset') {
-      updateParams({ remove: [statusParam, pageParam] })
-      return
-    }
-
-    updateParams({
-      set: [{ key: statusParam, value: value }],
-      remove: [pageParam],
-    })
-  }
-
-  return (
-    <DataTableFilterContainer
-      title='Status'
-      className={cn('w-48 shrink-0', className)}
-      {...props}
-    >
-      <Select
-        value={status}
-        onValueChange={handleSelect}
-        options={options}
-        placeholder='Selecione o status'
-        className='w-full'
-      />
-    </DataTableFilterContainer>
-  )
-}
diff --git a/src/components/data-table/header/actions.tsx b/src/components/data-table/header/actions.tsx
deleted file mode 100644
index 9c453f23..00000000
--- a/src/components/data-table/header/actions.tsx
+++ /dev/null
@@ -1,8 +0,0 @@
-import { cn } from '@/utils/class-name-merge'
-
-export function DataTableHeaderActions({
-  className,
-  ...props
-}: Readonly<React.ComponentProps<'div'>>) {
-  return <div className={cn('ml-auto flex gap-2', className)} {...props} />
-}
diff --git a/src/components/data-table/header/index.tsx b/src/components/data-table/header/index.tsx
deleted file mode 100644
index f0723658..00000000
--- a/src/components/data-table/header/index.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { cn } from '@/utils/class-name-merge'
-
-export function DataTableHeader({
-  className,
-  ...props
-}: Readonly<React.ComponentProps<'section'>>) {
-  return (
-    <section
-      className={cn('flex flex-wrap items-center gap-4', className)}
-      {...props}
-    />
-  )
-}
diff --git a/src/components/data-table/header/info.tsx b/src/components/data-table/header/info.tsx
deleted file mode 100644
index be0b7b1d..00000000
--- a/src/components/data-table/header/info.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { Slot } from '@radix-ui/react-slot'
-
-import { cn } from '@/utils/class-name-merge'
-
-interface DataTableHeaderInfoProps {
-  icon: React.ReactNode
-  total?: number
-  title: string
-  iconClassName?: string
-}
-
-export function DataTableHeaderInfo({
-  icon,
-  total = 0,
-  title,
-}: Readonly<DataTableHeaderInfoProps>) {
-  return (
-    <div className='flex items-center gap-4'>
-      <div className='bg-background border-border flex size-10 items-center justify-center rounded-lg border shadow shadow-black/5'>
-        <Slot className={cn('text-primary size-5.5')}>{icon}</Slot>
-      </div>
-
-      <div className='flex items-center gap-2'>
-        {total > 0 && <span className='text-2xl font-semibold'>{total}</span>}
-        <p className='text-foreground-soft text-lg'>{title}</p>
-      </div>
-    </div>
-  )
-}
diff --git a/src/components/data-table/header/order-by.tsx b/src/components/data-table/header/order-by.tsx
deleted file mode 100644
index 86fb1c4a..00000000
--- a/src/components/data-table/header/order-by.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-'use client'
-
-import { Select, type SelectOption } from '@/components/ui/select'
-import { QUERY_PARAMS } from '@/constants/params'
-import { useParams } from '@/hooks/params'
-import { cn } from '@/utils/class-name-merge'
-
-interface DataTableHeaderOrderByProps {
-  options: SelectOption[]
-  className?: string
-}
-
-export function DataTableHeaderOrderBy({
-  options,
-  className,
-}: Readonly<DataTableHeaderOrderByProps>) {
-  const { getParam, updateParams } = useParams()
-
-  const orderByParam = QUERY_PARAMS.orderBy
-  const orderBy = getParam(orderByParam)
-
-  function handleSelect(value: string | null) {
-    if (!value || value === 'reset') {
-      updateParams({ remove: [orderByParam] })
-      return
-    }
-
-    updateParams({ set: [{ key: orderByParam, value }] })
-  }
-
-  const enhancedOptions: SelectOption[] = [
-    ...options.map(({ label, value }) => ({ label: label, value: value })),
-    ...(orderBy ? [{ label: 'Limpar ordem', value: 'reset' }] : []),
-  ]
-
-  return (
-    <Select
-      value={orderBy}
-      options={enhancedOptions}
-      placeholder='Ordenar por'
-      onValueChange={handleSelect}
-      className={cn('shrink-0', className)}
-    />
-  )
-}
diff --git a/src/components/data-table/header/search.tsx b/src/components/data-table/header/search.tsx
deleted file mode 100644
index 7d23349a..00000000
--- a/src/components/data-table/header/search.tsx
+++ /dev/null
@@ -1,63 +0,0 @@
-'use client'
-
-import { SearchIcon, XIcon } from 'lucide-react'
-import { useEffect, useState } from 'react'
-
-import { Button } from '@/components/ui/button'
-import { Input, type InputProps } from '@/components/ui/input'
-import { QUERY_PARAMS } from '@/constants/params'
-import { useDebounce } from '@/hooks/debounce'
-import { useParams } from '@/hooks/params'
-import { cn } from '@/utils/class-name-merge'
-
-export function DataTableHeaderSearch({
-  className,
-  ...props
-}: Readonly<InputProps>) {
-  const queryParam = QUERY_PARAMS.search
-  const pageParam = QUERY_PARAMS.page
-
-  const { getParam, updateParams } = useParams()
-  const searchQuery = getParam(queryParam) || ''
-
-  const [query, setQuery] = useState(searchQuery)
-  const debouncedQuery = useDebounce(query)
-
-  useEffect(() => {
-    updateParams({
-      set: [{ key: queryParam, value: debouncedQuery }],
-      remove: !debouncedQuery ? [queryParam, pageParam] : [pageParam],
-    })
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [debouncedQuery])
-
-  useEffect(() => {
-    if (!searchQuery) setQuery('')
-  }, [searchQuery])
-
-  return (
-    <div className='relative'>
-      <Input
-        size='sm'
-        name='search'
-        value={query}
-        icon={SearchIcon}
-        onChange={(e) => setQuery(e.target.value)}
-        className={cn('w-52 pr-10', className)}
-        {...props}
-      />
-
-      {query && (
-        <Button
-          size='icon'
-          variant='ghost'
-          title='Limpar pesquisa'
-          className='absolute top-0 right-0 size-9 [&_svg]:size-4'
-          onClick={() => setQuery('')}
-        >
-          <XIcon />
-        </Button>
-      )}
-    </div>
-  )
-}
diff --git a/src/components/filters/clear-filters-button.tsx b/src/components/filters/clear-filters-button.tsx
new file mode 100644
index 00000000..a9b5d9ea
--- /dev/null
+++ b/src/components/filters/clear-filters-button.tsx
@@ -0,0 +1,31 @@
+'use client'
+
+import { XIcon } from 'lucide-react'
+
+import { Button, type ButtonProps } from '@/components/ui/button'
+import { useParams } from '@/hooks/params'
+import { cn } from '@/utils/class-name-merge'
+
+export function ClearFiltersButton({
+  className,
+  ...props
+}: Readonly<ButtonProps>) {
+  const { clearParams, searchParams } = useParams()
+
+  if (searchParams.size === 0) {
+    return null
+  }
+
+  return (
+    <Button
+      size='sm'
+      variant='muted'
+      onClick={clearParams}
+      className={cn('ml-auto', className)}
+      {...props}
+    >
+      <XIcon />
+      Limpar filtros
+    </Button>
+  )
+}
diff --git a/src/components/data-table/filters/container.tsx b/src/components/filters/container.tsx
similarity index 61%
rename from src/components/data-table/filters/container.tsx
rename to src/components/filters/container.tsx
index a1b1b0e9..962483f4 100644
--- a/src/components/data-table/filters/container.tsx
+++ b/src/components/filters/container.tsx
@@ -1,16 +1,15 @@
 import { cn } from '@/utils/class-name-merge'
 
-export interface DataTableFilterContainerProps
-  extends React.ComponentProps<'div'> {
+export interface FilterContainerProps extends React.ComponentProps<'div'> {
   title: string
 }
 
-export function DataTableFilterContainer({
+export function FilterContainer({
   title,
   className,
   children,
   ...props
-}: Readonly<DataTableFilterContainerProps>) {
+}: Readonly<FilterContainerProps>) {
   return (
     <div className={cn('flex flex-col gap-1', className)} {...props}>
       <label className='text-sm font-medium'>{title}</label>
diff --git a/src/components/data-table/filters/date.tsx b/src/components/filters/date.tsx
similarity index 80%
rename from src/components/data-table/filters/date.tsx
rename to src/components/filters/date.tsx
index 4d968d86..6aa54400 100644
--- a/src/components/data-table/filters/date.tsx
+++ b/src/components/filters/date.tsx
@@ -1,14 +1,12 @@
 'use client'
 
+import { FilterContainer } from '@/components/filters/container'
 import { DatePicker } from '@/components/ui/date-picker'
 import { QUERY_PARAMS } from '@/constants/params'
 import { useParams } from '@/hooks/params'
 import { cn } from '@/utils/class-name-merge'
 
-import { DataTableFilterContainer } from './container'
-
-// TODO: implement date pickers
-export function DataTableFilterDate({
+export function FilterDate({
   className,
   ...props
 }: Readonly<React.ComponentProps<'div'>>) {
@@ -36,21 +34,22 @@ export function DataTableFilterDate({
 
   return (
     <div className={cn('grid w-96 grid-cols-2 gap-2', className)} {...props}>
-      <DataTableFilterContainer title='Data inicial'>
+      <FilterContainer title='Data inicial'>
         <DatePicker
           size='sm'
           value={startDate}
           onSelectDate={handleSelectStartDate}
         />
-      </DataTableFilterContainer>
-      <DataTableFilterContainer title='Data final'>
+      </FilterContainer>
+      <FilterContainer title='Data final'>
         <DatePicker
           size='sm'
           value={endDate}
           onSelectDate={handleSelectEndDate}
+          startDate={startDate}
           disabled={!startDate}
         />
-      </DataTableFilterContainer>
+      </FilterContainer>
     </div>
   )
 }
diff --git a/src/components/filters/filter-select.tsx b/src/components/filters/filter-select.tsx
new file mode 100644
index 00000000..cdd3b5a6
--- /dev/null
+++ b/src/components/filters/filter-select.tsx
@@ -0,0 +1,37 @@
+'use client'
+
+import { Select, type SelectProps } from '@/components/ui/select'
+import { QUERY_PARAMS } from '@/constants/params'
+import { useParams } from '@/hooks/params'
+
+interface FilterSelectProps extends SelectProps {
+  param: string
+}
+
+export function FilterSelect({ param, ...props }: Readonly<FilterSelectProps>) {
+  const { getParam, updateParams } = useParams()
+
+  const pageParam = QUERY_PARAMS.page
+  const selectValue = getParam(param) || ''
+
+  function handleSelect(value: string) {
+    if (!value || value === 'reset') {
+      updateParams({ remove: [param, pageParam] })
+      return
+    }
+
+    updateParams({
+      set: [{ key: param, value: value }],
+      remove: [pageParam],
+    })
+  }
+
+  return (
+    <Select
+      size='sm'
+      value={selectValue}
+      onValueChange={handleSelect}
+      {...props}
+    />
+  )
+}
diff --git a/src/components/ui/search-input.tsx b/src/components/filters/search-input.tsx
similarity index 79%
rename from src/components/ui/search-input.tsx
rename to src/components/filters/search-input.tsx
index 8447652f..c33705b2 100644
--- a/src/components/ui/search-input.tsx
+++ b/src/components/filters/search-input.tsx
@@ -4,13 +4,21 @@ import { SearchIcon, XIcon } from 'lucide-react'
 import { useEffect, useState } from 'react'
 
 import { Button } from '@/components/ui/button'
-import { Input, type InputProps } from '@/components/ui/input'
+import { Input } from '@/components/ui/input'
 import { QUERY_PARAMS } from '@/constants/params'
 import { useDebounce } from '@/hooks/debounce'
 import { useParams } from '@/hooks/params'
 import { cn } from '@/utils/class-name-merge'
 
-export function SearchInput({ className, ...props }: Readonly<InputProps>) {
+interface SearchInputProps {
+  placeholder: string
+  className?: string
+}
+
+export function SearchInput({
+  placeholder,
+  className,
+}: Readonly<SearchInputProps>) {
   const queryParam = QUERY_PARAMS.search
   const pageParam = QUERY_PARAMS.page
 
@@ -33,22 +41,22 @@ export function SearchInput({ className, ...props }: Readonly<InputProps>) {
   }, [searchQuery])
 
   return (
-    <div className='relative'>
+    <div className={cn('relative', className)}>
       <Input
         size='sm'
         name='search'
         value={query}
         icon={SearchIcon}
         onChange={(e) => setQuery(e.target.value)}
-        className={cn('w-52 pr-10', className)}
-        {...props}
+        placeholder={placeholder}
+        className='w-full pr-10'
       />
 
       {query && (
         <Button
           size='icon'
           variant='ghost'
-          title='Limpar busca'
+          title='Limpar pesquisa'
           className='absolute top-0 right-0 size-9 [&_svg]:size-4'
           onClick={() => setQuery('')}
         >
diff --git a/src/components/data-table/header/filter-button.tsx b/src/components/filters/show-filter-button.tsx
similarity index 90%
rename from src/components/data-table/header/filter-button.tsx
rename to src/components/filters/show-filter-button.tsx
index 8447805e..044e4707 100644
--- a/src/components/data-table/header/filter-button.tsx
+++ b/src/components/filters/show-filter-button.tsx
@@ -5,7 +5,7 @@ import { ListFilterIcon } from 'lucide-react'
 import { Button, type ButtonProps } from '@/components/ui/button'
 import { cn } from '@/utils/class-name-merge'
 
-export function DataTableHeaderFilterButton({
+export function ShowFilterButton({
   className,
   ...props
 }: Readonly<ButtonProps>) {
diff --git a/src/components/section-header.tsx b/src/components/section-header.tsx
index 7b93a3c3..c27b728e 100644
--- a/src/components/section-header.tsx
+++ b/src/components/section-header.tsx
@@ -40,8 +40,8 @@ export function SectionHeaderTitle({
         {icon}
       </div>
       <div className='flex items-center gap-2'>
-        {total > 0 && <span className='text-2xl font-semibold'>{total}</span>}
-        <p className='text-foreground-soft text-lg'>{title}</p>
+        {total > 0 && <span className='text-3xl font-semibold'>{total}</span>}
+        <p className='text-foreground-soft text-xl'>{title}</p>
       </div>
     </div>
   )
diff --git a/src/components/ui/calendar/index.tsx b/src/components/ui/calendar/index.tsx
index 7b3bcd2e..44c940fa 100644
--- a/src/components/ui/calendar/index.tsx
+++ b/src/components/ui/calendar/index.tsx
@@ -16,26 +16,42 @@ import { CalendarStepNav } from './step-nav'
 export interface CalendarProps extends Omit<PropsSingle, 'mode'> {
   navMode?: 'step' | 'dropdown'
   allowFutureDates?: boolean
+  startDate?: string | Date
 }
 
 export function Calendar({
   navMode = 'step',
   allowFutureDates,
+  startDate,
   ...props
 }: Readonly<CalendarProps>) {
   const defaultClassNames = getDefaultClassNames()
 
-  const dateRestrictions = !allowFutureDates
-    ? {
-        toDate: new Date(),
-        toMonth: new Date(),
-        disabled: (date: Date) => {
-          const today = new Date()
-          today.setHours(23, 59, 59, 999)
-          return date > today
-        },
-      }
-    : {}
+  const dateRestrictions = {
+    ...(startDate && {
+      fromDate: new Date(startDate),
+      fromMonth: new Date(startDate),
+      disabled: (date: Date) => {
+        const start = new Date(startDate)
+        start.setHours(0, 0, 0, 0)
+        return date < start
+      },
+    }),
+    ...(!allowFutureDates && {
+      toDate: new Date(),
+      toMonth: new Date(),
+      disabled: (date: Date) => {
+        const today = new Date()
+        today.setHours(23, 59, 59, 999)
+        if (startDate) {
+          const start = new Date(startDate)
+          start.setHours(0, 0, 0, 0)
+          return date > today || date < start
+        }
+        return date > today
+      },
+    }),
+  }
 
   return (
     <DayPicker
diff --git a/src/components/ui/date-picker.tsx b/src/components/ui/date-picker.tsx
index 7d2eaa34..35423b31 100644
--- a/src/components/ui/date-picker.tsx
+++ b/src/components/ui/date-picker.tsx
@@ -15,7 +15,7 @@ import { PopoverTrigger, type PopoverTriggerProps } from './popover/trigger'
 
 export interface DatePickerProps
   extends Omit<PopoverTriggerProps, 'value'>,
-    Pick<CalendarProps, 'allowFutureDates' | 'navMode'> {
+    Pick<CalendarProps, 'allowFutureDates' | 'navMode' | 'startDate'> {
   value?: string
   onSelectDate?: (date: string) => void
   modal?: boolean
@@ -28,6 +28,7 @@ export function DatePicker({
   allowFutureDates,
   onSelectDate,
   modal,
+  startDate,
   ...props
 }: Readonly<DatePickerProps>) {
   const [open, setOpen] = useState(false)
@@ -74,6 +75,7 @@ export function DatePicker({
       <PopoverContent>
         <Calendar
           navMode={navMode}
+          startDate={startDate}
           onSelect={handleCalendarSelect}
           allowFutureDates={allowFutureDates}
           selected={date ? new Date(date) : undefined}
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
index bec1b9aa..8e4f02e1 100644
--- a/src/components/ui/select.tsx
+++ b/src/components/ui/select.tsx
@@ -6,10 +6,12 @@ import {
   type SelectRootProps,
 } from '@base-ui-components/react/select'
 import { cva, type VariantProps } from 'class-variance-authority'
-import { CheckIcon, ChevronsUpDownIcon } from 'lucide-react'
+import { CheckIcon, ChevronsUpDownIcon, XIcon } from 'lucide-react'
 
 import { cn } from '@/utils/class-name-merge'
 
+import { Divider } from './divider'
+
 export type SelectOption = {
   label: string
   value: string
@@ -17,7 +19,7 @@ export type SelectOption = {
 }
 
 const selectTriggerVariants = cva(
-  'border-border bg-background hover:bg-accent focus-visible:outline-ring data-[placeholder]:text-disabled flex cursor-pointer items-center justify-between gap-2 rounded-lg border pr-2 pl-3 shadow-xs outline-offset-4 outline-transparent transition-colors disabled:pointer-events-none disabled:opacity-50 aria-[readonly]:pointer-events-none',
+  'border-border bg-background data-[placeholder]:text-disabled outline-ring hover:bg-accent flex cursor-pointer items-center justify-between gap-2 rounded-lg border pr-2 pl-3 shadow-xs outline-offset-4 transition-colors disabled:pointer-events-none disabled:opacity-50 aria-[readonly]:pointer-events-none',
   {
     variants: {
       size: {
@@ -37,6 +39,7 @@ export type SelectProps = Omit<SelectRootProps<string, false>, 'items'> &
     align?: SelectPositionerProps['align']
     className?: string
     placeholder?: string
+    resetLabel?: string
   }
 
 export function Select({
@@ -45,6 +48,7 @@ export function Select({
   align,
   options,
   className,
+  resetLabel,
   placeholder = 'Selecione uma opção',
   ...props
 }: Readonly<SelectProps>) {
@@ -101,6 +105,19 @@ export function Select({
                   </BaseSelect.ItemIndicator>
                 </BaseSelect.Item>
               ))}
+
+              {resetLabel && selectedOption && (
+                <>
+                  <Divider className='my-1' />
+                  <BaseSelect.Item
+                    value='reset'
+                    className='data-[highlighted]:bg-primary data-[highlighted]:text-primary-foreground flex cursor-pointer items-center gap-2 rounded-md px-3 py-1.5 transition-colors outline-none [&_svg]:size-4'
+                  >
+                    <XIcon />
+                    <BaseSelect.ItemText>{resetLabel}</BaseSelect.ItemText>
+                  </BaseSelect.Item>
+                </>
+              )}
             </BaseSelect.List>
           </BaseSelect.Popup>
         </BaseSelect.Positioner>
diff --git a/src/hooks/params.ts b/src/hooks/params.ts
index aab93d28..ccad9183 100644
--- a/src/hooks/params.ts
+++ b/src/hooks/params.ts
@@ -38,9 +38,14 @@ export function useParams() {
     router.replace(`?${pageParams.toString()}`)
   }
 
+  function clearParams() {
+    router.replace(window.location.pathname)
+  }
+
   return {
     searchParams,
     getParam,
     updateParams,
+    clearParams,
   }
 }
diff --git a/src/modules/patient-requirements/approved-list-table.tsx b/src/modules/patient-requirements/approved-list-table.tsx
index 5f51052e..7e152dd3 100644
--- a/src/modules/patient-requirements/approved-list-table.tsx
+++ b/src/modules/patient-requirements/approved-list-table.tsx
@@ -1,15 +1,17 @@
 'use client'
 
 import { useQuery } from '@tanstack/react-query'
-import { UserCheck2Icon } from 'lucide-react'
+import { ClipboardCheckIcon } from 'lucide-react'
 import { useEffect, useState } from 'react'
 
-import { DataTableHeader } from '@/components/data-table/header'
-import { DataTableHeaderActions } from '@/components/data-table/header/actions'
-import { DataTableHeaderInfo } from '@/components/data-table/header/info'
-import { DataTableHeaderOrderBy } from '@/components/data-table/header/order-by'
-import { DataTableHeaderSearch } from '@/components/data-table/header/search'
+import { FilterSelect } from '@/components/filters/filter-select'
+import { SearchInput } from '@/components/filters/search-input'
 import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
 import { Avatar } from '@/components/ui/avatar'
 import { Card } from '@/components/ui/card'
 import {
@@ -85,21 +87,23 @@ export function ApprovedPatientRequirementsListTable() {
 
   return (
     <>
-      <DataTableHeader>
-        <DataTableHeaderInfo
-          icon={<UserCheck2Icon />}
-          total={stableTotal}
+      <SectionHeader>
+        <SectionHeaderTitle
           title='Aprovações'
+          icon={<ClipboardCheckIcon />}
+          total={stableTotal}
         />
-
-        <DataTableHeaderActions>
-          <DataTableHeaderSearch placeholder='Pesquisar nome...' />
-          <DataTableHeaderOrderBy
+        <SectionHeaderActions>
+          <SearchInput placeholder='Pesquisar nome...' className='w-56' />
+          <FilterSelect
+            param={QUERY_PARAMS.orderBy}
             options={PATIENT_REQUIREMENTS_ORDER_OPTIONS}
+            placeholder='Ordenar por...'
+            resetLabel='Limpar ordem'
             className='w-52'
           />
-        </DataTableHeaderActions>
-      </DataTableHeader>
+        </SectionHeaderActions>
+      </SectionHeader>
 
       <Card className='p-6'>
         <Table>
diff --git a/src/modules/patient-requirements/pending-requirements.tsx b/src/modules/patient-requirements/pending-requirements.tsx
index 5f9eb884..9d6d408a 100644
--- a/src/modules/patient-requirements/pending-requirements.tsx
+++ b/src/modules/patient-requirements/pending-requirements.tsx
@@ -2,14 +2,17 @@
 
 import { useQuery } from '@tanstack/react-query'
 import { differenceInDays } from 'date-fns'
-import { Calendar, CircleAlert } from 'lucide-react'
+import { Calendar, CircleAlert, ClockArrowUpIcon } from 'lucide-react'
 import { useEffect, useState } from 'react'
 
-import { DataTableHeader } from '@/components/data-table/header'
-import { DataTableHeaderActions } from '@/components/data-table/header/actions'
-import { DataTableHeaderOrderBy } from '@/components/data-table/header/order-by'
-import { DataTableHeaderSearch } from '@/components/data-table/header/search'
+import { FilterSelect } from '@/components/filters/filter-select'
+import { SearchInput } from '@/components/filters/search-input'
 import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
 import { Card } from '@/components/ui/card'
 import { Skeleton } from '@/components/ui/skeleton'
 import { Tag } from '@/components/ui/tag'
@@ -88,16 +91,24 @@ export function PendingPatientRequirements() {
 
   return (
     <>
-      <DataTableHeader>
-        <DataTableHeaderActions>
-          <DataTableHeaderSearch placeholder='Pesquisar nome...' />
-          <DataTableHeaderOrderBy
+      <SectionHeader>
+        <SectionHeaderTitle
+          title='Envios pendentes'
+          icon={<ClockArrowUpIcon />}
+          total={stableTotal}
+        />
+        <SectionHeaderActions>
+          <SearchInput placeholder='Pesquisar nome...' className='w-56' />
+          <FilterSelect
+            param={QUERY_PARAMS.orderBy}
             options={PATIENT_REQUIREMENTS_ORDER_OPTIONS}
+            placeholder='Ordenar por...'
+            resetLabel='Limpar ordem'
             className='w-52'
           />
           <AddPatientRequirementButton size='sm' />
-        </DataTableHeaderActions>
-      </DataTableHeader>
+        </SectionHeaderActions>
+      </SectionHeader>
 
       <Card className='grid gap-4 p-6 sm:grid-cols-2 xl:grid-cols-3'>
         {isLoading && <Skeleton quantity={12} className='h-40 rounded-xl' />}
diff --git a/src/modules/patient-requirements/under-review-requirements.tsx b/src/modules/patient-requirements/under-review-requirements.tsx
index ac7fff62..2e7d616d 100644
--- a/src/modules/patient-requirements/under-review-requirements.tsx
+++ b/src/modules/patient-requirements/under-review-requirements.tsx
@@ -1,14 +1,17 @@
 'use client'
 
 import { useQuery } from '@tanstack/react-query'
-import { CircleAlertIcon } from 'lucide-react'
+import { CircleAlertIcon, ClipboardClockIcon } from 'lucide-react'
 import { useEffect, useState } from 'react'
 
-import { DataTableHeader } from '@/components/data-table/header'
-import { DataTableHeaderActions } from '@/components/data-table/header/actions'
-import { DataTableHeaderOrderBy } from '@/components/data-table/header/order-by'
-import { DataTableHeaderSearch } from '@/components/data-table/header/search'
+import { FilterSelect } from '@/components/filters/filter-select'
+import { SearchInput } from '@/components/filters/search-input'
 import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
 import { Card } from '@/components/ui/card'
 import { Skeleton } from '@/components/ui/skeleton'
 import { Tag } from '@/components/ui/tag'
@@ -85,16 +88,24 @@ export function UnderReviewPatientRequirements() {
 
   return (
     <>
-      <DataTableHeader>
-        <DataTableHeaderActions>
-          <DataTableHeaderSearch placeholder='Pesquisar nome...' />
-          <DataTableHeaderOrderBy
+      <SectionHeader>
+        <SectionHeaderTitle
+          title='Aprovações pendentes'
+          icon={<ClipboardClockIcon />}
+          total={stableTotal}
+        />
+        <SectionHeaderActions>
+          <SearchInput placeholder='Pesquisar nome...' className='w-56' />
+          <FilterSelect
+            param={QUERY_PARAMS.orderBy}
             options={PATIENT_REQUIREMENTS_ORDER_OPTIONS}
+            placeholder='Ordenar por...'
+            resetLabel='Limpar ordem'
             className='w-52'
           />
           <AddPatientRequirementButton size='sm' />
-        </DataTableHeaderActions>
-      </DataTableHeader>
+        </SectionHeaderActions>
+      </SectionHeader>
 
       <Card className='grid gap-4 p-6 sm:grid-cols-2 xl:grid-cols-3'>
         {isLoading && <Skeleton quantity={12} className='h-32 rounded-xl' />}
diff --git a/src/modules/patients/list/table.tsx b/src/modules/patients/list/table.tsx
index 1ffe1893..afe9e871 100644
--- a/src/modules/patients/list/table.tsx
+++ b/src/modules/patients/list/table.tsx
@@ -5,16 +5,18 @@ import { PlusIcon, Users2Icon } from 'lucide-react'
 import { useRouter } from 'next/navigation'
 import { useEffect, useState } from 'react'
 
-import { DataTableFilters } from '@/components/data-table/filters'
-import { DataTableFilterDate } from '@/components/data-table/filters/date'
-import { DataTableFilterStatus } from '@/components/data-table/filters/status'
-import { DataTableHeader } from '@/components/data-table/header'
-import { DataTableHeaderActions } from '@/components/data-table/header/actions'
-import { DataTableHeaderFilterButton } from '@/components/data-table/header/filter-button'
-import { DataTableHeaderInfo } from '@/components/data-table/header/info'
-import { DataTableHeaderOrderBy } from '@/components/data-table/header/order-by'
-import { DataTableHeaderSearch } from '@/components/data-table/header/search'
+import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
+import { FilterContainer } from '@/components/filters/container'
+import { FilterDate } from '@/components/filters/date'
+import { FilterSelect } from '@/components/filters/filter-select'
+import { SearchInput } from '@/components/filters/search-input'
+import { ShowFilterButton } from '@/components/filters/show-filter-button'
 import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
 import { Avatar } from '@/components/ui/avatar'
 import { Card } from '@/components/ui/card'
 import { NavButton } from '@/components/ui/nav-button'
@@ -104,40 +106,43 @@ export function PatientsListTable() {
 
   return (
     <>
-      <DataTableHeader>
-        <DataTableHeaderInfo
+      <SectionHeader>
+        <SectionHeaderTitle
+          title='Pacientes'
           icon={<Users2Icon />}
           total={stableTotal}
-          title='Pacientes'
         />
-        <DataTableHeaderActions>
-          <DataTableHeaderSearch placeholder='Pesquisar nome' />
-          <DataTableHeaderOrderBy
+        <SectionHeaderActions>
+          <SearchInput placeholder='Pesquisar...' className='w-48' />
+          <FilterSelect
+            param={QUERY_PARAMS.orderBy}
             options={PATIENTS_ORDER_OPTIONS}
+            placeholder='Ordenar por...'
+            resetLabel='Limpar ordem'
             className='w-52'
           />
-          <DataTableHeaderFilterButton
-            onClick={() => setShowFilters(!showFilters)}
-          />
+          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
 
           <NavButton size='sm' href={ROUTES.dashboard.patients.new}>
             <PlusIcon />
             Novo paciente
           </NavButton>
-        </DataTableHeaderActions>
-      </DataTableHeader>
+        </SectionHeaderActions>
+      </SectionHeader>
 
       {showFilters && (
-        <DataTableFilters
-          queries={[
-            QUERY_PARAMS.status,
-            QUERY_PARAMS.startDate,
-            QUERY_PARAMS.endDate,
-          ]}
-        >
-          <DataTableFilterStatus options={PATIENT_STATUS_OPTIONS} />
-          <DataTableFilterDate />
-        </DataTableFilters>
+        <section className='flex items-end gap-8'>
+          <FilterContainer title='Status' className='w-48'>
+            <FilterSelect
+              param={QUERY_PARAMS.status}
+              options={PATIENT_STATUS_OPTIONS}
+              placeholder='Selecione o status'
+              resetLabel='Limpar status'
+            />
+          </FilterContainer>
+          <FilterDate />
+          <ClearFiltersButton />
+        </section>
       )}
 
       <Card className='p-6'>
@@ -157,16 +162,6 @@ export function PatientsListTable() {
 
           {isLoading && <PatientsListTableSkeleton />}
 
-          {!isLoading && isEmpty && (
-            <TableBody>
-              <TableRow>
-                <TableEmptyCell colSpan={6}>
-                  Nenhum paciente encontrado
-                </TableEmptyCell>
-              </TableRow>
-            </TableBody>
-          )}
-
           {!isLoading && !isEmpty && (
             <TableBody>
               {patients.map((patient) => {
@@ -203,6 +198,16 @@ export function PatientsListTable() {
               })}
             </TableBody>
           )}
+
+          {!isLoading && isEmpty && (
+            <TableBody>
+              <TableRow>
+                <TableEmptyCell colSpan={6}>
+                  Nenhum paciente encontrado
+                </TableEmptyCell>
+              </TableRow>
+            </TableBody>
+          )}
         </Table>
       </Card>
 
diff --git a/src/modules/teams/table.tsx b/src/modules/teams/table.tsx
index f877d22e..b04df918 100644
--- a/src/modules/teams/table.tsx
+++ b/src/modules/teams/table.tsx
@@ -8,12 +8,13 @@ import {
 } from 'lucide-react'
 import { useState } from 'react'
 
-import { DataTableHeader } from '@/components/data-table/header'
-import { DataTableHeaderActions } from '@/components/data-table/header/actions'
-import { DataTableHeaderFilterButton } from '@/components/data-table/header/filter-button'
-import { DataTableHeaderOrderBy } from '@/components/data-table/header/order-by'
-import { DataTableHeaderSearch } from '@/components/data-table/header/search'
+import { FilterSelect } from '@/components/filters/filter-select'
+import { SearchInput } from '@/components/filters/search-input'
 import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+} from '@/components/section-header'
 import { Avatar } from '@/components/ui/avatar'
 import { Button } from '@/components/ui/button'
 import { Card } from '@/components/ui/card'
@@ -34,6 +35,7 @@ import {
   TableRow,
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
+import { QUERY_PARAMS } from '@/constants/params'
 import { TEAMS_ORDER_OPTIONS } from '@/enums/team'
 import { formatDate } from '@/utils/formatters/format-date'
 import { TEAMS_MOCK } from '@/utils/mock/teams'
@@ -72,25 +74,26 @@ export function TeamListTable() {
 
   return (
     <>
-      <DataTableHeader>
+      <SectionHeader>
         <TabSelect buttons={filterOptions} />
 
-        <DataTableHeaderActions>
-          <DataTableHeaderSearch placeholder='Pesquisar' />
-
-          <DataTableHeaderFilterButton />
+        <SectionHeaderActions>
+          <SearchInput placeholder='Pesquisar...' className='w-48' />
 
-          <DataTableHeaderOrderBy
+          <FilterSelect
+            param={QUERY_PARAMS.orderBy}
             options={TEAMS_ORDER_OPTIONS}
-            className='min-w-48'
+            placeholder='Ordenar por...'
+            resetLabel='Limpar ordem'
+            className='w-68'
           />
 
           <Button size='sm'>
             <PlusIcon />
             Novo membro
           </Button>
-        </DataTableHeaderActions>
-      </DataTableHeader>
+        </SectionHeaderActions>
+      </SectionHeader>
 
       <Card className='p-6 sm:col-span-6'>
         <Table>

From b466ec66f8163c09c80b54cf2b3f4f70c1d4af70 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Thu, 5 Feb 2026 16:54:03 -0300
Subject: [PATCH 23/77] feat(patients): add appointment and referral buttons to
 patients table

---
 .../pacientes/[id]/informacoes/page.tsx       |   4 +-
 src/app/(dashboard)/pacientes/page.tsx        |   4 +-
 src/components/filters/search-input.tsx       |   2 +-
 src/components/ui/table.tsx                   |   2 +-
 src/constants/cache.ts                        |   4 +
 .../appointments/appointment-modal.tsx        |   8 +-
 src/modules/patients/list/actions.tsx         |  85 ----------
 src/modules/patients/list/skeleton.tsx        |  36 ----
 src/modules/patients/table/actions.tsx        | 121 +++++++++++++
 .../{list/table.tsx => table/index.tsx}       |  49 +++---
 src/modules/patients/table/skeleton.tsx       |  32 ++++
 ...ral-button.tsx => new-referral-button.tsx} |  18 +-
 ...referrals-modal.tsx => referral-modal.tsx} | 159 +++++++++++-------
 13 files changed, 288 insertions(+), 236 deletions(-)
 delete mode 100644 src/modules/patients/list/actions.tsx
 delete mode 100644 src/modules/patients/list/skeleton.tsx
 create mode 100644 src/modules/patients/table/actions.tsx
 rename src/modules/patients/{list/table.tsx => table/index.tsx} (85%)
 create mode 100644 src/modules/patients/table/skeleton.tsx
 rename src/modules/referrals/{referral-button.tsx => new-referral-button.tsx} (50%)
 rename src/modules/referrals/{referrals-modal.tsx => referral-modal.tsx} (52%)

diff --git a/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx b/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
index 558aabe1..de1f9e89 100644
--- a/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
+++ b/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
@@ -6,7 +6,7 @@ import { getPatient } from '@/actions/patients/get-patient'
 import { ROUTES } from '@/constants/routes'
 import { PatientForm } from '@/modules/patients/form'
 import { InactivatePatientButton } from '@/modules/patients/inactivate-button'
-import { ReferPatientButton } from '@/modules/referrals/referral-button'
+import { NewReferralButton } from '@/modules/referrals/new-referral-button'
 
 export const metadata: Metadata = {
   title: 'Informações do paciente',
@@ -45,7 +45,7 @@ export default async function Page({
 
         <div className='flex gap-2'>
           {isPatientActive && <InactivatePatientButton patient={patient} />}
-          <ReferPatientButton id={patient.id} />
+          <NewReferralButton id={patient.id} />
         </div>
       </header>
 
diff --git a/src/app/(dashboard)/pacientes/page.tsx b/src/app/(dashboard)/pacientes/page.tsx
index 9c241627..dbbd5954 100644
--- a/src/app/(dashboard)/pacientes/page.tsx
+++ b/src/app/(dashboard)/pacientes/page.tsx
@@ -1,11 +1,11 @@
 import type { Metadata } from 'next'
 
-import { PatientsListTable } from '@/modules/patients/list/table'
+import { PatientsTable } from '@/modules/patients/table'
 
 export const metadata: Metadata = {
   title: 'Pacientes',
 }
 
 export default function Page() {
-  return <PatientsListTable />
+  return <PatientsTable />
 }
diff --git a/src/components/filters/search-input.tsx b/src/components/filters/search-input.tsx
index c33705b2..3ae8098f 100644
--- a/src/components/filters/search-input.tsx
+++ b/src/components/filters/search-input.tsx
@@ -57,7 +57,7 @@ export function SearchInput({
           size='icon'
           variant='ghost'
           title='Limpar pesquisa'
-          className='absolute top-0 right-0 size-9 [&_svg]:size-4'
+          className='absolute top-1 right-1 size-7 rounded-md [&_svg]:size-4'
           onClick={() => setQuery('')}
         >
           <XIcon />
diff --git a/src/components/ui/table.tsx b/src/components/ui/table.tsx
index 9e000653..f59ec586 100644
--- a/src/components/ui/table.tsx
+++ b/src/components/ui/table.tsx
@@ -89,7 +89,7 @@ export function TableButton({
   return (
     <button
       className={cn(
-        'focus-visible:ring-ring focus-visible:outline-background flex cursor-pointer items-center gap-2 rounded-lg focus-visible:ring-2 focus-visible:ring-offset-4',
+        'outline-ring flex cursor-pointer items-center gap-2 rounded-lg outline-offset-4',
         className,
       )}
       {...props}
diff --git a/src/constants/cache.ts b/src/constants/cache.ts
index 6ddf37e4..47f0ee19 100644
--- a/src/constants/cache.ts
+++ b/src/constants/cache.ts
@@ -5,6 +5,10 @@ export const NEXT_CACHE_TAGS = {
     main: 'appointments',
     query: (query: string) => `appointments/${query}`,
   },
+  referrals: {
+    main: 'referrals',
+    query: (query: string) => `referrals/${query}`,
+  },
   statistics: {
     totalAppointments: {
       main: 'total-appointments',
diff --git a/src/modules/appointments/appointment-modal.tsx b/src/modules/appointments/appointment-modal.tsx
index 65302a15..54b845a1 100644
--- a/src/modules/appointments/appointment-modal.tsx
+++ b/src/modules/appointments/appointment-modal.tsx
@@ -52,11 +52,13 @@ const appointmentFormSchema = z.object({
 type AppointmentFormSchema = z.infer<typeof appointmentFormSchema>
 
 interface AppointmentModalProps {
+  patientId?: string
   appointment?: Appointment
   onClose: () => void
 }
 
 export function AppointmentModal({
+  patientId,
   appointment,
   onClose,
 }: Readonly<AppointmentModalProps>) {
@@ -67,7 +69,7 @@ export function AppointmentModal({
   const formMethods = useForm<AppointmentFormSchema>({
     resolver: zodResolver(appointmentFormSchema),
     defaultValues: {
-      patient_id: appointment?.patient_id || '',
+      patient_id: patientId ?? (appointment?.patient_id || ''),
       date: appointment?.date || '',
       category: appointment?.category || '',
       condition: appointment?.condition || '',
@@ -132,10 +134,10 @@ export function AppointmentModal({
             <ComboboxInput
               name='patient_id'
               label='Paciente'
+              options={patientOptions}
               className='sm:col-span-full'
               placeholder='Selecione um paciente'
-              options={patientOptions}
-              readOnly={isEditMode}
+              readOnly={isEditMode || !!patientId}
               isRequired
             />
             <DateInput
diff --git a/src/modules/patients/list/actions.tsx b/src/modules/patients/list/actions.tsx
deleted file mode 100644
index c6e28b6b..00000000
--- a/src/modules/patients/list/actions.tsx
+++ /dev/null
@@ -1,85 +0,0 @@
-'use client'
-
-import {
-  CircleXIcon,
-  ClipboardEditIcon,
-  EllipsisIcon,
-  SendIcon,
-} from 'lucide-react'
-import { useState } from 'react'
-
-import { Dialog } from '@/components/ui/dialog'
-import { Divider } from '@/components/ui/divider'
-import { DropdownMenu } from '@/components/ui/dropdown'
-import { DropdownMenuContent } from '@/components/ui/dropdown/content'
-import { DropdownMenuItem } from '@/components/ui/dropdown/item'
-import { DropdownMenuTrigger } from '@/components/ui/dropdown/trigger'
-import { InactivatePatientModal } from '@/modules/patients/inactivate-modal'
-import type { Patient } from '@/types/patients.d.ts'
-
-interface PatientsListTableActionsProps {
-  patient: Patient
-}
-
-export function PatientsListTableActions({
-  patient,
-}: PatientsListTableActionsProps) {
-  const [isDropdownOpen, setDropdownOpen] = useState(false)
-  const [isInactivateModalOpen, setInactivateModalOpen] = useState(false)
-
-  const isPatientActive = patient.status === 'active'
-
-  return (
-    <>
-      <DropdownMenu open={isDropdownOpen} onOpenChange={setDropdownOpen}>
-        <DropdownMenuTrigger size='icon' variant='ghost' className='size-8'>
-          <EllipsisIcon />
-        </DropdownMenuTrigger>
-
-        <DropdownMenuContent align='end'>
-          <DropdownMenuItem>
-            <ClipboardEditIcon />
-            Editar paciente
-          </DropdownMenuItem>
-
-          <DropdownMenuItem>
-            <SendIcon />
-            Encaminhar
-          </DropdownMenuItem>
-
-          {isPatientActive && (
-            <>
-              <Divider />
-              <DropdownMenuItem
-                variant='destructive'
-                onSelect={(e) => {
-                  e.preventDefault()
-                  setDropdownOpen(false)
-                  setInactivateModalOpen(true)
-                }}
-              >
-                <CircleXIcon />
-                Inativar paciente
-              </DropdownMenuItem>
-            </>
-          )}
-        </DropdownMenuContent>
-      </DropdownMenu>
-
-      {isPatientActive && (
-        <Dialog
-          open={isInactivateModalOpen}
-          onOpenChange={setInactivateModalOpen}
-        >
-          {isInactivateModalOpen && (
-            <InactivatePatientModal
-              id={patient.id}
-              name={patient.name}
-              onClose={() => setInactivateModalOpen(false)}
-            />
-          )}
-        </Dialog>
-      )}
-    </>
-  )
-}
diff --git a/src/modules/patients/list/skeleton.tsx b/src/modules/patients/list/skeleton.tsx
deleted file mode 100644
index 4a914000..00000000
--- a/src/modules/patients/list/skeleton.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { Skeleton } from '@/components/ui/skeleton'
-import { TableBody, TableCell, TableRow } from '@/components/ui/table'
-
-export default function PatientsListTableSkeleton() {
-  const skeletons = Array.from({ length: 10 }).map((_, index) => index)
-
-  return (
-    <TableBody>
-      {skeletons.map((skeleton) => (
-        <TableRow key={skeleton}>
-          <TableCell className='py-0'>
-            <div className='flex w-64 items-center gap-2'>
-              <Skeleton className='size-9 rounded-full' />
-              <Skeleton className='h-5 w-48 rounded-md' />
-            </div>
-          </TableCell>
-          <TableCell>
-            <Skeleton className='h-5 w-32 rounded-md' />
-          </TableCell>
-          <TableCell>
-            <Skeleton className='h-5 w-56 rounded-md' />
-          </TableCell>
-          <TableCell>
-            <Skeleton className='h-6 w-18 rounded-md' />
-          </TableCell>
-          <TableCell>
-            <Skeleton className='h-5 w-24 rounded-md' />
-          </TableCell>
-          <TableCell>
-            <Skeleton className='mx-auto size-8 rounded-md' />
-          </TableCell>
-        </TableRow>
-      ))}
-    </TableBody>
-  )
-}
diff --git a/src/modules/patients/table/actions.tsx b/src/modules/patients/table/actions.tsx
new file mode 100644
index 00000000..bc90775d
--- /dev/null
+++ b/src/modules/patients/table/actions.tsx
@@ -0,0 +1,121 @@
+'use client'
+
+import {
+  ClipboardListIcon,
+  ClipboardPasteIcon,
+  ClipboardPlusIcon,
+  EllipsisIcon,
+  XCircleIcon,
+} from 'lucide-react'
+import { useRouter } from 'next/navigation'
+import { useState } from 'react'
+
+import { Dialog } from '@/components/ui/dialog'
+import { Divider } from '@/components/ui/divider'
+import { Menu, MenuContent, MenuItem, MenuTrigger } from '@/components/ui/menu'
+import { ROUTES } from '@/constants/routes'
+import { AppointmentModal } from '@/modules/appointments/appointment-modal'
+import { InactivatePatientModal } from '@/modules/patients/inactivate-modal'
+import { ReferralModal } from '@/modules/referrals/referral-modal'
+import type { Patient } from '@/types/patients.d.ts'
+
+interface PatientsTableActionsProps {
+  patient: Patient
+}
+
+export function PatientsTableActions({ patient }: PatientsTableActionsProps) {
+  const [isReferralModalOpen, setReferralModalOpen] = useState(false)
+  const [isAppointmentModalOpen, setAppointmentModalOpen] = useState(false)
+  const [isInactivateModalOpen, setInactivateModalOpen] = useState(false)
+
+  const router = useRouter()
+
+  const isPatientActive = patient.status === 'active'
+
+  return (
+    <>
+      <Menu>
+        <MenuTrigger size='icon' variant='ghost' className='size-8'>
+          <EllipsisIcon />
+          <span className='sr-only'>Ações</span>
+        </MenuTrigger>
+
+        <MenuContent align='end'>
+          {isPatientActive && (
+            <>
+              <MenuItem onClick={() => setReferralModalOpen(true)}>
+                <ClipboardPasteIcon />
+                Encaminhar
+              </MenuItem>
+              <MenuItem onClick={() => setAppointmentModalOpen(true)}>
+                <ClipboardPlusIcon />
+                Novo atendimento
+              </MenuItem>
+            </>
+          )}
+
+          <MenuItem
+            onClick={() =>
+              router.push(ROUTES.dashboard.patients.details.info(patient.id))
+            }
+          >
+            <ClipboardListIcon />
+            Ver informações
+          </MenuItem>
+
+          {isPatientActive && (
+            <>
+              <Divider className='my-1' />
+              <MenuItem
+                variant='destructive'
+                onClick={() => setInactivateModalOpen(true)}
+              >
+                <XCircleIcon />
+                Inativar paciente
+              </MenuItem>
+            </>
+          )}
+        </MenuContent>
+      </Menu>
+
+      {isPatientActive && (
+        <>
+          <Dialog
+            open={isReferralModalOpen}
+            onOpenChange={setReferralModalOpen}
+          >
+            {isReferralModalOpen && (
+              <ReferralModal
+                patientId={patient.id}
+                onClose={() => setReferralModalOpen(false)}
+              />
+            )}
+          </Dialog>
+          <Dialog
+            open={isAppointmentModalOpen}
+            onOpenChange={setAppointmentModalOpen}
+          >
+            {isAppointmentModalOpen && (
+              <AppointmentModal
+                patientId={patient.id}
+                onClose={() => setAppointmentModalOpen(false)}
+              />
+            )}
+          </Dialog>
+          <Dialog
+            open={isInactivateModalOpen}
+            onOpenChange={setInactivateModalOpen}
+          >
+            {isInactivateModalOpen && (
+              <InactivatePatientModal
+                id={patient.id}
+                name={patient.name}
+                onClose={() => setInactivateModalOpen(false)}
+              />
+            )}
+          </Dialog>
+        </>
+      )}
+    </>
+  )
+}
diff --git a/src/modules/patients/list/table.tsx b/src/modules/patients/table/index.tsx
similarity index 85%
rename from src/modules/patients/list/table.tsx
rename to src/modules/patients/table/index.tsx
index afe9e871..d663b2b3 100644
--- a/src/modules/patients/list/table.tsx
+++ b/src/modules/patients/table/index.tsx
@@ -2,7 +2,6 @@
 
 import { useQuery } from '@tanstack/react-query'
 import { PlusIcon, Users2Icon } from 'lucide-react'
-import { useRouter } from 'next/navigation'
 import { useEffect, useState } from 'react'
 
 import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
@@ -23,11 +22,11 @@ import { NavButton } from '@/components/ui/nav-button'
 import {
   Table,
   TableBody,
-  TableButton,
   TableCell,
   TableEmptyCell,
   TableHead,
   TableHeader,
+  TableLink,
   TableRow,
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
@@ -47,14 +46,13 @@ import type { Patient } from '@/types/patients.d.ts'
 import { formatDate } from '@/utils/formatters/format-date'
 import { formatPhoneNumber } from '@/utils/formatters/format-phone-number'
 
-import { PatientsListTableActions } from './actions'
-import PatientsListTableSkeleton from './skeleton'
+import { PatientsTableActions } from './actions'
+import PatientsTableSkeleton from './skeleton'
 
-export function PatientsListTable() {
+export function PatientsTable() {
   const [showFilters, setShowFilters] = useState(false)
   const [stableTotal, setStableTotal] = useState(0)
   const { getParam } = useParams()
-  const router = useRouter()
 
   const page = getParam(QUERY_PARAMS.page)
   const search = getParam(QUERY_PARAMS.search)
@@ -89,7 +87,8 @@ export function PatientsListTable() {
   })
 
   const patients = response?.data?.patients ?? []
-  const isEmpty = patients.length === 0
+  const showPatients = !isLoading && patients.length > 0
+  const showEmptyMessage = !isLoading && patients.length === 0
 
   // Update stable total only when we have actual data to prevent pagination flickering
   useEffect(() => {
@@ -150,7 +149,7 @@ export function PatientsListTable() {
           <TableHeader>
             <TableRow>
               <TableHead className='w-64'>Nome do paciente</TableHead>
-              <TableHead className='w-44'>Telefone</TableHead>
+              <TableHead className='w-64'>Telefone</TableHead>
               <TableHead>E-mail</TableHead>
               <TableHead className='w-28'>Status</TableHead>
               <TableHead className='w-40 whitespace-nowrap'>
@@ -160,28 +159,25 @@ export function PatientsListTable() {
             </TableRow>
           </TableHeader>
 
-          {isLoading && <PatientsListTableSkeleton />}
+          <TableBody>
+            {isLoading && <PatientsTableSkeleton />}
 
-          {!isLoading && !isEmpty && (
-            <TableBody>
-              {patients.map((patient) => {
+            {showPatients &&
+              patients.map((patient) => {
                 const status = PATIENT_STATUSES[patient.status]
                 return (
                   <TableRow key={patient.id}>
-                    <TableCell className='py-0'>
-                      <TableButton
+                    <TableCell>
+                      <TableLink
                         className='w-64'
-                        onClick={() =>
-                          router.push(
-                            ROUTES.dashboard.patients.details.info(patient.id),
-                          )
-                        }
+                        href={ROUTES.dashboard.patients.details.info(
+                          patient.id,
+                        )}
                       >
                         <Avatar className='size-9' src={patient.avatar_url} />
                         <span className='truncate'>{patient.name}</span>
-                      </TableButton>
+                      </TableLink>
                     </TableCell>
-
                     <TableCell>{formatPhoneNumber(patient.phone)}</TableCell>
                     <TableCell>{patient.email}</TableCell>
                     <TableCell>
@@ -191,23 +187,20 @@ export function PatientsListTable() {
                     </TableCell>
                     <TableCell>{formatDate(patient.created_at)}</TableCell>
                     <TableCell className='text-center'>
-                      <PatientsListTableActions patient={patient} />
+                      <PatientsTableActions patient={patient} />
                     </TableCell>
                   </TableRow>
                 )
               })}
-            </TableBody>
-          )}
 
-          {!isLoading && isEmpty && (
-            <TableBody>
+            {showEmptyMessage && (
               <TableRow>
                 <TableEmptyCell colSpan={6}>
                   Nenhum paciente encontrado
                 </TableEmptyCell>
               </TableRow>
-            </TableBody>
-          )}
+            )}
+          </TableBody>
         </Table>
       </Card>
 
diff --git a/src/modules/patients/table/skeleton.tsx b/src/modules/patients/table/skeleton.tsx
new file mode 100644
index 00000000..77fbeed0
--- /dev/null
+++ b/src/modules/patients/table/skeleton.tsx
@@ -0,0 +1,32 @@
+import { Skeleton } from '@/components/ui/skeleton'
+import { TableCell, TableRow } from '@/components/ui/table'
+
+export default function PatientsTableSkeleton() {
+  const skeletons = Array.from({ length: 10 }).map((_, index) => index)
+
+  return skeletons.map((skeleton) => (
+    <TableRow key={skeleton}>
+      <TableCell>
+        <div className='flex items-center gap-2'>
+          <Skeleton className='size-9 rounded-full' />
+          <Skeleton className='h-5 w-48 rounded-md' />
+        </div>
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-5 w-32 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-5 w-56 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-6 w-18 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-5 w-24 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='mx-auto size-8 rounded-md' />
+      </TableCell>
+    </TableRow>
+  ))
+}
diff --git a/src/modules/referrals/referral-button.tsx b/src/modules/referrals/new-referral-button.tsx
similarity index 50%
rename from src/modules/referrals/referral-button.tsx
rename to src/modules/referrals/new-referral-button.tsx
index 06946e35..4f97c517 100644
--- a/src/modules/referrals/referral-button.tsx
+++ b/src/modules/referrals/new-referral-button.tsx
@@ -1,32 +1,24 @@
 'use client'
 
-import { ForwardIcon } from 'lucide-react'
+import { ClipboardPasteIcon } from 'lucide-react'
 import { useState } from 'react'
 
 import { Dialog, DialogTrigger } from '@/components/ui/dialog'
 
 import type { ButtonProps } from '../../components/ui/button'
-import { ReferralPatientModal } from './referrals-modal'
+import { ReferralModal } from './referral-modal'
 
-interface ReferPatientButtonProps extends ButtonProps {
-  id?: string
-}
-export function ReferPatientButton({
-  id,
-  ...props
-}: Readonly<ReferPatientButtonProps>) {
+export function NewReferralButton(props: Readonly<ButtonProps>) {
   const [modalOpen, setModalOpen] = useState(false)
 
   return (
     <Dialog open={modalOpen} onOpenChange={setModalOpen}>
       <DialogTrigger {...props}>
-        <ForwardIcon />
+        <ClipboardPasteIcon />
         Encaminhar paciente
       </DialogTrigger>
 
-      {modalOpen && (
-        <ReferralPatientModal id={id} onClose={() => setModalOpen(false)} />
-      )}
+      {modalOpen && <ReferralModal onClose={() => setModalOpen(false)} />}
     </Dialog>
   )
 }
diff --git a/src/modules/referrals/referrals-modal.tsx b/src/modules/referrals/referral-modal.tsx
similarity index 52%
rename from src/modules/referrals/referrals-modal.tsx
rename to src/modules/referrals/referral-modal.tsx
index c7547c9b..7c855d39 100644
--- a/src/modules/referrals/referrals-modal.tsx
+++ b/src/modules/referrals/referral-modal.tsx
@@ -1,7 +1,7 @@
 'use client'
 
 import { zodResolver } from '@hookform/resolvers/zod'
-import { ForwardIcon } from 'lucide-react'
+import { SmilePlusIcon } from 'lucide-react'
 import { FormProvider, useForm } from 'react-hook-form'
 import { toast } from 'sonner'
 import { z } from 'zod'
@@ -24,127 +24,153 @@ import {
   DialogTitle,
 } from '@/components/ui/dialog'
 import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
-import {
-  PATIENT_CONDITION_ENUM,
-  PATIENT_CONDITION_OPTIONS,
-} from '@/enums/patients'
-import { SPECIALTIES_ENUM, SPECIALTIES_OPTIONS } from '@/enums/shared'
+import { PATIENT_CONDITION_OPTIONS } from '@/enums/patients'
+import { SPECIALTIES_OPTIONS } from '@/enums/shared'
 import { usePatientOptions } from '@/hooks/use-patient-otions'
 import { api } from '@/lib/api'
 import { queryClient } from '@/lib/tanstack-query'
+import {
+  dateSchema,
+  patientConditionSchema,
+  professionalNameSchema,
+  specialtySchema,
+} from '@/schemas'
+import type { Referral } from '@/types/referrals'
+
+const referralFormSchema = z.object({
+  patient_id: z.string().uuid('Paciente é obrigatório'),
+  date: dateSchema,
+  category: specialtySchema,
+  condition: patientConditionSchema,
+  annotation: z
+    .string()
+    .max(2000)
+    .nullable()
+    .transform((value) => (!value ? null : value)),
+  professional_name: professionalNameSchema,
+})
+type ReferralFormSchema = z.infer<typeof referralFormSchema>
 
 interface ReferralModalProps {
-  onClose(): void
-  id?: string
+  patientId?: string
+  referral?: Referral
+  onClose: () => void
 }
 
-export function ReferralPatientModal({ onClose, id }: ReferralModalProps) {
+export function ReferralModal({
+  patientId,
+  referral,
+  onClose,
+}: ReferralModalProps) {
   const { patientOptions } = usePatientOptions()
-  const referralFormSchema = z.object({
-    patient_id: z.string().uuid('Paciente é obrigatório'),
-    date: z.string().datetime('A data é obrigatória'),
-    category: z.enum(SPECIALTIES_ENUM, {
-      message: 'Categoria é obrigatório',
-    }),
-    condition: z.enum(PATIENT_CONDITION_ENUM, {
-      message: 'O quadro é obrigatório',
-    }),
-    annotation: z
-      .string()
-      .max(500)
-      .nullable()
-      .transform((value) => (!value ? null : value)),
-    referred_to: z
-      .string()
-      .nullable()
-      .transform((value) => (!value ? null : value)),
-  })
-  type ReferralsFormSchema = z.infer<typeof referralFormSchema>
 
-  const formMethods = useForm<ReferralsFormSchema>({
+  const isEditMode = !!referral
+
+  const formMethods = useForm<ReferralFormSchema>({
     resolver: zodResolver(referralFormSchema),
     defaultValues: {
-      patient_id: id ?? '',
-      date: '',
-      category: '',
-      referred_to: '',
-      condition: '',
-      annotation: '',
-    } as unknown as ReferralsFormSchema,
+      patient_id: patientId ?? (referral?.patient_id || ''),
+      date: referral?.date || '',
+      category: referral?.category || '',
+      condition: referral?.condition || '',
+      annotation: referral?.annotation || '',
+      professional_name: referral?.professional_name || '',
+    } as unknown as ReferralFormSchema,
     mode: 'onBlur',
   })
 
-  async function submitForm(data: ReferralsFormSchema) {
-    const response = await api('/referrals', {
+  function createReferral(data: ReferralFormSchema) {
+    return api('/referrals', {
       method: 'POST',
       body: JSON.stringify(data),
     })
+  }
+
+  function updateReferral({ date, condition, annotation }: ReferralFormSchema) {
+    return api(`/referrals/${referral?.id}`, {
+      method: 'PUT',
+      body: JSON.stringify({ date, condition, annotation }),
+    })
+  }
+
+  async function submitForm(data: ReferralFormSchema) {
+    const response = isEditMode
+      ? await updateReferral(data)
+      : await createReferral(data)
+
     if (!response.success) {
       toast.error(response.message)
       return
     }
+
     queryClient.invalidateQueries({
       queryKey: [QUERY_CACHE_KEYS.referrals.main],
     })
     revalidateCache(NEXT_CACHE_TAGS.patient(data.patient_id))
+    revalidateCache(NEXT_CACHE_TAGS.referrals.main)
+    revalidateCache(NEXT_CACHE_TAGS.statistics.totalReferrals.main)
     toast.success(response.message)
     onClose()
   }
 
   return (
-    <DialogContainer className='max-w-2xl'>
-      <DialogHeader icon={<DialogIcon icon={ForwardIcon} />}>
-        <DialogTitle>Encaminhar paciente</DialogTitle>
+    <DialogContainer className='max-w-xl'>
+      <DialogHeader icon={<DialogIcon icon={SmilePlusIcon} />}>
+        <DialogTitle>
+          {isEditMode ? 'Atualizar encaminhamento' : 'Encaminhar paciente'}
+        </DialogTitle>
       </DialogHeader>
 
       <DialogContent>
         <FormProvider {...formMethods}>
           <FormContainer
-            className='grid gap-4 sm:grid-cols-4'
+            className='grid gap-4 sm:grid-cols-2'
             onSubmit={formMethods.handleSubmit(submitForm)}
           >
             <ComboboxInput
               name='patient_id'
               label='Paciente'
-              className='sm:col-span-4'
-              placeholder='Selecione um paciente'
               options={patientOptions}
-              isRequired
-              readOnly={!!id}
-            />
-            <SelectInput
-              name='condition'
-              label='Quadro geral'
-              options={PATIENT_CONDITION_OPTIONS}
-              className='sm:col-span-2'
+              className='sm:col-span-full'
+              placeholder='Selecione um paciente'
+              readOnly={isEditMode || !!patientId}
               isRequired
             />
             <DateInput
               name='date'
-              label='Data do encaminhamento'
-              wrapperClassName='sm:col-span-2'
+              label='Data do atendimento'
+              wrapperClassName='sm:col-span-1'
               allowFutureDates
               isRequired
             />
-            <TextInput
-              name='referred_to'
-              label='Profissional responsável'
-              wrapperClassName='sm:col-span-2'
-            />
             <SelectInput
               name='category'
               label='Categoria'
               options={SPECIALTIES_OPTIONS}
-              className='sm:col-span-2'
+              className='sm:col-span-1'
+              readOnly={isEditMode}
               isRequired
             />
+            <SelectInput
+              name='condition'
+              label='Quadro geral'
+              options={PATIENT_CONDITION_OPTIONS}
+              className='sm:col-span-1'
+              isRequired
+            />
+            <TextInput
+              name='professional_name'
+              label='Profissional responsável'
+              wrapperClassName='sm:col-span-1'
+              readOnly={isEditMode}
+            />
             <TextareaInput
               rows={8}
-              maxLength={500}
+              maxLength={2000}
               name='annotation'
               label='Observações'
               placeholder='Insira observações sobre o paciente'
-              wrapperClassName='sm:col-span-4'
+              wrapperClassName='sm:col-span-full'
             />
           </FormContainer>
         </FormProvider>
@@ -156,9 +182,12 @@ export function ReferralPatientModal({ onClose, id }: ReferralModalProps) {
           loading={formMethods.formState.isSubmitting}
           onClick={formMethods.handleSubmit(submitForm)}
         >
-          Encaminhar
+          {isEditMode ? 'Atualizar' : 'Cadastrar'}
         </Button>
-        <DialogClose className='flex-1' variant='outline'>
+        <DialogClose
+          className='flex-1'
+          disabled={formMethods.formState.isSubmitting}
+        >
           Cancelar
         </DialogClose>
       </DialogFooter>

From d8411d959cad2cc3353d79b44c11b9f922f31515 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Thu, 5 Feb 2026 17:07:04 -0300
Subject: [PATCH 24/77] refactor(params): create params key to be used as query
 key

---
 src/hooks/params.ts                  | 1 +
 src/modules/patients/table/index.tsx | 5 ++---
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/hooks/params.ts b/src/hooks/params.ts
index ccad9183..8289bea2 100644
--- a/src/hooks/params.ts
+++ b/src/hooks/params.ts
@@ -44,6 +44,7 @@ export function useParams() {
 
   return {
     searchParams,
+    paramsQueryKey: searchParams.toString(),
     getParam,
     updateParams,
     clearParams,
diff --git a/src/modules/patients/table/index.tsx b/src/modules/patients/table/index.tsx
index d663b2b3..e9d6ae56 100644
--- a/src/modules/patients/table/index.tsx
+++ b/src/modules/patients/table/index.tsx
@@ -52,7 +52,7 @@ import PatientsTableSkeleton from './skeleton'
 export function PatientsTable() {
   const [showFilters, setShowFilters] = useState(false)
   const [stableTotal, setStableTotal] = useState(0)
-  const { getParam } = useParams()
+  const { getParam, paramsQueryKey } = useParams()
 
   const page = getParam(QUERY_PARAMS.page)
   const search = getParam(QUERY_PARAMS.search)
@@ -60,7 +60,6 @@ export function PatientsTable() {
   const orderBy = getParam(QUERY_PARAMS.orderBy)
   const startDate = getParam(QUERY_PARAMS.startDate)
   const endDate = getParam(QUERY_PARAMS.endDate)
-  const filterQueries = [page, search, orderBy, status, startDate, endDate]
 
   const ORDER_MAPPING: QueryOrderMapping<PatientsOrder, PatientsOrderBy> = {
     date_asc: { orderBy: 'date', order: 'ASC' },
@@ -72,7 +71,7 @@ export function PatientsTable() {
   }
 
   const { data: response, isLoading } = useQuery({
-    queryKey: [QUERY_CACHE_KEYS.patients.main, filterQueries],
+    queryKey: [QUERY_CACHE_KEYS.patients.main, paramsQueryKey],
     queryFn: () =>
       api<{ patients: Patient[]; total: number }>('/patients', {
         params: {

From adf66125eaef77616e17c4fd4936f94e4f3e3c54 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Thu, 5 Feb 2026 17:31:30 -0300
Subject: [PATCH 25/77] refactor(referrals): simplify period tab select

---
 src/app/(dashboard)/encaminhamentos/page.tsx |  4 +-
 src/components/ui/tab-select.tsx             | 50 ++++++++++----------
 src/modules/referrals/period-tab-select.tsx  | 25 ++++++++++
 src/modules/referrals/period-tab.tsx         | 42 ----------------
 src/store/period.ts                          |  6 +--
 5 files changed, 55 insertions(+), 72 deletions(-)
 create mode 100644 src/modules/referrals/period-tab-select.tsx
 delete mode 100644 src/modules/referrals/period-tab.tsx

diff --git a/src/app/(dashboard)/encaminhamentos/page.tsx b/src/app/(dashboard)/encaminhamentos/page.tsx
index 1cb2d050..c1ebba56 100644
--- a/src/app/(dashboard)/encaminhamentos/page.tsx
+++ b/src/app/(dashboard)/encaminhamentos/page.tsx
@@ -1,12 +1,12 @@
 import { ReferralsByCategoryCard } from '@/modules/referrals/by-category-card'
 import { ReferralsByCityCards } from '@/modules/referrals/by-city-cards'
-import { ReferralsPeriodTab } from '@/modules/referrals/period-tab'
+import { ReferralsPeriodTabSelect } from '@/modules/referrals/period-tab-select'
 import { ReferralsSummaryCard } from '@/modules/referrals/summary-card'
 
 export default function Page() {
   return (
     <div className='grid gap-6 sm:grid-cols-2'>
-      <ReferralsPeriodTab />
+      <ReferralsPeriodTabSelect />
 
       <ReferralsSummaryCard />
 
diff --git a/src/components/ui/tab-select.tsx b/src/components/ui/tab-select.tsx
index 29513c94..77e3c575 100644
--- a/src/components/ui/tab-select.tsx
+++ b/src/components/ui/tab-select.tsx
@@ -2,42 +2,42 @@ import type React from 'react'
 
 import { cn } from '@/utils/class-name-merge'
 
-import { Button, type ButtonProps } from './button'
+import { Button } from './button'
 
-export type TabSelectButton = ButtonProps & {
-  label: string
-  isActive?: boolean
-}
+type TabSelectOptions<T> = { label: string; value: T }
 
-interface TabSelectProps extends React.ComponentProps<'div'> {
-  buttons: TabSelectButton[]
+interface TabSelectProps<T> {
+  value?: T | null
+  options: TabSelectOptions<T>[]
+  onSelect: (value: T) => void
+  className?: string
 }
 
-export function TabSelect({
-  buttons,
+export function TabSelect<T>({
+  value,
+  options,
   className,
+  onSelect,
   ...props
-}: Readonly<TabSelectProps>) {
+}: Readonly<TabSelectProps<T>>) {
   return (
     <div
       className={cn('bg-border/40 flex h-10 gap-1 rounded-lg p-1', className)}
       {...props}
     >
-      {buttons.map(({ label, isActive, className, ...buttonProps }) => (
-        <Button
-          key={label}
-          variant='ghost'
-          data-active={isActive}
-          className={cn(
-            'text-foreground-soft hover:bg-background hover:text-foreground h-auto min-h-auto flex-1 rounded-md hover:shadow',
-            'data-[active=true]:bg-background data-[active=true]:text-foreground data-[active=true]:pointer-events-none data-[active=true]:shadow',
-            className,
-          )}
-          {...buttonProps}
-        >
-          {label}
-        </Button>
-      ))}
+      {options.map((option) => {
+        return (
+          <Button
+            key={option.label}
+            variant='ghost'
+            data-active={value === option.value}
+            onClick={() => onSelect(option.value)}
+            className='text-foreground-soft hover:bg-background hover:text-foreground data-[active=true]:bg-background data-[active=true]:text-foreground h-auto min-h-auto flex-1 rounded-md hover:shadow data-[active=true]:pointer-events-none data-[active=true]:shadow'
+          >
+            {option.label}
+          </Button>
+        )
+      })}
     </div>
   )
 }
diff --git a/src/modules/referrals/period-tab-select.tsx b/src/modules/referrals/period-tab-select.tsx
new file mode 100644
index 00000000..63d413b9
--- /dev/null
+++ b/src/modules/referrals/period-tab-select.tsx
@@ -0,0 +1,25 @@
+'use client'
+
+import { TabSelect } from '@/components/ui/tab-select'
+import type { QueryPeriod } from '@/enums/queries'
+import { usePeriodStore } from '@/store/period'
+
+export function ReferralsPeriodTabSelect() {
+  const { period, setPeriod } = usePeriodStore()
+
+  const options: Array<{ label: string; value: QueryPeriod }> = [
+    { label: 'Hoje', value: 'today' },
+    { label: 'Na última semana', value: 'last-week' },
+    { label: 'No último mês', value: 'last-month' },
+    { label: 'No último ano', value: 'last-year' },
+  ]
+
+  return (
+    <TabSelect<QueryPeriod>
+      value={period}
+      options={options}
+      onSelect={(value) => setPeriod(value)}
+      className='col-span-full'
+    />
+  )
+}
diff --git a/src/modules/referrals/period-tab.tsx b/src/modules/referrals/period-tab.tsx
deleted file mode 100644
index bd6ef2cb..00000000
--- a/src/modules/referrals/period-tab.tsx
+++ /dev/null
@@ -1,42 +0,0 @@
-'use client'
-
-import { TabSelect } from '@/components/ui/tab-select'
-import { usePeriodStore } from '@/store/period'
-
-export function ReferralsPeriodTab() {
-  const { period, setPeriod } = usePeriodStore()
-
-  const filterOptions = [
-    {
-      label: 'Hoje',
-      value: 'today',
-      isActive: period === 'today',
-    },
-    {
-      label: 'Na última semana',
-      value: 'last_week',
-      isActive: period === 'last_week',
-    },
-    {
-      label: 'No último mês',
-      value: 'last_month',
-      isActive: period === 'last_month',
-    },
-    {
-      label: 'No último ano',
-      value: 'last_year',
-      isActive: period === 'last_year',
-    },
-  ] as const
-
-  return (
-    <TabSelect
-      buttons={filterOptions.map((option) => ({
-        label: option.label,
-        isActive: option.value === period,
-        onClick: () => setPeriod(option.value),
-      }))}
-      className='col-span-full'
-    />
-  )
-}
diff --git a/src/store/period.ts b/src/store/period.ts
index 6d428dfa..454fbb29 100644
--- a/src/store/period.ts
+++ b/src/store/period.ts
@@ -1,10 +1,10 @@
 import { create } from 'zustand'
 
-export type Period = 'today' | 'last_week' | 'last_month' | 'last_year'
+import type { QueryPeriod } from '@/enums/queries'
 
 interface PeriodState {
-  period: Period
-  setPeriod: (period: Period) => void
+  period: QueryPeriod
+  setPeriod: (period: QueryPeriod) => void
 }
 
 export const usePeriodStore = create<PeriodState>((set) => ({

From 47a4e6f0eec2e1bcffb4bf5363404fc9278d8d72 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Thu, 5 Feb 2026 20:42:35 -0300
Subject: [PATCH 26/77] chore: hide incomplete pages

---
 .../aprovacoes-pendentes/page.tsx             |  0
 .../aprovados/page.tsx                        |  0
 .../envios-pendentes/page.tsx                 |  0
 .../{aprovacoes => _aprovacoes}/page.tsx      |  0
 .../[id]/{documentos => _documentos}/page.tsx |  0
 .../pacientes/[id]/atendimentos/page.tsx      | 22 +++++++++++++++++++
 .../pacientes/[id]/encaminhamentos/page.tsx   | 22 +++++++++++++++++++
 .../pacientes/[id]/historico/page.tsx         |  2 +-
 src/app/layout.tsx                            |  3 ++-
 src/components/sidebar/index.tsx              | 19 +++++++++++-----
 src/constants/routes.ts                       |  4 +++-
 src/constants/section-tab-buttons.ts          | 17 ++++++++++----
 12 files changed, 76 insertions(+), 13 deletions(-)
 rename src/app/(dashboard)/{aprovacoes => _aprovacoes}/aprovacoes-pendentes/page.tsx (100%)
 rename src/app/(dashboard)/{aprovacoes => _aprovacoes}/aprovados/page.tsx (100%)
 rename src/app/(dashboard)/{aprovacoes => _aprovacoes}/envios-pendentes/page.tsx (100%)
 rename src/app/(dashboard)/{aprovacoes => _aprovacoes}/page.tsx (100%)
 rename src/app/(dashboard)/pacientes/[id]/{documentos => _documentos}/page.tsx (100%)
 create mode 100644 src/app/(dashboard)/pacientes/[id]/atendimentos/page.tsx
 create mode 100644 src/app/(dashboard)/pacientes/[id]/encaminhamentos/page.tsx

diff --git a/src/app/(dashboard)/aprovacoes/aprovacoes-pendentes/page.tsx b/src/app/(dashboard)/_aprovacoes/aprovacoes-pendentes/page.tsx
similarity index 100%
rename from src/app/(dashboard)/aprovacoes/aprovacoes-pendentes/page.tsx
rename to src/app/(dashboard)/_aprovacoes/aprovacoes-pendentes/page.tsx
diff --git a/src/app/(dashboard)/aprovacoes/aprovados/page.tsx b/src/app/(dashboard)/_aprovacoes/aprovados/page.tsx
similarity index 100%
rename from src/app/(dashboard)/aprovacoes/aprovados/page.tsx
rename to src/app/(dashboard)/_aprovacoes/aprovados/page.tsx
diff --git a/src/app/(dashboard)/aprovacoes/envios-pendentes/page.tsx b/src/app/(dashboard)/_aprovacoes/envios-pendentes/page.tsx
similarity index 100%
rename from src/app/(dashboard)/aprovacoes/envios-pendentes/page.tsx
rename to src/app/(dashboard)/_aprovacoes/envios-pendentes/page.tsx
diff --git a/src/app/(dashboard)/aprovacoes/page.tsx b/src/app/(dashboard)/_aprovacoes/page.tsx
similarity index 100%
rename from src/app/(dashboard)/aprovacoes/page.tsx
rename to src/app/(dashboard)/_aprovacoes/page.tsx
diff --git a/src/app/(dashboard)/pacientes/[id]/documentos/page.tsx b/src/app/(dashboard)/pacientes/[id]/_documentos/page.tsx
similarity index 100%
rename from src/app/(dashboard)/pacientes/[id]/documentos/page.tsx
rename to src/app/(dashboard)/pacientes/[id]/_documentos/page.tsx
diff --git a/src/app/(dashboard)/pacientes/[id]/atendimentos/page.tsx b/src/app/(dashboard)/pacientes/[id]/atendimentos/page.tsx
new file mode 100644
index 00000000..f3297cac
--- /dev/null
+++ b/src/app/(dashboard)/pacientes/[id]/atendimentos/page.tsx
@@ -0,0 +1,22 @@
+import type { Metadata } from 'next'
+import { redirect } from 'next/navigation'
+
+import { ROUTES } from '@/constants/routes'
+
+export const metadata: Metadata = {
+  title: 'Atendimentos',
+}
+
+interface PageParams {
+  params: Promise<{ id: string }>
+}
+
+export default async function Page({ params }: Readonly<PageParams>) {
+  const patientId = (await params).id
+
+  if (!patientId) {
+    redirect(ROUTES.dashboard.patients.main)
+  }
+
+  return <div>Atendimentos do paciente</div>
+}
diff --git a/src/app/(dashboard)/pacientes/[id]/encaminhamentos/page.tsx b/src/app/(dashboard)/pacientes/[id]/encaminhamentos/page.tsx
new file mode 100644
index 00000000..ac65867a
--- /dev/null
+++ b/src/app/(dashboard)/pacientes/[id]/encaminhamentos/page.tsx
@@ -0,0 +1,22 @@
+import type { Metadata } from 'next'
+import { redirect } from 'next/navigation'
+
+import { ROUTES } from '@/constants/routes'
+
+export const metadata: Metadata = {
+  title: 'Encaminhamentos',
+}
+
+interface PageParams {
+  params: Promise<{ id: string }>
+}
+
+export default async function Page({ params }: Readonly<PageParams>) {
+  const patientId = (await params).id
+
+  if (!patientId) {
+    redirect(ROUTES.dashboard.patients.main)
+  }
+
+  return <div>Encaminhamentos do paciente</div>
+}
diff --git a/src/app/(dashboard)/pacientes/[id]/historico/page.tsx b/src/app/(dashboard)/pacientes/[id]/historico/page.tsx
index b1c163dc..616563f2 100644
--- a/src/app/(dashboard)/pacientes/[id]/historico/page.tsx
+++ b/src/app/(dashboard)/pacientes/[id]/historico/page.tsx
@@ -20,5 +20,5 @@ export default async function Page({
     redirect(ROUTES.dashboard.patients.main)
   }
 
-  return <div>Histórico do paciente {patientId}</div>
+  return <div>Histórico do paciente</div>
 }
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index b5096967..664c3a57 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -3,6 +3,7 @@ import './globals.css'
 import type { Metadata } from 'next'
 
 import { inter } from '@/lib/fonts'
+import { cn } from '@/utils/class-name-merge'
 
 import { Providers } from './providers'
 
@@ -20,7 +21,7 @@ export default function RootLayout({
 }: Readonly<{ children: React.ReactNode }>) {
   return (
     <html lang='pt-BR'>
-      <body className={`${inter.variable} antialiased`}>
+      <body className={cn('overflow-x-hidden antialiased', inter.variable)}>
         <Providers>{children}</Providers>
       </body>
     </html>
diff --git a/src/components/sidebar/index.tsx b/src/components/sidebar/index.tsx
index 24fc44e7..7694fa35 100644
--- a/src/components/sidebar/index.tsx
+++ b/src/components/sidebar/index.tsx
@@ -1,8 +1,8 @@
 import {
+  ClipboardListIcon,
   HeartHandshakeIcon,
   LayoutDashboardIcon,
   Share2Icon,
-  UserRoundCheckIcon,
   Users2Icon,
 } from 'lucide-react'
 
@@ -47,16 +47,22 @@ const SIDEBAR_SECTIONS = [
         icon: <Users2Icon />,
         path: ROUTES.dashboard.patients.main,
       },
+      {
+        label: 'Atendimentos',
+        icon: <ClipboardListIcon />,
+        path: ROUTES.dashboard.appointments.main,
+      },
       {
         label: 'Encaminhamentos',
         icon: <Share2Icon />,
         path: ROUTES.dashboard.referrals.main,
       },
-      {
-        label: 'Aprovações',
-        icon: <UserRoundCheckIcon />,
-        path: ROUTES.dashboard.approvals.pendingApprovals,
-      },
+      // TODO: uncomment approvals when it's ready
+      // {
+      //   label: 'Aprovações',
+      //   icon: <UserRoundCheckIcon />,
+      //   path: ROUTES.dashboard.approvals.pendingApprovals,
+      // },
       {
         label: 'Equipe',
         icon: <HeartHandshakeIcon />,
@@ -64,6 +70,7 @@ const SIDEBAR_SECTIONS = [
       },
     ],
   },
+  // TODO: uncomment utils when it's ready
   // {
   //   id: 'utils',
   //   links: [
diff --git a/src/constants/routes.ts b/src/constants/routes.ts
index 284b0859..574f81dd 100644
--- a/src/constants/routes.ts
+++ b/src/constants/routes.ts
@@ -26,8 +26,10 @@ export const ROUTES = {
       new: '/pacientes/cadastrar',
       details: {
         info: (id: string) => `/pacientes/${id}/informacoes`,
-        documents: (id: string) => `/pacientes/${id}/documentos`,
         history: (id: string) => `/pacientes/${id}/historico`,
+        documents: (id: string) => `/pacientes/${id}/documentos`,
+        referrals: (id: string) => `/pacientes/${id}/encaminhamentos`,
+        appointments: (id: string) => `/pacientes/${id}/atendimentos`,
       },
     },
     referrals: {
diff --git a/src/constants/section-tab-buttons.ts b/src/constants/section-tab-buttons.ts
index 2a95c5ee..d695a591 100644
--- a/src/constants/section-tab-buttons.ts
+++ b/src/constants/section-tab-buttons.ts
@@ -8,16 +8,25 @@ type TabButton = {
 export const SECTION_TAB_BUTTONS: Record<string, Array<TabButton>> = {
   pacientes: [
     {
-      title: 'Informações do paciente',
+      title: 'Informações',
       path: ROUTES.dashboard.patients.details.info,
     },
     {
-      title: 'Histórico do paciente',
+      title: 'Histórico',
       path: ROUTES.dashboard.patients.details.history,
     },
+    // TODO: uncomment documents when it's ready
+    // {
+    //   title: 'Documentos',
+    //   path: ROUTES.dashboard.patients.details.documents,
+    // },
     {
-      title: 'Documentos',
-      path: ROUTES.dashboard.patients.details.documents,
+      title: 'Atendimentos',
+      path: ROUTES.dashboard.patients.details.appointments,
+    },
+    {
+      title: 'Encaminhamentos',
+      path: ROUTES.dashboard.patients.details.referrals,
     },
   ],
   encaminhamentos: [

From 203feab1a597f4c78fa558878a2573b05fb07616 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 6 Feb 2026 15:06:22 -0300
Subject: [PATCH 27/77] feat(components): add label to bar chart tooltip

---
 src/components/charts/custom-tooltip.tsx | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/components/charts/custom-tooltip.tsx b/src/components/charts/custom-tooltip.tsx
index 45771f3d..f0e71763 100644
--- a/src/components/charts/custom-tooltip.tsx
+++ b/src/components/charts/custom-tooltip.tsx
@@ -4,15 +4,19 @@ export function CustomTooltip({ active, payload, coordinate }: any) {
 
   const { x, y } = coordinate
   const value = payload[0].value
+  const label = payload[0].payload.label
 
   return (
     <div>
       <div
-        className='bg-foreground text-background pointer-events-none absolute flex min-w-8 flex-col items-center rounded-md px-2 py-1.5 text-center text-sm transition-all duration-300 ease-out'
+        className='bg-foreground text-background pointer-events-none absolute flex flex-col items-center gap-2 rounded-md px-3 py-2 text-sm transition-all duration-300 ease-out'
         style={{ left: x, top: y, transform: 'translate(-50%, -155%)' }}
       >
-        {value}
-        <div className='bg-foreground absolute -bottom-0.5 -z-10 size-4 rotate-45' />
+        <div>
+          <span className='font-medium whitespace-nowrap'>{label}:</span>
+          <span className='ml-1 font-bold'>{value}</span>
+        </div>
+        <div className='bg-foreground absolute -bottom-0.5 -z-10 mx-auto size-4 rotate-45' />
       </div>
       <div
         className='bg-primary-soft border-background pointer-events-none absolute size-3 rounded-full border-2 transition-all duration-150 ease-out'

From e6aac64f73b9ee0d9e52b8592985b8098e6fdfc6 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 6 Feb 2026 16:23:08 -0300
Subject: [PATCH 28/77] feat(referrals): integrate main page with api

---
 .../statistics/get-total-referred-patients.ts | 46 ++++++++++
 .../listagem/referrals-table.tsx              | 29 +++----
 src/app/(dashboard)/encaminhamentos/page.tsx  | 10 ++-
 .../laudo-medico/medical-report-form.tsx      | 12 ++-
 .../triagem/seus-dados/patient-data-form.tsx  |  2 +-
 src/components/summary-card.tsx               | 10 ++-
 src/constants/cache.ts                        |  9 ++
 src/constants/charts.ts                       | 10 +++
 src/constants/enums.ts                        | 40 ---------
 src/enums/shared.ts                           | 40 ++++++++-
 src/hooks/cities.ts                           |  2 +-
 .../dashboard/patients-by-city-card.tsx       | 12 +--
 src/modules/patients/form.tsx                 |  6 +-
 src/modules/referrals/by-category-card.tsx    | 57 +++++++------
 src/modules/referrals/by-city-cards.tsx       | 75 -----------------
 src/modules/referrals/by-state-card.tsx       | 84 +++++++++++++++++++
 .../referred-patients-percentage-card.tsx     | 27 ++++++
 src/modules/referrals/summary-card.tsx        | 55 ------------
 .../referrals/total-referrals-card.tsx        | 31 +++++++
 src/modules/teams/table.tsx                   | 32 +++----
 src/schemas/index.tsx                         |  3 +-
 21 files changed, 331 insertions(+), 261 deletions(-)
 create mode 100644 src/actions/statistics/get-total-referred-patients.ts
 create mode 100644 src/constants/charts.ts
 delete mode 100644 src/constants/enums.ts
 delete mode 100644 src/modules/referrals/by-city-cards.tsx
 create mode 100644 src/modules/referrals/by-state-card.tsx
 create mode 100644 src/modules/referrals/referred-patients-percentage-card.tsx
 delete mode 100644 src/modules/referrals/summary-card.tsx
 create mode 100644 src/modules/referrals/total-referrals-card.tsx

diff --git a/src/actions/statistics/get-total-referred-patients.ts b/src/actions/statistics/get-total-referred-patients.ts
new file mode 100644
index 00000000..5d50f87b
--- /dev/null
+++ b/src/actions/statistics/get-total-referred-patients.ts
@@ -0,0 +1,46 @@
+'use server'
+
+import { DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS } from '@/config/cache'
+import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import type { QueryPeriod } from '@/enums/queries'
+import { api } from '@/lib/api'
+
+type GetTotalReferredPatientsParams = {
+  period?: QueryPeriod
+}
+
+interface GetTotalReferredPatientsProps {
+  params?: GetTotalReferredPatientsParams
+  cacheKey?: string
+}
+
+export async function getTotalReferredPatients({
+  params,
+  cacheKey,
+}: GetTotalReferredPatientsProps = {}) {
+  try {
+    const response = await api<{ total: number }>(
+      '/statistics/referred-patients-total',
+      {
+        includeCookies: true,
+        cache: 'force-cache',
+        params,
+        next: {
+          revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
+          tags: cacheKey
+            ? [NEXT_CACHE_TAGS.statistics.totalReferredPatients.main, cacheKey]
+            : [NEXT_CACHE_TAGS.statistics.totalReferredPatients.main],
+        },
+      },
+    )
+
+    if (!response.data) {
+      return null
+    }
+
+    return response.data
+  } catch (error) {
+    console.error('Failed to fetch total referred patients:', error)
+    return null
+  }
+}
diff --git a/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx b/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
index 1dbceee9..c7adbe52 100644
--- a/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
+++ b/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
@@ -115,28 +115,23 @@ export function ReferralsTable() {
   const [isReferralsEmpty] = useState<boolean>(referrals.length <= 0)
   const [statusFilter, setStatusFilter] = useState<string>('all')
 
-  const filterOptions = [
-    {
-      label: 'Todos',
-      isActive: statusFilter === 'all',
-      onClick: () => setStatusFilter('all'),
-    },
-    {
-      label: 'Em surto',
-      isActive: statusFilter === 'outbreak',
-      onClick: () => setStatusFilter('outbreak'),
-    },
-    {
-      label: 'Estável',
-      isActive: statusFilter === 'stable',
-      onClick: () => setStatusFilter('stable'),
-    },
+  const filterOptions: Array<{
+    label: string
+    value: PatientCondition | 'all'
+  }> = [
+    { label: 'Todos', value: 'all' },
+    { label: 'Em surto', value: 'in_crisis' },
+    { label: 'Estável', value: 'stable' },
   ]
 
   return (
     <div className='space-y-6'>
       <SectionHeader>
-        <TabSelect buttons={filterOptions} />
+        <TabSelect
+          value={statusFilter}
+          options={filterOptions}
+          onSelect={(value) => setStatusFilter(value)}
+        />
         <SectionHeaderActions>
           <SearchInput placeholder='Pesquisar' />
           <FilterSelect
diff --git a/src/app/(dashboard)/encaminhamentos/page.tsx b/src/app/(dashboard)/encaminhamentos/page.tsx
index c1ebba56..52ee9b3f 100644
--- a/src/app/(dashboard)/encaminhamentos/page.tsx
+++ b/src/app/(dashboard)/encaminhamentos/page.tsx
@@ -1,17 +1,19 @@
 import { ReferralsByCategoryCard } from '@/modules/referrals/by-category-card'
-import { ReferralsByCityCards } from '@/modules/referrals/by-city-cards'
+import { ReferralsByStateCard } from '@/modules/referrals/by-state-card'
 import { ReferralsPeriodTabSelect } from '@/modules/referrals/period-tab-select'
-import { ReferralsSummaryCard } from '@/modules/referrals/summary-card'
+import { ReferredPatientsPercentageCard } from '@/modules/referrals/referred-patients-percentage-card'
+import { TotalReferralsCard } from '@/modules/referrals/total-referrals-card'
 
 export default function Page() {
   return (
     <div className='grid gap-6 sm:grid-cols-2'>
       <ReferralsPeriodTabSelect />
 
-      <ReferralsSummaryCard />
+      <TotalReferralsCard />
+      <ReferredPatientsPercentageCard />
 
       <ReferralsByCategoryCard />
-      <ReferralsByCityCards />
+      <ReferralsByStateCard />
     </div>
   )
 }
diff --git a/src/app/_paciente/triagem/laudo-medico/medical-report-form.tsx b/src/app/_paciente/triagem/laudo-medico/medical-report-form.tsx
index d5a95d57..bf89b75f 100644
--- a/src/app/_paciente/triagem/laudo-medico/medical-report-form.tsx
+++ b/src/app/_paciente/triagem/laudo-medico/medical-report-form.tsx
@@ -10,10 +10,9 @@ import { FormField } from '@/components/form/form-field'
 import { RadioInput } from '@/components/form/radio-input'
 import { TextInput } from '@/components/form/text-input'
 import { Button } from '@/components/ui/button'
-import { YES_OR_NO } from '@/constants/enums'
 import { ROUTES } from '@/constants/routes'
 import { PATIENT_STORAGE_KEYS } from '@/constants/storage-keys'
-import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
+import { YES_OR_NO_OPTIONS } from '@/enums/shared'
 
 import { useScreening } from '../hooks'
 import {
@@ -36,7 +35,6 @@ export function ScreeningMedicalReportForm() {
   const { setValue, watch } = formMethods
   const hasDisability = watch('has_disability') === 'yes'
   const takeMedication = watch('take_medication') === 'yes'
-  const yesOrNoOptions = convertObjectToOptions(YES_OR_NO)
 
   useEffect(() => {
     const savedFormData = getStoredFormData(screeningMedicalReportFormSchema)
@@ -65,7 +63,7 @@ export function ScreeningMedicalReportForm() {
             name='has_disability'
             label='Você possui alguma deficiência?'
             isRequired
-            options={yesOrNoOptions}
+            options={YES_OR_NO_OPTIONS}
           />
           {hasDisability && (
             <TextInput
@@ -79,7 +77,7 @@ export function ScreeningMedicalReportForm() {
           name='need_legal_assistance'
           label='Precisa de assistência legal?'
           isRequired
-          options={yesOrNoOptions}
+          options={YES_OR_NO_OPTIONS}
         />
 
         <FormField>
@@ -87,7 +85,7 @@ export function ScreeningMedicalReportForm() {
             name='take_medication'
             label='Faz uso de medicamentos?'
             isRequired
-            options={yesOrNoOptions}
+            options={YES_OR_NO_OPTIONS}
           />
           {takeMedication && (
             <TextInput name='medication_desc' label='Quais medicamentos?' />
@@ -98,7 +96,7 @@ export function ScreeningMedicalReportForm() {
           name='has_nmo_diagnosis'
           label='Você possui um Diagnóstico de NMO?'
           isRequired
-          options={yesOrNoOptions}
+          options={YES_OR_NO_OPTIONS}
         />
 
         <div className='mt-6 flex flex-col gap-2 md:flex-row-reverse'>
diff --git a/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx b/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
index 513895ea..d8b2dde6 100644
--- a/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
+++ b/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
@@ -10,10 +10,10 @@ import { FormContainer } from '@/components/form/form-container'
 import { SelectInput } from '@/components/form/select-input'
 import { TextInput } from '@/components/form/text-input'
 import { Button } from '@/components/ui/button'
-import { BRAZILIAN_STATES_OPTIONS, type UF } from '@/constants/enums'
 import { ROUTES } from '@/constants/routes'
 import { PATIENT_STORAGE_KEYS } from '@/constants/storage-keys'
 import { PATIENT_GENDER_OPTIONS } from '@/enums/patients'
+import { BRAZILIAN_STATES_OPTIONS, type UF } from '@/enums/shared'
 import { useCities } from '@/hooks/cities'
 
 import { useScreening } from '../hooks'
diff --git a/src/components/summary-card.tsx b/src/components/summary-card.tsx
index afab3fee..1b51327a 100644
--- a/src/components/summary-card.tsx
+++ b/src/components/summary-card.tsx
@@ -3,11 +3,13 @@ import type { LucideIcon } from 'lucide-react'
 import { cn } from '@/utils/class-name-merge'
 
 import { Card, type CardProps } from './ui/card'
+import { Skeleton } from './ui/skeleton'
 
 interface SummaryCardProps extends CardProps {
   label: string
   icon: LucideIcon
   value?: number | string
+  loading?: boolean
 }
 
 export function SummaryCard({
@@ -15,6 +17,7 @@ export function SummaryCard({
   icon: Icon,
   value = 0,
   className,
+  loading,
   ...props
 }: Readonly<SummaryCardProps>) {
   return (
@@ -26,7 +29,12 @@ export function SummaryCard({
       {...props}
     >
       <div className='flex items-center justify-between'>
-        <span className='text-4xl font-semibold'>{value}</span>
+        {loading ? (
+          <Skeleton className='size-10' />
+        ) : (
+          <span className='text-4xl font-semibold'>{value}</span>
+        )}
+
         <div className='border-border text-primary rounded-full border p-2 [&_svg]:size-5'>
           <Icon />
         </div>
diff --git a/src/constants/cache.ts b/src/constants/cache.ts
index 47f0ee19..8efd4bd7 100644
--- a/src/constants/cache.ts
+++ b/src/constants/cache.ts
@@ -22,6 +22,10 @@ export const NEXT_CACHE_TAGS = {
       main: 'total-referrals',
       query: (query: string) => `total-referrals/${query}`,
     },
+    totalReferredPatients: {
+      main: 'total-referred-patients',
+      query: (query: string) => `total-referred-patients/${query}`,
+    },
   },
 }
 
@@ -45,5 +49,10 @@ export const QUERY_CACHE_KEYS = {
     pending: 'approvals-pending',
     approved: 'approvals-approved',
   },
+  statistics: {
+    totalReferrals: 'total-referrals',
+    referralsByCategory: 'referrals-by-category',
+    referralsByState: 'referrals-by-state',
+  },
   profile: 'profile',
 }
diff --git a/src/constants/charts.ts b/src/constants/charts.ts
new file mode 100644
index 00000000..3ebd64fe
--- /dev/null
+++ b/src/constants/charts.ts
@@ -0,0 +1,10 @@
+export const CHART_PIE_COLORS = [
+  '#0d9488',
+  '#dc2626',
+  '#9333ea',
+  '#ca8a04',
+  '#84cc16',
+  '#f97316',
+  '#2563eb',
+  '#ec4899',
+]
diff --git a/src/constants/enums.ts b/src/constants/enums.ts
deleted file mode 100644
index 783698a7..00000000
--- a/src/constants/enums.ts
+++ /dev/null
@@ -1,40 +0,0 @@
-import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
-
-export const YES_OR_NO = {
-  yes: 'Sim',
-  no: 'Não',
-} as const
-export const YES_OR_NO_TUPLE = Object.keys(YES_OR_NO) as ['yes', 'no']
-export const YES_OR_NO_OPTIONS = convertObjectToOptions(YES_OR_NO)
-
-export const UF_LIST = {
-  AC: 'Acre',
-  AP: 'Amapá',
-  AL: 'Alagoas',
-  AM: 'Amazonas',
-  BA: 'Bahia',
-  CE: 'Ceará',
-  DF: 'Distrito Federal',
-  ES: 'Espírito Santo',
-  GO: 'Goiás',
-  MA: 'Maranhão',
-  MT: 'Mato Grosso',
-  MS: 'Mato Grosso do Sul',
-  MG: 'Minas Gerais',
-  PA: 'Pará',
-  PB: 'Paraíba',
-  PR: 'Paraná',
-  PE: 'Pernambuco',
-  PI: 'Piauí',
-  RJ: 'Rio de Janeiro',
-  RN: 'Rio Grande do Norte',
-  RS: 'Rio Grande do Sul',
-  RO: 'Rondônia',
-  RR: 'Roraima',
-  SC: 'Santa Catarina',
-  SP: 'São Paulo',
-  SE: 'Sergipe',
-  TO: 'Tocantins',
-}
-export type UF = keyof typeof UF_LIST
-export const BRAZILIAN_STATES_OPTIONS = convertObjectToOptions(UF_LIST)
diff --git a/src/enums/shared.ts b/src/enums/shared.ts
index 7d1735f0..4481c4e9 100644
--- a/src/enums/shared.ts
+++ b/src/enums/shared.ts
@@ -15,5 +15,43 @@ export const SPECIALTIES = {
 export type Specialty = keyof typeof SPECIALTIES
 
 export const SPECIALTIES_OPTIONS = convertObjectToOptions(SPECIALTIES)
-
 export const SPECIALTIES_ENUM = Object.keys(SPECIALTIES) as [Specialty]
+
+export const UF_LIST = {
+  AC: 'Acre',
+  AP: 'Amapá',
+  AL: 'Alagoas',
+  AM: 'Amazonas',
+  BA: 'Bahia',
+  CE: 'Ceará',
+  DF: 'Distrito Federal',
+  ES: 'Espírito Santo',
+  GO: 'Goiás',
+  MA: 'Maranhão',
+  MT: 'Mato Grosso',
+  MS: 'Mato Grosso do Sul',
+  MG: 'Minas Gerais',
+  PA: 'Pará',
+  PB: 'Paraíba',
+  PR: 'Paraná',
+  PE: 'Pernambuco',
+  PI: 'Piauí',
+  RJ: 'Rio de Janeiro',
+  RN: 'Rio Grande do Norte',
+  RS: 'Rio Grande do Sul',
+  RO: 'Rondônia',
+  RR: 'Roraima',
+  SC: 'Santa Catarina',
+  SP: 'São Paulo',
+  SE: 'Sergipe',
+  TO: 'Tocantins',
+}
+export type UF = keyof typeof UF_LIST
+export const BRAZILIAN_STATES_OPTIONS = convertObjectToOptions(UF_LIST)
+
+export const YES_OR_NO = {
+  yes: 'Sim',
+  no: 'Não',
+} as const
+export const YES_OR_NO_TUPLE = Object.keys(YES_OR_NO) as ['yes', 'no']
+export const YES_OR_NO_OPTIONS = convertObjectToOptions(YES_OR_NO)
diff --git a/src/hooks/cities.ts b/src/hooks/cities.ts
index 5d555330..d601028a 100644
--- a/src/hooks/cities.ts
+++ b/src/hooks/cities.ts
@@ -4,7 +4,7 @@ import { useMemo } from 'react'
 
 import type { SelectOption } from '@/components/ui/select'
 import { CITIES_BY_UF } from '@/constants/cities'
-import type { UF } from '@/constants/enums'
+import type { UF } from '@/enums/shared'
 
 export function useCities(uf: UF) {
   const cities = useMemo<SelectOption[]>(() => {
diff --git a/src/modules/dashboard/patients-by-city-card.tsx b/src/modules/dashboard/patients-by-city-card.tsx
index f989f2d4..c3f28b45 100644
--- a/src/modules/dashboard/patients-by-city-card.tsx
+++ b/src/modules/dashboard/patients-by-city-card.tsx
@@ -9,6 +9,7 @@ import { DashboardCardChart } from '@/components/dashboard/cards/chart'
 import { SelectPeriod } from '@/components/select-period'
 import { Skeleton } from '@/components/ui/skeleton'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { CHART_PIE_COLORS } from '@/constants/charts'
 import { type QueryPeriod } from '@/enums/queries'
 import { api } from '@/lib/api'
 
@@ -33,19 +34,10 @@ export function DashboardPatientsByCityCard() {
   const cities = response?.data?.cities ?? []
   const isEmpty = cities.length === 0 && !isLoading
 
-  const PIE_COLORS = [
-    '#E255F2',
-    '#DF1C41',
-    '#0F37E0',
-    '#008B62',
-    '#F17B2C',
-    '#F2AE40',
-  ]
-
   const data = cities.map((item, index) => ({
     label: item.city,
     value: Number(item.percentage),
-    color: PIE_COLORS[index],
+    color: CHART_PIE_COLORS[index],
   }))
 
   return (
diff --git a/src/modules/patients/form.tsx b/src/modules/patients/form.tsx
index 872bb43c..1f5130ad 100644
--- a/src/modules/patients/form.tsx
+++ b/src/modules/patients/form.tsx
@@ -22,13 +22,13 @@ import { TextInput } from '@/components/form/text-input'
 import { Button } from '@/components/ui/button'
 import { Divider } from '@/components/ui/divider'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { ROUTES } from '@/constants/routes'
+import { PATIENT_GENDER_OPTIONS } from '@/enums/patients'
 import {
   BRAZILIAN_STATES_OPTIONS,
   type UF,
   YES_OR_NO_OPTIONS,
-} from '@/constants/enums'
-import { ROUTES } from '@/constants/routes'
-import { PATIENT_GENDER_OPTIONS } from '@/enums/patients'
+} from '@/enums/shared'
 import { useCities } from '@/hooks/cities'
 import { api } from '@/lib/api'
 import { queryClient } from '@/lib/tanstack-query'
diff --git a/src/modules/referrals/by-category-card.tsx b/src/modules/referrals/by-category-card.tsx
index 20372b2b..27d67b01 100644
--- a/src/modules/referrals/by-category-card.tsx
+++ b/src/modules/referrals/by-category-card.tsx
@@ -1,44 +1,53 @@
 'use client'
 
+import { useQuery } from '@tanstack/react-query'
 import { ChartBarDecreasingIcon } from 'lucide-react'
 
 import { BarChart } from '@/components/charts/bar'
 import { DashboardCardChart } from '@/components/dashboard/cards/chart'
+import { Skeleton } from '@/components/ui/skeleton'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { SPECIALTIES, type Specialty } from '@/enums/shared'
+import { api } from '@/lib/api'
+import { usePeriodStore } from '@/store/period'
+
+export function ReferralsByCategoryCard() {
+  const { period } = usePeriodStore()
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.statistics.referralsByCategory, period],
+    queryFn: () =>
+      api<{ categories: Array<{ category: Specialty; total: number }> }>(
+        '/statistics/referrals-by-category',
+        { params: { period } },
+      ),
+  })
+
+  const categories = response?.data?.categories ?? []
+  const isEmpty = categories.length === 0 && !isLoading
+
+  const data = categories.map((item) => ({
+    label: SPECIALTIES[item.category],
+    value: Number(item.total),
+  }))
 
-const MOCK_DATA = [
-  { label: 'Advogado', value: 15 },
-  { label: 'Enfermeiro', value: 30 },
-  { label: 'Fisioterapeuta', value: 22 },
-  { label: 'Médico', value: 45 },
-  { label: 'Neurologista', value: 15 },
-  { label: 'Nutricionista', value: 18 },
-  { label: 'Oftalmologista', value: 11 },
-  { label: 'Psicólogo', value: 35 },
-  { label: 'Psiquiatra', value: 55 },
-  { label: 'Serviço social', value: 8 },
-]
-
-const isEmpty = MOCK_DATA.length === 0
-
-export function ReferralsByCategoryCard(
-  props: Readonly<React.ComponentProps<'div'>>,
-) {
   return (
     <DashboardCardChart
-      icon={ChartBarDecreasingIcon}
       title='Encaminhamentos por categoria'
-      {...props}
+      icon={ChartBarDecreasingIcon}
     >
-      <div className='flex h-full min-h-72 items-center justify-center'>
-        {!isEmpty && (
+      <div className='flex h-full min-h-60 items-center justify-center'>
+        {isLoading && <Skeleton className='bg-border/75 size-full' />}
+
+        {!isLoading && !isEmpty && (
           <div className='size-full min-h-40'>
-            <BarChart data={MOCK_DATA} />
+            <BarChart data={data} />
           </div>
         )}
 
         {isEmpty && (
           <p className='text-foreground-soft text-sm'>
-            Nenhum encaminhamento por especialista registrado.
+            Nenhum encaminhamento registrado neste período.
           </p>
         )}
       </div>
diff --git a/src/modules/referrals/by-city-cards.tsx b/src/modules/referrals/by-city-cards.tsx
deleted file mode 100644
index de4cee99..00000000
--- a/src/modules/referrals/by-city-cards.tsx
+++ /dev/null
@@ -1,75 +0,0 @@
-'use client'
-
-import { ChartPieIcon } from 'lucide-react'
-
-import { PieChart } from '@/components/charts/pie'
-import { DashboardCardChart } from '@/components/dashboard/cards/chart'
-
-const PIE_COLORS = [
-  '#E255F2',
-  '#DF1C41',
-  '#0F37E0',
-  '#008B62',
-  '#F17B2C',
-  '#F2AE40',
-  '#3AB795',
-  '#8C6DFD',
-]
-
-const MOCK_DATA = {
-  cities: [
-    { city: 'São Paulo', percentage: 45 },
-    { city: 'Rio de Janeiro', percentage: 25 },
-    { city: 'São José do Rio Preto', percentage: 15 },
-    { city: 'Salvador', percentage: 8 },
-    { city: 'Fortaleza', percentage: 5 },
-    { city: 'Curitiba', percentage: 5 },
-    { city: 'Recife', percentage: 34 },
-    { city: 'Porto Alegre', percentage: 18 },
-  ],
-}
-
-const data = MOCK_DATA.cities.map((item, index) => ({
-  label: item.city,
-  value: item.percentage,
-  color: PIE_COLORS[index],
-}))
-
-export function ReferralsByCityCards(
-  props: Readonly<React.ComponentProps<'div'>>,
-) {
-  return (
-    <DashboardCardChart
-      icon={ChartPieIcon}
-      title='Localização dos pacientes'
-      {...props}
-    >
-      <div className='flex size-full items-center gap-6 xl:gap-10'>
-        <PieChart
-          data={data}
-          label='cidades'
-          total={10}
-          className='size-40 xl:size-48'
-        />
-
-        <div className='divide-border min-w-0 flex-1 divide-y'>
-          {data.map((city) => {
-            return (
-              <div
-                key={city.label}
-                className='text-foreground-soft flex items-center gap-2 py-1 text-sm'
-              >
-                <div
-                  className='size-2.5 shrink-0 rounded-full'
-                  style={{ backgroundColor: city.color }}
-                />
-                <span className='flex-1 truncate'>{city.label}</span>
-                <span className='font-semibold'>{city.value}%</span>
-              </div>
-            )
-          })}
-        </div>
-      </div>
-    </DashboardCardChart>
-  )
-}
diff --git a/src/modules/referrals/by-state-card.tsx b/src/modules/referrals/by-state-card.tsx
new file mode 100644
index 00000000..0611a841
--- /dev/null
+++ b/src/modules/referrals/by-state-card.tsx
@@ -0,0 +1,84 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query'
+import { ChartPieIcon } from 'lucide-react'
+
+import { PieChart } from '@/components/charts/pie'
+import { DashboardCardChart } from '@/components/dashboard/cards/chart'
+import { Skeleton } from '@/components/ui/skeleton'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { CHART_PIE_COLORS } from '@/constants/charts'
+import { type UF, UF_LIST } from '@/enums/shared'
+import { api } from '@/lib/api'
+import { usePeriodStore } from '@/store/period'
+
+export function ReferralsByStateCard() {
+  const { period } = usePeriodStore()
+
+  const limit = 10
+  const withPercentage = true
+  const queries = [period, limit, withPercentage]
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.statistics.referralsByState, queries],
+    queryFn: () =>
+      api<{
+        states: Array<{ state: UF; total: number; percentage: number }>
+        total: number
+      }>('/statistics/referrals-by-state', {
+        params: { period, limit, withPercentage },
+      }),
+  })
+
+  const states = response?.data?.states ?? []
+  const isEmpty = states.length === 0 && !isLoading
+
+  const data = states.map((item, index) => ({
+    label: UF_LIST[item.state],
+    value: Number(item.percentage),
+    color: CHART_PIE_COLORS[index],
+  }))
+
+  return (
+    <DashboardCardChart title='Localização dos pacientes' icon={ChartPieIcon}>
+      <div className='flex h-full min-h-60 items-center justify-center'>
+        {isLoading && <Skeleton className='bg-border/75 size-full' />}
+
+        {!isLoading && !isEmpty && (
+          <div className='flex size-full items-center gap-6 xl:gap-10'>
+            <PieChart
+              data={data}
+              label='Estados'
+              total={response?.data?.total}
+              className='size-40'
+            />
+
+            <div className='divide-border min-w-0 flex-1 divide-y'>
+              {data.map((state) => {
+                return (
+                  <div
+                    key={state.label}
+                    className='text-foreground-soft flex items-center gap-2 py-1 text-sm'
+                  >
+                    <div
+                      className='size-2.5 shrink-0 rounded-full'
+                      style={{ backgroundColor: state.color }}
+                    />
+                    <span className='flex-1 truncate'>{state.label}</span>
+                    <span className='font-semibold'>{state.value}%</span>
+                  </div>
+                )
+              })}
+            </div>
+          </div>
+        )}
+
+        {isEmpty && (
+          <p className='text-foreground-soft text-sm'>
+            Nenhum encaminhamento registrado neste período.
+          </p>
+        )}
+      </div>
+    </DashboardCardChart>
+  )
+}
diff --git a/src/modules/referrals/referred-patients-percentage-card.tsx b/src/modules/referrals/referred-patients-percentage-card.tsx
new file mode 100644
index 00000000..9fb0e04d
--- /dev/null
+++ b/src/modules/referrals/referred-patients-percentage-card.tsx
@@ -0,0 +1,27 @@
+import { Users2Icon } from 'lucide-react'
+
+import { getTotalReferrals } from '@/actions/statistics/get-total-referrals'
+import { getTotalReferredPatients } from '@/actions/statistics/get-total-referred-patients'
+import { SummaryCard } from '@/components/summary-card'
+
+export async function ReferredPatientsPercentageCard() {
+  const [totalReferrals, totalReferredPatients] = await Promise.all([
+    getTotalReferrals(),
+    getTotalReferredPatients(),
+  ])
+
+  const totalReferralsValue = totalReferrals?.total ?? 0
+  const totalReferredPatientsValue = totalReferredPatients?.total ?? 0
+
+  const referredPatientsPercentage =
+    (totalReferredPatientsValue / totalReferralsValue) * 100
+
+  return (
+    <SummaryCard
+      icon={Users2Icon}
+      label='Pacientes encaminhados'
+      value={`${referredPatientsPercentage.toFixed(1)}%`}
+      className='sm:col-span-1'
+    />
+  )
+}
diff --git a/src/modules/referrals/summary-card.tsx b/src/modules/referrals/summary-card.tsx
deleted file mode 100644
index 3cc7eba9..00000000
--- a/src/modules/referrals/summary-card.tsx
+++ /dev/null
@@ -1,55 +0,0 @@
-import { HeartPulse, Waypoints } from 'lucide-react'
-
-import { Card } from '@/components/ui/card'
-
-export function ReferralsSummaryCard() {
-  const statistics = [
-    {
-      value: 50,
-      label: 'referrals',
-    },
-    {
-      value: `${70}%`,
-      label: 'patients',
-    },
-  ] as const
-
-  const STATISTICS_MAPPING = {
-    referrals: {
-      title: (
-        <>
-          Total de <strong>encaminhamentos</strong>
-        </>
-      ),
-      icon: Waypoints,
-    },
-    patients: {
-      title: (
-        <>
-          Total de <strong>pacientes com encaminhamento</strong>
-        </>
-      ),
-      icon: HeartPulse,
-    },
-  } as const
-
-  return statistics.map((statistic) => {
-    const data = STATISTICS_MAPPING[statistic.label]
-    const Icon = data.icon
-
-    return (
-      <Card
-        key={statistic.label}
-        className='flex min-h-28 flex-col justify-between gap-3 p-6'
-      >
-        <div className='flex items-center justify-between'>
-          <span className='text-4xl font-semibold'>{statistic.value}</span>
-          <div className='border-border rounded-full border p-2 [&_svg]:size-5'>
-            <Icon />
-          </div>
-        </div>
-        <p className='text-foreground-soft text-xs uppercase'>{data.title}</p>
-      </Card>
-    )
-  })
-}
diff --git a/src/modules/referrals/total-referrals-card.tsx b/src/modules/referrals/total-referrals-card.tsx
new file mode 100644
index 00000000..66ff9411
--- /dev/null
+++ b/src/modules/referrals/total-referrals-card.tsx
@@ -0,0 +1,31 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query'
+import { ClipboardPasteIcon } from 'lucide-react'
+
+import { SummaryCard } from '@/components/summary-card'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { api } from '@/lib/api'
+import { usePeriodStore } from '@/store/period'
+
+export function TotalReferralsCard() {
+  const { period } = usePeriodStore()
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.statistics.totalReferrals, period],
+    queryFn: () =>
+      api<{ total: number }>('/statistics/referrals-total', {
+        params: { period },
+      }),
+  })
+
+  return (
+    <SummaryCard
+      icon={ClipboardPasteIcon}
+      label='Encaminhamentos'
+      value={response?.data?.total}
+      className='sm:col-span-1'
+      loading={isLoading}
+    />
+  )
+}
diff --git a/src/modules/teams/table.tsx b/src/modules/teams/table.tsx
index b04df918..8af0c0ee 100644
--- a/src/modules/teams/table.tsx
+++ b/src/modules/teams/table.tsx
@@ -40,12 +40,12 @@ import { TEAMS_ORDER_OPTIONS } from '@/enums/team'
 import { formatDate } from '@/utils/formatters/format-date'
 import { TEAMS_MOCK } from '@/utils/mock/teams'
 
+type Status = 'all' | 'active' | 'inactive'
+
 export function TeamListTable() {
   const members = TEAMS_MOCK
 
-  const [statusFilter, setStatusFilter] = useState<
-    'all' | 'active' | 'inactive'
-  >('all')
+  const [statusFilter, setStatusFilter] = useState<Status>('all')
 
   const filteredMembers = members.filter((member) => {
     if (statusFilter === 'all') {
@@ -54,28 +54,20 @@ export function TeamListTable() {
     return member.status === statusFilter
   })
 
-  const filterOptions = [
-    {
-      label: 'Todos',
-      isActive: statusFilter === 'all',
-      onClick: () => setStatusFilter('all'),
-    },
-    {
-      label: 'Ativos',
-      isActive: statusFilter === 'active',
-      onClick: () => setStatusFilter('active'),
-    },
-    {
-      label: 'Inativos',
-      isActive: statusFilter === 'inactive',
-      onClick: () => setStatusFilter('inactive'),
-    },
+  const filterOptions: Array<{ label: string; value: Status }> = [
+    { label: 'Todos', value: 'all' },
+    { label: 'Ativos', value: 'active' },
+    { label: 'Inativos', value: 'inactive' },
   ]
 
   return (
     <>
       <SectionHeader>
-        <TabSelect buttons={filterOptions} />
+        <TabSelect
+          value={statusFilter}
+          onSelect={(value) => setStatusFilter(value)}
+          options={filterOptions}
+        />
 
         <SectionHeaderActions>
           <SearchInput placeholder='Pesquisar...' className='w-48' />
diff --git a/src/schemas/index.tsx b/src/schemas/index.tsx
index cdf55bbf..5f5161b0 100644
--- a/src/schemas/index.tsx
+++ b/src/schemas/index.tsx
@@ -1,6 +1,5 @@
 import { z } from 'zod'
 
-import { UF_LIST, YES_OR_NO_TUPLE } from '@/constants/enums'
 import {
   CPF_REGEX,
   NAME_REGEX,
@@ -8,7 +7,7 @@ import {
   PHONE_REGEX,
 } from '@/constants/regex'
 import { PATIENT_CONDITION_ENUM } from '@/enums/patients'
-import { SPECIALTIES_ENUM } from '@/enums/shared'
+import { SPECIALTIES_ENUM, UF_LIST, YES_OR_NO_TUPLE } from '@/enums/shared'
 
 export const nameSchema = z
   .string()

From 50d81a297c35f7750f80ed8ea2ca547062c9a703 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 6 Feb 2026 18:47:21 -0300
Subject: [PATCH 29/77] feat(helpers): create revalidate server and client
 cache functions

---
 src/app/_paciente/_header/user-dropdown.tsx   |  4 +--
 src/components/sidebar/account.tsx            |  4 +--
 src/helpers/revalidate-client-cache.ts        | 12 +++++++++
 .../revalidate-server-cache.ts}               |  2 +-
 .../appointments/appointment-modal.tsx        | 16 ++++++------
 .../appointments/cancel-appointment-modal.tsx | 25 ++++++++++++-------
 src/modules/patients/inactivate-modal.tsx     | 16 ++++++------
 src/modules/referrals/referral-modal.tsx      | 25 ++++++++++++-------
 8 files changed, 64 insertions(+), 40 deletions(-)
 create mode 100644 src/helpers/revalidate-client-cache.ts
 rename src/{actions/cache.ts => helpers/revalidate-server-cache.ts} (72%)

diff --git a/src/app/_paciente/_header/user-dropdown.tsx b/src/app/_paciente/_header/user-dropdown.tsx
index cb8ad9b9..e54fe1a8 100644
--- a/src/app/_paciente/_header/user-dropdown.tsx
+++ b/src/app/_paciente/_header/user-dropdown.tsx
@@ -5,7 +5,6 @@ import { useRouter } from 'next/navigation'
 import { useTransition } from 'react'
 import { toast } from 'sonner'
 
-import { revalidateCache } from '@/actions/cache'
 import { getUserFromToken } from '@/actions/token'
 import { Avatar } from '@/components/ui/avatar'
 import { Divider } from '@/components/ui/divider'
@@ -15,6 +14,7 @@ import { DropdownMenuItem } from '@/components/ui/dropdown/item'
 import { DropdownMenuTrigger } from '@/components/ui/dropdown/trigger'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
+import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
 import { api } from '@/lib/api'
 import type { User } from '@/types/users.d.ts'
 
@@ -43,7 +43,7 @@ export function PatientHeaderUserDropdown({
         return
       }
 
-      revalidateCache(NEXT_CACHE_TAGS.user(user.id))
+      revalidateServerCache(NEXT_CACHE_TAGS.user(user.id))
       toast.success(response.message)
       router.replace(ROUTES.auth.signIn)
     })
diff --git a/src/components/sidebar/account.tsx b/src/components/sidebar/account.tsx
index be62d5b6..3d1bb7b8 100644
--- a/src/components/sidebar/account.tsx
+++ b/src/components/sidebar/account.tsx
@@ -5,10 +5,10 @@ import { useRouter } from 'next/navigation'
 import { useTransition } from 'react'
 import { toast } from 'sonner'
 
-import { revalidateCache } from '@/actions/cache'
 import { Avatar } from '@/components/ui/avatar'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
+import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
 import { api } from '@/lib/api'
 import { useSidebar } from '@/store/sidebar'
 import type { User } from '@/types/users.d.ts'
@@ -37,7 +37,7 @@ export function SidebarAccount({ user }: Readonly<SidebarAccountProps>) {
         return
       }
 
-      revalidateCache(NEXT_CACHE_TAGS.user(user.id))
+      revalidateServerCache(NEXT_CACHE_TAGS.user(user.id))
       toast.success(response.message)
       router.push(ROUTES.auth.signIn)
     })
diff --git a/src/helpers/revalidate-client-cache.ts b/src/helpers/revalidate-client-cache.ts
new file mode 100644
index 00000000..fef90ea1
--- /dev/null
+++ b/src/helpers/revalidate-client-cache.ts
@@ -0,0 +1,12 @@
+import { queryClient } from '@/lib/tanstack-query'
+
+export async function revalidateClientCache(keys: string | string[]) {
+  if (Array.isArray(keys)) {
+    for (const key of keys) {
+      queryClient.invalidateQueries({ queryKey: [key] })
+    }
+    return
+  }
+
+  queryClient.invalidateQueries({ queryKey: [keys] })
+}
diff --git a/src/actions/cache.ts b/src/helpers/revalidate-server-cache.ts
similarity index 72%
rename from src/actions/cache.ts
rename to src/helpers/revalidate-server-cache.ts
index 13eddd38..6f851dc3 100644
--- a/src/actions/cache.ts
+++ b/src/helpers/revalidate-server-cache.ts
@@ -2,7 +2,7 @@
 
 import { revalidateTag } from 'next/cache'
 
-export async function revalidateCache(tags: string | string[]) {
+export async function revalidateServerCache(tags: string | string[]) {
   if (Array.isArray(tags)) {
     for (const tag of tags) {
       revalidateTag(tag)
diff --git a/src/modules/appointments/appointment-modal.tsx b/src/modules/appointments/appointment-modal.tsx
index 54b845a1..5c52706d 100644
--- a/src/modules/appointments/appointment-modal.tsx
+++ b/src/modules/appointments/appointment-modal.tsx
@@ -6,7 +6,6 @@ import { FormProvider, useForm } from 'react-hook-form'
 import { toast } from 'sonner'
 import { z } from 'zod'
 
-import { revalidateCache } from '@/actions/cache'
 import { ComboboxInput } from '@/components/form/combobox-input'
 import { DateInput } from '@/components/form/date-input'
 import { FormContainer } from '@/components/form/form-container'
@@ -26,9 +25,10 @@ import {
 import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
 import { PATIENT_CONDITION_OPTIONS } from '@/enums/patients'
 import { SPECIALTIES_OPTIONS } from '@/enums/shared'
+import { revalidateClientCache } from '@/helpers/revalidate-client-cache'
+import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
 import { usePatientOptions } from '@/hooks/use-patient-otions'
 import { api } from '@/lib/api'
-import { queryClient } from '@/lib/tanstack-query'
 import {
   dateSchema,
   patientConditionSchema,
@@ -107,12 +107,12 @@ export function AppointmentModal({
       return
     }
 
-    queryClient.invalidateQueries({
-      queryKey: [QUERY_CACHE_KEYS.appointments.main],
-    })
-    revalidateCache(NEXT_CACHE_TAGS.patient(data.patient_id))
-    revalidateCache(NEXT_CACHE_TAGS.appointments.main)
-    revalidateCache(NEXT_CACHE_TAGS.statistics.totalAppointments.main)
+    revalidateClientCache(QUERY_CACHE_KEYS.appointments.main)
+    revalidateServerCache([
+      NEXT_CACHE_TAGS.patient(data.patient_id),
+      NEXT_CACHE_TAGS.appointments.main,
+      NEXT_CACHE_TAGS.statistics.totalAppointments.main,
+    ])
     toast.success(response.message)
     onClose()
   }
diff --git a/src/modules/appointments/cancel-appointment-modal.tsx b/src/modules/appointments/cancel-appointment-modal.tsx
index c19c296e..d0a38463 100644
--- a/src/modules/appointments/cancel-appointment-modal.tsx
+++ b/src/modules/appointments/cancel-appointment-modal.tsx
@@ -4,7 +4,6 @@ import { CircleXIcon } from 'lucide-react'
 import { useTransition } from 'react'
 import { toast } from 'sonner'
 
-import { revalidateCache } from '@/actions/cache'
 import { Button } from '@/components/ui/button'
 import {
   DialogClose,
@@ -16,8 +15,9 @@ import {
   DialogTitle,
 } from '@/components/ui/dialog'
 import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
+import { revalidateClientCache } from '@/helpers/revalidate-client-cache'
+import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
 import { api } from '@/lib/api'
-import { queryClient } from '@/lib/tanstack-query'
 import type { Appointment } from '@/types/appointments'
 import { formatDate } from '@/utils/formatters/format-date'
 
@@ -43,11 +43,11 @@ export function CancelAppointmentModal({
         return
       }
 
-      queryClient.invalidateQueries({
-        queryKey: [QUERY_CACHE_KEYS.appointments.main],
-      })
-      revalidateCache(NEXT_CACHE_TAGS.patient(appointment.patient_id))
-      revalidateCache(NEXT_CACHE_TAGS.appointments.main)
+      revalidateClientCache(QUERY_CACHE_KEYS.appointments.main)
+      revalidateServerCache([
+        NEXT_CACHE_TAGS.patient(appointment.patient_id),
+        NEXT_CACHE_TAGS.appointments.main,
+      ])
       toast.success(response.message)
       onClose()
     })
@@ -55,7 +55,14 @@ export function CancelAppointmentModal({
 
   return (
     <DialogContainer>
-      <DialogHeader icon={<DialogIcon icon={CircleXIcon} />}>
+      <DialogHeader
+        icon={
+          <DialogIcon
+            icon={CircleXIcon}
+            className='text-error bg-error/10 border-none'
+          />
+        }
+      >
         <DialogTitle>Cancelar atendimento</DialogTitle>
       </DialogHeader>
 
@@ -76,7 +83,7 @@ export function CancelAppointmentModal({
           Confirmar cancelamento
         </Button>
         <DialogClose className='flex-1' disabled={isPending}>
-          Cancelar
+          Voltar
         </DialogClose>
       </DialogFooter>
     </DialogContainer>
diff --git a/src/modules/patients/inactivate-modal.tsx b/src/modules/patients/inactivate-modal.tsx
index 04b31e3b..969f91c8 100644
--- a/src/modules/patients/inactivate-modal.tsx
+++ b/src/modules/patients/inactivate-modal.tsx
@@ -6,7 +6,6 @@ import { FormProvider, useForm } from 'react-hook-form'
 import { toast } from 'sonner'
 import { z } from 'zod'
 
-import { revalidateCache } from '@/actions/cache'
 import { FormContainer } from '@/components/form/form-container'
 import { TextInput } from '@/components/form/text-input'
 import { Button } from '@/components/ui/button'
@@ -21,8 +20,9 @@ import {
   DialogTitle,
 } from '@/components/ui/dialog'
 import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
+import { revalidateClientCache } from '@/helpers/revalidate-client-cache'
+import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
 import { api } from '@/lib/api'
-import { queryClient } from '@/lib/tanstack-query'
 
 interface InactivatePatientModalProps {
   id: string
@@ -58,13 +58,11 @@ export function InactivatePatientModal({
       return
     }
 
-    queryClient.invalidateQueries({
-      queryKey: [QUERY_CACHE_KEYS.patients.main],
-    })
-    queryClient.invalidateQueries({
-      queryKey: [QUERY_CACHE_KEYS.patients.allOptions],
-    })
-    revalidateCache(NEXT_CACHE_TAGS.patient(id))
+    revalidateClientCache([
+      QUERY_CACHE_KEYS.patients.main,
+      QUERY_CACHE_KEYS.patients.allOptions,
+    ])
+    revalidateServerCache(NEXT_CACHE_TAGS.patient(id))
     toast.success(response.message)
     onClose()
   }
diff --git a/src/modules/referrals/referral-modal.tsx b/src/modules/referrals/referral-modal.tsx
index 7c855d39..ec10a9a1 100644
--- a/src/modules/referrals/referral-modal.tsx
+++ b/src/modules/referrals/referral-modal.tsx
@@ -6,7 +6,6 @@ import { FormProvider, useForm } from 'react-hook-form'
 import { toast } from 'sonner'
 import { z } from 'zod'
 
-import { revalidateCache } from '@/actions/cache'
 import { ComboboxInput } from '@/components/form/combobox-input'
 import { DateInput } from '@/components/form/date-input'
 import { FormContainer } from '@/components/form/form-container'
@@ -26,9 +25,10 @@ import {
 import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
 import { PATIENT_CONDITION_OPTIONS } from '@/enums/patients'
 import { SPECIALTIES_OPTIONS } from '@/enums/shared'
+import { revalidateClientCache } from '@/helpers/revalidate-client-cache'
+import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
 import { usePatientOptions } from '@/hooks/use-patient-otions'
 import { api } from '@/lib/api'
-import { queryClient } from '@/lib/tanstack-query'
 import {
   dateSchema,
   patientConditionSchema,
@@ -103,12 +103,19 @@ export function ReferralModal({
       return
     }
 
-    queryClient.invalidateQueries({
-      queryKey: [QUERY_CACHE_KEYS.referrals.main],
-    })
-    revalidateCache(NEXT_CACHE_TAGS.patient(data.patient_id))
-    revalidateCache(NEXT_CACHE_TAGS.referrals.main)
-    revalidateCache(NEXT_CACHE_TAGS.statistics.totalReferrals.main)
+    revalidateClientCache([
+      QUERY_CACHE_KEYS.referrals.main,
+      QUERY_CACHE_KEYS.statistics.referralsByCategory,
+      QUERY_CACHE_KEYS.statistics.referralsByState,
+      QUERY_CACHE_KEYS.statistics.totalReferrals,
+    ])
+    revalidateServerCache([
+      NEXT_CACHE_TAGS.patient(data.patient_id),
+      NEXT_CACHE_TAGS.referrals.main,
+      NEXT_CACHE_TAGS.statistics.totalReferrals.main,
+      NEXT_CACHE_TAGS.statistics.totalReferredPatients.main,
+    ])
+
     toast.success(response.message)
     onClose()
   }
@@ -138,7 +145,7 @@ export function ReferralModal({
             />
             <DateInput
               name='date'
-              label='Data do atendimento'
+              label='Data do encaminhamento'
               wrapperClassName='sm:col-span-1'
               allowFutureDates
               isRequired

From 10afd58a30f3eaff8ad7dbd75c04f29fec1d48e0 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 6 Feb 2026 18:48:03 -0300
Subject: [PATCH 30/77] feat(components): enable future date options to filter
 date component

---
 src/components/filters/date.tsx | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/components/filters/date.tsx b/src/components/filters/date.tsx
index 6aa54400..9e3c05f6 100644
--- a/src/components/filters/date.tsx
+++ b/src/components/filters/date.tsx
@@ -6,10 +6,15 @@ import { QUERY_PARAMS } from '@/constants/params'
 import { useParams } from '@/hooks/params'
 import { cn } from '@/utils/class-name-merge'
 
+interface FilterDateProps extends React.ComponentProps<'div'> {
+  allowFutureDates?: boolean
+}
+
 export function FilterDate({
+  allowFutureDates,
   className,
   ...props
-}: Readonly<React.ComponentProps<'div'>>) {
+}: Readonly<FilterDateProps>) {
   const { getParam, updateParams } = useParams()
 
   const pageParam = QUERY_PARAMS.page
@@ -39,6 +44,7 @@ export function FilterDate({
           size='sm'
           value={startDate}
           onSelectDate={handleSelectStartDate}
+          allowFutureDates={allowFutureDates}
         />
       </FilterContainer>
       <FilterContainer title='Data final'>
@@ -48,6 +54,7 @@ export function FilterDate({
           onSelectDate={handleSelectEndDate}
           startDate={startDate}
           disabled={!startDate}
+          allowFutureDates={allowFutureDates}
         />
       </FilterContainer>
     </div>

From f5e66db4de8d8237a0c6dc6d67764fc83115f813 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 6 Feb 2026 18:50:55 -0300
Subject: [PATCH 31/77] chore(enums): move query param keys to enums folder

---
 src/components/filters/date.tsx                |  8 ++++----
 src/components/filters/filter-select.tsx       |  7 ++++---
 src/components/filters/search-input.tsx        |  6 +++---
 src/constants/params.ts                        |  9 ---------
 src/enums/params.ts                            | 13 +++++++++++++
 .../approved-list-table.tsx                    | 10 +++++-----
 .../pending-requirements.tsx                   | 10 +++++-----
 .../under-review-requirements.tsx              | 10 +++++-----
 src/modules/patients/table/index.tsx           | 18 +++++++++---------
 src/modules/teams/table.tsx                    |  4 ++--
 10 files changed, 50 insertions(+), 45 deletions(-)
 delete mode 100644 src/constants/params.ts
 create mode 100644 src/enums/params.ts

diff --git a/src/components/filters/date.tsx b/src/components/filters/date.tsx
index 9e3c05f6..61239457 100644
--- a/src/components/filters/date.tsx
+++ b/src/components/filters/date.tsx
@@ -2,7 +2,7 @@
 
 import { FilterContainer } from '@/components/filters/container'
 import { DatePicker } from '@/components/ui/date-picker'
-import { QUERY_PARAMS } from '@/constants/params'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
 import { useParams } from '@/hooks/params'
 import { cn } from '@/utils/class-name-merge'
 
@@ -17,9 +17,9 @@ export function FilterDate({
 }: Readonly<FilterDateProps>) {
   const { getParam, updateParams } = useParams()
 
-  const pageParam = QUERY_PARAMS.page
-  const startDateParam = QUERY_PARAMS.startDate
-  const endDateParam = QUERY_PARAMS.endDate
+  const pageParam = QUERY_PARAM_KEYS.page
+  const startDateParam = QUERY_PARAM_KEYS.startDate
+  const endDateParam = QUERY_PARAM_KEYS.endDate
   const startDate = getParam(startDateParam) || ''
   const endDate = getParam(endDateParam) || ''
 
diff --git a/src/components/filters/filter-select.tsx b/src/components/filters/filter-select.tsx
index cdd3b5a6..00047f31 100644
--- a/src/components/filters/filter-select.tsx
+++ b/src/components/filters/filter-select.tsx
@@ -1,17 +1,17 @@
 'use client'
 
 import { Select, type SelectProps } from '@/components/ui/select'
-import { QUERY_PARAMS } from '@/constants/params'
+import { QUERY_PARAM_KEYS, type QueryParamKey } from '@/enums/params'
 import { useParams } from '@/hooks/params'
 
 interface FilterSelectProps extends SelectProps {
-  param: string
+  param: QueryParamKey
 }
 
 export function FilterSelect({ param, ...props }: Readonly<FilterSelectProps>) {
   const { getParam, updateParams } = useParams()
 
-  const pageParam = QUERY_PARAMS.page
+  const pageParam = QUERY_PARAM_KEYS.page
   const selectValue = getParam(param) || ''
 
   function handleSelect(value: string) {
@@ -29,6 +29,7 @@ export function FilterSelect({ param, ...props }: Readonly<FilterSelectProps>) {
   return (
     <Select
       size='sm'
+      align='end'
       value={selectValue}
       onValueChange={handleSelect}
       {...props}
diff --git a/src/components/filters/search-input.tsx b/src/components/filters/search-input.tsx
index 3ae8098f..b2e58bf4 100644
--- a/src/components/filters/search-input.tsx
+++ b/src/components/filters/search-input.tsx
@@ -5,7 +5,7 @@ import { useEffect, useState } from 'react'
 
 import { Button } from '@/components/ui/button'
 import { Input } from '@/components/ui/input'
-import { QUERY_PARAMS } from '@/constants/params'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
 import { useDebounce } from '@/hooks/debounce'
 import { useParams } from '@/hooks/params'
 import { cn } from '@/utils/class-name-merge'
@@ -19,8 +19,8 @@ export function SearchInput({
   placeholder,
   className,
 }: Readonly<SearchInputProps>) {
-  const queryParam = QUERY_PARAMS.search
-  const pageParam = QUERY_PARAMS.page
+  const queryParam = QUERY_PARAM_KEYS.search
+  const pageParam = QUERY_PARAM_KEYS.page
 
   const { getParam, updateParams } = useParams()
   const searchQuery = getParam(queryParam) || ''
diff --git a/src/constants/params.ts b/src/constants/params.ts
deleted file mode 100644
index 391db4c5..00000000
--- a/src/constants/params.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-export const QUERY_PARAMS = {
-  page: 'page',
-  search: 'search',
-  order: 'order',
-  orderBy: 'orderBy',
-  status: 'status',
-  startDate: 'startDate',
-  endDate: 'endDate',
-}
diff --git a/src/enums/params.ts b/src/enums/params.ts
new file mode 100644
index 00000000..02297090
--- /dev/null
+++ b/src/enums/params.ts
@@ -0,0 +1,13 @@
+export const QUERY_PARAM_KEYS = {
+  page: 'page',
+  search: 'search',
+  order: 'order',
+  orderBy: 'orderBy',
+  status: 'status',
+  category: 'category',
+  startDate: 'startDate',
+  endDate: 'endDate',
+} as const
+
+export type QueryParamKey =
+  (typeof QUERY_PARAM_KEYS)[keyof typeof QUERY_PARAM_KEYS]
diff --git a/src/modules/patient-requirements/approved-list-table.tsx b/src/modules/patient-requirements/approved-list-table.tsx
index 7e152dd3..246f0d0e 100644
--- a/src/modules/patient-requirements/approved-list-table.tsx
+++ b/src/modules/patient-requirements/approved-list-table.tsx
@@ -24,7 +24,7 @@ import {
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
-import { QUERY_PARAMS } from '@/constants/params'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
 import {
   PATIENT_REQUIREMENT_TYPES,
   PATIENT_REQUIREMENTS_ORDER_OPTIONS,
@@ -46,9 +46,9 @@ export function ApprovedPatientRequirementsListTable() {
   const [stableTotal, setStableTotal] = useState(0)
   const { getParam } = useParams()
 
-  const page = getParam(QUERY_PARAMS.page)
-  const search = getParam(QUERY_PARAMS.search)
-  const orderBy = getParam(QUERY_PARAMS.orderBy)
+  const page = getParam(QUERY_PARAM_KEYS.page)
+  const search = getParam(QUERY_PARAM_KEYS.search)
+  const orderBy = getParam(QUERY_PARAM_KEYS.orderBy)
 
   const ORDER_MAPPING: QueryOrderMapping<
     PatientRequirementsOrder,
@@ -96,7 +96,7 @@ export function ApprovedPatientRequirementsListTable() {
         <SectionHeaderActions>
           <SearchInput placeholder='Pesquisar nome...' className='w-56' />
           <FilterSelect
-            param={QUERY_PARAMS.orderBy}
+            param={QUERY_PARAM_KEYS.orderBy}
             options={PATIENT_REQUIREMENTS_ORDER_OPTIONS}
             placeholder='Ordenar por...'
             resetLabel='Limpar ordem'
diff --git a/src/modules/patient-requirements/pending-requirements.tsx b/src/modules/patient-requirements/pending-requirements.tsx
index 9d6d408a..b4bfa99f 100644
--- a/src/modules/patient-requirements/pending-requirements.tsx
+++ b/src/modules/patient-requirements/pending-requirements.tsx
@@ -17,7 +17,7 @@ import { Card } from '@/components/ui/card'
 import { Skeleton } from '@/components/ui/skeleton'
 import { Tag } from '@/components/ui/tag'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
-import { QUERY_PARAMS } from '@/constants/params'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
 import {
   PATIENT_REQUIREMENT_TYPES,
   PATIENT_REQUIREMENTS_ORDER_OPTIONS,
@@ -42,9 +42,9 @@ export function PendingPatientRequirements() {
   const { getParam } = useParams()
 
   const perPage = 12
-  const page = getParam(QUERY_PARAMS.page)
-  const search = getParam(QUERY_PARAMS.search)
-  const orderBy = getParam(QUERY_PARAMS.orderBy)
+  const page = getParam(QUERY_PARAM_KEYS.page)
+  const search = getParam(QUERY_PARAM_KEYS.search)
+  const orderBy = getParam(QUERY_PARAM_KEYS.orderBy)
 
   const ORDER_MAPPING: QueryOrderMapping<
     PatientRequirementsOrder,
@@ -100,7 +100,7 @@ export function PendingPatientRequirements() {
         <SectionHeaderActions>
           <SearchInput placeholder='Pesquisar nome...' className='w-56' />
           <FilterSelect
-            param={QUERY_PARAMS.orderBy}
+            param={QUERY_PARAM_KEYS.orderBy}
             options={PATIENT_REQUIREMENTS_ORDER_OPTIONS}
             placeholder='Ordenar por...'
             resetLabel='Limpar ordem'
diff --git a/src/modules/patient-requirements/under-review-requirements.tsx b/src/modules/patient-requirements/under-review-requirements.tsx
index 2e7d616d..16b50d6e 100644
--- a/src/modules/patient-requirements/under-review-requirements.tsx
+++ b/src/modules/patient-requirements/under-review-requirements.tsx
@@ -16,7 +16,7 @@ import { Card } from '@/components/ui/card'
 import { Skeleton } from '@/components/ui/skeleton'
 import { Tag } from '@/components/ui/tag'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
-import { QUERY_PARAMS } from '@/constants/params'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
 import {
   PATIENT_REQUIREMENT_TYPES,
   PATIENT_REQUIREMENTS_ORDER_OPTIONS,
@@ -39,9 +39,9 @@ export function UnderReviewPatientRequirements() {
   const { getParam } = useParams()
 
   const perPage = 12
-  const page = getParam(QUERY_PARAMS.page)
-  const search = getParam(QUERY_PARAMS.search)
-  const orderBy = getParam(QUERY_PARAMS.orderBy)
+  const page = getParam(QUERY_PARAM_KEYS.page)
+  const search = getParam(QUERY_PARAM_KEYS.search)
+  const orderBy = getParam(QUERY_PARAM_KEYS.orderBy)
 
   const ORDER_MAPPING: QueryOrderMapping<
     PatientRequirementsOrder,
@@ -97,7 +97,7 @@ export function UnderReviewPatientRequirements() {
         <SectionHeaderActions>
           <SearchInput placeholder='Pesquisar nome...' className='w-56' />
           <FilterSelect
-            param={QUERY_PARAMS.orderBy}
+            param={QUERY_PARAM_KEYS.orderBy}
             options={PATIENT_REQUIREMENTS_ORDER_OPTIONS}
             placeholder='Ordenar por...'
             resetLabel='Limpar ordem'
diff --git a/src/modules/patients/table/index.tsx b/src/modules/patients/table/index.tsx
index e9d6ae56..1b7c16a8 100644
--- a/src/modules/patients/table/index.tsx
+++ b/src/modules/patients/table/index.tsx
@@ -31,8 +31,8 @@ import {
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
-import { QUERY_PARAMS } from '@/constants/params'
 import { ROUTES } from '@/constants/routes'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
 import {
   PATIENT_STATUS_OPTIONS,
   PATIENT_STATUSES,
@@ -54,12 +54,12 @@ export function PatientsTable() {
   const [stableTotal, setStableTotal] = useState(0)
   const { getParam, paramsQueryKey } = useParams()
 
-  const page = getParam(QUERY_PARAMS.page)
-  const search = getParam(QUERY_PARAMS.search)
-  const status = getParam(QUERY_PARAMS.status)
-  const orderBy = getParam(QUERY_PARAMS.orderBy)
-  const startDate = getParam(QUERY_PARAMS.startDate)
-  const endDate = getParam(QUERY_PARAMS.endDate)
+  const page = getParam(QUERY_PARAM_KEYS.page)
+  const search = getParam(QUERY_PARAM_KEYS.search)
+  const status = getParam(QUERY_PARAM_KEYS.status)
+  const orderBy = getParam(QUERY_PARAM_KEYS.orderBy)
+  const startDate = getParam(QUERY_PARAM_KEYS.startDate)
+  const endDate = getParam(QUERY_PARAM_KEYS.endDate)
 
   const ORDER_MAPPING: QueryOrderMapping<PatientsOrder, PatientsOrderBy> = {
     date_asc: { orderBy: 'date', order: 'ASC' },
@@ -113,7 +113,7 @@ export function PatientsTable() {
         <SectionHeaderActions>
           <SearchInput placeholder='Pesquisar...' className='w-48' />
           <FilterSelect
-            param={QUERY_PARAMS.orderBy}
+            param={QUERY_PARAM_KEYS.orderBy}
             options={PATIENTS_ORDER_OPTIONS}
             placeholder='Ordenar por...'
             resetLabel='Limpar ordem'
@@ -132,7 +132,7 @@ export function PatientsTable() {
         <section className='flex items-end gap-8'>
           <FilterContainer title='Status' className='w-48'>
             <FilterSelect
-              param={QUERY_PARAMS.status}
+              param={QUERY_PARAM_KEYS.status}
               options={PATIENT_STATUS_OPTIONS}
               placeholder='Selecione o status'
               resetLabel='Limpar status'
diff --git a/src/modules/teams/table.tsx b/src/modules/teams/table.tsx
index 8af0c0ee..5b50c7c1 100644
--- a/src/modules/teams/table.tsx
+++ b/src/modules/teams/table.tsx
@@ -35,7 +35,7 @@ import {
   TableRow,
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
-import { QUERY_PARAMS } from '@/constants/params'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
 import { TEAMS_ORDER_OPTIONS } from '@/enums/team'
 import { formatDate } from '@/utils/formatters/format-date'
 import { TEAMS_MOCK } from '@/utils/mock/teams'
@@ -73,7 +73,7 @@ export function TeamListTable() {
           <SearchInput placeholder='Pesquisar...' className='w-48' />
 
           <FilterSelect
-            param={QUERY_PARAMS.orderBy}
+            param={QUERY_PARAM_KEYS.orderBy}
             options={TEAMS_ORDER_OPTIONS}
             placeholder='Ordenar por...'
             resetLabel='Limpar ordem'

From d98d1ceb24b07575622a117fe372ae4628c449f5 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 6 Feb 2026 22:17:35 -0300
Subject: [PATCH 32/77] refactor(referrals): create new referrals list table

---
 .../encaminhamentos/listagem/page.tsx         |   4 +-
 .../listagem/referrals-skeleton.tsx           |  35 ---
 .../listagem/referrals-table.tsx              | 210 ------------------
 src/enums/patients.ts                         |  12 +-
 src/enums/referrals.ts                        |  32 ++-
 src/modules/appointments/table/index.tsx      |   4 +-
 .../referrals/cancel-referral-modal.tsx       |  99 +++++++++
 src/modules/referrals/list.tsx                | 151 +++++++++++++
 src/modules/referrals/new-referral-button.tsx |   2 +-
 src/modules/referrals/table/actions.tsx       | 106 +++++++++
 src/modules/referrals/table/index.tsx         | 105 +++++++++
 src/modules/referrals/table/skeleton.tsx      |  35 +++
 src/types/orders.d.ts                         |   8 +
 13 files changed, 536 insertions(+), 267 deletions(-)
 delete mode 100644 src/app/(dashboard)/encaminhamentos/listagem/referrals-skeleton.tsx
 delete mode 100644 src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
 create mode 100644 src/modules/referrals/cancel-referral-modal.tsx
 create mode 100644 src/modules/referrals/list.tsx
 create mode 100644 src/modules/referrals/table/actions.tsx
 create mode 100644 src/modules/referrals/table/index.tsx
 create mode 100644 src/modules/referrals/table/skeleton.tsx

diff --git a/src/app/(dashboard)/encaminhamentos/listagem/page.tsx b/src/app/(dashboard)/encaminhamentos/listagem/page.tsx
index ec02309c..a1d1b7fc 100644
--- a/src/app/(dashboard)/encaminhamentos/listagem/page.tsx
+++ b/src/app/(dashboard)/encaminhamentos/listagem/page.tsx
@@ -1,11 +1,11 @@
 import type { Metadata } from 'next'
 
-import { ReferralsTable } from './referrals-table'
+import { ReferralsList } from '@/modules/referrals/list'
 
 export const metadata: Metadata = {
   title: 'Encaminhamentos',
 }
 
 export default function Page() {
-  return <ReferralsTable />
+  return <ReferralsList />
 }
diff --git a/src/app/(dashboard)/encaminhamentos/listagem/referrals-skeleton.tsx b/src/app/(dashboard)/encaminhamentos/listagem/referrals-skeleton.tsx
deleted file mode 100644
index 348ad8b1..00000000
--- a/src/app/(dashboard)/encaminhamentos/listagem/referrals-skeleton.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import { Skeleton } from '@/components/ui/skeleton'
-import { TableBody, TableCell, TableRow } from '@/components/ui/table'
-
-export default function ReferralsSkeleton() {
-  const skeletons = Array.from({ length: 10 }).map((_, index) => index)
-
-  return (
-    <TableBody>
-      {skeletons.map((skeleton) => (
-        <TableRow key={skeleton}>
-          <TableCell className='py-0'>
-            <div className='flex items-center gap-2'>
-              <Skeleton className='h-5 w-35 rounded-md' />
-            </div>
-          </TableCell>
-          <TableCell>
-            <Skeleton className='h-5 w-30 rounded-md' />
-          </TableCell>
-          <TableCell>
-            <Skeleton className='h-5 w-30 rounded-md' />
-          </TableCell>
-          <TableCell>
-            <Skeleton className='h-5 w-30 rounded-md' />
-          </TableCell>
-          <TableCell>
-            <Skeleton className='h-5 w-30 rounded-md' />
-          </TableCell>
-          <TableCell className='flex justify-center'>
-            <Skeleton className='size-5 rounded-md' />
-          </TableCell>
-        </TableRow>
-      ))}
-    </TableBody>
-  )
-}
diff --git a/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx b/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
deleted file mode 100644
index c7adbe52..00000000
--- a/src/app/(dashboard)/encaminhamentos/listagem/referrals-table.tsx
+++ /dev/null
@@ -1,210 +0,0 @@
-'use client'
-import { Eye } from 'lucide-react'
-import { useState } from 'react'
-
-import { FilterSelect } from '@/components/filters/filter-select'
-import { SearchInput } from '@/components/filters/search-input'
-import { Pagination } from '@/components/pagination'
-import {
-  SectionHeader,
-  SectionHeaderActions,
-} from '@/components/section-header'
-import { Card } from '@/components/ui/card'
-import { TabSelect } from '@/components/ui/tab-select'
-import {
-  Table,
-  TableBody,
-  TableButton,
-  TableCell,
-  TableHead,
-  TableHeader,
-  TableRow,
-} from '@/components/ui/table'
-import { Tag } from '@/components/ui/tag'
-import { QUERY_PARAMS } from '@/constants/params'
-import { PATIENT_CONDITIONS, type PatientCondition } from '@/enums/patients'
-import { REFERRALS_ORDER_OPTIONS } from '@/enums/referrals'
-
-import ReferralsSkeleton from './referrals-skeleton'
-
-const referrals = [
-  {
-    id: 1,
-    nome: 'Ana Silva',
-    encaminhadoEm: '03/03/2025',
-    profissional: 'João Pereira',
-    especialidade: 'Medicina',
-    quadroGeral: 'stable',
-  },
-  {
-    id: 2,
-    nome: 'Carlos Mendes',
-    encaminhadoEm: '03/03/2025',
-    profissional: 'Mariana Costa',
-    especialidade: 'Psicologia',
-    quadroGeral: 'outbreak',
-  },
-  {
-    id: 3,
-    nome: 'Beatriz Rocha',
-    encaminhadoEm: '03/03/2025',
-    profissional: 'Lucas Andrade',
-    especialidade: 'Nutrição',
-    quadroGeral: 'stable',
-  },
-  {
-    id: 4,
-    nome: 'Rafael Gomes',
-    encaminhadoEm: '03/03/2025',
-    profissional: 'Fernanda Lima',
-    especialidade: 'Enfermagem',
-    quadroGeral: 'outbreak',
-  },
-  {
-    id: 5,
-    nome: 'Juliana Santos',
-    encaminhadoEm: '03/03/2025',
-    profissional: 'Pedro Albuquerque',
-    especialidade: 'Advocacia',
-    quadroGeral: 'stable',
-  },
-  {
-    id: 6,
-    nome: 'Marcos Oliveira',
-    encaminhadoEm: '03/03/2025',
-    profissional: 'Camila Duarte',
-    especialidade: 'Medicina',
-    quadroGeral: 'stable',
-  },
-  {
-    id: 7,
-    nome: 'Paula Ferreira',
-    encaminhadoEm: '03/03/2025',
-    profissional: 'Ricardo Matos',
-    especialidade: 'Psicologia',
-    quadroGeral: 'outbreak',
-  },
-  {
-    id: 8,
-    nome: 'Daniel Azevedo',
-    encaminhadoEm: '03/03/2025',
-    profissional: 'Larissa Pires',
-    especialidade: 'Nutrição',
-    quadroGeral: 'stable',
-  },
-  {
-    id: 9,
-    nome: 'Gabriela Martins',
-    encaminhadoEm: '03/03/2025',
-    profissional: 'Diego Amaral',
-    especialidade: 'Enfermagem',
-    quadroGeral: 'outbreak',
-  },
-  {
-    id: 10,
-    nome: 'Vitor Souza',
-    encaminhadoEm: '03/03/2025',
-    profissional: 'Letícia Moura',
-    especialidade: 'Psicologia',
-    quadroGeral: 'stable',
-  },
-]
-
-export function ReferralsTable() {
-  const [isLoading] = useState(false)
-  const [isReferralsEmpty] = useState<boolean>(referrals.length <= 0)
-  const [statusFilter, setStatusFilter] = useState<string>('all')
-
-  const filterOptions: Array<{
-    label: string
-    value: PatientCondition | 'all'
-  }> = [
-    { label: 'Todos', value: 'all' },
-    { label: 'Em surto', value: 'in_crisis' },
-    { label: 'Estável', value: 'stable' },
-  ]
-
-  return (
-    <div className='space-y-6'>
-      <SectionHeader>
-        <TabSelect
-          value={statusFilter}
-          options={filterOptions}
-          onSelect={(value) => setStatusFilter(value)}
-        />
-        <SectionHeaderActions>
-          <SearchInput placeholder='Pesquisar' />
-          <FilterSelect
-            param={QUERY_PARAMS.orderBy}
-            options={REFERRALS_ORDER_OPTIONS}
-          />
-        </SectionHeaderActions>
-      </SectionHeader>
-
-      <Card className='p-6'>
-        <Table>
-          <TableHeader>
-            <TableRow>
-              <TableHead>Nome do paciente</TableHead>
-              <TableHead>Encaminhado em</TableHead>
-              <TableHead>Profissional</TableHead>
-              <TableHead>Especialidade</TableHead>
-              <TableHead>Quadro geral</TableHead>
-              <TableHead className='w-10 text-center'>Observações</TableHead>
-            </TableRow>
-          </TableHeader>
-
-          {isLoading && <ReferralsSkeleton />}
-
-          {!isLoading && isReferralsEmpty && (
-            <TableBody>
-              <TableRow>
-                <TableCell colSpan={6}>
-                  <div className='pt-2 text-center'>
-                    Nenhum paciente encontrado
-                  </div>
-                </TableCell>
-              </TableRow>
-            </TableBody>
-          )}
-
-          {!isLoading && !isReferralsEmpty && (
-            <TableBody>
-              {referrals?.map((forwarding) => {
-                const condition =
-                  PATIENT_CONDITIONS[forwarding.quadroGeral as PatientCondition]
-                const ConditionIcon = condition.icon
-                return (
-                  <TableRow key={forwarding.id}>
-                    <TableCell className='py-0'>{forwarding.nome}</TableCell>
-
-                    <TableCell>{forwarding.encaminhadoEm}</TableCell>
-                    <TableCell>{forwarding.profissional}</TableCell>
-                    <TableCell>
-                      <span className='border-border text-foreground-soft rounded-md border px-2 py-1'>
-                        {forwarding.especialidade}
-                      </span>
-                    </TableCell>
-                    <TableCell>
-                      <Tag variant={condition.variant} size='sm'>
-                        <ConditionIcon />
-                        {condition.label}
-                      </Tag>
-                    </TableCell>
-                    <TableCell className='flex justify-center'>
-                      <TableButton>
-                        <Eye className='text-foreground-soft/70' />
-                      </TableButton>
-                    </TableCell>
-                  </TableRow>
-                )
-              })}
-            </TableBody>
-          )}
-        </Table>
-      </Card>
-
-      <Pagination totalItems={30} />
-    </div>
-  )
-}
diff --git a/src/enums/patients.ts b/src/enums/patients.ts
index cf749c27..5f345504 100644
--- a/src/enums/patients.ts
+++ b/src/enums/patients.ts
@@ -67,12 +67,12 @@ export const PATIENT_CONDITION_ENUM = Object.keys(PATIENT_CONDITIONS) as [
 ]
 
 export const PATIENTS_ORDERS = {
-  name_asc: 'Nome (Crescente)',
-  name_desc: 'Nome (Decrescente)',
-  date_asc: 'Data (Crescente)',
-  date_desc: 'Data (Decrescente)',
-  email_asc: 'E-mail (Crescente)',
-  email_desc: 'E-mail (Decrescente)',
+  name_asc: 'Nome (Asc.)',
+  name_desc: 'Nome (Desc.)',
+  date_asc: 'Data (Asc.)',
+  date_desc: 'Data (Desc.)',
+  email_asc: 'E-mail (Asc.)',
+  email_desc: 'E-mail (Desc.)',
 }
 export type PatientsOrder = keyof typeof PATIENTS_ORDERS
 
diff --git a/src/enums/referrals.ts b/src/enums/referrals.ts
index 79b10a33..5ead3ed0 100644
--- a/src/enums/referrals.ts
+++ b/src/enums/referrals.ts
@@ -1,26 +1,34 @@
 import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
 
 export const REFERRAL_STATUSES = {
-  scheduled: 'Agendado',
-  canceled: 'Cancelado',
-  completed: 'Concluído',
-  no_show: 'Não compareceu',
+  scheduled: { variant: 'outlined', label: 'Agendado' },
+  canceled: { variant: 'error', label: 'Cancelado' },
+  completed: { variant: 'success', label: 'Concluído' },
+  no_show: { variant: 'info', label: 'Não compareceu' },
 } as const
 export type ReferralStatus = keyof typeof REFERRAL_STATUSES
 
-export const REFERRAL_STATUS_OPTIONS = convertObjectToOptions(REFERRAL_STATUSES)
-
 export const REFERRAL_STATUS_ENUM = Object.keys(REFERRAL_STATUSES) as [
   ReferralStatus,
 ]
 
+export const REFERRAL_STATUS_OPTIONS = Object.entries(REFERRAL_STATUSES).map(
+  ([key, status]) => ({ label: status.label, value: key }),
+)
+
 export const REFERRALS_ORDER = {
-  name_asc: 'Nome (Crescente)',
-  name_desc: 'Nome (Decrescente)',
-  date_asc: 'Data (Crescente)',
-  date_desc: 'Data (Decrescente)',
-  condition_asc: 'Em surto (Crescente)',
-  condition_desc: 'Estável (Decrescente)',
+  name_asc: 'Nome (Asc.)',
+  name_desc: 'Nome (Desc.)',
+  date_asc: 'Data (Asc.)',
+  date_desc: 'Data (Desc.)',
+  status_asc: 'Status (Asc.)',
+  status_desc: 'Status (Desc.)',
+  category_asc: 'Categoria (Asc.)',
+  category_desc: 'Categoria (Desc.)',
+  condition_asc: 'Quadro geral (Asc.)',
+  condition_desc: 'Quadro geral (Desc.)',
+  professional_asc: 'Profissional (Asc.)',
+  professional_desc: 'Profissional (Desc.)',
 }
 export type ReferralsOrder = keyof typeof REFERRALS_ORDER
 
diff --git a/src/modules/appointments/table/index.tsx b/src/modules/appointments/table/index.tsx
index 2227b045..20eaf5dc 100644
--- a/src/modules/appointments/table/index.tsx
+++ b/src/modules/appointments/table/index.tsx
@@ -63,7 +63,9 @@ export function AppointmentsTable({
                   </TableLink>
                 </TableCell>
                 <TableCell>{formatDate(appointment.date)}</TableCell>
-                <TableCell>{SPECIALTIES[appointment.category]}</TableCell>
+                <TableCell>
+                  <Tag>{SPECIALTIES[appointment.category]}</Tag>
+                </TableCell>
                 <TableCell>{appointment.professional_name ?? '-'}</TableCell>
                 <TableCell>
                   <Tag variant={condition.variant} size='sm'>
diff --git a/src/modules/referrals/cancel-referral-modal.tsx b/src/modules/referrals/cancel-referral-modal.tsx
new file mode 100644
index 00000000..0a5cc983
--- /dev/null
+++ b/src/modules/referrals/cancel-referral-modal.tsx
@@ -0,0 +1,99 @@
+'use client'
+
+import { CircleXIcon } from 'lucide-react'
+import { useTransition } from 'react'
+import { toast } from 'sonner'
+
+import { Button } from '@/components/ui/button'
+import {
+  DialogClose,
+  DialogContainer,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogIcon,
+  DialogTitle,
+} from '@/components/ui/dialog'
+import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
+import { revalidateClientCache } from '@/helpers/revalidate-client-cache'
+import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
+import { api } from '@/lib/api'
+import type { Referral } from '@/types/referrals'
+import { formatDate } from '@/utils/formatters/format-date'
+
+interface CancelReferralModalProps {
+  referral: Referral
+  onClose: () => void
+}
+
+export function CancelReferralModal({
+  referral,
+  onClose,
+}: Readonly<CancelReferralModalProps>) {
+  const [isPending, startTransition] = useTransition()
+
+  async function cancelReferral() {
+    startTransition(async () => {
+      const response = await api(`/referrals/${referral.id}/cancel`, {
+        method: 'PATCH',
+      })
+
+      if (!response.success) {
+        toast.error(response.message)
+        return
+      }
+
+      revalidateClientCache([
+        QUERY_CACHE_KEYS.referrals.main,
+        QUERY_CACHE_KEYS.statistics.referralsByCategory,
+        QUERY_CACHE_KEYS.statistics.referralsByState,
+        QUERY_CACHE_KEYS.statistics.totalReferrals,
+      ])
+      revalidateServerCache([
+        NEXT_CACHE_TAGS.patient(referral.patient_id),
+        NEXT_CACHE_TAGS.referrals.main,
+        NEXT_CACHE_TAGS.statistics.totalReferrals.main,
+        NEXT_CACHE_TAGS.statistics.totalReferredPatients.main,
+      ])
+
+      toast.success(response.message)
+      onClose()
+    })
+  }
+
+  return (
+    <DialogContainer>
+      <DialogHeader
+        icon={
+          <DialogIcon
+            icon={CircleXIcon}
+            className='text-error bg-error/10 border-none'
+          />
+        }
+      >
+        <DialogTitle>Cancelar encaminhamento</DialogTitle>
+      </DialogHeader>
+
+      <DialogContent>
+        Você tem certeza que deseja cancelar o encaminhamento de{' '}
+        <span className='font-semibold'>{referral.patient.name}</span>, agendado
+        para dia{' '}
+        <span className='font-semibold'>{formatDate(referral.date)}</span>?
+      </DialogContent>
+
+      <DialogFooter>
+        <Button
+          className='flex-1'
+          loading={isPending}
+          variant='destructive'
+          onClick={cancelReferral}
+        >
+          Confirmar cancelamento
+        </Button>
+        <DialogClose className='flex-1' disabled={isPending}>
+          Voltar
+        </DialogClose>
+      </DialogFooter>
+    </DialogContainer>
+  )
+}
diff --git a/src/modules/referrals/list.tsx b/src/modules/referrals/list.tsx
new file mode 100644
index 00000000..a0628dcb
--- /dev/null
+++ b/src/modules/referrals/list.tsx
@@ -0,0 +1,151 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query'
+import { ClipboardPasteIcon } from 'lucide-react'
+import { useEffect, useState } from 'react'
+
+import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
+import { FilterContainer } from '@/components/filters/container'
+import { FilterDate } from '@/components/filters/date'
+import { FilterSelect } from '@/components/filters/filter-select'
+import { SearchInput } from '@/components/filters/search-input'
+import { ShowFilterButton } from '@/components/filters/show-filter-button'
+import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
+import { Card } from '@/components/ui/card'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
+import type { ReferralsOrder } from '@/enums/referrals'
+import {
+  REFERRAL_STATUS_OPTIONS,
+  REFERRALS_ORDER_OPTIONS,
+} from '@/enums/referrals'
+import { SPECIALTIES_OPTIONS } from '@/enums/shared'
+import { useParams } from '@/hooks/params'
+import { api } from '@/lib/api'
+import type { QueryOrderMapping, ReferralsOrderBy } from '@/types/orders'
+import type { Referral } from '@/types/referrals'
+
+import { NewReferralButton } from './new-referral-button'
+import { ReferralsTable } from './table'
+
+export function ReferralsList() {
+  const [showFilters, setShowFilters] = useState(false)
+  const [stableTotal, setStableTotal] = useState(0)
+  const { getParam, paramsQueryKey } = useParams()
+
+  const page = getParam(QUERY_PARAM_KEYS.page)
+  const search = getParam(QUERY_PARAM_KEYS.search)
+  const category = getParam(QUERY_PARAM_KEYS.category)
+  const status = getParam(QUERY_PARAM_KEYS.status)
+  const orderBy = getParam(QUERY_PARAM_KEYS.orderBy)
+  const startDate = getParam(QUERY_PARAM_KEYS.startDate)
+  const endDate = getParam(QUERY_PARAM_KEYS.endDate)
+
+  const ORDER_MAPPING: QueryOrderMapping<ReferralsOrder, ReferralsOrderBy> = {
+    date_asc: { orderBy: 'date', order: 'ASC' },
+    date_desc: { orderBy: 'date', order: 'DESC' },
+    name_asc: { orderBy: 'patient', order: 'ASC' },
+    name_desc: { orderBy: 'patient', order: 'DESC' },
+    status_asc: { orderBy: 'status', order: 'ASC' },
+    status_desc: { orderBy: 'status', order: 'DESC' },
+    category_asc: { orderBy: 'category', order: 'ASC' },
+    category_desc: { orderBy: 'category', order: 'DESC' },
+    condition_asc: { orderBy: 'condition', order: 'ASC' },
+    condition_desc: { orderBy: 'condition', order: 'DESC' },
+    professional_asc: { orderBy: 'professional', order: 'ASC' },
+    professional_desc: { orderBy: 'professional', order: 'DESC' },
+  }
+
+  const orderByQuery =
+    ORDER_MAPPING[orderBy as ReferralsOrder] ?? ORDER_MAPPING['name_asc']
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.referrals.main, paramsQueryKey],
+    queryFn: () =>
+      api<{ referrals: Referral[]; total: number }>('/referrals', {
+        params: {
+          page,
+          search,
+          category,
+          status,
+          startDate,
+          endDate,
+          ...orderByQuery,
+        },
+      }),
+  })
+
+  const referrals = response?.data?.referrals ?? []
+
+  // Update stable total only when we have actual data to prevent pagination flickering
+  useEffect(() => {
+    if (response?.data?.total !== undefined) {
+      setStableTotal(response.data.total)
+    }
+  }, [response?.data?.total])
+
+  useEffect(() => {
+    if (category || startDate || endDate) {
+      setShowFilters(true)
+    }
+  }, [category, startDate, endDate])
+
+  return (
+    <>
+      <SectionHeader>
+        <SectionHeaderTitle
+          title='Encaminhamentos'
+          icon={<ClipboardPasteIcon />}
+          total={stableTotal}
+        />
+        <SectionHeaderActions>
+          <SearchInput placeholder='Pesquisar...' className='w-48' />
+          <FilterSelect
+            param={QUERY_PARAM_KEYS.orderBy}
+            options={REFERRALS_ORDER_OPTIONS}
+            placeholder='Ordenar por...'
+            resetLabel='Limpar ordem'
+            className='w-52'
+          />
+          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
+
+          <NewReferralButton size='sm' />
+        </SectionHeaderActions>
+      </SectionHeader>
+
+      {showFilters && (
+        <section className='flex items-end gap-6'>
+          <FilterContainer title='Categoria' className='w-48'>
+            <FilterSelect
+              param={QUERY_PARAM_KEYS.category}
+              options={SPECIALTIES_OPTIONS}
+              placeholder='Todas'
+              resetLabel='Limpar categoria'
+            />
+          </FilterContainer>
+          <FilterContainer title='Status' className='w-48'>
+            <FilterSelect
+              param={QUERY_PARAM_KEYS.status}
+              options={REFERRAL_STATUS_OPTIONS}
+              placeholder='Todos'
+              resetLabel='Limpar status'
+            />
+          </FilterContainer>
+          <FilterDate allowFutureDates />
+          <ClearFiltersButton />
+        </section>
+      )}
+
+      <Card className='p-6'>
+        <ReferralsTable referrals={referrals} loading={isLoading} />
+      </Card>
+
+      <Pagination totalItems={stableTotal} />
+    </>
+  )
+}
diff --git a/src/modules/referrals/new-referral-button.tsx b/src/modules/referrals/new-referral-button.tsx
index 4f97c517..74401f77 100644
--- a/src/modules/referrals/new-referral-button.tsx
+++ b/src/modules/referrals/new-referral-button.tsx
@@ -15,7 +15,7 @@ export function NewReferralButton(props: Readonly<ButtonProps>) {
     <Dialog open={modalOpen} onOpenChange={setModalOpen}>
       <DialogTrigger {...props}>
         <ClipboardPasteIcon />
-        Encaminhar paciente
+        Encaminhar
       </DialogTrigger>
 
       {modalOpen && <ReferralModal onClose={() => setModalOpen(false)} />}
diff --git a/src/modules/referrals/table/actions.tsx b/src/modules/referrals/table/actions.tsx
new file mode 100644
index 00000000..267aad97
--- /dev/null
+++ b/src/modules/referrals/table/actions.tsx
@@ -0,0 +1,106 @@
+'use client'
+
+import {
+  ClipboardClockIcon,
+  ClipboardListIcon,
+  ClipboardPenIcon,
+  EllipsisIcon,
+  XCircleIcon,
+} from 'lucide-react'
+import { useRouter } from 'next/navigation'
+import { useState } from 'react'
+
+import { Dialog } from '@/components/ui/dialog'
+import { Divider } from '@/components/ui/divider'
+import { Menu, MenuContent, MenuItem, MenuTrigger } from '@/components/ui/menu'
+import { ROUTES } from '@/constants/routes'
+import type { Referral } from '@/types/referrals'
+
+import { CancelReferralModal } from '../cancel-referral-modal'
+import { ReferralModal } from '../referral-modal'
+
+type ReferralModalMode = 'edit' | 'cancel'
+
+interface ReferralsTableActionsProps {
+  referral: Referral
+}
+
+export function ReferralsTableActions({
+  referral,
+}: Readonly<ReferralsTableActionsProps>) {
+  const [modalOpen, setModalOpen] = useState<ReferralModalMode | null>(null)
+
+  const router = useRouter()
+
+  return (
+    <>
+      <Menu>
+        <MenuTrigger size='icon' variant='ghost' className='size-8'>
+          <EllipsisIcon />
+          <span className='sr-only'>Ações</span>
+        </MenuTrigger>
+
+        <MenuContent align='end'>
+          <MenuItem onClick={() => setModalOpen('edit')}>
+            <ClipboardPenIcon />
+            Editar
+          </MenuItem>
+          <MenuItem
+            onClick={() =>
+              router.push(
+                ROUTES.dashboard.patients.details.info(referral.patient_id),
+              )
+            }
+          >
+            <ClipboardListIcon />
+            Informações do paciente
+          </MenuItem>
+          <MenuItem
+            onClick={() =>
+              router.push(
+                ROUTES.dashboard.patients.details.history(referral.patient_id),
+              )
+            }
+          >
+            <ClipboardClockIcon />
+            Histórico do paciente
+          </MenuItem>
+
+          <Divider className='my-1' />
+
+          <MenuItem
+            variant='destructive'
+            onClick={() => setModalOpen('cancel')}
+          >
+            <XCircleIcon />
+            Cancelar
+          </MenuItem>
+        </MenuContent>
+      </Menu>
+
+      {modalOpen === 'edit' && (
+        <Dialog
+          open={modalOpen === 'edit'}
+          onOpenChange={(open) => setModalOpen(open ? 'edit' : null)}
+        >
+          <ReferralModal
+            referral={referral}
+            onClose={() => setModalOpen(null)}
+          />
+        </Dialog>
+      )}
+
+      {modalOpen === 'cancel' && (
+        <Dialog
+          open={modalOpen === 'cancel'}
+          onOpenChange={(open) => setModalOpen(open ? 'cancel' : null)}
+        >
+          <CancelReferralModal
+            referral={referral}
+            onClose={() => setModalOpen(null)}
+          />
+        </Dialog>
+      )}
+    </>
+  )
+}
diff --git a/src/modules/referrals/table/index.tsx b/src/modules/referrals/table/index.tsx
new file mode 100644
index 00000000..939fc997
--- /dev/null
+++ b/src/modules/referrals/table/index.tsx
@@ -0,0 +1,105 @@
+import { Avatar } from '@/components/ui/avatar'
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableEmptyCell,
+  TableHead,
+  TableHeader,
+  TableLink,
+  TableRow,
+} from '@/components/ui/table'
+import { Tag } from '@/components/ui/tag'
+import { ROUTES } from '@/constants/routes'
+import { PATIENT_CONDITIONS } from '@/enums/patients'
+import { REFERRAL_STATUSES } from '@/enums/referrals'
+import { SPECIALTIES } from '@/enums/shared'
+import type { Referral } from '@/types/referrals'
+import { formatDate } from '@/utils/formatters/format-date'
+
+import { ReferralsTableActions } from './actions'
+import { ReferralsTableSkeleton } from './skeleton'
+
+interface ReferralsTableProps {
+  referrals: Referral[]
+  loading?: boolean
+}
+
+export function ReferralsTable({
+  referrals,
+  loading,
+}: Readonly<ReferralsTableProps>) {
+  const isEmpty = !loading && referrals.length <= 0
+
+  return (
+    <Table>
+      <TableHeader>
+        <TableRow>
+          <TableHead className='w-64'>Paciente</TableHead>
+          <TableHead className='w-36'>Data</TableHead>
+          <TableHead className='w-48'>Categoria</TableHead>
+          <TableHead>Profissional</TableHead>
+          <TableHead className='w-36'>Quadro geral</TableHead>
+          <TableHead className='w-36'>Status</TableHead>
+          <TableHead className='w-20 text-center'>Ações</TableHead>
+        </TableRow>
+      </TableHeader>
+      <TableBody>
+        {loading && <ReferralsTableSkeleton />}
+
+        {isEmpty && (
+          <TableRow>
+            <TableEmptyCell colSpan={6}>
+              Nenhum encaminhamento registrado
+            </TableEmptyCell>
+          </TableRow>
+        )}
+
+        {!isEmpty &&
+          referrals.map((referral) => {
+            const status = REFERRAL_STATUSES[referral.status]
+            const condition = PATIENT_CONDITIONS[referral.condition]
+            const Icon = condition.icon
+
+            return (
+              <TableRow key={referral.id}>
+                <TableCell>
+                  <TableLink
+                    className='w-64'
+                    href={ROUTES.dashboard.patients.details.info(
+                      referral.patient_id,
+                    )}
+                  >
+                    <Avatar
+                      className='size-9'
+                      src={referral.patient.avatar_url}
+                    />
+                    <span className='truncate'>{referral.patient.name}</span>
+                  </TableLink>
+                </TableCell>
+                <TableCell>{formatDate(referral.date)}</TableCell>
+                <TableCell>
+                  <Tag>{SPECIALTIES[referral.category]}</Tag>
+                </TableCell>
+                <TableCell>{referral.professional_name ?? '-'}</TableCell>
+                <TableCell>
+                  <Tag variant={condition.variant} size='sm'>
+                    <Icon />
+                    {condition.label}
+                  </Tag>
+                </TableCell>
+                <TableCell>
+                  <Tag variant={status.variant} size='sm'>
+                    {status.label}
+                  </Tag>
+                </TableCell>
+                <TableCell className='text-center'>
+                  <ReferralsTableActions referral={referral} />
+                </TableCell>
+              </TableRow>
+            )
+          })}
+      </TableBody>
+    </Table>
+  )
+}
diff --git a/src/modules/referrals/table/skeleton.tsx b/src/modules/referrals/table/skeleton.tsx
new file mode 100644
index 00000000..762f42a4
--- /dev/null
+++ b/src/modules/referrals/table/skeleton.tsx
@@ -0,0 +1,35 @@
+import { Skeleton } from '@/components/ui/skeleton'
+import { TableCell, TableRow } from '@/components/ui/table'
+
+export function ReferralsTableSkeleton() {
+  const skeletons = Array.from({ length: 10 }).map((_, index) => index)
+
+  return skeletons.map((skeleton) => (
+    <TableRow key={skeleton}>
+      <TableCell>
+        <div className='flex w-64 items-center gap-2'>
+          <Skeleton className='size-9 rounded-full' />
+          <Skeleton className='h-5 w-44 rounded-md' />
+        </div>
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-5 w-24 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-6 w-36 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-5 w-40 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-6 w-24 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-6 w-28 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='mx-auto size-8 rounded-md' />
+      </TableCell>
+    </TableRow>
+  ))
+}
diff --git a/src/types/orders.d.ts b/src/types/orders.d.ts
index 4384dae3..7479d157 100644
--- a/src/types/orders.d.ts
+++ b/src/types/orders.d.ts
@@ -15,6 +15,14 @@ export type AppointmentsOrderBy =
   | 'condition'
   | 'professional'
 
+export type ReferralsOrderBy =
+  | 'date'
+  | 'patient'
+  | 'status'
+  | 'category'
+  | 'condition'
+  | 'professional'
+
 export type PatientRequirementsOrderBy =
   | 'patient'
   | 'status'

From 9386fb119f8321c1345e8ae41609f1706715510f Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 6 Feb 2026 22:34:44 -0300
Subject: [PATCH 33/77] feat(hooks): add `getParams` method to `useParams` hook

---
 src/hooks/params.ts | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/src/hooks/params.ts b/src/hooks/params.ts
index 8289bea2..051021ca 100644
--- a/src/hooks/params.ts
+++ b/src/hooks/params.ts
@@ -20,6 +20,19 @@ export function useParams() {
     return searchParams.get(key)
   }
 
+  function getParams(keys: string[]): (string | null)[] {
+    const values = []
+
+    if (Array.isArray(keys)) {
+      for (const key of keys) {
+        const value = searchParams.get(key)
+        values.push(value)
+      }
+    }
+
+    return values
+  }
+
   function updateParams({ set, remove }: Readonly<UpdateParamsProps>) {
     const pageParams = new URLSearchParams(searchParams)
 
@@ -46,6 +59,7 @@ export function useParams() {
     searchParams,
     paramsQueryKey: searchParams.toString(),
     getParam,
+    getParams,
     updateParams,
     clearParams,
   }

From 8acf1b37a718f58d407b3dafcffdc9f4f5b9b958 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 6 Feb 2026 22:45:18 -0300
Subject: [PATCH 34/77] refactor: use `getParams` method when getting several
 params

---
 src/components/filters/date.tsx               |  5 ++---
 src/components/pagination/index.tsx           |  3 ++-
 src/components/ui/calendar/index.tsx          |  2 +-
 src/components/ui/date-picker.tsx             |  2 +-
 .../approved-list-table.tsx                   | 10 +++++----
 .../pending-requirements.tsx                  | 11 ++++++----
 .../under-review-requirements.tsx             | 10 +++++----
 src/modules/patients/table/index.tsx          | 18 +++++++++-------
 src/modules/referrals/list.tsx                | 21 +++++++++++--------
 9 files changed, 47 insertions(+), 35 deletions(-)

diff --git a/src/components/filters/date.tsx b/src/components/filters/date.tsx
index 61239457..4f08a45b 100644
--- a/src/components/filters/date.tsx
+++ b/src/components/filters/date.tsx
@@ -15,13 +15,12 @@ export function FilterDate({
   className,
   ...props
 }: Readonly<FilterDateProps>) {
-  const { getParam, updateParams } = useParams()
+  const { getParams, updateParams } = useParams()
 
   const pageParam = QUERY_PARAM_KEYS.page
   const startDateParam = QUERY_PARAM_KEYS.startDate
   const endDateParam = QUERY_PARAM_KEYS.endDate
-  const startDate = getParam(startDateParam) || ''
-  const endDate = getParam(endDateParam) || ''
+  const [startDate, endDate] = getParams([startDateParam, endDateParam])
 
   function handleSelectStartDate(value: string) {
     updateParams({
diff --git a/src/components/pagination/index.tsx b/src/components/pagination/index.tsx
index 8acc826a..e706057f 100644
--- a/src/components/pagination/index.tsx
+++ b/src/components/pagination/index.tsx
@@ -2,6 +2,7 @@
 
 import { ChevronFirstIcon, ChevronLastIcon } from 'lucide-react'
 
+import { QUERY_PARAM_KEYS } from '@/enums/params'
 import { useParams } from '@/hooks/params'
 
 import { PaginationButton } from './button'
@@ -28,7 +29,7 @@ export function Pagination({
     return null
   }
 
-  const currentPage = Number(getParam('page')) || 1
+  const currentPage = Number(getParam(QUERY_PARAM_KEYS.page)) || 1
   const totalPages = Math.ceil(totalItems / perPage)
   const lastPageItems = totalItems - (totalPages - 1) * perPage
 
diff --git a/src/components/ui/calendar/index.tsx b/src/components/ui/calendar/index.tsx
index 44c940fa..2d2e5ce2 100644
--- a/src/components/ui/calendar/index.tsx
+++ b/src/components/ui/calendar/index.tsx
@@ -16,7 +16,7 @@ import { CalendarStepNav } from './step-nav'
 export interface CalendarProps extends Omit<PropsSingle, 'mode'> {
   navMode?: 'step' | 'dropdown'
   allowFutureDates?: boolean
-  startDate?: string | Date
+  startDate?: string | Date | null
 }
 
 export function Calendar({
diff --git a/src/components/ui/date-picker.tsx b/src/components/ui/date-picker.tsx
index 35423b31..9360251a 100644
--- a/src/components/ui/date-picker.tsx
+++ b/src/components/ui/date-picker.tsx
@@ -16,7 +16,7 @@ import { PopoverTrigger, type PopoverTriggerProps } from './popover/trigger'
 export interface DatePickerProps
   extends Omit<PopoverTriggerProps, 'value'>,
     Pick<CalendarProps, 'allowFutureDates' | 'navMode' | 'startDate'> {
-  value?: string
+  value?: string | null
   onSelectDate?: (date: string) => void
   modal?: boolean
 }
diff --git a/src/modules/patient-requirements/approved-list-table.tsx b/src/modules/patient-requirements/approved-list-table.tsx
index 246f0d0e..e2d22887 100644
--- a/src/modules/patient-requirements/approved-list-table.tsx
+++ b/src/modules/patient-requirements/approved-list-table.tsx
@@ -44,11 +44,13 @@ import ApprovedPatientRequirementsListTableSkeleton from './approved-list-table-
 
 export function ApprovedPatientRequirementsListTable() {
   const [stableTotal, setStableTotal] = useState(0)
-  const { getParam } = useParams()
+  const { getParams } = useParams()
 
-  const page = getParam(QUERY_PARAM_KEYS.page)
-  const search = getParam(QUERY_PARAM_KEYS.search)
-  const orderBy = getParam(QUERY_PARAM_KEYS.orderBy)
+  const [page, search, orderBy] = getParams([
+    QUERY_PARAM_KEYS.page,
+    QUERY_PARAM_KEYS.search,
+    QUERY_PARAM_KEYS.orderBy,
+  ])
 
   const ORDER_MAPPING: QueryOrderMapping<
     PatientRequirementsOrder,
diff --git a/src/modules/patient-requirements/pending-requirements.tsx b/src/modules/patient-requirements/pending-requirements.tsx
index b4bfa99f..263ed57a 100644
--- a/src/modules/patient-requirements/pending-requirements.tsx
+++ b/src/modules/patient-requirements/pending-requirements.tsx
@@ -39,12 +39,15 @@ import { AddPatientRequirementButton } from './add-patient-requirement-button'
 // TODO: add dropdown menu
 export function PendingPatientRequirements() {
   const [stableTotal, setStableTotal] = useState(0)
-  const { getParam } = useParams()
+
+  const { getParams } = useParams()
 
   const perPage = 12
-  const page = getParam(QUERY_PARAM_KEYS.page)
-  const search = getParam(QUERY_PARAM_KEYS.search)
-  const orderBy = getParam(QUERY_PARAM_KEYS.orderBy)
+  const [page, search, orderBy] = getParams([
+    QUERY_PARAM_KEYS.page,
+    QUERY_PARAM_KEYS.search,
+    QUERY_PARAM_KEYS.orderBy,
+  ])
 
   const ORDER_MAPPING: QueryOrderMapping<
     PatientRequirementsOrder,
diff --git a/src/modules/patient-requirements/under-review-requirements.tsx b/src/modules/patient-requirements/under-review-requirements.tsx
index 16b50d6e..d148e07a 100644
--- a/src/modules/patient-requirements/under-review-requirements.tsx
+++ b/src/modules/patient-requirements/under-review-requirements.tsx
@@ -36,12 +36,14 @@ import { AddPatientRequirementButton } from './add-patient-requirement-button'
 // TODO: add dropdown actions menu
 export function UnderReviewPatientRequirements() {
   const [stableTotal, setStableTotal] = useState(0)
-  const { getParam } = useParams()
+  const { getParams } = useParams()
 
   const perPage = 12
-  const page = getParam(QUERY_PARAM_KEYS.page)
-  const search = getParam(QUERY_PARAM_KEYS.search)
-  const orderBy = getParam(QUERY_PARAM_KEYS.orderBy)
+  const [page, search, orderBy] = getParams([
+    QUERY_PARAM_KEYS.page,
+    QUERY_PARAM_KEYS.search,
+    QUERY_PARAM_KEYS.orderBy,
+  ])
 
   const ORDER_MAPPING: QueryOrderMapping<
     PatientRequirementsOrder,
diff --git a/src/modules/patients/table/index.tsx b/src/modules/patients/table/index.tsx
index 1b7c16a8..34aff5ca 100644
--- a/src/modules/patients/table/index.tsx
+++ b/src/modules/patients/table/index.tsx
@@ -52,14 +52,16 @@ import PatientsTableSkeleton from './skeleton'
 export function PatientsTable() {
   const [showFilters, setShowFilters] = useState(false)
   const [stableTotal, setStableTotal] = useState(0)
-  const { getParam, paramsQueryKey } = useParams()
-
-  const page = getParam(QUERY_PARAM_KEYS.page)
-  const search = getParam(QUERY_PARAM_KEYS.search)
-  const status = getParam(QUERY_PARAM_KEYS.status)
-  const orderBy = getParam(QUERY_PARAM_KEYS.orderBy)
-  const startDate = getParam(QUERY_PARAM_KEYS.startDate)
-  const endDate = getParam(QUERY_PARAM_KEYS.endDate)
+  const { getParams, paramsQueryKey } = useParams()
+
+  const [page, search, status, orderBy, startDate, endDate] = getParams([
+    QUERY_PARAM_KEYS.page,
+    QUERY_PARAM_KEYS.search,
+    QUERY_PARAM_KEYS.status,
+    QUERY_PARAM_KEYS.orderBy,
+    QUERY_PARAM_KEYS.startDate,
+    QUERY_PARAM_KEYS.endDate,
+  ])
 
   const ORDER_MAPPING: QueryOrderMapping<PatientsOrder, PatientsOrderBy> = {
     date_asc: { orderBy: 'date', order: 'ASC' },
diff --git a/src/modules/referrals/list.tsx b/src/modules/referrals/list.tsx
index a0628dcb..1468e4ed 100644
--- a/src/modules/referrals/list.tsx
+++ b/src/modules/referrals/list.tsx
@@ -36,15 +36,18 @@ import { ReferralsTable } from './table'
 export function ReferralsList() {
   const [showFilters, setShowFilters] = useState(false)
   const [stableTotal, setStableTotal] = useState(0)
-  const { getParam, paramsQueryKey } = useParams()
-
-  const page = getParam(QUERY_PARAM_KEYS.page)
-  const search = getParam(QUERY_PARAM_KEYS.search)
-  const category = getParam(QUERY_PARAM_KEYS.category)
-  const status = getParam(QUERY_PARAM_KEYS.status)
-  const orderBy = getParam(QUERY_PARAM_KEYS.orderBy)
-  const startDate = getParam(QUERY_PARAM_KEYS.startDate)
-  const endDate = getParam(QUERY_PARAM_KEYS.endDate)
+  const { getParams, paramsQueryKey } = useParams()
+
+  const [page, search, category, status, orderBy, startDate, endDate] =
+    getParams([
+      QUERY_PARAM_KEYS.page,
+      QUERY_PARAM_KEYS.search,
+      QUERY_PARAM_KEYS.category,
+      QUERY_PARAM_KEYS.status,
+      QUERY_PARAM_KEYS.orderBy,
+      QUERY_PARAM_KEYS.startDate,
+      QUERY_PARAM_KEYS.endDate,
+    ])
 
   const ORDER_MAPPING: QueryOrderMapping<ReferralsOrder, ReferralsOrderBy> = {
     date_asc: { orderBy: 'date', order: 'ASC' },

From 23175ef5a100492c7cc0eaafffa53d64a372d928 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 6 Feb 2026 23:36:27 -0300
Subject: [PATCH 35/77] fix: minor fixes on breadrumbs, section tab buttons,
 date picker and referral actions

---
 src/components/breadcrumbs.tsx           |  2 +
 src/components/dashboard/tab-buttons.tsx |  3 +-
 src/components/filters/date.tsx          |  2 +-
 src/components/ui/date-picker.tsx        |  4 +-
 src/components/ui/expandable-text.tsx    | 56 ------------------------
 src/constants/breadcrumbs/dashboard.ts   |  6 +--
 src/modules/referrals/table/actions.tsx  | 36 +++++++++------
 7 files changed, 32 insertions(+), 77 deletions(-)
 delete mode 100644 src/components/ui/expandable-text.tsx

diff --git a/src/components/breadcrumbs.tsx b/src/components/breadcrumbs.tsx
index 6ab3b15e..97e2e1d2 100644
--- a/src/components/breadcrumbs.tsx
+++ b/src/components/breadcrumbs.tsx
@@ -19,6 +19,8 @@ export function Breadcrumbs() {
   const section = pathnames[1]
   const breadcrumbSection = BREADCRUMBS[section as BreadcrumbSection]
 
+  console.log(breadcrumbSection)
+
   if (!breadcrumbSection) {
     return null
   }
diff --git a/src/components/dashboard/tab-buttons.tsx b/src/components/dashboard/tab-buttons.tsx
index 6223a7aa..40005b28 100644
--- a/src/components/dashboard/tab-buttons.tsx
+++ b/src/components/dashboard/tab-buttons.tsx
@@ -17,7 +17,8 @@ export function DashboardTabButtons() {
   const buttons = SECTION_TAB_BUTTONS[section as SectionTabButton]
 
   const hidePatientDetailsButtons =
-    section === 'pacientes' && segments.length < 2
+    (section === 'pacientes' && segments.length < 2) ||
+    segments[1] === 'cadastrar'
 
   if (!buttons || hidePatientDetailsButtons) {
     return null
diff --git a/src/components/filters/date.tsx b/src/components/filters/date.tsx
index 4f08a45b..1381d4fb 100644
--- a/src/components/filters/date.tsx
+++ b/src/components/filters/date.tsx
@@ -37,7 +37,7 @@ export function FilterDate({
   }
 
   return (
-    <div className={cn('grid w-96 grid-cols-2 gap-2', className)} {...props}>
+    <div className={cn('grid w-80 grid-cols-2 gap-2', className)} {...props}>
       <FilterContainer title='Data inicial'>
         <DatePicker
           size='sm'
diff --git a/src/components/ui/date-picker.tsx b/src/components/ui/date-picker.tsx
index 9360251a..c934d826 100644
--- a/src/components/ui/date-picker.tsx
+++ b/src/components/ui/date-picker.tsx
@@ -59,7 +59,7 @@ export function DatePicker({
       <PopoverTrigger
         variant='outline'
         className={cn(
-          '[&_svg]:text-disabled justify-start pl-3 font-normal [&_svg]:size-4.5',
+          '[&_svg]:text-disabled justify-start overflow-hidden pl-3 font-normal [&_svg]:size-4.5',
           className,
         )}
         {...props}
@@ -68,7 +68,7 @@ export function DatePicker({
         {date ? (
           formatDate(date, { dateStyle: 'short' })
         ) : (
-          <span className='text-disabled'>Selecione a data</span>
+          <span className='text-disabled'>Selecionar...</span>
         )}
       </PopoverTrigger>
 
diff --git a/src/components/ui/expandable-text.tsx b/src/components/ui/expandable-text.tsx
deleted file mode 100644
index 729db9ef..00000000
--- a/src/components/ui/expandable-text.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-'use client'
-
-import { useState } from 'react'
-
-import { Button } from '@/components/ui/button'
-import { cn } from '@/utils/class-name-merge'
-
-interface ExpandableTextProps {
-  text: string
-  maxLength?: number
-  className?: string
-}
-
-export function ExpandableText({
-  text,
-  maxLength = 230,
-  className,
-}: Readonly<ExpandableTextProps>) {
-  const [isExpanded, setIsExpanded] = useState(false)
-
-  const toggleExpanded = () => {
-    setIsExpanded(!isExpanded)
-  }
-
-  if (text.length <= maxLength) {
-    return (
-      <div className={cn('break-words whitespace-pre-wrap', className)}>
-        {text}
-      </div>
-    )
-  }
-
-  const collapsedText = (
-    <div className='flex flex-col items-start'>
-      <span>{`${text.substring(0, maxLength)}... `}</span>
-      <Button variant='muted' onClick={toggleExpanded} className='mt-1 h-auto'>
-        Ver mais...
-      </Button>
-    </div>
-  )
-
-  const expandedText = (
-    <div className='flex flex-col items-start'>
-      <span>{text}</span>
-      <Button variant='ghost' onClick={toggleExpanded} className='mt-1 h-auto'>
-        Ver menos...
-      </Button>
-    </div>
-  )
-
-  return (
-    <div className={cn('break-words whitespace-pre-wrap', className)}>
-      {isExpanded ? expandedText : collapsedText}
-    </div>
-  )
-}
diff --git a/src/constants/breadcrumbs/dashboard.ts b/src/constants/breadcrumbs/dashboard.ts
index f60bc0f3..93f72e54 100644
--- a/src/constants/breadcrumbs/dashboard.ts
+++ b/src/constants/breadcrumbs/dashboard.ts
@@ -2,10 +2,10 @@ import {
   ClipboardCheckIcon,
   ClipboardClockIcon,
   ClipboardListIcon,
+  ClipboardPasteIcon,
   ClockArrowUpIcon,
   HistoryIcon,
   PaperclipIcon,
-  Share2Icon,
   User2Icon,
   UserRoundCheckIcon,
   UserRoundPlusIcon,
@@ -43,9 +43,9 @@ export const DASHBOARD_BREADCRUMBS: Breadcrumbs = {
       path: ROUTES.dashboard.patients.new,
     },
   },
-  referrals: {
+  encaminhamentos: {
     encaminhamentos: {
-      icon: Share2Icon,
+      icon: ClipboardPasteIcon,
       name: 'Encaminhamentos',
       path: ROUTES.dashboard.referrals.main,
     },
diff --git a/src/modules/referrals/table/actions.tsx b/src/modules/referrals/table/actions.tsx
index 267aad97..5b6e89e0 100644
--- a/src/modules/referrals/table/actions.tsx
+++ b/src/modules/referrals/table/actions.tsx
@@ -32,6 +32,8 @@ export function ReferralsTableActions({
 
   const router = useRouter()
 
+  const canEdit = referral.status !== 'canceled'
+
   return (
     <>
       <Menu>
@@ -41,10 +43,12 @@ export function ReferralsTableActions({
         </MenuTrigger>
 
         <MenuContent align='end'>
-          <MenuItem onClick={() => setModalOpen('edit')}>
-            <ClipboardPenIcon />
-            Editar
-          </MenuItem>
+          {canEdit && (
+            <MenuItem onClick={() => setModalOpen('edit')}>
+              <ClipboardPenIcon />
+              Editar
+            </MenuItem>
+          )}
           <MenuItem
             onClick={() =>
               router.push(
@@ -66,19 +70,23 @@ export function ReferralsTableActions({
             Histórico do paciente
           </MenuItem>
 
-          <Divider className='my-1' />
+          {canEdit && (
+            <>
+              <Divider className='my-1' />
 
-          <MenuItem
-            variant='destructive'
-            onClick={() => setModalOpen('cancel')}
-          >
-            <XCircleIcon />
-            Cancelar
-          </MenuItem>
+              <MenuItem
+                variant='destructive'
+                onClick={() => setModalOpen('cancel')}
+              >
+                <XCircleIcon />
+                Cancelar
+              </MenuItem>
+            </>
+          )}
         </MenuContent>
       </Menu>
 
-      {modalOpen === 'edit' && (
+      {modalOpen === 'edit' && canEdit && (
         <Dialog
           open={modalOpen === 'edit'}
           onOpenChange={(open) => setModalOpen(open ? 'edit' : null)}
@@ -90,7 +98,7 @@ export function ReferralsTableActions({
         </Dialog>
       )}
 
-      {modalOpen === 'cancel' && (
+      {modalOpen === 'cancel' && canEdit && (
         <Dialog
           open={modalOpen === 'cancel'}
           onOpenChange={(open) => setModalOpen(open ? 'cancel' : null)}

From ff3ec2c4d3bae01bdb935ee0f26e1279c0e48763 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 6 Feb 2026 23:40:47 -0300
Subject: [PATCH 36/77] fix(referrals): fix referred patients percentage
 calculation

---
 .../referrals/referred-patients-percentage-card.tsx    | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/modules/referrals/referred-patients-percentage-card.tsx b/src/modules/referrals/referred-patients-percentage-card.tsx
index 9fb0e04d..bfe44244 100644
--- a/src/modules/referrals/referred-patients-percentage-card.tsx
+++ b/src/modules/referrals/referred-patients-percentage-card.tsx
@@ -1,20 +1,20 @@
 import { Users2Icon } from 'lucide-react'
 
-import { getTotalReferrals } from '@/actions/statistics/get-total-referrals'
+import { getTotalPatients } from '@/actions/statistics/get-total-patients'
 import { getTotalReferredPatients } from '@/actions/statistics/get-total-referred-patients'
 import { SummaryCard } from '@/components/summary-card'
 
 export async function ReferredPatientsPercentageCard() {
-  const [totalReferrals, totalReferredPatients] = await Promise.all([
-    getTotalReferrals(),
+  const [totalPatients, totalReferredPatients] = await Promise.all([
+    getTotalPatients(),
     getTotalReferredPatients(),
   ])
 
-  const totalReferralsValue = totalReferrals?.total ?? 0
+  const totalPatientsValue = totalPatients?.total ?? 0
   const totalReferredPatientsValue = totalReferredPatients?.total ?? 0
 
   const referredPatientsPercentage =
-    (totalReferredPatientsValue / totalReferralsValue) * 100
+    (totalReferredPatientsValue / totalPatientsValue) * 100
 
   return (
     <SummaryCard

From 42aaa6e9274834894d86e0ccf72f7352e00f7994 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 6 Feb 2026 23:51:08 -0300
Subject: [PATCH 37/77] chore(dashboard): improve upcoming appointments card
 semantic

---
 src/app/(dashboard)/page.tsx                                  | 4 ++--
 .../{appointments-card.tsx => upcoming-appointments-card.tsx} | 4 ++--
 src/modules/patients/table/index.tsx                          | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)
 rename src/modules/dashboard/{appointments-card.tsx => upcoming-appointments-card.tsx} (93%)

diff --git a/src/app/(dashboard)/page.tsx b/src/app/(dashboard)/page.tsx
index 0ec52b9f..a49a291a 100644
--- a/src/app/(dashboard)/page.tsx
+++ b/src/app/(dashboard)/page.tsx
@@ -1,10 +1,10 @@
 import { Suspense } from 'react'
 
 import { Skeleton } from '@/components/ui/skeleton'
-import { DashboardAppointmentsCard } from '@/modules/dashboard/appointments-card'
 import { DashboardPatientsByCityCard } from '@/modules/dashboard/patients-by-city-card'
 import { DashboardPatientsByGenderCard } from '@/modules/dashboard/patients-by-gender-card'
 import { DashboardSummaryCards } from '@/modules/dashboard/summary-cards'
+import { DashboardUpcomingAppointmentsCard } from '@/modules/dashboard/upcoming-appointments-card'
 
 export default function Page() {
   return (
@@ -20,7 +20,7 @@ export default function Page() {
       <DashboardPatientsByGenderCard />
       <DashboardPatientsByCityCard />
 
-      <DashboardAppointmentsCard />
+      <DashboardUpcomingAppointmentsCard />
     </div>
   )
 }
diff --git a/src/modules/dashboard/appointments-card.tsx b/src/modules/dashboard/upcoming-appointments-card.tsx
similarity index 93%
rename from src/modules/dashboard/appointments-card.tsx
rename to src/modules/dashboard/upcoming-appointments-card.tsx
index f54da092..e9908ceb 100644
--- a/src/modules/dashboard/appointments-card.tsx
+++ b/src/modules/dashboard/upcoming-appointments-card.tsx
@@ -17,7 +17,7 @@ import { NewAppointmentButton } from '@/modules/appointments/new-appointment-but
 
 import { AppointmentsTable } from '../appointments/table'
 
-export async function DashboardAppointmentsCard() {
+export async function DashboardUpcomingAppointmentsCard() {
   const params: GetAppointmentsParams = {
     startDate: new Date().toISOString(),
     status: 'scheduled',
@@ -37,7 +37,7 @@ export async function DashboardAppointmentsCard() {
     <Card className='p-6 sm:col-span-6'>
       <SectionHeader className='mb-6'>
         <SectionHeaderTitle
-          title='Fila de atendimento'
+          title='Próximos atendimentos'
           icon={<ClipboardListIcon />}
         />
         <SectionHeaderActions>
diff --git a/src/modules/patients/table/index.tsx b/src/modules/patients/table/index.tsx
index 34aff5ca..f517cd95 100644
--- a/src/modules/patients/table/index.tsx
+++ b/src/modules/patients/table/index.tsx
@@ -125,7 +125,7 @@ export function PatientsTable() {
 
           <NavButton size='sm' href={ROUTES.dashboard.patients.new}>
             <PlusIcon />
-            Novo paciente
+            Cadastrar paciente
           </NavButton>
         </SectionHeaderActions>
       </SectionHeader>

From a7c2e8ea677e135d85b1d5f0ea8aad974c7560fe Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sat, 7 Feb 2026 13:38:36 -0300
Subject: [PATCH 38/77] chore(components): update calendar styles to improve
 readability

---
 src/components/ui/calendar/dropdown-nav.tsx | 18 +++++++-----
 src/components/ui/calendar/index.tsx        | 32 +++++++++------------
 src/components/ui/calendar/step-nav.tsx     | 10 +++----
 3 files changed, 29 insertions(+), 31 deletions(-)

diff --git a/src/components/ui/calendar/dropdown-nav.tsx b/src/components/ui/calendar/dropdown-nav.tsx
index 605eca9a..6d193564 100644
--- a/src/components/ui/calendar/dropdown-nav.tsx
+++ b/src/components/ui/calendar/dropdown-nav.tsx
@@ -74,11 +74,11 @@ export function CalendarDropdownNav({
   }, [dateCurrent, months.length])
 
   return (
-    <div className='bg-background-soft flex items-center justify-center gap-1 rounded-lg p-1.5'>
+    <div className='bg-accent flex items-center justify-center gap-1 rounded-lg p-1.5'>
       <Button
         size='icon'
         variant='ghost'
-        className='size-7'
+        className='mr-auto size-8'
         onClick={onPreviousClick}
         disabled={!previousMonth}
       >
@@ -86,30 +86,34 @@ export function CalendarDropdownNav({
       </Button>
 
       <Select
+        size='sm'
+        placeholder='Mês'
         value={monthSelected}
+        options={monthOptions}
+        className='w-20'
         onValueChange={(value: string) => {
           setMonthSeleted(value)
           goToMonth(new Date(yearSelected, monthsOfYear.indexOf(value)))
         }}
-        options={monthOptions}
-        className='h-8 w-16'
       />
 
       <Select
+        size='sm'
+        placeholder='Ano'
+        options={yearOptions}
         value={yearSelected.toString()}
+        className='w-22'
         onValueChange={(value: string) => {
           const year = Number(value)
           setYearSeleted(year)
           goToMonth(new Date(year, monthsOfYear.indexOf(monthSelected)))
         }}
-        options={yearOptions}
-        className='h-8 w-18'
       />
 
       <Button
         size='icon'
         variant='ghost'
-        className='size-7 disabled:pointer-events-auto disabled:cursor-not-allowed disabled:opacity-25'
+        className='ml-auto size-8'
         onClick={onNextClick}
         disabled={!nextMonth}
       >
diff --git a/src/components/ui/calendar/index.tsx b/src/components/ui/calendar/index.tsx
index 2d2e5ce2..e455529e 100644
--- a/src/components/ui/calendar/index.tsx
+++ b/src/components/ui/calendar/index.tsx
@@ -2,13 +2,7 @@
 
 import { format } from 'date-fns'
 import { ptBR } from 'date-fns/locale'
-import {
-  DayPicker,
-  getDefaultClassNames,
-  type PropsSingle,
-} from 'react-day-picker'
-
-import { cn } from '@/utils/class-name-merge'
+import { DayPicker, type PropsSingle } from 'react-day-picker'
 
 import { CalendarDropdownNav } from './dropdown-nav'
 import { CalendarStepNav } from './step-nav'
@@ -25,8 +19,6 @@ export function Calendar({
   startDate,
   ...props
 }: Readonly<CalendarProps>) {
-  const defaultClassNames = getDefaultClassNames()
-
   const dateRestrictions = {
     ...(startDate && {
       fromDate: new Date(startDate),
@@ -60,16 +52,19 @@ export function Calendar({
       showOutsideDays
       {...dateRestrictions}
       classNames={{
-        months: 'p-0 space-y-2',
+        months: 'p-1',
         month_caption: 'hidden',
         outside: 'text-disabled/50',
-        weekday: cn(defaultClassNames.weekday, 'text-xs text-disabled'),
-        day: 'rounded-md overflow-hidden',
+        weekday: 'font-medium text-disabled pt-2 pb-1 border-b border-border',
+        week: 'pt-2',
+        day: 'overflow-hidden',
         day_button:
-          'size-8 text-sm cursor-pointer hover:bg-primary hover:text-primary-foreground outline-none disabled:opacity-100',
-        selected: 'bg-primary text-white font-medium',
-        focused: 'text-white bg-primary ',
-        today: 'text-primary font-medium',
+          'size-9 flex justify-center p-2 items-center cursor-pointer hover:bg-primary hover:text-primary-foreground transition-colors rounded-md hover:border-primary outline-none m-0.25 mt-1',
+        selected:
+          'text-white font-medium [&_button]:bg-primary [&_button]:border-primary',
+        focused: 'text-white [&_button]:bg-primary [&_button]:border-primary',
+        today:
+          'text-primary font-semibold [&_button]:border [&_button]:border-border ',
         disabled: 'opacity-25 pointer-events-none',
       }}
       formatters={{
@@ -78,7 +73,7 @@ export function Calendar({
         },
       }}
       components={{
-        Nav: navMode === 'step' ? CalendarStepNav : CalendarDropdownNav,
+        Nav: navMode !== 'step' ? CalendarStepNav : CalendarDropdownNav,
       }}
       {...props}
     />
@@ -90,7 +85,8 @@ export function Calendar({
   <Calendar
     selected={selectedDate}
     onSelect={setSelectedDate}
-    navMode="dropdown" | "step" (default)
+    startDate={Date} - optional
+    navMode={"dropdown" | "step" (default)} - optional 
     allowFutureDates={true | false (default)} - optional
   />
 
diff --git a/src/components/ui/calendar/step-nav.tsx b/src/components/ui/calendar/step-nav.tsx
index 4381912d..b34acd19 100644
--- a/src/components/ui/calendar/step-nav.tsx
+++ b/src/components/ui/calendar/step-nav.tsx
@@ -13,23 +13,21 @@ export function CalendarStepNav(props: Readonly<NavProps>) {
   const label = format(currentMonth, 'MMMM yyyy', { locale: ptBR })
 
   return (
-    <div className='bg-background-soft flex items-center justify-between rounded-lg p-1.5'>
+    <div className='bg-accent flex items-center justify-between rounded-lg p-1.5'>
       <Button
-        size='icon'
+        size='icon_sm'
         variant='outline'
-        className='size-8'
         onClick={onPreviousClick}
         disabled={!previousMonth}
       >
         <ChevronLeftIcon />
       </Button>
 
-      <span className='text-sm font-medium capitalize'>{label}</span>
+      <span className='font-medium capitalize'>{label}</span>
 
       <Button
-        size='icon'
+        size='icon_sm'
         variant='outline'
-        className='size-8 disabled:pointer-events-auto disabled:cursor-not-allowed disabled:opacity-25'
         onClick={onNextClick}
         disabled={!nextMonth}
       >

From b85c2ce86cd7c8b7c9b19c7c8ec6175f588584da Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sat, 7 Feb 2026 13:39:12 -0300
Subject: [PATCH 39/77] chore(filters): improve filters sizes and spacing

---
 src/components/filters/date.tsx                      |  2 +-
 src/components/filters/filter-select.tsx             |  1 -
 src/components/ui/date-picker.tsx                    |  2 +-
 src/components/ui/select.tsx                         |  2 +-
 .../patient-requirements/approved-list-table.tsx     |  2 +-
 .../patient-requirements/pending-requirements.tsx    |  2 +-
 .../under-review-requirements.tsx                    |  2 +-
 src/modules/patients/table/index.tsx                 | 12 ++++++------
 src/modules/referrals/list.tsx                       | 10 +++++-----
 src/modules/teams/table.tsx                          |  4 ++--
 10 files changed, 19 insertions(+), 20 deletions(-)

diff --git a/src/components/filters/date.tsx b/src/components/filters/date.tsx
index 1381d4fb..bfdd7673 100644
--- a/src/components/filters/date.tsx
+++ b/src/components/filters/date.tsx
@@ -37,7 +37,7 @@ export function FilterDate({
   }
 
   return (
-    <div className={cn('grid w-80 grid-cols-2 gap-2', className)} {...props}>
+    <div className={cn('grid w-74 grid-cols-2 gap-2', className)} {...props}>
       <FilterContainer title='Data inicial'>
         <DatePicker
           size='sm'
diff --git a/src/components/filters/filter-select.tsx b/src/components/filters/filter-select.tsx
index 00047f31..3bb03976 100644
--- a/src/components/filters/filter-select.tsx
+++ b/src/components/filters/filter-select.tsx
@@ -29,7 +29,6 @@ export function FilterSelect({ param, ...props }: Readonly<FilterSelectProps>) {
   return (
     <Select
       size='sm'
-      align='end'
       value={selectValue}
       onValueChange={handleSelect}
       {...props}
diff --git a/src/components/ui/date-picker.tsx b/src/components/ui/date-picker.tsx
index c934d826..bd3f9818 100644
--- a/src/components/ui/date-picker.tsx
+++ b/src/components/ui/date-picker.tsx
@@ -68,7 +68,7 @@ export function DatePicker({
         {date ? (
           formatDate(date, { dateStyle: 'short' })
         ) : (
-          <span className='text-disabled'>Selecionar...</span>
+          <span className='text-disabled'>Selecionar</span>
         )}
       </PopoverTrigger>
 
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
index 8e4f02e1..892a05ee 100644
--- a/src/components/ui/select.tsx
+++ b/src/components/ui/select.tsx
@@ -45,7 +45,7 @@ export type SelectProps = Omit<SelectRootProps<string, false>, 'items'> &
 export function Select({
   size,
   value,
-  align,
+  align = 'start',
   options,
   className,
   resetLabel,
diff --git a/src/modules/patient-requirements/approved-list-table.tsx b/src/modules/patient-requirements/approved-list-table.tsx
index e2d22887..08a8ff21 100644
--- a/src/modules/patient-requirements/approved-list-table.tsx
+++ b/src/modules/patient-requirements/approved-list-table.tsx
@@ -100,7 +100,7 @@ export function ApprovedPatientRequirementsListTable() {
           <FilterSelect
             param={QUERY_PARAM_KEYS.orderBy}
             options={PATIENT_REQUIREMENTS_ORDER_OPTIONS}
-            placeholder='Ordenar por...'
+            placeholder='Ordenar por'
             resetLabel='Limpar ordem'
             className='w-52'
           />
diff --git a/src/modules/patient-requirements/pending-requirements.tsx b/src/modules/patient-requirements/pending-requirements.tsx
index 263ed57a..8fa923e4 100644
--- a/src/modules/patient-requirements/pending-requirements.tsx
+++ b/src/modules/patient-requirements/pending-requirements.tsx
@@ -105,7 +105,7 @@ export function PendingPatientRequirements() {
           <FilterSelect
             param={QUERY_PARAM_KEYS.orderBy}
             options={PATIENT_REQUIREMENTS_ORDER_OPTIONS}
-            placeholder='Ordenar por...'
+            placeholder='Ordenar por'
             resetLabel='Limpar ordem'
             className='w-52'
           />
diff --git a/src/modules/patient-requirements/under-review-requirements.tsx b/src/modules/patient-requirements/under-review-requirements.tsx
index d148e07a..3583eb64 100644
--- a/src/modules/patient-requirements/under-review-requirements.tsx
+++ b/src/modules/patient-requirements/under-review-requirements.tsx
@@ -101,7 +101,7 @@ export function UnderReviewPatientRequirements() {
           <FilterSelect
             param={QUERY_PARAM_KEYS.orderBy}
             options={PATIENT_REQUIREMENTS_ORDER_OPTIONS}
-            placeholder='Ordenar por...'
+            placeholder='Ordenar por'
             resetLabel='Limpar ordem'
             className='w-52'
           />
diff --git a/src/modules/patients/table/index.tsx b/src/modules/patients/table/index.tsx
index f517cd95..876cb474 100644
--- a/src/modules/patients/table/index.tsx
+++ b/src/modules/patients/table/index.tsx
@@ -113,30 +113,30 @@ export function PatientsTable() {
           total={stableTotal}
         />
         <SectionHeaderActions>
-          <SearchInput placeholder='Pesquisar...' className='w-48' />
+          <SearchInput placeholder='Pesquisar' className='w-40' />
           <FilterSelect
             param={QUERY_PARAM_KEYS.orderBy}
             options={PATIENTS_ORDER_OPTIONS}
-            placeholder='Ordenar por...'
+            placeholder='Ordenar por'
             resetLabel='Limpar ordem'
-            className='w-52'
+            className='w-40'
           />
           <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
 
           <NavButton size='sm' href={ROUTES.dashboard.patients.new}>
             <PlusIcon />
-            Cadastrar paciente
+            Cadastrar
           </NavButton>
         </SectionHeaderActions>
       </SectionHeader>
 
       {showFilters && (
         <section className='flex items-end gap-8'>
-          <FilterContainer title='Status' className='w-48'>
+          <FilterContainer title='Status' className='w-40'>
             <FilterSelect
               param={QUERY_PARAM_KEYS.status}
               options={PATIENT_STATUS_OPTIONS}
-              placeholder='Selecione o status'
+              placeholder='Todos'
               resetLabel='Limpar status'
             />
           </FilterContainer>
diff --git a/src/modules/referrals/list.tsx b/src/modules/referrals/list.tsx
index 1468e4ed..a880b679 100644
--- a/src/modules/referrals/list.tsx
+++ b/src/modules/referrals/list.tsx
@@ -107,11 +107,11 @@ export function ReferralsList() {
           total={stableTotal}
         />
         <SectionHeaderActions>
-          <SearchInput placeholder='Pesquisar...' className='w-48' />
+          <SearchInput placeholder='Pesquisar' className='w-48' />
           <FilterSelect
             param={QUERY_PARAM_KEYS.orderBy}
             options={REFERRALS_ORDER_OPTIONS}
-            placeholder='Ordenar por...'
+            placeholder='Ordenar por'
             resetLabel='Limpar ordem'
             className='w-52'
           />
@@ -122,8 +122,8 @@ export function ReferralsList() {
       </SectionHeader>
 
       {showFilters && (
-        <section className='flex items-end gap-6'>
-          <FilterContainer title='Categoria' className='w-48'>
+        <section className='flex flex-wrap items-end gap-6'>
+          <FilterContainer title='Categoria' className='w-46'>
             <FilterSelect
               param={QUERY_PARAM_KEYS.category}
               options={SPECIALTIES_OPTIONS}
@@ -131,7 +131,7 @@ export function ReferralsList() {
               resetLabel='Limpar categoria'
             />
           </FilterContainer>
-          <FilterContainer title='Status' className='w-48'>
+          <FilterContainer title='Status' className='w-46'>
             <FilterSelect
               param={QUERY_PARAM_KEYS.status}
               options={REFERRAL_STATUS_OPTIONS}
diff --git a/src/modules/teams/table.tsx b/src/modules/teams/table.tsx
index 5b50c7c1..f45816e5 100644
--- a/src/modules/teams/table.tsx
+++ b/src/modules/teams/table.tsx
@@ -70,12 +70,12 @@ export function TeamListTable() {
         />
 
         <SectionHeaderActions>
-          <SearchInput placeholder='Pesquisar...' className='w-48' />
+          <SearchInput placeholder='Pesquisar' className='w-48' />
 
           <FilterSelect
             param={QUERY_PARAM_KEYS.orderBy}
             options={TEAMS_ORDER_OPTIONS}
-            placeholder='Ordenar por...'
+            placeholder='Ordenar por'
             resetLabel='Limpar ordem'
             className='w-68'
           />

From c875181f87d28d8bff416097886b532a2255f87f Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sat, 7 Feb 2026 13:43:08 -0300
Subject: [PATCH 40/77] chore(modals): change cancel button label to avoid
 misunderstanding

---
 src/modules/appointments/appointment-modal.tsx         | 2 +-
 src/modules/patient-requirements/requirement-modal.tsx | 2 +-
 src/modules/patients/inactivate-modal.tsx              | 2 +-
 src/modules/referrals/referral-modal.tsx               | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/modules/appointments/appointment-modal.tsx b/src/modules/appointments/appointment-modal.tsx
index 5c52706d..e77293eb 100644
--- a/src/modules/appointments/appointment-modal.tsx
+++ b/src/modules/appointments/appointment-modal.tsx
@@ -192,7 +192,7 @@ export function AppointmentModal({
           className='flex-1'
           disabled={formMethods.formState.isSubmitting}
         >
-          Cancelar
+          Voltar
         </DialogClose>
       </DialogFooter>
     </DialogContainer>
diff --git a/src/modules/patient-requirements/requirement-modal.tsx b/src/modules/patient-requirements/requirement-modal.tsx
index bdd40bbe..dbf1efb8 100644
--- a/src/modules/patient-requirements/requirement-modal.tsx
+++ b/src/modules/patient-requirements/requirement-modal.tsx
@@ -126,7 +126,7 @@ export function PatientRequirementModal({
           className='flex-1'
           disabled={formMethods.formState.isSubmitting}
         >
-          Cancelar
+          Voltar
         </DialogClose>
       </DialogFooter>
     </DialogContainer>
diff --git a/src/modules/patients/inactivate-modal.tsx b/src/modules/patients/inactivate-modal.tsx
index 969f91c8..bf6b8427 100644
--- a/src/modules/patients/inactivate-modal.tsx
+++ b/src/modules/patients/inactivate-modal.tsx
@@ -107,7 +107,7 @@ export function InactivatePatientModal({
           className='flex-1'
           disabled={formMethods.formState.isSubmitting}
         >
-          Cancelar
+          Voltar
         </DialogClose>
       </DialogFooter>
     </DialogContainer>
diff --git a/src/modules/referrals/referral-modal.tsx b/src/modules/referrals/referral-modal.tsx
index ec10a9a1..736cdc66 100644
--- a/src/modules/referrals/referral-modal.tsx
+++ b/src/modules/referrals/referral-modal.tsx
@@ -195,7 +195,7 @@ export function ReferralModal({
           className='flex-1'
           disabled={formMethods.formState.isSubmitting}
         >
-          Cancelar
+          Voltar
         </DialogClose>
       </DialogFooter>
     </DialogContainer>

From 784a68286da36231b137cf0a343aa95199ec8017 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sat, 7 Feb 2026 17:03:07 -0300
Subject: [PATCH 41/77] feat(users): create main users page

---
 src/app/(dashboard)/equipe/page.tsx       |   4 +-
 src/components/sidebar/index.tsx          |   2 +-
 src/components/ui/button.tsx              |   2 +
 src/components/ui/dialog.tsx              |  31 ++-
 src/components/ui/menu.tsx                |   2 +
 src/constants/cache.ts                    |   3 +
 src/constants/routes.ts                   |   3 +-
 src/enums/params.ts                       |   1 +
 src/enums/team.ts                         |  14 --
 src/enums/users.ts                        |  28 ++-
 src/modules/appointments/table/index.tsx  |   2 +-
 src/modules/referrals/table/index.tsx     |   2 +-
 src/modules/teams/table.tsx               | 169 ----------------
 src/modules/users/change-status-modal.tsx | 110 ++++++++++
 src/modules/users/list.tsx                | 152 ++++++++++++++
 src/modules/users/table/actions.tsx       |  92 +++++++++
 src/modules/users/table/index.tsx         |  95 +++++++++
 src/modules/users/table/skeleton.tsx      |  35 ++++
 src/types/orders.d.ts                     |   2 +
 src/types/team.d.ts                       |   2 -
 src/types/users.d.ts                      |   5 +-
 src/utils/mock/patients.ts                | 234 ----------------------
 src/utils/mock/queue-service-patients.ts  |  42 ----
 src/utils/mock/teams.ts                   |  92 ---------
 24 files changed, 550 insertions(+), 574 deletions(-)
 delete mode 100644 src/enums/team.ts
 delete mode 100644 src/modules/teams/table.tsx
 create mode 100644 src/modules/users/change-status-modal.tsx
 create mode 100644 src/modules/users/list.tsx
 create mode 100644 src/modules/users/table/actions.tsx
 create mode 100644 src/modules/users/table/index.tsx
 create mode 100644 src/modules/users/table/skeleton.tsx
 delete mode 100644 src/types/team.d.ts
 delete mode 100644 src/utils/mock/patients.ts
 delete mode 100644 src/utils/mock/queue-service-patients.ts
 delete mode 100644 src/utils/mock/teams.ts

diff --git a/src/app/(dashboard)/equipe/page.tsx b/src/app/(dashboard)/equipe/page.tsx
index 3491eecc..cb8a7896 100644
--- a/src/app/(dashboard)/equipe/page.tsx
+++ b/src/app/(dashboard)/equipe/page.tsx
@@ -1,11 +1,11 @@
 import type { Metadata } from 'next'
 
-import { TeamListTable } from '@/modules/teams/table'
+import { UsersList } from '@/modules/users/list'
 
 export const metadata: Metadata = {
   title: 'Equipe',
 }
 
 export default function Page() {
-  return <TeamListTable />
+  return <UsersList />
 }
diff --git a/src/components/sidebar/index.tsx b/src/components/sidebar/index.tsx
index 7694fa35..4d7900fd 100644
--- a/src/components/sidebar/index.tsx
+++ b/src/components/sidebar/index.tsx
@@ -66,7 +66,7 @@ const SIDEBAR_SECTIONS = [
       {
         label: 'Equipe',
         icon: <HeartHandshakeIcon />,
-        path: ROUTES.dashboard.team.main,
+        path: ROUTES.dashboard.users.main,
       },
     ],
   },
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index 58fe7cf3..f3059d90 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -13,6 +13,8 @@ const buttonVariants = cva(
           'bg-primary text-primary-foreground hover:bg-primary/80 shadow-xs',
         destructive:
           'bg-error text-primary-foreground hover:bg-error/80 shadow-xs',
+        success:
+          'bg-success text-primary-foreground hover:bg-success/80 shadow-xs',
         outline:
           'border-border hover:bg-accent text-accent-foreground bg-background border shadow-xs',
         muted: 'bg-background-soft text-accent-foreground hover:bg-border',
diff --git a/src/components/ui/dialog.tsx b/src/components/ui/dialog.tsx
index ad3ac72f..df17a6a1 100644
--- a/src/components/ui/dialog.tsx
+++ b/src/components/ui/dialog.tsx
@@ -1,5 +1,5 @@
 import { Dialog as BaseDialog } from '@base-ui-components/react/dialog'
-import type { VariantProps } from 'class-variance-authority'
+import { cva, type VariantProps } from 'class-variance-authority'
 import { type LucideIcon, XIcon } from 'lucide-react'
 
 import { cn } from '@/utils/class-name-merge'
@@ -79,18 +79,29 @@ export function DialogHeader({
 interface DialogIconProps extends React.ComponentProps<'div'> {
   icon: LucideIcon
 }
+
+const dialogIconVariants = cva('border-border size-12 rounded-full p-2.5', {
+  variants: {
+    variant: {
+      default: 'text-foreground-soft border',
+      destructive: 'text-error bg-error/10',
+      success: 'text-success bg-success/10',
+    },
+  },
+  defaultVariants: {
+    variant: 'default',
+  },
+})
+
+type DialogIconComponentProps = DialogIconProps &
+  VariantProps<typeof dialogIconVariants>
+
 export function DialogIcon({
   icon: Icon,
+  variant,
   className,
-}: Readonly<DialogIconProps>) {
-  return (
-    <Icon
-      className={cn(
-        'border-border text-foreground-soft size-12 rounded-full border p-2.5',
-        className,
-      )}
-    />
-  )
+}: Readonly<DialogIconComponentProps>) {
+  return <Icon className={cn(dialogIconVariants({ variant, className }))} />
 }
 
 export function DialogTitle({
diff --git a/src/components/ui/menu.tsx b/src/components/ui/menu.tsx
index 0fcc5e32..58abd45e 100644
--- a/src/components/ui/menu.tsx
+++ b/src/components/ui/menu.tsx
@@ -63,6 +63,8 @@ const menuItemVariants = cva(
     variants: {
       variant: {
         default: 'text-foreground-soft',
+        success:
+          'text-success data-[highlighted]:bg-success/10 data-[highlighted]:text-success',
         destructive:
           'text-error data-[highlighted]:bg-error/10 data-[highlighted]:text-error',
       },
diff --git a/src/constants/cache.ts b/src/constants/cache.ts
index 8efd4bd7..6f02b76b 100644
--- a/src/constants/cache.ts
+++ b/src/constants/cache.ts
@@ -34,6 +34,9 @@ export const QUERY_CACHE_KEYS = {
     patientsByGender: 'dashboard-patients-by-gender',
     patientsByCity: 'dashboard-patients-by-city',
   },
+  users: {
+    main: 'users',
+  },
   patients: {
     main: 'patients',
     allOptions: 'patients-all-options',
diff --git a/src/constants/routes.ts b/src/constants/routes.ts
index 574f81dd..0949711e 100644
--- a/src/constants/routes.ts
+++ b/src/constants/routes.ts
@@ -46,8 +46,9 @@ export const ROUTES = {
       pendingSubmissions: '/aprovacoes/envios-pendentes',
       approved: '/aprovacoes/aprovados',
     },
-    team: {
+    users: {
       main: '/equipe',
+      details: (id: string) => `/equipe/membro/${id}`,
     },
     settings: {
       main: '/configuracoes',
diff --git a/src/enums/params.ts b/src/enums/params.ts
index 02297090..7777625c 100644
--- a/src/enums/params.ts
+++ b/src/enums/params.ts
@@ -4,6 +4,7 @@ export const QUERY_PARAM_KEYS = {
   order: 'order',
   orderBy: 'orderBy',
   status: 'status',
+  role: 'role',
   category: 'category',
   startDate: 'startDate',
   endDate: 'endDate',
diff --git a/src/enums/team.ts b/src/enums/team.ts
deleted file mode 100644
index 90127a5c..00000000
--- a/src/enums/team.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
-
-export const TEAMS_ORDERS = {
-  name_asc: 'Nome (Crescente)',
-  name_desc: 'Nome (Decrescente)',
-  date_asc: 'Data (Crescente)',
-  date_desc: 'Data (Decrescente)',
-  role_asc: 'Função (Crescente)',
-  role_desc: 'Função (Decrescente)',
-  specialty_desc: 'Especialidade (Decrescente)',
-  specialty_asc: 'Especialidade (Crescente)',
-}
-export type TeamsOrder = keyof typeof TEAMS_ORDERS
-export const TEAMS_ORDER_OPTIONS = convertObjectToOptions(TEAMS_ORDERS)
diff --git a/src/enums/users.ts b/src/enums/users.ts
index cdbc608f..b0c12842 100644
--- a/src/enums/users.ts
+++ b/src/enums/users.ts
@@ -1,13 +1,33 @@
+import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
+
 export const USER_ROLES = {
   admin: 'Administração',
   nurse: 'Enfermagem',
   specialist: 'Especialista',
-  manager: 'Manager',
+  manager: 'Gestão',
 }
 export type UserRole = keyof typeof USER_ROLES
+export const USERS_ROLE_OPTIONS = convertObjectToOptions(USER_ROLES)
 
 export const USER_STATUSES = {
-  active: 'Ativo',
-  inactive: 'Inativo',
-}
+  active: { variant: 'success', label: 'Ativo' },
+  inactive: { variant: 'error', label: 'Inativo' },
+} as const
 export type UserStatus = keyof typeof USER_STATUSES
+
+export const USER_STATUS_OPTIONS = Object.entries(USER_STATUSES).map(
+  ([key, status]) => ({ label: status.label, value: key }),
+)
+
+export const USERS_ORDERS = {
+  name_asc: 'Nome (Asc.)',
+  name_desc: 'Nome (Desc.)',
+  date_asc: 'Data (Asc.)',
+  date_desc: 'Data (Desc.)',
+  role_asc: 'Cargo (Asc.)',
+  role_desc: 'Cargo (Desc.)',
+  status_desc: 'Status (Desc.)',
+  status_asc: 'Status (Asc.)',
+}
+export type UsersOrder = keyof typeof USERS_ORDERS
+export const USERS_ORDER_OPTIONS = convertObjectToOptions(USERS_ORDERS)
diff --git a/src/modules/appointments/table/index.tsx b/src/modules/appointments/table/index.tsx
index 20eaf5dc..fe1b5e2d 100644
--- a/src/modules/appointments/table/index.tsx
+++ b/src/modules/appointments/table/index.tsx
@@ -64,7 +64,7 @@ export function AppointmentsTable({
                 </TableCell>
                 <TableCell>{formatDate(appointment.date)}</TableCell>
                 <TableCell>
-                  <Tag>{SPECIALTIES[appointment.category]}</Tag>
+                  <Tag size='sm'>{SPECIALTIES[appointment.category]}</Tag>
                 </TableCell>
                 <TableCell>{appointment.professional_name ?? '-'}</TableCell>
                 <TableCell>
diff --git a/src/modules/referrals/table/index.tsx b/src/modules/referrals/table/index.tsx
index 939fc997..0e42bfad 100644
--- a/src/modules/referrals/table/index.tsx
+++ b/src/modules/referrals/table/index.tsx
@@ -79,7 +79,7 @@ export function ReferralsTable({
                 </TableCell>
                 <TableCell>{formatDate(referral.date)}</TableCell>
                 <TableCell>
-                  <Tag>{SPECIALTIES[referral.category]}</Tag>
+                  <Tag size='sm'>{SPECIALTIES[referral.category]}</Tag>
                 </TableCell>
                 <TableCell>{referral.professional_name ?? '-'}</TableCell>
                 <TableCell>
diff --git a/src/modules/teams/table.tsx b/src/modules/teams/table.tsx
deleted file mode 100644
index f45816e5..00000000
--- a/src/modules/teams/table.tsx
+++ /dev/null
@@ -1,169 +0,0 @@
-'use client'
-
-import {
-  ClipboardPenIcon,
-  EllipsisIcon,
-  PlusIcon,
-  XCircleIcon,
-} from 'lucide-react'
-import { useState } from 'react'
-
-import { FilterSelect } from '@/components/filters/filter-select'
-import { SearchInput } from '@/components/filters/search-input'
-import { Pagination } from '@/components/pagination'
-import {
-  SectionHeader,
-  SectionHeaderActions,
-} from '@/components/section-header'
-import { Avatar } from '@/components/ui/avatar'
-import { Button } from '@/components/ui/button'
-import { Card } from '@/components/ui/card'
-import { Divider } from '@/components/ui/divider'
-import { DropdownMenu } from '@/components/ui/dropdown'
-import { DropdownMenuContent } from '@/components/ui/dropdown/content'
-import { DropdownMenuItem } from '@/components/ui/dropdown/item'
-import { DropdownMenuTrigger } from '@/components/ui/dropdown/trigger'
-import { StatusTag } from '@/components/ui/status-tag'
-import { TabSelect } from '@/components/ui/tab-select'
-import {
-  Table,
-  TableBody,
-  TableButton,
-  TableCell,
-  TableHead,
-  TableHeader,
-  TableRow,
-} from '@/components/ui/table'
-import { Tag } from '@/components/ui/tag'
-import { QUERY_PARAM_KEYS } from '@/enums/params'
-import { TEAMS_ORDER_OPTIONS } from '@/enums/team'
-import { formatDate } from '@/utils/formatters/format-date'
-import { TEAMS_MOCK } from '@/utils/mock/teams'
-
-type Status = 'all' | 'active' | 'inactive'
-
-export function TeamListTable() {
-  const members = TEAMS_MOCK
-
-  const [statusFilter, setStatusFilter] = useState<Status>('all')
-
-  const filteredMembers = members.filter((member) => {
-    if (statusFilter === 'all') {
-      return true
-    }
-    return member.status === statusFilter
-  })
-
-  const filterOptions: Array<{ label: string; value: Status }> = [
-    { label: 'Todos', value: 'all' },
-    { label: 'Ativos', value: 'active' },
-    { label: 'Inativos', value: 'inactive' },
-  ]
-
-  return (
-    <>
-      <SectionHeader>
-        <TabSelect
-          value={statusFilter}
-          onSelect={(value) => setStatusFilter(value)}
-          options={filterOptions}
-        />
-
-        <SectionHeaderActions>
-          <SearchInput placeholder='Pesquisar' className='w-48' />
-
-          <FilterSelect
-            param={QUERY_PARAM_KEYS.orderBy}
-            options={TEAMS_ORDER_OPTIONS}
-            placeholder='Ordenar por'
-            resetLabel='Limpar ordem'
-            className='w-68'
-          />
-
-          <Button size='sm'>
-            <PlusIcon />
-            Novo membro
-          </Button>
-        </SectionHeaderActions>
-      </SectionHeader>
-
-      <Card className='p-6 sm:col-span-6'>
-        <Table>
-          <TableHeader>
-            <TableRow>
-              <TableHead className='w-64'>Colaborador</TableHead>
-              <TableHead>Data de entrada</TableHead>
-              <TableHead>Função</TableHead>
-              <TableHead>Especialidade</TableHead>
-              <TableHead>Registro</TableHead>
-              <TableHead>Status</TableHead>
-              <TableHead>Ações</TableHead>
-            </TableRow>
-          </TableHeader>
-
-          <TableBody>
-            {filteredMembers.map((member) => {
-              return (
-                <TableRow key={member.id}>
-                  <TableCell>
-                    <TableButton className='w-64'>
-                      <Avatar className='size-9' />
-                      <span className='truncate'>{member.name}</span>
-                    </TableButton>
-                  </TableCell>
-
-                  <TableCell>{formatDate(member.entryDate)}</TableCell>
-
-                  <TableCell>
-                    <Tag>{member.role}</Tag>
-                  </TableCell>
-
-                  <TableCell>
-                    {member.specialty ? <Tag>{member.specialty}</Tag> : '-'}
-                  </TableCell>
-
-                  <TableCell>{member.registration}</TableCell>
-
-                  <TableCell>
-                    <StatusTag status={member.status} />
-                  </TableCell>
-
-                  <TableCell>
-                    <DropdownMenu>
-                      <DropdownMenuTrigger
-                        size='icon'
-                        variant='ghost'
-                        className='size-8'
-                      >
-                        <EllipsisIcon />
-                      </DropdownMenuTrigger>
-
-                      <DropdownMenuContent align='end'>
-                        <DropdownMenuItem>
-                          <ClipboardPenIcon />
-                          Editar
-                        </DropdownMenuItem>
-
-                        <Divider />
-
-                        <DropdownMenuItem
-                          variant='destructive'
-                          className='text-center'
-                        >
-                          <XCircleIcon />
-                          Desativar
-                        </DropdownMenuItem>
-                      </DropdownMenuContent>
-                    </DropdownMenu>
-                  </TableCell>
-                </TableRow>
-              )
-            })}
-          </TableBody>
-        </Table>
-      </Card>
-
-      <Pagination totalItems={filteredMembers.length} />
-    </>
-  )
-}
diff --git a/src/modules/users/change-status-modal.tsx b/src/modules/users/change-status-modal.tsx
new file mode 100644
index 00000000..62240787
--- /dev/null
+++ b/src/modules/users/change-status-modal.tsx
@@ -0,0 +1,110 @@
+'use client'
+
+import { CircleCheckIcon, CircleXIcon } from 'lucide-react'
+import { useTransition } from 'react'
+import { toast } from 'sonner'
+
+import { Button } from '@/components/ui/button'
+import {
+  DialogClose,
+  DialogContainer,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogIcon,
+  DialogTitle,
+} from '@/components/ui/dialog'
+import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
+import { revalidateClientCache } from '@/helpers/revalidate-client-cache'
+import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
+import { api } from '@/lib/api'
+import type { User } from '@/types/users'
+
+interface ChangeUserStatusModalModalProps {
+  user: User
+  onClose: () => void
+}
+
+export function ChangeUserStatusModal({
+  user,
+  onClose,
+}: Readonly<ChangeUserStatusModalModalProps>) {
+  const [isPending, startTransition] = useTransition()
+
+  const actionToPerfom = user.status === 'active' ? 'inactivate' : 'activate'
+
+  const actionContent = {
+    inactivate: {
+      icon: CircleXIcon,
+      action: 'Inativar',
+      result: 'perderá o',
+      variant: 'destructive',
+    },
+    activate: {
+      icon: CircleCheckIcon,
+      action: 'Ativar',
+      result: 'terá',
+      variant: 'success',
+    },
+  } as const
+
+  const selectedAction = actionContent[actionToPerfom]
+
+  async function changeUserStatus() {
+    startTransition(async () => {
+      const response = await api(`/users/${user.id}/${actionToPerfom}`, {
+        method: 'PATCH',
+      })
+
+      if (!response.success) {
+        toast.error(response.message)
+        return
+      }
+
+      revalidateClientCache(QUERY_CACHE_KEYS.users.main)
+      revalidateServerCache(NEXT_CACHE_TAGS.user(user.id))
+
+      toast.success(response.message)
+      onClose()
+    })
+  }
+
+  return (
+    <DialogContainer>
+      <DialogHeader
+        icon={
+          <DialogIcon
+            icon={selectedAction.icon}
+            variant={selectedAction.variant}
+          />
+        }
+      >
+        <DialogTitle>{selectedAction.action} usuário</DialogTitle>
+      </DialogHeader>
+
+      <DialogContent className='space-y-2'>
+        <p>
+          Você tem certeza que deseja {selectedAction.action.toLowerCase()} o
+          usuário <span className='font-semibold'>{user.name}</span>?
+        </p>
+        <p>
+          Ao confirmar, este usuário {selectedAction.result} acesso ao sistema.
+        </p>
+      </DialogContent>
+
+      <DialogFooter>
+        <Button
+          className='flex-1'
+          loading={isPending}
+          variant={selectedAction.variant}
+          onClick={changeUserStatus}
+        >
+          {selectedAction.action}
+        </Button>
+        <DialogClose className='flex-1' disabled={isPending}>
+          Voltar
+        </DialogClose>
+      </DialogFooter>
+    </DialogContainer>
+  )
+}
diff --git a/src/modules/users/list.tsx b/src/modules/users/list.tsx
new file mode 100644
index 00000000..8724c53e
--- /dev/null
+++ b/src/modules/users/list.tsx
@@ -0,0 +1,152 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query'
+import { HeartHandshakeIcon, PlusIcon } from 'lucide-react'
+import { useEffect, useState } from 'react'
+
+import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
+import { FilterContainer } from '@/components/filters/container'
+import { FilterDate } from '@/components/filters/date'
+import { FilterSelect } from '@/components/filters/filter-select'
+import { SearchInput } from '@/components/filters/search-input'
+import { ShowFilterButton } from '@/components/filters/show-filter-button'
+import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
+import { Button } from '@/components/ui/button'
+import { Card } from '@/components/ui/card'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
+import {
+  USER_STATUS_OPTIONS,
+  USERS_ORDER_OPTIONS,
+  USERS_ROLE_OPTIONS,
+  type UsersOrder,
+} from '@/enums/users'
+import { useParams } from '@/hooks/params'
+import { api } from '@/lib/api'
+import type { QueryOrderMapping, UsersOrderBy } from '@/types/orders'
+import type { User } from '@/types/users'
+
+import { UsersTable } from './table'
+
+export function UsersList() {
+  const [showFilters, setShowFilters] = useState(false)
+  const [stableTotal, setStableTotal] = useState(0)
+  const { getParams, paramsQueryKey } = useParams()
+
+  const [page, search, role, status, orderBy, startDate, endDate] = getParams([
+    QUERY_PARAM_KEYS.page,
+    QUERY_PARAM_KEYS.search,
+    QUERY_PARAM_KEYS.role,
+    QUERY_PARAM_KEYS.status,
+    QUERY_PARAM_KEYS.orderBy,
+    QUERY_PARAM_KEYS.startDate,
+    QUERY_PARAM_KEYS.endDate,
+  ])
+
+  const ORDER_MAPPING: QueryOrderMapping<UsersOrder, UsersOrderBy> = {
+    name_asc: { orderBy: 'name', order: 'ASC' },
+    name_desc: { orderBy: 'name', order: 'DESC' },
+    date_asc: { orderBy: 'date', order: 'ASC' },
+    date_desc: { orderBy: 'date', order: 'DESC' },
+    role_asc: { orderBy: 'role', order: 'ASC' },
+    role_desc: { orderBy: 'role', order: 'DESC' },
+    status_asc: { orderBy: 'status', order: 'ASC' },
+    status_desc: { orderBy: 'status', order: 'DESC' },
+  }
+
+  const orderByQuery =
+    ORDER_MAPPING[orderBy as UsersOrder] ?? ORDER_MAPPING['name_asc']
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.users.main, paramsQueryKey],
+    queryFn: () =>
+      api<{ users: User[]; total: number }>('/users', {
+        params: {
+          page,
+          search,
+          role,
+          status,
+          startDate,
+          endDate,
+          ...orderByQuery,
+        },
+      }),
+  })
+
+  const users = response?.data?.users ?? []
+
+  // Update stable total only when we have actual data to prevent pagination flickering
+  useEffect(() => {
+    if (response?.data?.total !== undefined) {
+      setStableTotal(response.data.total)
+    }
+  }, [response?.data?.total])
+
+  useEffect(() => {
+    if (status || role || startDate || endDate) {
+      setShowFilters(true)
+    }
+  }, [status, role, startDate, endDate])
+
+  return (
+    <>
+      <SectionHeader>
+        <SectionHeaderTitle
+          title='Membros'
+          icon={<HeartHandshakeIcon />}
+          total={stableTotal}
+        />
+
+        <SectionHeaderActions>
+          <SearchInput placeholder='Pesquisar' className='w-48' />
+          <FilterSelect
+            param={QUERY_PARAM_KEYS.orderBy}
+            options={USERS_ORDER_OPTIONS}
+            placeholder='Ordenar por'
+            resetLabel='Limpar ordem'
+            className='w-44'
+          />
+          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
+          <Button size='sm'>
+            <PlusIcon />
+            Novo usuário
+          </Button>
+        </SectionHeaderActions>
+      </SectionHeader>
+
+      {showFilters && (
+        <section className='flex flex-wrap items-end gap-6'>
+          <FilterContainer title='Cargo' className='w-44'>
+            <FilterSelect
+              param={QUERY_PARAM_KEYS.role}
+              options={USERS_ROLE_OPTIONS}
+              placeholder='Todos'
+              resetLabel='Limpar cargo'
+            />
+          </FilterContainer>
+          <FilterContainer title='Status' className='w-44'>
+            <FilterSelect
+              param={QUERY_PARAM_KEYS.status}
+              options={USER_STATUS_OPTIONS}
+              placeholder='Todos'
+              resetLabel='Limpar status'
+            />
+          </FilterContainer>
+          <FilterDate />
+          <ClearFiltersButton />
+        </section>
+      )}
+
+      <Card className='p-6 sm:col-span-6'>
+        <UsersTable users={users} loading={isLoading} />
+      </Card>
+
+      <Pagination totalItems={stableTotal} />
+    </>
+  )
+}
diff --git a/src/modules/users/table/actions.tsx b/src/modules/users/table/actions.tsx
new file mode 100644
index 00000000..29123f8f
--- /dev/null
+++ b/src/modules/users/table/actions.tsx
@@ -0,0 +1,92 @@
+'use client'
+
+import {
+  CheckCircle2Icon,
+  ClipboardPenIcon,
+  EllipsisIcon,
+  UserSquare2Icon,
+  XCircleIcon,
+} from 'lucide-react'
+import { useRouter } from 'next/navigation'
+import { useState } from 'react'
+
+import { Dialog } from '@/components/ui/dialog'
+import { Divider } from '@/components/ui/divider'
+import { Menu, MenuContent, MenuItem, MenuTrigger } from '@/components/ui/menu'
+import { ROUTES } from '@/constants/routes'
+import type { User } from '@/types/users'
+
+import { ChangeUserStatusModal } from '../change-status-modal'
+
+type UserModalMode = 'view' | 'edit' | 'status'
+
+interface UsersTableActionsProps {
+  user: User
+}
+
+export function UsersTableActions({ user }: Readonly<UsersTableActionsProps>) {
+  const [modalOpen, setModalOpen] = useState<UserModalMode | null>(null)
+  const router = useRouter()
+
+  const changingStatusData = {
+    active: {
+      variant: 'destructive',
+      icon: <XCircleIcon />,
+      label: 'Desativar',
+    },
+    inactive: {
+      variant: 'success',
+      icon: <CheckCircle2Icon />,
+      label: 'Ativar',
+    },
+  } as const
+
+  const statusButton = changingStatusData[user.status]
+
+  return (
+    <>
+      <Menu>
+        <MenuTrigger size='icon' variant='ghost' className='size-8'>
+          <EllipsisIcon />
+          <span className='sr-only'>Ações</span>
+        </MenuTrigger>
+
+        <MenuContent align='end'>
+          <MenuItem onClick={() => setModalOpen('edit')}>
+            <ClipboardPenIcon />
+            Editar
+          </MenuItem>
+
+          <MenuItem
+            onClick={() => router.push(ROUTES.dashboard.users.details(user.id))}
+          >
+            <UserSquare2Icon />
+            Informações do usuário
+          </MenuItem>
+
+          <Divider className='my-1' />
+
+          <MenuItem
+            variant={statusButton.variant}
+            onClick={() => setModalOpen('status')}
+          >
+            {statusButton.icon}
+            {statusButton.label}
+          </MenuItem>
+        </MenuContent>
+      </Menu>
+
+      {modalOpen === 'status' && (
+        <Dialog
+          open={modalOpen === 'status'}
+          onOpenChange={(open) => setModalOpen(open ? 'edit' : null)}
+        >
+          <ChangeUserStatusModal
+            user={user}
+            onClose={() => setModalOpen(null)}
+          />
+        </Dialog>
+      )}
+    </>
+  )
+}
diff --git a/src/modules/users/table/index.tsx b/src/modules/users/table/index.tsx
new file mode 100644
index 00000000..ae86b007
--- /dev/null
+++ b/src/modules/users/table/index.tsx
@@ -0,0 +1,95 @@
+import { Avatar } from '@/components/ui/avatar'
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableEmptyCell,
+  TableHead,
+  TableHeader,
+  TableLink,
+  TableRow,
+} from '@/components/ui/table'
+import { Tag } from '@/components/ui/tag'
+import { ROUTES } from '@/constants/routes'
+import { SPECIALTIES } from '@/enums/shared'
+import { USER_ROLES, USER_STATUSES } from '@/enums/users'
+import type { User } from '@/types/users'
+import { formatDate } from '@/utils/formatters/format-date'
+
+import { UsersTableActions } from './actions'
+import { UsersTableSkeleton } from './skeleton'
+
+interface UsersTableProps {
+  users: User[]
+  loading?: boolean
+}
+
+export function UsersTable({ users, loading }: Readonly<UsersTableProps>) {
+  const isEmpty = !loading && users.length <= 0
+
+  return (
+    <Table>
+      <TableHeader>
+        <TableRow>
+          <TableHead className='w-64'>Nome</TableHead>
+          <TableHead className='w-36'>Data</TableHead>
+          <TableHead className='w-40'>Função</TableHead>
+          <TableHead className='w-48'>Especialidade</TableHead>
+          <TableHead className='w-44'>Registro</TableHead>
+          <TableHead className='w-24'>Status</TableHead>
+          <TableHead className='w-20 text-center'>Ações</TableHead>
+        </TableRow>
+      </TableHeader>
+      <TableBody>
+        {loading && <UsersTableSkeleton />}
+
+        {isEmpty && (
+          <TableRow>
+            <TableEmptyCell colSpan={7}>
+              Nenhum usuário encontrado
+            </TableEmptyCell>
+          </TableRow>
+        )}
+
+        {!isEmpty &&
+          users.map((user) => {
+            const status = USER_STATUSES[user.status]
+
+            return (
+              <TableRow key={user.id}>
+                <TableCell>
+                  <TableLink
+                    className='w-64'
+                    href={ROUTES.dashboard.users.details(user.id)}
+                  >
+                    <Avatar className='size-9' src={user.avatar_url} />
+                    <span className='truncate'>{user.name}</span>
+                  </TableLink>
+                </TableCell>
+                <TableCell>{formatDate(user.created_at)}</TableCell>
+                <TableCell>
+                  <Tag size='sm'>{USER_ROLES[user.role]}</Tag>
+                </TableCell>
+                <TableCell>
+                  {user.specialty ? (
+                    <Tag size='sm'>{SPECIALTIES[user.specialty]}</Tag>
+                  ) : (
+                    '-'
+                  )}
+                </TableCell>
+                <TableCell>{user.registration_number ?? '-'}</TableCell>
+                <TableCell>
+                  <Tag variant={status.variant} size='sm'>
+                    {status.label}
+                  </Tag>
+                </TableCell>
+                <TableCell className='text-center'>
+                  <UsersTableActions user={user} />
+                </TableCell>
+              </TableRow>
+            )
+          })}
+      </TableBody>
+    </Table>
+  )
+}
diff --git a/src/modules/users/table/skeleton.tsx b/src/modules/users/table/skeleton.tsx
new file mode 100644
index 00000000..8f8cba2b
--- /dev/null
+++ b/src/modules/users/table/skeleton.tsx
@@ -0,0 +1,35 @@
+import { Skeleton } from '@/components/ui/skeleton'
+import { TableCell, TableRow } from '@/components/ui/table'
+
+export function UsersTableSkeleton() {
+  const skeletons = Array.from({ length: 10 }).map((_, index) => index)
+
+  return skeletons.map((skeleton) => (
+    <TableRow key={skeleton}>
+      <TableCell>
+        <div className='flex w-64 items-center gap-2'>
+          <Skeleton className='size-9 rounded-full' />
+          <Skeleton className='h-5 w-44 rounded-md' />
+        </div>
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-5 w-24 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-6 w-32 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-6 w-36 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-5 w-28 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-6 w-16 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='mx-auto size-8 rounded-md' />
+      </TableCell>
+    </TableRow>
+  ))
+}
diff --git a/src/types/orders.d.ts b/src/types/orders.d.ts
index 7479d157..93892258 100644
--- a/src/types/orders.d.ts
+++ b/src/types/orders.d.ts
@@ -5,6 +5,8 @@ export type QueryOrderMapping<
 
 export type QueryOrder = 'ASC' | 'DESC'
 
+export type UsersOrderBy = 'name' | 'status' | 'role' | 'date'
+
 export type PatientsOrderBy = 'name' | 'email' | 'status' | 'date'
 
 export type AppointmentsOrderBy =
diff --git a/src/types/team.d.ts b/src/types/team.d.ts
deleted file mode 100644
index 227c118c..00000000
--- a/src/types/team.d.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export type { TeamsOrder } from '@/enums/team'
-export { TEAMS_ORDER_OPTIONS, TEAMS_ORDERS } from '@/enums/team'
diff --git a/src/types/users.d.ts b/src/types/users.d.ts
index 09b56cc3..2e101717 100644
--- a/src/types/users.d.ts
+++ b/src/types/users.d.ts
@@ -1,12 +1,15 @@
+import type { Specialty } from '@/enums/shared'
 import type { UserRole, UserStatus } from '@/enums/users'
 
 export type User = {
   id: string
   name: string
   email: string
+  role: UserRole
   avatar_url: string | null
   status: UserStatus
-  role: UserRole
+  specialty: Specialty | null
+  registration_number: string | null
   updated_at: Date
   created_at: Date
 }
diff --git a/src/utils/mock/patients.ts b/src/utils/mock/patients.ts
deleted file mode 100644
index c6adaa5d..00000000
--- a/src/utils/mock/patients.ts
+++ /dev/null
@@ -1,234 +0,0 @@
-import type { Patient } from '@/types/patients.d.ts'
-
-export const PATIENTS_MOCKS: Patient[] = [
-  {
-    id: '1',
-    user_id: '1',
-    gender: 'female_cis',
-    date_of_birth: '1990-01-01',
-    phone: '(11) 91234-5678',
-    cpf: '123.456.789-00',
-    state: 'SP',
-    city: 'São Paulo',
-    has_disability: false,
-    disability_desc: null,
-    need_legal_assistance: false,
-    take_medication: false,
-    medication_desc: null,
-    has_nmo_diagnosis: false,
-    status: 'active',
-    created_at: '2025-08-25 02:22:28.455104',
-    updated_at: '2025-08-25 02:22:28.455104',
-    name: 'Lucas Pereira',
-    email: 'lucas.pereira1@example.com',
-    avatar_url:
-      'https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait/male/512/1.jpg',
-  },
-  {
-    id: '2',
-    user_id: '2',
-    gender: 'female_cis',
-    date_of_birth: '1990-01-01',
-    phone: '(11) 91234-5678',
-    cpf: '123.456.789-00',
-    state: 'SP',
-    city: 'São Paulo',
-    has_disability: false,
-    disability_desc: null,
-    need_legal_assistance: false,
-    take_medication: false,
-    medication_desc: null,
-    has_nmo_diagnosis: false,
-    status: 'inactive',
-    created_at: '2025-08-25 02:22:28.455104',
-    updated_at: '2025-08-25 02:22:28.455104',
-    name: 'Clara Almeida',
-    email: 'clara.almeida2@example.com',
-    avatar_url:
-      'https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait/female/512/1.jpg',
-  },
-  {
-    id: '3',
-    user_id: '3',
-    gender: 'female_cis',
-    date_of_birth: '1990-01-01',
-    phone: '(11) 91234-5678',
-    cpf: '123.456.789-00',
-    state: 'SP',
-    city: 'São Paulo',
-    has_disability: false,
-    disability_desc: null,
-    need_legal_assistance: false,
-    take_medication: false,
-    medication_desc: null,
-    has_nmo_diagnosis: false,
-    status: 'active',
-    created_at: '2025-08-25 02:22:28.455104',
-    updated_at: '2025-08-25 02:22:28.455104',
-    name: 'Marcos Silva',
-    email: 'marcos.silva3@example.com',
-    avatar_url:
-      'https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait/male/512/2.jpg',
-  },
-  {
-    id: '4',
-    user_id: '4',
-    gender: 'female_cis',
-    date_of_birth: '1990-01-01',
-    phone: '(11) 91234-5678',
-    cpf: '123.456.789-00',
-    state: 'SP',
-    city: 'São Paulo',
-    has_disability: false,
-    disability_desc: null,
-    need_legal_assistance: false,
-    take_medication: false,
-    medication_desc: null,
-    has_nmo_diagnosis: false,
-    status: 'active',
-    created_at: '2025-08-25 02:22:28.455104',
-    updated_at: '2025-08-25 02:22:28.455104',
-    name: 'Ana Costa',
-    email: 'ana.costa4@example.com',
-    avatar_url:
-      'https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait/female/512/2.jpg',
-  },
-  {
-    id: '5',
-    user_id: '5',
-    gender: 'female_cis',
-    date_of_birth: '1990-01-01',
-    phone: '(11) 91234-5678',
-    cpf: '123.456.789-00',
-    state: 'SP',
-    city: 'São Paulo',
-    has_disability: false,
-    disability_desc: null,
-    need_legal_assistance: false,
-    take_medication: false,
-    medication_desc: null,
-    has_nmo_diagnosis: false,
-    status: 'inactive',
-    created_at: '2025-08-25 02:22:28.455104',
-    updated_at: '2025-08-25 02:22:28.455104',
-    name: 'Felipe Rocha',
-    email: 'felipe.rocha5@example.com',
-    avatar_url:
-      'https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait/male/512/3.jpg',
-  },
-  {
-    id: '6',
-    user_id: '6',
-    gender: 'female_cis',
-    date_of_birth: '1990-01-01',
-    phone: '(11) 91234-5678',
-    cpf: '123.456.789-00',
-    state: 'SP',
-    city: 'São Paulo',
-    has_disability: false,
-    disability_desc: null,
-    need_legal_assistance: false,
-    take_medication: false,
-    medication_desc: null,
-    has_nmo_diagnosis: false,
-    status: 'active',
-    created_at: '2025-08-25 02:22:28.455104',
-    updated_at: '2025-08-25 02:22:28.455104',
-    name: 'Beatriz Santos',
-    email: 'beatriz.santos6@example.com',
-    avatar_url:
-      'https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait/female/512/3.jpg',
-  },
-  {
-    id: '7',
-    user_id: '7',
-    gender: 'female_cis',
-    date_of_birth: '1990-01-01',
-    phone: '(11) 91234-5678',
-    cpf: '123.456.789-00',
-    state: 'SP',
-    city: 'São Paulo',
-    has_disability: false,
-    disability_desc: null,
-    need_legal_assistance: false,
-    take_medication: false,
-    medication_desc: null,
-    has_nmo_diagnosis: false,
-    status: 'active',
-    created_at: '2025-08-25 02:22:28.455104',
-    updated_at: '2025-08-25 02:22:28.455104',
-    name: 'Rafael Lima',
-    email: 'rafael.lima7@example.com',
-    avatar_url:
-      'https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait/male/512/4.jpg',
-  },
-  {
-    id: '8',
-    user_id: '8',
-    gender: 'female_cis',
-    date_of_birth: '1990-01-01',
-    phone: '(11) 91234-5678',
-    cpf: '123.456.789-00',
-    state: 'SP',
-    city: 'São Paulo',
-    has_disability: false,
-    disability_desc: null,
-    need_legal_assistance: false,
-    take_medication: false,
-    medication_desc: null,
-    has_nmo_diagnosis: false,
-    status: 'inactive',
-    created_at: '2025-08-25 02:22:28.455104',
-    updated_at: '2025-08-25 02:22:28.455104',
-    name: 'Julia Alves',
-    email: 'julia.alves8@example.com',
-    avatar_url:
-      'https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait/female/512/4.jpg',
-  },
-  {
-    id: '9',
-    user_id: '9',
-    gender: 'female_cis',
-    date_of_birth: '1990-01-01',
-    phone: '(11) 91234-5678',
-    cpf: '123.456.789-00',
-    state: 'SP',
-    city: 'São Paulo',
-    has_disability: false,
-    disability_desc: null,
-    need_legal_assistance: false,
-    take_medication: false,
-    medication_desc: null,
-    has_nmo_diagnosis: false,
-    status: 'active',
-    created_at: '2025-08-25 02:22:28.455104',
-    updated_at: '2025-08-25 02:22:28.455104',
-    name: 'Pedro Souza',
-    email: 'pedro.souza9@example.com',
-    avatar_url:
-      'https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait/male/512/5.jpg',
-  },
-  {
-    id: '10',
-    user_id: '10',
-    gender: 'female_cis',
-    date_of_birth: '1990-01-01',
-    phone: '(11) 91234-5678',
-    cpf: '123.456.789-00',
-    state: 'SP',
-    city: 'São Paulo',
-    has_disability: false,
-    disability_desc: null,
-    need_legal_assistance: false,
-    take_medication: false,
-    medication_desc: null,
-    has_nmo_diagnosis: false,
-    status: 'inactive',
-    created_at: '2025-08-25 02:22:28.455104',
-    updated_at: '2025-08-25 02:22:28.455104',
-    name: 'Fernanda Oliveira',
-    email: 'fernanda.oliveira10@example.com',
-    avatar_url:
-      'https://cdn.jsdelivr.net/gh/faker-js/assets-person-portrait/female/512/5.jpg',
-  },
-]
diff --git a/src/utils/mock/queue-service-patients.ts b/src/utils/mock/queue-service-patients.ts
deleted file mode 100644
index 2a105115..00000000
--- a/src/utils/mock/queue-service-patients.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-export const QUEUE_SERVICE_PATIENTS_MOCK = [
-  {
-    id: '1',
-    name: 'João da Silva',
-    appointmentDate: new Date('2023-10-01T10:00:00Z'),
-    professional: 'Dr. Ana Souza',
-    specialty: 'Cardiologista',
-    general_condition: 'in_crisis',
-  },
-  {
-    id: '2',
-    name: 'Maria Oliveira',
-    appointmentDate: new Date('2023-10-01T11:00:00Z'),
-    professional: 'Dr. Carlos Pereira',
-    specialty: 'Neurologista',
-    general_condition: 'stable',
-  },
-  {
-    id: '3',
-    name: 'Pedro Santos',
-    appointmentDate: new Date('2023-10-01T12:00:00Z'),
-    professional: 'Dr. Fernanda Lima',
-    specialty: 'Neurologista',
-    general_condition: 'in_crisis',
-  },
-  {
-    id: '4',
-    name: 'Ana Costa',
-    appointmentDate: new Date('2023-10-01T13:00:00Z'),
-    professional: 'Dr. Lucas Almeida',
-    specialty: 'Cardiologista',
-    general_condition: 'stable',
-  },
-  {
-    id: '5',
-    name: 'Roberto Silva',
-    appointmentDate: new Date('2023-10-01T14:00:00Z'),
-    professional: 'Dr. Juliana Rocha',
-    specialty: 'Cardiologista',
-    general_condition: 'stable',
-  },
-] as const
diff --git a/src/utils/mock/teams.ts b/src/utils/mock/teams.ts
deleted file mode 100644
index 6674a8c3..00000000
--- a/src/utils/mock/teams.ts
+++ /dev/null
@@ -1,92 +0,0 @@
-export const TEAMS_MOCK = [
-  {
-    id: '1',
-    name: 'Carlos Ferreira',
-    entryDate: new Date('2022-08-15T09:00:00Z'),
-    role: 'Especialista',
-    specialty: 'Oftalmologia',
-    registration: 'CRM-SP-123456',
-    status: 'active',
-  },
-  {
-    id: '2',
-    name: 'Ana Rodrigues',
-    entryDate: new Date('2023-01-20T14:30:00Z'),
-    role: 'Enfermagem',
-    specialty: 'Psicologia',
-    registration: 'COREN-SP-234567',
-    status: 'active',
-  },
-  {
-    id: '3',
-    name: 'Ricardo Almeida',
-    entryDate: new Date('2021-11-05T08:45:00Z'),
-    role: 'Gestão',
-    specialty: '',
-    registration: 'CRP-SP-345678',
-    status: 'inactive',
-  },
-  {
-    id: '4',
-    name: 'Juliana Martins',
-    entryDate: new Date('2023-03-10T11:00:00Z'),
-    role: 'Especialista',
-    specialty: 'Neurologia',
-    registration: 'CRM-SP-456789',
-    status: 'active',
-  },
-  {
-    id: '5',
-    name: 'Lucas Gonçalves',
-    entryDate: new Date('2022-05-25T16:20:00Z'),
-    role: 'Enfermagem',
-    specialty: 'Terapia ocupacional',
-    registration: 'COREN-SP-567890',
-    status: 'active',
-  },
-  {
-    id: '6',
-    name: 'Beatriz Costa',
-    entryDate: new Date('2023-09-01T07:00:00Z'),
-    role: 'Especialista',
-    specialty: 'Nutrição',
-    registration: 'CRN-SP-678901',
-    status: 'inactive',
-  },
-  {
-    id: '7',
-    name: 'Fernando Pereira',
-    entryDate: new Date('2020-02-18T13:15:00Z'),
-    role: 'Gestão',
-    specialty: '',
-    registration: 'CREFITO-SP-789012',
-    status: 'active',
-  },
-  {
-    id: '8',
-    name: 'Sofia Ribeiro',
-    entryDate: new Date('2023-07-22T10:30:00Z'),
-    role: 'Especialista',
-    specialty: 'Psicologia',
-    registration: 'CRP-SP-890123',
-    status: 'active',
-  },
-  {
-    id: '9',
-    name: 'Gustavo Santos',
-    entryDate: new Date('2022-10-30T18:00:00Z'),
-    role: 'Enfermagem',
-    specialty: 'Fonoaudiologia',
-    registration: 'COREN-SP-901234',
-    status: 'inactive',
-  },
-  {
-    id: '10',
-    name: 'Larissa Oliveira',
-    entryDate: new Date('2021-08-12T09:45:00Z'),
-    role: 'Especialista',
-    specialty: 'Psicologia',
-    registration: 'CRM-SP-112233',
-    status: 'active',
-  },
-] as const

From a5f71bb48483b28574af5a112587e367798782cf Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 9 Feb 2026 14:47:50 -0300
Subject: [PATCH 42/77] chore(team): rename table to `user-table` to avoid
 conflict with new tables

---
 src/app/(dashboard)/equipe/page.tsx                   | 2 +-
 src/modules/users/{list.tsx => users-list.tsx}        | 2 +-
 src/modules/users/{table => users-table}/actions.tsx  | 0
 src/modules/users/{table => users-table}/index.tsx    | 4 ++--
 src/modules/users/{table => users-table}/skeleton.tsx | 0
 src/types/users.d.ts                                  | 2 +-
 6 files changed, 5 insertions(+), 5 deletions(-)
 rename src/modules/users/{list.tsx => users-list.tsx} (99%)
 rename src/modules/users/{table => users-table}/actions.tsx (100%)
 rename src/modules/users/{table => users-table}/index.tsx (95%)
 rename src/modules/users/{table => users-table}/skeleton.tsx (100%)

diff --git a/src/app/(dashboard)/equipe/page.tsx b/src/app/(dashboard)/equipe/page.tsx
index cb8a7896..6bcdbf4d 100644
--- a/src/app/(dashboard)/equipe/page.tsx
+++ b/src/app/(dashboard)/equipe/page.tsx
@@ -1,6 +1,6 @@
 import type { Metadata } from 'next'
 
-import { UsersList } from '@/modules/users/list'
+import { UsersList } from '@/modules/users/users-list'
 
 export const metadata: Metadata = {
   title: 'Equipe',
diff --git a/src/modules/users/list.tsx b/src/modules/users/users-list.tsx
similarity index 99%
rename from src/modules/users/list.tsx
rename to src/modules/users/users-list.tsx
index 8724c53e..35265233 100644
--- a/src/modules/users/list.tsx
+++ b/src/modules/users/users-list.tsx
@@ -31,7 +31,7 @@ import { api } from '@/lib/api'
 import type { QueryOrderMapping, UsersOrderBy } from '@/types/orders'
 import type { User } from '@/types/users'
 
-import { UsersTable } from './table'
+import { UsersTable } from './users-table'
 
 export function UsersList() {
   const [showFilters, setShowFilters] = useState(false)
diff --git a/src/modules/users/table/actions.tsx b/src/modules/users/users-table/actions.tsx
similarity index 100%
rename from src/modules/users/table/actions.tsx
rename to src/modules/users/users-table/actions.tsx
diff --git a/src/modules/users/table/index.tsx b/src/modules/users/users-table/index.tsx
similarity index 95%
rename from src/modules/users/table/index.tsx
rename to src/modules/users/users-table/index.tsx
index ae86b007..4873c6bd 100644
--- a/src/modules/users/table/index.tsx
+++ b/src/modules/users/users-table/index.tsx
@@ -33,7 +33,7 @@ export function UsersTable({ users, loading }: Readonly<UsersTableProps>) {
         <TableRow>
           <TableHead className='w-64'>Nome</TableHead>
           <TableHead className='w-36'>Data</TableHead>
-          <TableHead className='w-40'>Função</TableHead>
+          <TableHead className='w-40'>Cargo</TableHead>
           <TableHead className='w-48'>Especialidade</TableHead>
           <TableHead className='w-44'>Registro</TableHead>
           <TableHead className='w-24'>Status</TableHead>
@@ -77,7 +77,7 @@ export function UsersTable({ users, loading }: Readonly<UsersTableProps>) {
                     '-'
                   )}
                 </TableCell>
-                <TableCell>{user.registration_number ?? '-'}</TableCell>
+                <TableCell>{user.registration_id ?? '-'}</TableCell>
                 <TableCell>
                   <Tag variant={status.variant} size='sm'>
                     {status.label}
diff --git a/src/modules/users/table/skeleton.tsx b/src/modules/users/users-table/skeleton.tsx
similarity index 100%
rename from src/modules/users/table/skeleton.tsx
rename to src/modules/users/users-table/skeleton.tsx
diff --git a/src/types/users.d.ts b/src/types/users.d.ts
index 2e101717..b8ac744a 100644
--- a/src/types/users.d.ts
+++ b/src/types/users.d.ts
@@ -9,7 +9,7 @@ export type User = {
   avatar_url: string | null
   status: UserStatus
   specialty: Specialty | null
-  registration_number: string | null
+  registration_id: string | null
   updated_at: Date
   created_at: Date
 }

From 6bce7a19265366d7ea0a1e7318c3f8e88b2d433f Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 9 Feb 2026 14:48:35 -0300
Subject: [PATCH 43/77] Revert "chore(team): rename table to `user-table` to
 avoid conflict with new tables"

This reverts commit a5f71bb48483b28574af5a112587e367798782cf.
---
 src/app/(dashboard)/equipe/page.tsx                   | 2 +-
 src/modules/users/{users-list.tsx => list.tsx}        | 2 +-
 src/modules/users/{users-table => table}/actions.tsx  | 0
 src/modules/users/{users-table => table}/index.tsx    | 4 ++--
 src/modules/users/{users-table => table}/skeleton.tsx | 0
 src/types/users.d.ts                                  | 2 +-
 6 files changed, 5 insertions(+), 5 deletions(-)
 rename src/modules/users/{users-list.tsx => list.tsx} (99%)
 rename src/modules/users/{users-table => table}/actions.tsx (100%)
 rename src/modules/users/{users-table => table}/index.tsx (95%)
 rename src/modules/users/{users-table => table}/skeleton.tsx (100%)

diff --git a/src/app/(dashboard)/equipe/page.tsx b/src/app/(dashboard)/equipe/page.tsx
index 6bcdbf4d..cb8a7896 100644
--- a/src/app/(dashboard)/equipe/page.tsx
+++ b/src/app/(dashboard)/equipe/page.tsx
@@ -1,6 +1,6 @@
 import type { Metadata } from 'next'
 
-import { UsersList } from '@/modules/users/users-list'
+import { UsersList } from '@/modules/users/list'
 
 export const metadata: Metadata = {
   title: 'Equipe',
diff --git a/src/modules/users/users-list.tsx b/src/modules/users/list.tsx
similarity index 99%
rename from src/modules/users/users-list.tsx
rename to src/modules/users/list.tsx
index 35265233..8724c53e 100644
--- a/src/modules/users/users-list.tsx
+++ b/src/modules/users/list.tsx
@@ -31,7 +31,7 @@ import { api } from '@/lib/api'
 import type { QueryOrderMapping, UsersOrderBy } from '@/types/orders'
 import type { User } from '@/types/users'
 
-import { UsersTable } from './users-table'
+import { UsersTable } from './table'
 
 export function UsersList() {
   const [showFilters, setShowFilters] = useState(false)
diff --git a/src/modules/users/users-table/actions.tsx b/src/modules/users/table/actions.tsx
similarity index 100%
rename from src/modules/users/users-table/actions.tsx
rename to src/modules/users/table/actions.tsx
diff --git a/src/modules/users/users-table/index.tsx b/src/modules/users/table/index.tsx
similarity index 95%
rename from src/modules/users/users-table/index.tsx
rename to src/modules/users/table/index.tsx
index 4873c6bd..ae86b007 100644
--- a/src/modules/users/users-table/index.tsx
+++ b/src/modules/users/table/index.tsx
@@ -33,7 +33,7 @@ export function UsersTable({ users, loading }: Readonly<UsersTableProps>) {
         <TableRow>
           <TableHead className='w-64'>Nome</TableHead>
           <TableHead className='w-36'>Data</TableHead>
-          <TableHead className='w-40'>Cargo</TableHead>
+          <TableHead className='w-40'>Função</TableHead>
           <TableHead className='w-48'>Especialidade</TableHead>
           <TableHead className='w-44'>Registro</TableHead>
           <TableHead className='w-24'>Status</TableHead>
@@ -77,7 +77,7 @@ export function UsersTable({ users, loading }: Readonly<UsersTableProps>) {
                     '-'
                   )}
                 </TableCell>
-                <TableCell>{user.registration_id ?? '-'}</TableCell>
+                <TableCell>{user.registration_number ?? '-'}</TableCell>
                 <TableCell>
                   <Tag variant={status.variant} size='sm'>
                     {status.label}
diff --git a/src/modules/users/users-table/skeleton.tsx b/src/modules/users/table/skeleton.tsx
similarity index 100%
rename from src/modules/users/users-table/skeleton.tsx
rename to src/modules/users/table/skeleton.tsx
diff --git a/src/types/users.d.ts b/src/types/users.d.ts
index b8ac744a..2e101717 100644
--- a/src/types/users.d.ts
+++ b/src/types/users.d.ts
@@ -9,7 +9,7 @@ export type User = {
   avatar_url: string | null
   status: UserStatus
   specialty: Specialty | null
-  registration_id: string | null
+  registration_number: string | null
   updated_at: Date
   created_at: Date
 }

From 778e5d0023f63ff71c163babcb39669b4560b5d6 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 9 Feb 2026 16:57:04 -0300
Subject: [PATCH 44/77] feat(users): create user invites page

---
 src/app/(dashboard)/equipe/convites/page.tsx  | 11 +++
 src/components/breadcrumbs.tsx                |  2 -
 src/components/ui/select.tsx                  |  2 +-
 src/constants/breadcrumbs/dashboard.ts        | 13 +++
 src/constants/cache.ts                        |  1 +
 src/constants/routes.ts                       |  1 +
 src/constants/section-tab-buttons.ts          | 10 ++
 src/enums/invites.ts                          | 10 ++
 src/enums/users.ts                            |  1 +
 .../users/invites/cancel-invite-modal.tsx     | 82 ++++++++++++++++
 src/modules/users/invites/list.tsx            | 95 ++++++++++++++++++
 .../users/invites/new-invite-button.tsx       | 24 +++++
 .../users/invites/new-invite-modal.tsx        | 98 +++++++++++++++++++
 src/modules/users/invites/table/actions.tsx   | 55 +++++++++++
 src/modules/users/invites/table/index.tsx     | 84 ++++++++++++++++
 src/modules/users/invites/table/skeleton.tsx  | 23 +++++
 src/modules/users/list.tsx                    |  9 +-
 src/types/orders.d.ts                         |  2 +
 src/types/users.d.ts                          | 11 ++-
 19 files changed, 523 insertions(+), 11 deletions(-)
 create mode 100644 src/app/(dashboard)/equipe/convites/page.tsx
 create mode 100644 src/enums/invites.ts
 create mode 100644 src/modules/users/invites/cancel-invite-modal.tsx
 create mode 100644 src/modules/users/invites/list.tsx
 create mode 100644 src/modules/users/invites/new-invite-button.tsx
 create mode 100644 src/modules/users/invites/new-invite-modal.tsx
 create mode 100644 src/modules/users/invites/table/actions.tsx
 create mode 100644 src/modules/users/invites/table/index.tsx
 create mode 100644 src/modules/users/invites/table/skeleton.tsx

diff --git a/src/app/(dashboard)/equipe/convites/page.tsx b/src/app/(dashboard)/equipe/convites/page.tsx
new file mode 100644
index 00000000..7dfb5b91
--- /dev/null
+++ b/src/app/(dashboard)/equipe/convites/page.tsx
@@ -0,0 +1,11 @@
+import type { Metadata } from 'next'
+
+import { UserInvitesList } from '@/modules/users/invites/list'
+
+export const metadata: Metadata = {
+  title: 'Convites',
+}
+
+export default function Page() {
+  return <UserInvitesList />
+}
diff --git a/src/components/breadcrumbs.tsx b/src/components/breadcrumbs.tsx
index 97e2e1d2..6ab3b15e 100644
--- a/src/components/breadcrumbs.tsx
+++ b/src/components/breadcrumbs.tsx
@@ -19,8 +19,6 @@ export function Breadcrumbs() {
   const section = pathnames[1]
   const breadcrumbSection = BREADCRUMBS[section as BreadcrumbSection]
 
-  console.log(breadcrumbSection)
-
   if (!breadcrumbSection) {
     return null
   }
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
index 892a05ee..a111a07e 100644
--- a/src/components/ui/select.tsx
+++ b/src/components/ui/select.tsx
@@ -75,7 +75,7 @@ export function Select({
         >
           <BaseSelect.Popup
             className={cn(
-              'border-border bg-popover rounded-lg border p-2 shadow-lg',
+              'border-border bg-popover rounded-lg border p-2 shadow-lg outline-none',
               'max-h-[min(var(--available-height),30rem)] max-w-[var(--available-width)] min-w-[var(--anchor-width)] origin-[var(--transform-origin)] overflow-y-auto overscroll-contain',
               'transition-[transform,translate,opacity]',
               'data-[ending-style]:-translate-y-2 data-[ending-style]:opacity-0',
diff --git a/src/constants/breadcrumbs/dashboard.ts b/src/constants/breadcrumbs/dashboard.ts
index 93f72e54..58963929 100644
--- a/src/constants/breadcrumbs/dashboard.ts
+++ b/src/constants/breadcrumbs/dashboard.ts
@@ -5,6 +5,7 @@ import {
   ClipboardPasteIcon,
   ClockArrowUpIcon,
   HistoryIcon,
+  MailPlusIcon,
   PaperclipIcon,
   User2Icon,
   UserRoundCheckIcon,
@@ -77,4 +78,16 @@ export const DASHBOARD_BREADCRUMBS: Breadcrumbs = {
       path: ROUTES.dashboard.approvals.approved,
     },
   },
+  equipe: {
+    equipe: {
+      icon: Users2Icon,
+      name: 'Membros',
+      path: ROUTES.dashboard.users.main,
+    },
+    convites: {
+      icon: MailPlusIcon,
+      name: 'Convites',
+      path: ROUTES.dashboard.users.invites,
+    },
+  },
 }
diff --git a/src/constants/cache.ts b/src/constants/cache.ts
index 6f02b76b..c51ae111 100644
--- a/src/constants/cache.ts
+++ b/src/constants/cache.ts
@@ -36,6 +36,7 @@ export const QUERY_CACHE_KEYS = {
   },
   users: {
     main: 'users',
+    invites: 'invites',
   },
   patients: {
     main: 'patients',
diff --git a/src/constants/routes.ts b/src/constants/routes.ts
index 0949711e..9201177a 100644
--- a/src/constants/routes.ts
+++ b/src/constants/routes.ts
@@ -49,6 +49,7 @@ export const ROUTES = {
     users: {
       main: '/equipe',
       details: (id: string) => `/equipe/membro/${id}`,
+      invites: '/equipe/convites',
     },
     settings: {
       main: '/configuracoes',
diff --git a/src/constants/section-tab-buttons.ts b/src/constants/section-tab-buttons.ts
index d695a591..92a86c9b 100644
--- a/src/constants/section-tab-buttons.ts
+++ b/src/constants/section-tab-buttons.ts
@@ -53,5 +53,15 @@ export const SECTION_TAB_BUTTONS: Record<string, Array<TabButton>> = {
       path: ROUTES.dashboard.approvals.approved,
     },
   ],
+  equipe: [
+    {
+      title: 'Membros',
+      path: ROUTES.dashboard.users.main,
+    },
+    {
+      title: 'Convites',
+      path: ROUTES.dashboard.users.invites,
+    },
+  ],
 }
 export type SectionTabButton = keyof typeof SECTION_TAB_BUTTONS
diff --git a/src/enums/invites.ts b/src/enums/invites.ts
new file mode 100644
index 00000000..ca01f10f
--- /dev/null
+++ b/src/enums/invites.ts
@@ -0,0 +1,10 @@
+import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
+
+export const INVITES_ORDERS = {
+  email_asc: 'Email (Asc.)',
+  email_desc: 'Email (Desc.)',
+  date_asc: 'Data (Asc.)',
+  date_desc: 'Data (Desc.)',
+}
+export type InvitesOrder = keyof typeof INVITES_ORDERS
+export const INVITES_ORDER_OPTIONS = convertObjectToOptions(INVITES_ORDERS)
diff --git a/src/enums/users.ts b/src/enums/users.ts
index b0c12842..e692c319 100644
--- a/src/enums/users.ts
+++ b/src/enums/users.ts
@@ -8,6 +8,7 @@ export const USER_ROLES = {
 }
 export type UserRole = keyof typeof USER_ROLES
 export const USERS_ROLE_OPTIONS = convertObjectToOptions(USER_ROLES)
+export const USERS_ROLE_ENUM = Object.keys(USER_ROLES) as [UserRole]
 
 export const USER_STATUSES = {
   active: { variant: 'success', label: 'Ativo' },
diff --git a/src/modules/users/invites/cancel-invite-modal.tsx b/src/modules/users/invites/cancel-invite-modal.tsx
new file mode 100644
index 00000000..5e8ca5f6
--- /dev/null
+++ b/src/modules/users/invites/cancel-invite-modal.tsx
@@ -0,0 +1,82 @@
+'use client'
+
+import { CircleXIcon } from 'lucide-react'
+import { useTransition } from 'react'
+import { toast } from 'sonner'
+
+import { Button } from '@/components/ui/button'
+import {
+  DialogClose,
+  DialogContainer,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogIcon,
+  DialogTitle,
+} from '@/components/ui/dialog'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { revalidateClientCache } from '@/helpers/revalidate-client-cache'
+import { api } from '@/lib/api'
+import type { UserInvite } from '@/types/users'
+
+interface CancelUserInviteModalProps {
+  invite: UserInvite
+  onClose: () => void
+}
+
+export function CancelUserInviteModal({
+  invite,
+  onClose,
+}: Readonly<CancelUserInviteModalProps>) {
+  const [isPending, startTransition] = useTransition()
+
+  async function cancelUserInvite() {
+    startTransition(async () => {
+      const response = await api(`/users/invites/${invite.id}`, {
+        method: 'DELETE',
+      })
+
+      if (!response.success) {
+        toast.error(response.message)
+        return
+      }
+
+      revalidateClientCache(QUERY_CACHE_KEYS.users.invites)
+
+      toast.success(response.message)
+      onClose()
+    })
+  }
+
+  return (
+    <DialogContainer>
+      <DialogHeader
+        icon={<DialogIcon icon={CircleXIcon} variant='destructive' />}
+      >
+        <DialogTitle>Cancelar convite</DialogTitle>
+      </DialogHeader>
+
+      <DialogContent className='space-y-2'>
+        <p>
+          Você tem certeza que deseja cancelar o convite para{' '}
+          <span className='font-semibold'>{invite.email}</span>?
+        </p>
+        <p>Este convite não poderá mais ser utilizado.</p>
+      </DialogContent>
+
+      <DialogFooter>
+        <Button
+          className='flex-1'
+          loading={isPending}
+          variant='destructive'
+          onClick={cancelUserInvite}
+        >
+          Cancelar convite
+        </Button>
+        <DialogClose className='flex-1' disabled={isPending}>
+          Voltar
+        </DialogClose>
+      </DialogFooter>
+    </DialogContainer>
+  )
+}
diff --git a/src/modules/users/invites/list.tsx b/src/modules/users/invites/list.tsx
new file mode 100644
index 00000000..7b032fef
--- /dev/null
+++ b/src/modules/users/invites/list.tsx
@@ -0,0 +1,95 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query'
+import { MailPlusIcon } from 'lucide-react'
+import { useEffect, useState } from 'react'
+
+import { FilterSelect } from '@/components/filters/filter-select'
+import { SearchInput } from '@/components/filters/search-input'
+import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
+import { Card } from '@/components/ui/card'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { INVITES_ORDER_OPTIONS, type InvitesOrder } from '@/enums/invites'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
+import { useParams } from '@/hooks/params'
+import { api } from '@/lib/api'
+import type { InvitesOrderBy, QueryOrderMapping } from '@/types/orders'
+import type { UserInvite } from '@/types/users'
+
+import { NewAppointmentButton } from './new-invite-button'
+import { UserInvitesTable } from './table'
+
+export function UserInvitesList() {
+  const [stableTotal, setStableTotal] = useState(0)
+  const { getParams, paramsQueryKey } = useParams()
+
+  const [page, search, orderBy, startDate, endDate] = getParams([
+    QUERY_PARAM_KEYS.page,
+    QUERY_PARAM_KEYS.search,
+    QUERY_PARAM_KEYS.orderBy,
+    QUERY_PARAM_KEYS.startDate,
+    QUERY_PARAM_KEYS.endDate,
+  ])
+
+  const ORDER_MAPPING: QueryOrderMapping<InvitesOrder, InvitesOrderBy> = {
+    email_asc: { orderBy: 'email', order: 'ASC' },
+    email_desc: { orderBy: 'email', order: 'DESC' },
+    date_asc: { orderBy: 'date', order: 'ASC' },
+    date_desc: { orderBy: 'date', order: 'DESC' },
+  }
+
+  const orderByQuery =
+    ORDER_MAPPING[orderBy as InvitesOrder] ?? ORDER_MAPPING['email_asc']
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.users.invites, paramsQueryKey],
+    queryFn: () =>
+      api<{ invites: UserInvite[]; total: number }>('/users/invites', {
+        params: { page, search, startDate, endDate, ...orderByQuery },
+      }),
+  })
+
+  const invites = response?.data?.invites ?? []
+
+  // Update stable total only when we have actual data to prevent pagination flickering
+  useEffect(() => {
+    if (response?.data?.total !== undefined) {
+      setStableTotal(response.data.total)
+    }
+  }, [response?.data?.total])
+
+  return (
+    <>
+      <SectionHeader>
+        <SectionHeaderTitle
+          title='Convites'
+          icon={<MailPlusIcon />}
+          total={stableTotal}
+        />
+
+        <SectionHeaderActions>
+          <SearchInput placeholder='Pesquisar' className='w-48' />
+          <FilterSelect
+            param={QUERY_PARAM_KEYS.orderBy}
+            options={INVITES_ORDER_OPTIONS}
+            placeholder='Ordenar por'
+            resetLabel='Limpar ordem'
+            className='w-40'
+          />
+          <NewAppointmentButton size='sm' />
+        </SectionHeaderActions>
+      </SectionHeader>
+
+      <Card className='p-6 sm:col-span-6'>
+        <UserInvitesTable invites={invites} loading={isLoading} />
+      </Card>
+
+      <Pagination totalItems={stableTotal} />
+    </>
+  )
+}
diff --git a/src/modules/users/invites/new-invite-button.tsx b/src/modules/users/invites/new-invite-button.tsx
new file mode 100644
index 00000000..307c3bf7
--- /dev/null
+++ b/src/modules/users/invites/new-invite-button.tsx
@@ -0,0 +1,24 @@
+'use client'
+
+import { PlusIcon } from 'lucide-react'
+import { useState } from 'react'
+
+import type { ButtonProps } from '@/components/ui/button'
+import { Dialog, DialogTrigger } from '@/components/ui/dialog'
+
+import { NewUserInviteModal } from './new-invite-modal'
+
+export function NewAppointmentButton(props: Readonly<ButtonProps>) {
+  const [modalOpen, setModalOpen] = useState(false)
+
+  return (
+    <Dialog open={modalOpen} onOpenChange={setModalOpen}>
+      <DialogTrigger {...props}>
+        <PlusIcon />
+        Novo convite
+      </DialogTrigger>
+
+      {modalOpen && <NewUserInviteModal onClose={() => setModalOpen(false)} />}
+    </Dialog>
+  )
+}
diff --git a/src/modules/users/invites/new-invite-modal.tsx b/src/modules/users/invites/new-invite-modal.tsx
new file mode 100644
index 00000000..0884fc64
--- /dev/null
+++ b/src/modules/users/invites/new-invite-modal.tsx
@@ -0,0 +1,98 @@
+'use client'
+
+import { zodResolver } from '@hookform/resolvers/zod'
+import { MailPlusIcon } from 'lucide-react'
+import { FormProvider, useForm } from 'react-hook-form'
+import { toast } from 'sonner'
+import { z } from 'zod'
+
+import { FormContainer } from '@/components/form/form-container'
+import { SelectInput } from '@/components/form/select-input'
+import { TextInput } from '@/components/form/text-input'
+import { Button } from '@/components/ui/button'
+import {
+  DialogClose,
+  DialogContainer,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogIcon,
+  DialogTitle,
+} from '@/components/ui/dialog'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { USERS_ROLE_ENUM, USERS_ROLE_OPTIONS } from '@/enums/users'
+import { revalidateClientCache } from '@/helpers/revalidate-client-cache'
+import { api } from '@/lib/api'
+
+const userInviteFormSchema = z.object({
+  email: z.string().email('Insira um e-mail válido'),
+  role: z.enum(USERS_ROLE_ENUM),
+})
+type UserInviteFormSchema = z.infer<typeof userInviteFormSchema>
+
+interface NewUserInviteModalProps {
+  onClose: () => void
+}
+
+export function NewUserInviteModal({ onClose }: NewUserInviteModalProps) {
+  const formMethods = useForm<UserInviteFormSchema>({
+    resolver: zodResolver(userInviteFormSchema),
+    defaultValues: { email: '', role: '' } as unknown as UserInviteFormSchema,
+    mode: 'onBlur',
+  })
+
+  async function submitForm(data: UserInviteFormSchema) {
+    const response = await api('/users/invites', {
+      method: 'POST',
+      body: JSON.stringify(data),
+    })
+
+    if (!response.success) {
+      toast.error(response.message)
+      return
+    }
+
+    revalidateClientCache(QUERY_CACHE_KEYS.users.invites)
+
+    toast.success(response.message)
+    onClose()
+  }
+
+  return (
+    <DialogContainer className='max-w-md'>
+      <DialogHeader icon={<DialogIcon icon={MailPlusIcon} />}>
+        <DialogTitle>Criar convite</DialogTitle>
+      </DialogHeader>
+
+      <DialogContent>
+        <FormProvider {...formMethods}>
+          <FormContainer onSubmit={formMethods.handleSubmit(submitForm)}>
+            <TextInput name='email' label='E-mail' isRequired />
+            <SelectInput
+              name='role'
+              label='Cargo'
+              options={USERS_ROLE_OPTIONS}
+              isRequired
+            />
+          </FormContainer>
+        </FormProvider>
+      </DialogContent>
+
+      <DialogFooter>
+        <Button
+          className='flex-1'
+          loading={formMethods.formState.isSubmitting}
+          onClick={formMethods.handleSubmit(submitForm)}
+        >
+          Enviar
+        </Button>
+        <DialogClose
+          className='flex-1'
+          disabled={formMethods.formState.isSubmitting}
+        >
+          Voltar
+        </DialogClose>
+      </DialogFooter>
+    </DialogContainer>
+  )
+}
diff --git a/src/modules/users/invites/table/actions.tsx b/src/modules/users/invites/table/actions.tsx
new file mode 100644
index 00000000..f838764a
--- /dev/null
+++ b/src/modules/users/invites/table/actions.tsx
@@ -0,0 +1,55 @@
+'use client'
+
+import { CircleXIcon, EllipsisIcon } from 'lucide-react'
+import { useState } from 'react'
+
+import { Dialog } from '@/components/ui/dialog'
+import { Menu, MenuContent, MenuItem, MenuTrigger } from '@/components/ui/menu'
+import type { UserInvite } from '@/types/users'
+
+import { CancelUserInviteModal } from '../cancel-invite-modal'
+
+type InviteModalMode = 'cancel'
+
+interface UserInvitesTableActionsProps {
+  invite: UserInvite
+}
+
+export function UserInvitesTableActions({
+  invite,
+}: Readonly<UserInvitesTableActionsProps>) {
+  const [modalOpen, setModalOpen] = useState<InviteModalMode | null>(null)
+
+  return (
+    <>
+      <Menu>
+        <MenuTrigger size='icon' variant='ghost' className='size-8'>
+          <EllipsisIcon />
+          <span className='sr-only'>Ações</span>
+        </MenuTrigger>
+
+        <MenuContent align='end'>
+          <MenuItem
+            variant='destructive'
+            onClick={() => setModalOpen('cancel')}
+          >
+            <CircleXIcon />
+            Cancelar
+          </MenuItem>
+        </MenuContent>
+      </Menu>
+
+      {modalOpen === 'cancel' && (
+        <Dialog
+          open={modalOpen === 'cancel'}
+          onOpenChange={(open) => setModalOpen(open ? 'cancel' : null)}
+        >
+          <CancelUserInviteModal
+            invite={invite}
+            onClose={() => setModalOpen(null)}
+          />
+        </Dialog>
+      )}
+    </>
+  )
+}
diff --git a/src/modules/users/invites/table/index.tsx b/src/modules/users/invites/table/index.tsx
new file mode 100644
index 00000000..054e2b96
--- /dev/null
+++ b/src/modules/users/invites/table/index.tsx
@@ -0,0 +1,84 @@
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableEmptyCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from '@/components/ui/table'
+import { Tag } from '@/components/ui/tag'
+import type { UserInvite } from '@/types/users'
+import { formatDate } from '@/utils/formatters/format-date'
+
+import { UserInvitesTableActions } from './actions'
+import { UserInvitesTableSkeleton } from './skeleton'
+
+interface UserInvitesTableProps {
+  invites: UserInvite[]
+  loading?: boolean
+}
+
+export function UserInvitesTable({
+  invites,
+  loading,
+}: Readonly<UserInvitesTableProps>) {
+  const isEmpty = !loading && invites.length <= 0
+
+  return (
+    <Table>
+      <TableHeader>
+        <TableRow>
+          <TableHead>Email</TableHead>
+          <TableHead className='w-44'>Data de criação</TableHead>
+          <TableHead className='w-44'>Data de expiração</TableHead>
+          <TableHead className='w-20 text-center'>Ações</TableHead>
+        </TableRow>
+      </TableHeader>
+      <TableBody>
+        {loading && <UserInvitesTableSkeleton />}
+
+        {isEmpty && (
+          <TableRow>
+            <TableEmptyCell colSpan={4}>
+              Nenhum convite encontrado
+            </TableEmptyCell>
+          </TableRow>
+        )}
+
+        {!isEmpty &&
+          invites.map((invite) => {
+            const isExpired = new Date() > new Date(invite.expires_at)
+            return (
+              <TableRow key={invite.id}>
+                <TableCell>
+                  <span className='truncate'>{invite.email}</span>
+                </TableCell>
+                <TableCell>
+                  {formatDate(invite.created_at, {
+                    dateStyle: 'short',
+                    timeStyle: 'short',
+                  })}
+                </TableCell>
+                <TableCell>
+                  {isExpired ? (
+                    <Tag variant='error' size='sm'>
+                      Expirado
+                    </Tag>
+                  ) : (
+                    formatDate(invite.expires_at, {
+                      dateStyle: 'short',
+                      timeStyle: 'short',
+                    })
+                  )}
+                </TableCell>
+                <TableCell className='text-center'>
+                  <UserInvitesTableActions invite={invite} />
+                </TableCell>
+              </TableRow>
+            )
+          })}
+      </TableBody>
+    </Table>
+  )
+}
diff --git a/src/modules/users/invites/table/skeleton.tsx b/src/modules/users/invites/table/skeleton.tsx
new file mode 100644
index 00000000..12101748
--- /dev/null
+++ b/src/modules/users/invites/table/skeleton.tsx
@@ -0,0 +1,23 @@
+import { Skeleton } from '@/components/ui/skeleton'
+import { TableCell, TableRow } from '@/components/ui/table'
+
+export function UserInvitesTableSkeleton() {
+  const skeletons = Array.from({ length: 5 }).map((_, index) => index)
+
+  return skeletons.map((skeleton) => (
+    <TableRow key={skeleton}>
+      <TableCell>
+        <Skeleton className='h-5 w-56 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-5 w-36 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-5 w-36 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='mx-auto size-8 rounded-md' />
+      </TableCell>
+    </TableRow>
+  ))
+}
diff --git a/src/modules/users/list.tsx b/src/modules/users/list.tsx
index 8724c53e..ac0de565 100644
--- a/src/modules/users/list.tsx
+++ b/src/modules/users/list.tsx
@@ -1,7 +1,7 @@
 'use client'
 
 import { useQuery } from '@tanstack/react-query'
-import { HeartHandshakeIcon, PlusIcon } from 'lucide-react'
+import { HeartHandshakeIcon } from 'lucide-react'
 import { useEffect, useState } from 'react'
 
 import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
@@ -16,7 +16,6 @@ import {
   SectionHeaderActions,
   SectionHeaderTitle,
 } from '@/components/section-header'
-import { Button } from '@/components/ui/button'
 import { Card } from '@/components/ui/card'
 import { QUERY_CACHE_KEYS } from '@/constants/cache'
 import { QUERY_PARAM_KEYS } from '@/enums/params'
@@ -31,6 +30,7 @@ import { api } from '@/lib/api'
 import type { QueryOrderMapping, UsersOrderBy } from '@/types/orders'
 import type { User } from '@/types/users'
 
+import { NewAppointmentButton } from '../appointments/new-appointment-button'
 import { UsersTable } from './table'
 
 export function UsersList() {
@@ -112,10 +112,7 @@ export function UsersList() {
             className='w-44'
           />
           <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
-          <Button size='sm'>
-            <PlusIcon />
-            Novo usuário
-          </Button>
+          <NewAppointmentButton size='sm' />
         </SectionHeaderActions>
       </SectionHeader>
 
diff --git a/src/types/orders.d.ts b/src/types/orders.d.ts
index 93892258..3ec5bdaf 100644
--- a/src/types/orders.d.ts
+++ b/src/types/orders.d.ts
@@ -7,6 +7,8 @@ export type QueryOrder = 'ASC' | 'DESC'
 
 export type UsersOrderBy = 'name' | 'status' | 'role' | 'date'
 
+export type InvitesOrderBy = 'email' | 'date'
+
 export type PatientsOrderBy = 'name' | 'email' | 'status' | 'date'
 
 export type AppointmentsOrderBy =
diff --git a/src/types/users.d.ts b/src/types/users.d.ts
index 2e101717..85df5416 100644
--- a/src/types/users.d.ts
+++ b/src/types/users.d.ts
@@ -10,6 +10,13 @@ export type User = {
   status: UserStatus
   specialty: Specialty | null
   registration_number: string | null
-  updated_at: Date
-  created_at: Date
+  updated_at: string
+  created_at: string
+}
+
+export type UserInvite = {
+  id: string
+  email: string
+  expires_at: string
+  created_at: string
 }

From ae229749879dd1655496bc3aa36a615a5c719b05 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 9 Feb 2026 17:32:18 -0300
Subject: [PATCH 45/77] fix(users): update new user invite button label

---
 src/modules/users/invites/list.tsx              | 4 ++--
 src/modules/users/invites/new-invite-button.tsx | 2 +-
 src/modules/users/invites/new-invite-modal.tsx  | 7 ++++++-
 src/modules/users/list.tsx                      | 4 ++--
 4 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/src/modules/users/invites/list.tsx b/src/modules/users/invites/list.tsx
index 7b032fef..55e1667b 100644
--- a/src/modules/users/invites/list.tsx
+++ b/src/modules/users/invites/list.tsx
@@ -21,7 +21,7 @@ import { api } from '@/lib/api'
 import type { InvitesOrderBy, QueryOrderMapping } from '@/types/orders'
 import type { UserInvite } from '@/types/users'
 
-import { NewAppointmentButton } from './new-invite-button'
+import { NewInviteButton } from './new-invite-button'
 import { UserInvitesTable } from './table'
 
 export function UserInvitesList() {
@@ -81,7 +81,7 @@ export function UserInvitesList() {
             resetLabel='Limpar ordem'
             className='w-40'
           />
-          <NewAppointmentButton size='sm' />
+          <NewInviteButton size='sm' />
         </SectionHeaderActions>
       </SectionHeader>
 
diff --git a/src/modules/users/invites/new-invite-button.tsx b/src/modules/users/invites/new-invite-button.tsx
index 307c3bf7..43168a51 100644
--- a/src/modules/users/invites/new-invite-button.tsx
+++ b/src/modules/users/invites/new-invite-button.tsx
@@ -8,7 +8,7 @@ import { Dialog, DialogTrigger } from '@/components/ui/dialog'
 
 import { NewUserInviteModal } from './new-invite-modal'
 
-export function NewAppointmentButton(props: Readonly<ButtonProps>) {
+export function NewInviteButton(props: Readonly<ButtonProps>) {
   const [modalOpen, setModalOpen] = useState(false)
 
   return (
diff --git a/src/modules/users/invites/new-invite-modal.tsx b/src/modules/users/invites/new-invite-modal.tsx
index 0884fc64..8f039cd5 100644
--- a/src/modules/users/invites/new-invite-modal.tsx
+++ b/src/modules/users/invites/new-invite-modal.tsx
@@ -67,7 +67,12 @@ export function NewUserInviteModal({ onClose }: NewUserInviteModalProps) {
       <DialogContent>
         <FormProvider {...formMethods}>
           <FormContainer onSubmit={formMethods.handleSubmit(submitForm)}>
-            <TextInput name='email' label='E-mail' isRequired />
+            <TextInput
+              name='email'
+              label='E-mail'
+              placeholder='Insira o e-mail'
+              isRequired
+            />
             <SelectInput
               name='role'
               label='Cargo'
diff --git a/src/modules/users/list.tsx b/src/modules/users/list.tsx
index ac0de565..85e6b4de 100644
--- a/src/modules/users/list.tsx
+++ b/src/modules/users/list.tsx
@@ -30,7 +30,7 @@ import { api } from '@/lib/api'
 import type { QueryOrderMapping, UsersOrderBy } from '@/types/orders'
 import type { User } from '@/types/users'
 
-import { NewAppointmentButton } from '../appointments/new-appointment-button'
+import { NewInviteButton } from './invites/new-invite-button'
 import { UsersTable } from './table'
 
 export function UsersList() {
@@ -112,7 +112,7 @@ export function UsersList() {
             className='w-44'
           />
           <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
-          <NewAppointmentButton size='sm' />
+          <NewInviteButton size='sm' />
         </SectionHeaderActions>
       </SectionHeader>
 

From 7b8642a85834b87f5275dd355be0d7cc205e7e28 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 9 Feb 2026 22:14:44 -0300
Subject: [PATCH 46/77] fix(referrals): update endpoints and rename to keep
 consistency

---
 .../statistics/get-total-appointments.ts      |  2 +-
 ...s => get-total-patients-with-referrals.ts} | 21 ++++++++-------
 src/actions/statistics/get-total-patients.ts  |  2 +-
 src/actions/statistics/get-total-referrals.ts |  2 +-
 src/app/(dashboard)/encaminhamentos/page.tsx  | 12 ++++-----
 src/constants/cache.ts                        | 12 ++++-----
 .../referrals/cancel-referral-modal.tsx       |  6 ++---
 ...atients-with-referrals-percentage-card.tsx | 27 +++++++++++++++++++
 src/modules/referrals/referral-modal.tsx      |  6 ++---
 .../referred-patients-percentage-card.tsx     | 27 -------------------
 ...ry-card.tsx => total-by-category-card.tsx} |  6 ++---
 ...state-card.tsx => total-by-state-card.tsx} |  6 ++---
 .../referrals/total-referrals-card.tsx        |  2 +-
 13 files changed, 67 insertions(+), 64 deletions(-)
 rename src/actions/statistics/{get-total-referred-patients.ts => get-total-patients-with-referrals.ts} (54%)
 create mode 100644 src/modules/referrals/patients-with-referrals-percentage-card.tsx
 delete mode 100644 src/modules/referrals/referred-patients-percentage-card.tsx
 rename src/modules/referrals/{by-category-card.tsx => total-by-category-card.tsx} (90%)
 rename src/modules/referrals/{by-state-card.tsx => total-by-state-card.tsx} (93%)

diff --git a/src/actions/statistics/get-total-appointments.ts b/src/actions/statistics/get-total-appointments.ts
index f3f277b2..1be47bc0 100644
--- a/src/actions/statistics/get-total-appointments.ts
+++ b/src/actions/statistics/get-total-appointments.ts
@@ -20,7 +20,7 @@ export async function getTotalAppointments({
 }: GetTotalAppointmentsProps = {}) {
   try {
     const response = await api<{ total: number }>(
-      '/statistics/appointments-total',
+      '/statistics/appointments/total',
       {
         includeCookies: true,
         cache: 'force-cache',
diff --git a/src/actions/statistics/get-total-referred-patients.ts b/src/actions/statistics/get-total-patients-with-referrals.ts
similarity index 54%
rename from src/actions/statistics/get-total-referred-patients.ts
rename to src/actions/statistics/get-total-patients-with-referrals.ts
index 5d50f87b..6f6c772e 100644
--- a/src/actions/statistics/get-total-referred-patients.ts
+++ b/src/actions/statistics/get-total-patients-with-referrals.ts
@@ -5,22 +5,22 @@ import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import type { QueryPeriod } from '@/enums/queries'
 import { api } from '@/lib/api'
 
-type GetTotalReferredPatientsParams = {
+type GetTotalPatientsWithReferralsParams = {
   period?: QueryPeriod
 }
 
-interface GetTotalReferredPatientsProps {
-  params?: GetTotalReferredPatientsParams
+interface GetTotalPatientsWithReferralsProps {
+  params?: GetTotalPatientsWithReferralsParams
   cacheKey?: string
 }
 
-export async function getTotalReferredPatients({
+export async function getTotalPatientsWithReferrals({
   params,
   cacheKey,
-}: GetTotalReferredPatientsProps = {}) {
+}: GetTotalPatientsWithReferralsProps = {}) {
   try {
     const response = await api<{ total: number }>(
-      '/statistics/referred-patients-total',
+      '/statistics/patients/with-referrals',
       {
         includeCookies: true,
         cache: 'force-cache',
@@ -28,8 +28,11 @@ export async function getTotalReferredPatients({
         next: {
           revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
           tags: cacheKey
-            ? [NEXT_CACHE_TAGS.statistics.totalReferredPatients.main, cacheKey]
-            : [NEXT_CACHE_TAGS.statistics.totalReferredPatients.main],
+            ? [
+                NEXT_CACHE_TAGS.statistics.totalPatientsWithReferrals.main,
+                cacheKey,
+              ]
+            : [NEXT_CACHE_TAGS.statistics.totalPatientsWithReferrals.main],
         },
       },
     )
@@ -40,7 +43,7 @@ export async function getTotalReferredPatients({
 
     return response.data
   } catch (error) {
-    console.error('Failed to fetch total referred patients:', error)
+    console.error('Failed to fetch total patients with referrals:', error)
     return null
   }
 }
diff --git a/src/actions/statistics/get-total-patients.ts b/src/actions/statistics/get-total-patients.ts
index 7672a78c..b538ab00 100644
--- a/src/actions/statistics/get-total-patients.ts
+++ b/src/actions/statistics/get-total-patients.ts
@@ -22,7 +22,7 @@ export async function getTotalPatients({
 }: GetTotalPatientsProps = {}) {
   try {
     const response = await api<Record<Status, number>>(
-      '/statistics/patients-total',
+      '/statistics/patients/total',
       {
         includeCookies: true,
         cache: 'force-cache',
diff --git a/src/actions/statistics/get-total-referrals.ts b/src/actions/statistics/get-total-referrals.ts
index d05a7d9f..828a7ee1 100644
--- a/src/actions/statistics/get-total-referrals.ts
+++ b/src/actions/statistics/get-total-referrals.ts
@@ -20,7 +20,7 @@ export async function getTotalReferrals({
 }: GetTotalReferralsProps = {}) {
   try {
     const response = await api<{ total: number }>(
-      '/statistics/referrals-total',
+      '/statistics/referrals/total',
       {
         includeCookies: true,
         cache: 'force-cache',
diff --git a/src/app/(dashboard)/encaminhamentos/page.tsx b/src/app/(dashboard)/encaminhamentos/page.tsx
index 52ee9b3f..456be1ea 100644
--- a/src/app/(dashboard)/encaminhamentos/page.tsx
+++ b/src/app/(dashboard)/encaminhamentos/page.tsx
@@ -1,7 +1,7 @@
-import { ReferralsByCategoryCard } from '@/modules/referrals/by-category-card'
-import { ReferralsByStateCard } from '@/modules/referrals/by-state-card'
+import { PatientsWithReferralsPercentageCard } from '@/modules/referrals/patients-with-referrals-percentage-card'
 import { ReferralsPeriodTabSelect } from '@/modules/referrals/period-tab-select'
-import { ReferredPatientsPercentageCard } from '@/modules/referrals/referred-patients-percentage-card'
+import { TotalReferralsByCategoryCard } from '@/modules/referrals/total-by-category-card'
+import { TotalReferralsByStateCard } from '@/modules/referrals/total-by-state-card'
 import { TotalReferralsCard } from '@/modules/referrals/total-referrals-card'
 
 export default function Page() {
@@ -10,10 +10,10 @@ export default function Page() {
       <ReferralsPeriodTabSelect />
 
       <TotalReferralsCard />
-      <ReferredPatientsPercentageCard />
+      <PatientsWithReferralsPercentageCard />
 
-      <ReferralsByCategoryCard />
-      <ReferralsByStateCard />
+      <TotalReferralsByCategoryCard />
+      <TotalReferralsByStateCard />
     </div>
   )
 }
diff --git a/src/constants/cache.ts b/src/constants/cache.ts
index c51ae111..c0ad1a2a 100644
--- a/src/constants/cache.ts
+++ b/src/constants/cache.ts
@@ -18,14 +18,14 @@ export const NEXT_CACHE_TAGS = {
       main: 'total-patients',
       query: (query: string) => `total-patients/${query}`,
     },
+    totalPatientsWithReferrals: {
+      main: 'total-patients-with-referrals',
+      query: (query: string) => `total-patients-with-referrals/${query}`,
+    },
     totalReferrals: {
       main: 'total-referrals',
       query: (query: string) => `total-referrals/${query}`,
     },
-    totalReferredPatients: {
-      main: 'total-referred-patients',
-      query: (query: string) => `total-referred-patients/${query}`,
-    },
   },
 }
 
@@ -55,8 +55,8 @@ export const QUERY_CACHE_KEYS = {
   },
   statistics: {
     totalReferrals: 'total-referrals',
-    referralsByCategory: 'referrals-by-category',
-    referralsByState: 'referrals-by-state',
+    totalReferralsByCategory: 'total-referrals-by-category',
+    totalReferralsByState: 'referrals-by-state',
   },
   profile: 'profile',
 }
diff --git a/src/modules/referrals/cancel-referral-modal.tsx b/src/modules/referrals/cancel-referral-modal.tsx
index 0a5cc983..d433d6d8 100644
--- a/src/modules/referrals/cancel-referral-modal.tsx
+++ b/src/modules/referrals/cancel-referral-modal.tsx
@@ -45,15 +45,15 @@ export function CancelReferralModal({
 
       revalidateClientCache([
         QUERY_CACHE_KEYS.referrals.main,
-        QUERY_CACHE_KEYS.statistics.referralsByCategory,
-        QUERY_CACHE_KEYS.statistics.referralsByState,
+        QUERY_CACHE_KEYS.statistics.totalReferralsByCategory,
+        QUERY_CACHE_KEYS.statistics.totalReferralsByState,
         QUERY_CACHE_KEYS.statistics.totalReferrals,
       ])
       revalidateServerCache([
         NEXT_CACHE_TAGS.patient(referral.patient_id),
         NEXT_CACHE_TAGS.referrals.main,
         NEXT_CACHE_TAGS.statistics.totalReferrals.main,
-        NEXT_CACHE_TAGS.statistics.totalReferredPatients.main,
+        NEXT_CACHE_TAGS.statistics.totalPatientsWithReferrals.main,
       ])
 
       toast.success(response.message)
diff --git a/src/modules/referrals/patients-with-referrals-percentage-card.tsx b/src/modules/referrals/patients-with-referrals-percentage-card.tsx
new file mode 100644
index 00000000..c8ed2c61
--- /dev/null
+++ b/src/modules/referrals/patients-with-referrals-percentage-card.tsx
@@ -0,0 +1,27 @@
+import { Users2Icon } from 'lucide-react'
+
+import { getTotalPatients } from '@/actions/statistics/get-total-patients'
+import { getTotalPatientsWithReferrals } from '@/actions/statistics/get-total-patients-with-referrals'
+import { SummaryCard } from '@/components/summary-card'
+
+export async function PatientsWithReferralsPercentageCard() {
+  const [totalPatients, totalPatientsWithReferrals] = await Promise.all([
+    getTotalPatients(),
+    getTotalPatientsWithReferrals(),
+  ])
+
+  const totalPatientsValue = totalPatients?.total ?? 0
+  const totalPatientsWithReferralsValue = totalPatientsWithReferrals?.total ?? 0
+
+  const totalPatientsWithReferralsPercentage =
+    (totalPatientsWithReferralsValue / totalPatientsValue) * 100
+
+  return (
+    <SummaryCard
+      icon={Users2Icon}
+      label='Pacientes encaminhados'
+      value={`${totalPatientsWithReferralsPercentage.toFixed(1)}%`}
+      className='sm:col-span-1'
+    />
+  )
+}
diff --git a/src/modules/referrals/referral-modal.tsx b/src/modules/referrals/referral-modal.tsx
index 736cdc66..26a0e96b 100644
--- a/src/modules/referrals/referral-modal.tsx
+++ b/src/modules/referrals/referral-modal.tsx
@@ -105,15 +105,15 @@ export function ReferralModal({
 
     revalidateClientCache([
       QUERY_CACHE_KEYS.referrals.main,
-      QUERY_CACHE_KEYS.statistics.referralsByCategory,
-      QUERY_CACHE_KEYS.statistics.referralsByState,
+      QUERY_CACHE_KEYS.statistics.totalReferralsByCategory,
+      QUERY_CACHE_KEYS.statistics.totalReferralsByState,
       QUERY_CACHE_KEYS.statistics.totalReferrals,
     ])
     revalidateServerCache([
       NEXT_CACHE_TAGS.patient(data.patient_id),
       NEXT_CACHE_TAGS.referrals.main,
       NEXT_CACHE_TAGS.statistics.totalReferrals.main,
-      NEXT_CACHE_TAGS.statistics.totalReferredPatients.main,
+      NEXT_CACHE_TAGS.statistics.totalPatientsWithReferrals.main,
     ])
 
     toast.success(response.message)
diff --git a/src/modules/referrals/referred-patients-percentage-card.tsx b/src/modules/referrals/referred-patients-percentage-card.tsx
deleted file mode 100644
index bfe44244..00000000
--- a/src/modules/referrals/referred-patients-percentage-card.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { Users2Icon } from 'lucide-react'
-
-import { getTotalPatients } from '@/actions/statistics/get-total-patients'
-import { getTotalReferredPatients } from '@/actions/statistics/get-total-referred-patients'
-import { SummaryCard } from '@/components/summary-card'
-
-export async function ReferredPatientsPercentageCard() {
-  const [totalPatients, totalReferredPatients] = await Promise.all([
-    getTotalPatients(),
-    getTotalReferredPatients(),
-  ])
-
-  const totalPatientsValue = totalPatients?.total ?? 0
-  const totalReferredPatientsValue = totalReferredPatients?.total ?? 0
-
-  const referredPatientsPercentage =
-    (totalReferredPatientsValue / totalPatientsValue) * 100
-
-  return (
-    <SummaryCard
-      icon={Users2Icon}
-      label='Pacientes encaminhados'
-      value={`${referredPatientsPercentage.toFixed(1)}%`}
-      className='sm:col-span-1'
-    />
-  )
-}
diff --git a/src/modules/referrals/by-category-card.tsx b/src/modules/referrals/total-by-category-card.tsx
similarity index 90%
rename from src/modules/referrals/by-category-card.tsx
rename to src/modules/referrals/total-by-category-card.tsx
index 27d67b01..4553af4d 100644
--- a/src/modules/referrals/by-category-card.tsx
+++ b/src/modules/referrals/total-by-category-card.tsx
@@ -11,14 +11,14 @@ import { SPECIALTIES, type Specialty } from '@/enums/shared'
 import { api } from '@/lib/api'
 import { usePeriodStore } from '@/store/period'
 
-export function ReferralsByCategoryCard() {
+export function TotalReferralsByCategoryCard() {
   const { period } = usePeriodStore()
 
   const { data: response, isLoading } = useQuery({
-    queryKey: [QUERY_CACHE_KEYS.statistics.referralsByCategory, period],
+    queryKey: [QUERY_CACHE_KEYS.statistics.totalReferralsByCategory, period],
     queryFn: () =>
       api<{ categories: Array<{ category: Specialty; total: number }> }>(
-        '/statistics/referrals-by-category',
+        '/statistics/referrals/by-category',
         { params: { period } },
       ),
   })
diff --git a/src/modules/referrals/by-state-card.tsx b/src/modules/referrals/total-by-state-card.tsx
similarity index 93%
rename from src/modules/referrals/by-state-card.tsx
rename to src/modules/referrals/total-by-state-card.tsx
index 0611a841..b45a8236 100644
--- a/src/modules/referrals/by-state-card.tsx
+++ b/src/modules/referrals/total-by-state-card.tsx
@@ -12,7 +12,7 @@ import { type UF, UF_LIST } from '@/enums/shared'
 import { api } from '@/lib/api'
 import { usePeriodStore } from '@/store/period'
 
-export function ReferralsByStateCard() {
+export function TotalReferralsByStateCard() {
   const { period } = usePeriodStore()
 
   const limit = 10
@@ -20,12 +20,12 @@ export function ReferralsByStateCard() {
   const queries = [period, limit, withPercentage]
 
   const { data: response, isLoading } = useQuery({
-    queryKey: [QUERY_CACHE_KEYS.statistics.referralsByState, queries],
+    queryKey: [QUERY_CACHE_KEYS.statistics.totalReferralsByState, queries],
     queryFn: () =>
       api<{
         states: Array<{ state: UF; total: number; percentage: number }>
         total: number
-      }>('/statistics/referrals-by-state', {
+      }>('/statistics/patients/with-referrals/by-state', {
         params: { period, limit, withPercentage },
       }),
   })
diff --git a/src/modules/referrals/total-referrals-card.tsx b/src/modules/referrals/total-referrals-card.tsx
index 66ff9411..a09ee2b1 100644
--- a/src/modules/referrals/total-referrals-card.tsx
+++ b/src/modules/referrals/total-referrals-card.tsx
@@ -14,7 +14,7 @@ export function TotalReferralsCard() {
   const { data: response, isLoading } = useQuery({
     queryKey: [QUERY_CACHE_KEYS.statistics.totalReferrals, period],
     queryFn: () =>
-      api<{ total: number }>('/statistics/referrals-total', {
+      api<{ total: number }>('/statistics/referrals/total', {
         params: { period },
       }),
   })

From 7b23ed85eedb98c99d2c54fea30e354831fe3a36 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 9 Feb 2026 23:06:45 -0300
Subject: [PATCH 47/77] feat(appointments): create main and list pages

---
 .../get-total-patients-with-appointments.ts   |  49 ++++++
 .../atendimentos/listagem/page.tsx            |   5 +
 src/app/(dashboard)/atendimentos/page.tsx     |  19 +++
 src/components/sidebar/index.tsx              |   8 +-
 src/constants/breadcrumbs/dashboard.ts        |  12 ++
 src/constants/cache.ts                        |   7 +
 src/constants/section-tab-buttons.ts          |  10 ++
 src/constants/section-titles.ts               |   1 +
 src/enums/appointments.ts                     |  34 +++-
 .../appointments/appointment-modal.tsx        |   9 +-
 .../appointments/cancel-appointment-modal.tsx |   9 +-
 src/modules/appointments/list.tsx             | 157 ++++++++++++++++++
 ...ents-with-appointments-percentage-card.tsx |  28 ++++
 .../appointments/period-tab-select.tsx        |  25 +++
 src/modules/appointments/table/index.tsx      |  44 +++--
 src/modules/appointments/table/skeleton.tsx   |  35 ++++
 .../appointments/total-appointments-card.tsx  |  31 ++++
 .../appointments/total-by-category-card.tsx   |  56 +++++++
 .../appointments/total-by-state-card.tsx      |  84 ++++++++++
 src/modules/dashboard/summary-cards.tsx       |   8 +-
 .../dashboard/upcoming-appointments-card.tsx  |   4 +-
 ...atients-with-referrals-percentage-card.tsx |   4 +-
 22 files changed, 602 insertions(+), 37 deletions(-)
 create mode 100644 src/actions/statistics/get-total-patients-with-appointments.ts
 create mode 100644 src/app/(dashboard)/atendimentos/listagem/page.tsx
 create mode 100644 src/app/(dashboard)/atendimentos/page.tsx
 create mode 100644 src/modules/appointments/list.tsx
 create mode 100644 src/modules/appointments/patients-with-appointments-percentage-card.tsx
 create mode 100644 src/modules/appointments/period-tab-select.tsx
 create mode 100644 src/modules/appointments/table/skeleton.tsx
 create mode 100644 src/modules/appointments/total-appointments-card.tsx
 create mode 100644 src/modules/appointments/total-by-category-card.tsx
 create mode 100644 src/modules/appointments/total-by-state-card.tsx

diff --git a/src/actions/statistics/get-total-patients-with-appointments.ts b/src/actions/statistics/get-total-patients-with-appointments.ts
new file mode 100644
index 00000000..c01c2d34
--- /dev/null
+++ b/src/actions/statistics/get-total-patients-with-appointments.ts
@@ -0,0 +1,49 @@
+'use server'
+
+import { DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS } from '@/config/cache'
+import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import type { QueryPeriod } from '@/enums/queries'
+import { api } from '@/lib/api'
+
+type GetTotalPatientsWithAppointmentsParams = {
+  period?: QueryPeriod
+}
+
+interface GetTotalPatientsWithAppointmentsProps {
+  params?: GetTotalPatientsWithAppointmentsParams
+  cacheKey?: string
+}
+
+export async function getTotalPatientsWithAppointments({
+  params,
+  cacheKey,
+}: GetTotalPatientsWithAppointmentsProps = {}) {
+  try {
+    const response = await api<{ total: number }>(
+      '/statistics/patients/with-appointments',
+      {
+        includeCookies: true,
+        cache: 'force-cache',
+        params,
+        next: {
+          revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
+          tags: cacheKey
+            ? [
+                NEXT_CACHE_TAGS.statistics.totalPatientsWithAppointments.main,
+                cacheKey,
+              ]
+            : [NEXT_CACHE_TAGS.statistics.totalPatientsWithAppointments.main],
+        },
+      },
+    )
+
+    if (!response.data) {
+      return null
+    }
+
+    return response.data
+  } catch (error) {
+    console.error('Failed to fetch total patients with appointments:', error)
+    return null
+  }
+}
diff --git a/src/app/(dashboard)/atendimentos/listagem/page.tsx b/src/app/(dashboard)/atendimentos/listagem/page.tsx
new file mode 100644
index 00000000..8ca7fc4d
--- /dev/null
+++ b/src/app/(dashboard)/atendimentos/listagem/page.tsx
@@ -0,0 +1,5 @@
+import { AppointmentsList } from '@/modules/appointments/list'
+
+export default function Page() {
+  return <AppointmentsList />
+}
diff --git a/src/app/(dashboard)/atendimentos/page.tsx b/src/app/(dashboard)/atendimentos/page.tsx
new file mode 100644
index 00000000..d5172be7
--- /dev/null
+++ b/src/app/(dashboard)/atendimentos/page.tsx
@@ -0,0 +1,19 @@
+import { PatientsWithAppointmentsPercentageCard } from '@/modules/appointments/patients-with-appointments-percentage-card'
+import { AppointmentsPeriodTabSelect } from '@/modules/appointments/period-tab-select'
+import { TotalAppointmentsCard } from '@/modules/appointments/total-appointments-card'
+import { TotalAppointmentsByCategoryCard } from '@/modules/appointments/total-by-category-card'
+import { TotalAppointmentsByStateCard } from '@/modules/appointments/total-by-state-card'
+
+export default function Page() {
+  return (
+    <div className='grid gap-6 sm:grid-cols-2'>
+      <AppointmentsPeriodTabSelect />
+
+      <TotalAppointmentsCard />
+      <PatientsWithAppointmentsPercentageCard />
+
+      <TotalAppointmentsByCategoryCard />
+      <TotalAppointmentsByStateCard />
+    </div>
+  )
+}
diff --git a/src/components/sidebar/index.tsx b/src/components/sidebar/index.tsx
index 4d7900fd..8e00229a 100644
--- a/src/components/sidebar/index.tsx
+++ b/src/components/sidebar/index.tsx
@@ -1,8 +1,8 @@
 import {
-  ClipboardListIcon,
+  ClipboardCheckIcon,
+  ClipboardPasteIcon,
   HeartHandshakeIcon,
   LayoutDashboardIcon,
-  Share2Icon,
   Users2Icon,
 } from 'lucide-react'
 
@@ -49,12 +49,12 @@ const SIDEBAR_SECTIONS = [
       },
       {
         label: 'Atendimentos',
-        icon: <ClipboardListIcon />,
+        icon: <ClipboardCheckIcon />,
         path: ROUTES.dashboard.appointments.main,
       },
       {
         label: 'Encaminhamentos',
-        icon: <Share2Icon />,
+        icon: <ClipboardPasteIcon />,
         path: ROUTES.dashboard.referrals.main,
       },
       // TODO: uncomment approvals when it's ready
diff --git a/src/constants/breadcrumbs/dashboard.ts b/src/constants/breadcrumbs/dashboard.ts
index 58963929..2aee2a8d 100644
--- a/src/constants/breadcrumbs/dashboard.ts
+++ b/src/constants/breadcrumbs/dashboard.ts
@@ -44,6 +44,18 @@ export const DASHBOARD_BREADCRUMBS: Breadcrumbs = {
       path: ROUTES.dashboard.patients.new,
     },
   },
+  atendimentos: {
+    atendimentos: {
+      icon: ClipboardCheckIcon,
+      name: 'Atendimentos',
+      path: ROUTES.dashboard.appointments.main,
+    },
+    listagem: {
+      icon: ClipboardListIcon,
+      name: 'Lista de atendimentos',
+      path: ROUTES.dashboard.appointments.list,
+    },
+  },
   encaminhamentos: {
     encaminhamentos: {
       icon: ClipboardPasteIcon,
diff --git a/src/constants/cache.ts b/src/constants/cache.ts
index c0ad1a2a..ed822b85 100644
--- a/src/constants/cache.ts
+++ b/src/constants/cache.ts
@@ -18,6 +18,10 @@ export const NEXT_CACHE_TAGS = {
       main: 'total-patients',
       query: (query: string) => `total-patients/${query}`,
     },
+    totalPatientsWithAppointments: {
+      main: 'total-patients-with-appointments',
+      query: (query: string) => `total-patients-with-appointments/${query}`,
+    },
     totalPatientsWithReferrals: {
       main: 'total-patients-with-referrals',
       query: (query: string) => `total-patients-with-referrals/${query}`,
@@ -54,6 +58,9 @@ export const QUERY_CACHE_KEYS = {
     approved: 'approvals-approved',
   },
   statistics: {
+    totalAppointments: 'total-appointments',
+    totalAppointmentsByCategory: 'total-appointments-by-category',
+    totalAppointmentsByState: 'appointments-by-state',
     totalReferrals: 'total-referrals',
     totalReferralsByCategory: 'total-referrals-by-category',
     totalReferralsByState: 'referrals-by-state',
diff --git a/src/constants/section-tab-buttons.ts b/src/constants/section-tab-buttons.ts
index 92a86c9b..fe284102 100644
--- a/src/constants/section-tab-buttons.ts
+++ b/src/constants/section-tab-buttons.ts
@@ -29,6 +29,16 @@ export const SECTION_TAB_BUTTONS: Record<string, Array<TabButton>> = {
       path: ROUTES.dashboard.patients.details.referrals,
     },
   ],
+  atendimentos: [
+    {
+      title: 'Visão geral',
+      path: ROUTES.dashboard.appointments.main,
+    },
+    {
+      title: 'Lista de atendimentos',
+      path: ROUTES.dashboard.appointments.list,
+    },
+  ],
   encaminhamentos: [
     {
       title: 'Visão geral',
diff --git a/src/constants/section-titles.ts b/src/constants/section-titles.ts
index 08324c07..c55c060f 100644
--- a/src/constants/section-titles.ts
+++ b/src/constants/section-titles.ts
@@ -1,6 +1,7 @@
 export const SECTION_TITLES = {
   default: 'Visão geral',
   pacientes: 'Pacientes',
+  atendimentos: 'Atendimentos',
   encaminhamentos: 'Encaminhamentos',
   aprovacoes: 'Aprovações',
   equipe: 'Equipe',
diff --git a/src/enums/appointments.ts b/src/enums/appointments.ts
index 1e6e19fe..eae49de0 100644
--- a/src/enums/appointments.ts
+++ b/src/enums/appointments.ts
@@ -1,16 +1,36 @@
 import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
 
 export const APPOINTMENT_STATUSES = {
-  scheduled: 'Agendado',
-  canceled: 'Cancelado',
-  completed: 'Concluído',
-  no_show: 'Não compareceu',
+  scheduled: { variant: 'outlined', label: 'Agendado' },
+  canceled: { variant: 'error', label: 'Cancelado' },
+  completed: { variant: 'success', label: 'Concluído' },
+  no_show: { variant: 'info', label: 'Não compareceu' },
 } as const
 export type AppointmentStatus = keyof typeof APPOINTMENT_STATUSES
 
-export const APPOINTMENT_STATUS_OPTIONS =
-  convertObjectToOptions(APPOINTMENT_STATUSES)
-
 export const APPOINTMENT_STATUS_ENUM = Object.keys(APPOINTMENT_STATUSES) as [
   AppointmentStatus,
 ]
+
+export const APPOINTMENT_STATUS_OPTIONS = Object.entries(
+  APPOINTMENT_STATUSES,
+).map(([key, status]) => ({ label: status.label, value: key }))
+
+export const APPOINTMENTS_ORDER = {
+  name_asc: 'Nome (Asc.)',
+  name_desc: 'Nome (Desc.)',
+  date_asc: 'Data (Asc.)',
+  date_desc: 'Data (Desc.)',
+  status_asc: 'Status (Asc.)',
+  status_desc: 'Status (Desc.)',
+  category_asc: 'Categoria (Asc.)',
+  category_desc: 'Categoria (Desc.)',
+  condition_asc: 'Quadro geral (Asc.)',
+  condition_desc: 'Quadro geral (Desc.)',
+  professional_asc: 'Profissional (Asc.)',
+  professional_desc: 'Profissional (Desc.)',
+}
+export type AppointmentsOrder = keyof typeof APPOINTMENTS_ORDER
+
+export const APPOINTMENTS_ORDER_OPTIONS =
+  convertObjectToOptions(APPOINTMENTS_ORDER)
diff --git a/src/modules/appointments/appointment-modal.tsx b/src/modules/appointments/appointment-modal.tsx
index e77293eb..b4aca4e8 100644
--- a/src/modules/appointments/appointment-modal.tsx
+++ b/src/modules/appointments/appointment-modal.tsx
@@ -107,12 +107,19 @@ export function AppointmentModal({
       return
     }
 
-    revalidateClientCache(QUERY_CACHE_KEYS.appointments.main)
+    revalidateClientCache([
+      QUERY_CACHE_KEYS.appointments.main,
+      QUERY_CACHE_KEYS.statistics.totalAppointmentsByCategory,
+      QUERY_CACHE_KEYS.statistics.totalAppointmentsByState,
+      QUERY_CACHE_KEYS.statistics.totalAppointments,
+    ])
     revalidateServerCache([
       NEXT_CACHE_TAGS.patient(data.patient_id),
       NEXT_CACHE_TAGS.appointments.main,
       NEXT_CACHE_TAGS.statistics.totalAppointments.main,
+      NEXT_CACHE_TAGS.statistics.totalPatientsWithAppointments.main,
     ])
+
     toast.success(response.message)
     onClose()
   }
diff --git a/src/modules/appointments/cancel-appointment-modal.tsx b/src/modules/appointments/cancel-appointment-modal.tsx
index d0a38463..4e81cd8c 100644
--- a/src/modules/appointments/cancel-appointment-modal.tsx
+++ b/src/modules/appointments/cancel-appointment-modal.tsx
@@ -43,10 +43,17 @@ export function CancelAppointmentModal({
         return
       }
 
-      revalidateClientCache(QUERY_CACHE_KEYS.appointments.main)
+      revalidateClientCache([
+        QUERY_CACHE_KEYS.appointments.main,
+        QUERY_CACHE_KEYS.statistics.totalAppointments,
+        QUERY_CACHE_KEYS.statistics.totalAppointmentsByCategory,
+        QUERY_CACHE_KEYS.statistics.totalAppointmentsByState,
+      ])
       revalidateServerCache([
         NEXT_CACHE_TAGS.patient(appointment.patient_id),
         NEXT_CACHE_TAGS.appointments.main,
+        NEXT_CACHE_TAGS.statistics.totalAppointments.main,
+        NEXT_CACHE_TAGS.statistics.totalPatientsWithAppointments.main,
       ])
       toast.success(response.message)
       onClose()
diff --git a/src/modules/appointments/list.tsx b/src/modules/appointments/list.tsx
new file mode 100644
index 00000000..6bb48f5d
--- /dev/null
+++ b/src/modules/appointments/list.tsx
@@ -0,0 +1,157 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query'
+import { ClipboardCheckIcon } from 'lucide-react'
+import { useEffect, useState } from 'react'
+
+import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
+import { FilterContainer } from '@/components/filters/container'
+import { FilterDate } from '@/components/filters/date'
+import { FilterSelect } from '@/components/filters/filter-select'
+import { SearchInput } from '@/components/filters/search-input'
+import { ShowFilterButton } from '@/components/filters/show-filter-button'
+import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
+import { Card } from '@/components/ui/card'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import type { AppointmentsOrder } from '@/enums/appointments'
+import {
+  APPOINTMENT_STATUS_OPTIONS,
+  APPOINTMENTS_ORDER_OPTIONS,
+} from '@/enums/appointments'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
+import { SPECIALTIES_OPTIONS } from '@/enums/shared'
+import { useParams } from '@/hooks/params'
+import { api } from '@/lib/api'
+import type { Appointment } from '@/types/appointments'
+import type { AppointmentsOrderBy, QueryOrderMapping } from '@/types/orders'
+
+import { NewAppointmentButton } from './new-appointment-button'
+import { AppointmentsTable } from './table'
+
+export function AppointmentsList() {
+  const [showFilters, setShowFilters] = useState(false)
+  const [stableTotal, setStableTotal] = useState(0)
+  const { getParams, paramsQueryKey } = useParams()
+
+  const [page, search, category, status, orderBy, startDate, endDate] =
+    getParams([
+      QUERY_PARAM_KEYS.page,
+      QUERY_PARAM_KEYS.search,
+      QUERY_PARAM_KEYS.category,
+      QUERY_PARAM_KEYS.status,
+      QUERY_PARAM_KEYS.orderBy,
+      QUERY_PARAM_KEYS.startDate,
+      QUERY_PARAM_KEYS.endDate,
+    ])
+
+  const ORDER_MAPPING: QueryOrderMapping<
+    AppointmentsOrder,
+    AppointmentsOrderBy
+  > = {
+    date_asc: { orderBy: 'date', order: 'ASC' },
+    date_desc: { orderBy: 'date', order: 'DESC' },
+    name_asc: { orderBy: 'patient', order: 'ASC' },
+    name_desc: { orderBy: 'patient', order: 'DESC' },
+    status_asc: { orderBy: 'status', order: 'ASC' },
+    status_desc: { orderBy: 'status', order: 'DESC' },
+    category_asc: { orderBy: 'category', order: 'ASC' },
+    category_desc: { orderBy: 'category', order: 'DESC' },
+    condition_asc: { orderBy: 'condition', order: 'ASC' },
+    condition_desc: { orderBy: 'condition', order: 'DESC' },
+    professional_asc: { orderBy: 'professional', order: 'ASC' },
+    professional_desc: { orderBy: 'professional', order: 'DESC' },
+  }
+
+  const orderByQuery =
+    ORDER_MAPPING[orderBy as AppointmentsOrder] ?? ORDER_MAPPING['name_asc']
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.appointments.main, paramsQueryKey],
+    queryFn: () =>
+      api<{ appointments: Appointment[]; total: number }>('/appointments', {
+        params: {
+          page,
+          search,
+          category,
+          status,
+          startDate,
+          endDate,
+          ...orderByQuery,
+        },
+      }),
+  })
+
+  const appointments = response?.data?.appointments ?? []
+
+  // Update stable total only when we have actual data to prevent pagination flickering
+  useEffect(() => {
+    if (response?.data?.total !== undefined) {
+      setStableTotal(response.data.total)
+    }
+  }, [response?.data?.total])
+
+  useEffect(() => {
+    if (category || startDate || endDate) {
+      setShowFilters(true)
+    }
+  }, [category, startDate, endDate])
+
+  return (
+    <>
+      <SectionHeader>
+        <SectionHeaderTitle
+          title='Atendimentos'
+          icon={<ClipboardCheckIcon />}
+          total={stableTotal}
+        />
+        <SectionHeaderActions>
+          <SearchInput placeholder='Pesquisar' className='w-48' />
+          <FilterSelect
+            param={QUERY_PARAM_KEYS.orderBy}
+            options={APPOINTMENTS_ORDER_OPTIONS}
+            placeholder='Ordenar por'
+            resetLabel='Limpar ordem'
+            className='w-52'
+          />
+          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
+
+          <NewAppointmentButton size='sm' />
+        </SectionHeaderActions>
+      </SectionHeader>
+
+      {showFilters && (
+        <section className='flex flex-wrap items-end gap-6'>
+          <FilterContainer title='Categoria' className='w-46'>
+            <FilterSelect
+              param={QUERY_PARAM_KEYS.category}
+              options={SPECIALTIES_OPTIONS}
+              placeholder='Todas'
+              resetLabel='Limpar categoria'
+            />
+          </FilterContainer>
+          <FilterContainer title='Status' className='w-46'>
+            <FilterSelect
+              param={QUERY_PARAM_KEYS.status}
+              options={APPOINTMENT_STATUS_OPTIONS}
+              placeholder='Todos'
+              resetLabel='Limpar status'
+            />
+          </FilterContainer>
+          <FilterDate allowFutureDates />
+          <ClearFiltersButton />
+        </section>
+      )}
+
+      <Card className='p-6'>
+        <AppointmentsTable appointments={appointments} loading={isLoading} />
+      </Card>
+
+      <Pagination totalItems={stableTotal} />
+    </>
+  )
+}
diff --git a/src/modules/appointments/patients-with-appointments-percentage-card.tsx b/src/modules/appointments/patients-with-appointments-percentage-card.tsx
new file mode 100644
index 00000000..eb5c9909
--- /dev/null
+++ b/src/modules/appointments/patients-with-appointments-percentage-card.tsx
@@ -0,0 +1,28 @@
+import { UserCheck2Icon } from 'lucide-react'
+
+import { getTotalPatients } from '@/actions/statistics/get-total-patients'
+import { getTotalPatientsWithAppointments } from '@/actions/statistics/get-total-patients-with-appointments'
+import { SummaryCard } from '@/components/summary-card'
+
+export async function PatientsWithAppointmentsPercentageCard() {
+  const [totalPatients, totalPatientsWithAppointments] = await Promise.all([
+    getTotalPatients(),
+    getTotalPatientsWithAppointments(),
+  ])
+
+  const totalPatientsValue = totalPatients?.total ?? 0
+  const totalPatientsWithAppointmentsValue =
+    totalPatientsWithAppointments?.total ?? 0
+
+  const totalPatientsWithAppointmentsPercentage =
+    (totalPatientsWithAppointmentsValue / totalPatientsValue) * 100
+
+  return (
+    <SummaryCard
+      icon={UserCheck2Icon}
+      label='Pacientes atendidos'
+      value={`${totalPatientsWithAppointmentsPercentage.toFixed(1)}%`}
+      className='sm:col-span-1'
+    />
+  )
+}
diff --git a/src/modules/appointments/period-tab-select.tsx b/src/modules/appointments/period-tab-select.tsx
new file mode 100644
index 00000000..0bbd2c86
--- /dev/null
+++ b/src/modules/appointments/period-tab-select.tsx
@@ -0,0 +1,25 @@
+'use client'
+
+import { TabSelect } from '@/components/ui/tab-select'
+import type { QueryPeriod } from '@/enums/queries'
+import { usePeriodStore } from '@/store/period'
+
+export function AppointmentsPeriodTabSelect() {
+  const { period, setPeriod } = usePeriodStore()
+
+  const options: Array<{ label: string; value: QueryPeriod }> = [
+    { label: 'Hoje', value: 'today' },
+    { label: 'Na última semana', value: 'last-week' },
+    { label: 'No último mês', value: 'last-month' },
+    { label: 'No último ano', value: 'last-year' },
+  ]
+
+  return (
+    <TabSelect<QueryPeriod>
+      value={period}
+      options={options}
+      onSelect={(value) => setPeriod(value)}
+      className='col-span-full'
+    />
+  )
+}
diff --git a/src/modules/appointments/table/index.tsx b/src/modules/appointments/table/index.tsx
index fe1b5e2d..16e1e102 100644
--- a/src/modules/appointments/table/index.tsx
+++ b/src/modules/appointments/table/index.tsx
@@ -11,21 +11,25 @@ import {
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
 import { ROUTES } from '@/constants/routes'
+import { APPOINTMENT_STATUSES } from '@/enums/appointments'
 import { PATIENT_CONDITIONS } from '@/enums/patients'
 import { SPECIALTIES } from '@/enums/shared'
 import type { Appointment } from '@/types/appointments'
 import { formatDate } from '@/utils/formatters/format-date'
 
 import { AppointmentsTableActions } from './actions'
+import { AppointmentsTableSkeleton } from './skeleton'
 
 interface AppointmentsTableProps {
   appointments: Appointment[]
+  loading?: boolean
 }
 
 export function AppointmentsTable({
   appointments,
+  loading,
 }: Readonly<AppointmentsTableProps>) {
-  const isEmpty = appointments.length <= 0
+  const isEmpty = !loading && appointments.length <= 0
 
   return (
     <Table>
@@ -33,16 +37,27 @@ export function AppointmentsTable({
         <TableRow>
           <TableHead className='w-64'>Paciente</TableHead>
           <TableHead className='w-36'>Data</TableHead>
-          <TableHead className='w-44'>Categoria</TableHead>
+          <TableHead className='w-48'>Categoria</TableHead>
           <TableHead>Profissional</TableHead>
           <TableHead className='w-36'>Quadro geral</TableHead>
+          <TableHead className='w-36'>Status</TableHead>
           <TableHead className='w-20 text-center'>Ações</TableHead>
         </TableRow>
       </TableHeader>
+      <TableBody>
+        {loading && <AppointmentsTableSkeleton />}
 
-      {!isEmpty && (
-        <TableBody>
-          {appointments.map((appointment) => {
+        {isEmpty && (
+          <TableRow>
+            <TableEmptyCell colSpan={6}>
+              Nenhum atendimento registrado
+            </TableEmptyCell>
+          </TableRow>
+        )}
+
+        {!loading &&
+          appointments.map((appointment) => {
+            const status = APPOINTMENT_STATUSES[appointment.status]
             const condition = PATIENT_CONDITIONS[appointment.condition]
             const Icon = condition.icon
 
@@ -73,25 +88,18 @@ export function AppointmentsTable({
                     {condition.label}
                   </Tag>
                 </TableCell>
-
+                <TableCell>
+                  <Tag variant={status.variant} size='sm'>
+                    {status.label}
+                  </Tag>
+                </TableCell>
                 <TableCell className='text-center'>
                   <AppointmentsTableActions appointment={appointment} />
                 </TableCell>
               </TableRow>
             )
           })}
-        </TableBody>
-      )}
-
-      {isEmpty && (
-        <TableBody>
-          <TableRow>
-            <TableEmptyCell colSpan={6}>
-              Nenhum atendimento registrado
-            </TableEmptyCell>
-          </TableRow>
-        </TableBody>
-      )}
+      </TableBody>
     </Table>
   )
 }
diff --git a/src/modules/appointments/table/skeleton.tsx b/src/modules/appointments/table/skeleton.tsx
new file mode 100644
index 00000000..f46526a0
--- /dev/null
+++ b/src/modules/appointments/table/skeleton.tsx
@@ -0,0 +1,35 @@
+import { Skeleton } from '@/components/ui/skeleton'
+import { TableCell, TableRow } from '@/components/ui/table'
+
+export function AppointmentsTableSkeleton() {
+  const skeletons = Array.from({ length: 10 }).map((_, index) => index)
+
+  return skeletons.map((skeleton) => (
+    <TableRow key={skeleton}>
+      <TableCell>
+        <div className='flex w-64 items-center gap-2'>
+          <Skeleton className='size-9 rounded-full' />
+          <Skeleton className='h-5 w-44 rounded-md' />
+        </div>
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-5 w-24 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-6 w-36 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-5 w-40 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-6 w-24 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='h-6 w-28 rounded-md' />
+      </TableCell>
+      <TableCell>
+        <Skeleton className='mx-auto size-8 rounded-md' />
+      </TableCell>
+    </TableRow>
+  ))
+}
diff --git a/src/modules/appointments/total-appointments-card.tsx b/src/modules/appointments/total-appointments-card.tsx
new file mode 100644
index 00000000..dcac7b91
--- /dev/null
+++ b/src/modules/appointments/total-appointments-card.tsx
@@ -0,0 +1,31 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query'
+import { ClipboardCheckIcon } from 'lucide-react'
+
+import { SummaryCard } from '@/components/summary-card'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { api } from '@/lib/api'
+import { usePeriodStore } from '@/store/period'
+
+export function TotalAppointmentsCard() {
+  const { period } = usePeriodStore()
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.statistics.totalAppointments, period],
+    queryFn: () =>
+      api<{ total: number }>('/statistics/appointments/total', {
+        params: { period },
+      }),
+  })
+
+  return (
+    <SummaryCard
+      icon={ClipboardCheckIcon}
+      label='Atendimentos'
+      value={response?.data?.total}
+      className='sm:col-span-1'
+      loading={isLoading}
+    />
+  )
+}
diff --git a/src/modules/appointments/total-by-category-card.tsx b/src/modules/appointments/total-by-category-card.tsx
new file mode 100644
index 00000000..f267de82
--- /dev/null
+++ b/src/modules/appointments/total-by-category-card.tsx
@@ -0,0 +1,56 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query'
+import { ChartBarDecreasingIcon } from 'lucide-react'
+
+import { BarChart } from '@/components/charts/bar'
+import { DashboardCardChart } from '@/components/dashboard/cards/chart'
+import { Skeleton } from '@/components/ui/skeleton'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { SPECIALTIES, type Specialty } from '@/enums/shared'
+import { api } from '@/lib/api'
+import { usePeriodStore } from '@/store/period'
+
+export function TotalAppointmentsByCategoryCard() {
+  const { period } = usePeriodStore()
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.statistics.totalAppointmentsByCategory, period],
+    queryFn: () =>
+      api<{ categories: Array<{ category: Specialty; total: number }> }>(
+        '/statistics/appointments/by-category',
+        { params: { period } },
+      ),
+  })
+
+  const categories = response?.data?.categories ?? []
+  const isEmpty = categories.length === 0 && !isLoading
+
+  const data = categories.map((item) => ({
+    label: SPECIALTIES[item.category],
+    value: Number(item.total),
+  }))
+
+  return (
+    <DashboardCardChart
+      title='Atendimentos por categoria'
+      icon={ChartBarDecreasingIcon}
+    >
+      <div className='flex h-full min-h-60 items-center justify-center'>
+        {isLoading && <Skeleton className='bg-border/75 size-full' />}
+
+        {!isLoading && !isEmpty && (
+          <div className='size-full min-h-40'>
+            <BarChart data={data} />
+          </div>
+        )}
+
+        {isEmpty && (
+          <p className='text-foreground-soft text-sm'>
+            Nenhum atendimento registrado neste período.
+          </p>
+        )}
+      </div>
+    </DashboardCardChart>
+  )
+}
diff --git a/src/modules/appointments/total-by-state-card.tsx b/src/modules/appointments/total-by-state-card.tsx
new file mode 100644
index 00000000..5579a8b0
--- /dev/null
+++ b/src/modules/appointments/total-by-state-card.tsx
@@ -0,0 +1,84 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query'
+import { ChartPieIcon } from 'lucide-react'
+
+import { PieChart } from '@/components/charts/pie'
+import { DashboardCardChart } from '@/components/dashboard/cards/chart'
+import { Skeleton } from '@/components/ui/skeleton'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { CHART_PIE_COLORS } from '@/constants/charts'
+import { type UF, UF_LIST } from '@/enums/shared'
+import { api } from '@/lib/api'
+import { usePeriodStore } from '@/store/period'
+
+export function TotalAppointmentsByStateCard() {
+  const { period } = usePeriodStore()
+
+  const limit = 10
+  const withPercentage = true
+  const queries = [period, limit, withPercentage]
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.statistics.totalAppointmentsByState, queries],
+    queryFn: () =>
+      api<{
+        states: Array<{ state: UF; total: number; percentage: number }>
+        total: number
+      }>('/statistics/patients/with-appointments/by-state', {
+        params: { period, limit, withPercentage },
+      }),
+  })
+
+  const states = response?.data?.states ?? []
+  const isEmpty = states.length === 0 && !isLoading
+
+  const data = states.map((item, index) => ({
+    label: UF_LIST[item.state],
+    value: Number(item.percentage),
+    color: CHART_PIE_COLORS[index],
+  }))
+
+  return (
+    <DashboardCardChart title='Localização dos pacientes' icon={ChartPieIcon}>
+      <div className='flex h-full min-h-60 items-center justify-center'>
+        {isLoading && <Skeleton className='bg-border/75 size-full' />}
+
+        {!isLoading && !isEmpty && (
+          <div className='flex size-full items-center gap-6 xl:gap-10'>
+            <PieChart
+              data={data}
+              label='Estados'
+              total={response?.data?.total}
+              className='size-40'
+            />
+
+            <div className='divide-border min-w-0 flex-1 divide-y'>
+              {data.map((state) => {
+                return (
+                  <div
+                    key={state.label}
+                    className='text-foreground-soft flex items-center gap-2 py-1 text-sm'
+                  >
+                    <div
+                      className='size-2.5 shrink-0 rounded-full'
+                      style={{ backgroundColor: state.color }}
+                    />
+                    <span className='flex-1 truncate'>{state.label}</span>
+                    <span className='font-semibold'>{state.value}%</span>
+                  </div>
+                )
+              })}
+            </div>
+          </div>
+        )}
+
+        {isEmpty && (
+          <p className='text-foreground-soft text-sm'>
+            Nenhum encaminhamento registrado neste período.
+          </p>
+        )}
+      </div>
+    </DashboardCardChart>
+  )
+}
diff --git a/src/modules/dashboard/summary-cards.tsx b/src/modules/dashboard/summary-cards.tsx
index 5e835176..72af6416 100644
--- a/src/modules/dashboard/summary-cards.tsx
+++ b/src/modules/dashboard/summary-cards.tsx
@@ -1,4 +1,8 @@
-import { ClipboardListIcon, ClipboardPasteIcon, Users2Icon } from 'lucide-react'
+import {
+  ClipboardCheckIcon,
+  ClipboardPasteIcon,
+  Users2Icon,
+} from 'lucide-react'
 
 import { getTotalAppointments } from '@/actions/statistics/get-total-appointments'
 import { getTotalPatients } from '@/actions/statistics/get-total-patients'
@@ -27,7 +31,7 @@ export async function DashboardSummaryCards() {
         className='sm:col-span-2'
       />
       <SummaryCard
-        icon={ClipboardListIcon}
+        icon={ClipboardCheckIcon}
         label='Atendimentos'
         value={appointments?.total}
         className='sm:col-span-2'
diff --git a/src/modules/dashboard/upcoming-appointments-card.tsx b/src/modules/dashboard/upcoming-appointments-card.tsx
index e9908ceb..d3346ba8 100644
--- a/src/modules/dashboard/upcoming-appointments-card.tsx
+++ b/src/modules/dashboard/upcoming-appointments-card.tsx
@@ -1,4 +1,4 @@
-import { ClipboardListIcon } from 'lucide-react'
+import { ClipboardCheckIcon } from 'lucide-react'
 
 import {
   getAppointments,
@@ -38,7 +38,7 @@ export async function DashboardUpcomingAppointmentsCard() {
       <SectionHeader className='mb-6'>
         <SectionHeaderTitle
           title='Próximos atendimentos'
-          icon={<ClipboardListIcon />}
+          icon={<ClipboardCheckIcon />}
         />
         <SectionHeaderActions>
           <NavButton
diff --git a/src/modules/referrals/patients-with-referrals-percentage-card.tsx b/src/modules/referrals/patients-with-referrals-percentage-card.tsx
index c8ed2c61..be513d83 100644
--- a/src/modules/referrals/patients-with-referrals-percentage-card.tsx
+++ b/src/modules/referrals/patients-with-referrals-percentage-card.tsx
@@ -1,4 +1,4 @@
-import { Users2Icon } from 'lucide-react'
+import { UserCheck2Icon } from 'lucide-react'
 
 import { getTotalPatients } from '@/actions/statistics/get-total-patients'
 import { getTotalPatientsWithReferrals } from '@/actions/statistics/get-total-patients-with-referrals'
@@ -18,7 +18,7 @@ export async function PatientsWithReferralsPercentageCard() {
 
   return (
     <SummaryCard
-      icon={Users2Icon}
+      icon={UserCheck2Icon}
       label='Pacientes encaminhados'
       value={`${totalPatientsWithReferralsPercentage.toFixed(1)}%`}
       className='sm:col-span-1'

From 7f68a65161e7439d964846a47861603baee54b18 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 9 Feb 2026 23:11:13 -0300
Subject: [PATCH 48/77] fix(dashboard): fix patients by gender and city
 endpoints

---
 src/components/ui/select.tsx                      | 2 +-
 src/modules/dashboard/patients-by-city-card.tsx   | 2 +-
 src/modules/dashboard/patients-by-gender-card.tsx | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
index a111a07e..db98b9bd 100644
--- a/src/components/ui/select.tsx
+++ b/src/components/ui/select.tsx
@@ -76,7 +76,7 @@ export function Select({
           <BaseSelect.Popup
             className={cn(
               'border-border bg-popover rounded-lg border p-2 shadow-lg outline-none',
-              'max-h-[min(var(--available-height),30rem)] max-w-[var(--available-width)] min-w-[var(--anchor-width)] origin-[var(--transform-origin)] overflow-y-auto overscroll-contain',
+              'max-h-[min(var(--available-height),32rem)] max-w-[var(--available-width)] min-w-[var(--anchor-width)] origin-[var(--transform-origin)] overflow-y-auto overscroll-contain',
               'transition-[transform,translate,opacity]',
               'data-[ending-style]:-translate-y-2 data-[ending-style]:opacity-0',
               'data-[starting-style]:-translate-y-2 data-[starting-style]:opacity-0',
diff --git a/src/modules/dashboard/patients-by-city-card.tsx b/src/modules/dashboard/patients-by-city-card.tsx
index c3f28b45..b6ee5e5c 100644
--- a/src/modules/dashboard/patients-by-city-card.tsx
+++ b/src/modules/dashboard/patients-by-city-card.tsx
@@ -26,7 +26,7 @@ export function DashboardPatientsByCityCard() {
       api<{
         cities: { city: string; percentage: number }[]
         total: number
-      }>('/statistics/patients-by-city', {
+      }>('/statistics/patients/by-city', {
         params: { period, limit, withPercentage },
       }),
   })
diff --git a/src/modules/dashboard/patients-by-gender-card.tsx b/src/modules/dashboard/patients-by-gender-card.tsx
index 67c82f33..75d75c69 100644
--- a/src/modules/dashboard/patients-by-gender-card.tsx
+++ b/src/modules/dashboard/patients-by-gender-card.tsx
@@ -22,7 +22,7 @@ export function DashboardPatientsByGenderCard() {
       api<{
         genders: { gender: PatientGender; total: string }[]
         total: number
-      }>('/statistics/patients-by-gender', {
+      }>('/statistics/patients/by-gender', {
         params: { period },
       }),
   })

From 2d8233efaecd5d6759e41250896f0037e44dd151 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Wed, 11 Feb 2026 17:25:18 -0300
Subject: [PATCH 49/77] refactor(profile): update profile page and change
 password modal

---
 src/app/(dashboard)/perfil/page.tsx           | 162 +++---------------
 src/components/form/select-input.tsx          |   6 +-
 src/components/sidebar/account.tsx            |   5 +-
 src/components/ui/avatar.tsx                  |   2 +-
 src/components/ui/button.tsx                  |   2 +-
 src/components/ui/input.tsx                   |   2 +-
 src/components/ui/select.tsx                  |  10 +-
 src/constants/section-titles.ts               |   2 +-
 src/helpers/revalidate-client-cache.ts        |   7 +-
 .../profile/change-password-button.tsx        |  13 +-
 src/modules/profile/change-password-modal.tsx | 119 ++++++-------
 src/modules/profile/profile-form.tsx          |  82 ++++++---
 src/modules/users/table/index.tsx             |   2 +-
 src/schemas/index.tsx                         |  16 ++
 src/types/users.d.ts                          |   2 +-
 15 files changed, 200 insertions(+), 232 deletions(-)

diff --git a/src/app/(dashboard)/perfil/page.tsx b/src/app/(dashboard)/perfil/page.tsx
index 8d09832e..e6653fee 100644
--- a/src/app/(dashboard)/perfil/page.tsx
+++ b/src/app/(dashboard)/perfil/page.tsx
@@ -1,153 +1,47 @@
-'use client'
-
-import { ArrowLeftIcon, Loader2 } from 'lucide-react'
-import { useEffect, useState } from 'react'
+import { redirect } from 'next/navigation'
 
 import { getCurrentUser } from '@/actions/users'
 import { Avatar } from '@/components/ui/avatar'
-import { Button } from '@/components/ui/button'
-import { DatePicker } from '@/components/ui/date-picker'
 import { Divider } from '@/components/ui/divider'
-import { Input } from '@/components/ui/input'
-import { NavButton } from '@/components/ui/nav-button'
-import { ChangePasswordButton } from '@/modules/profile/change-password-button'
-import { ProfileForm } from '@/modules/profile/profile-form'
-
-interface UserProfile {
-  category?: string
-  register?: string
-  avatar_url?: string | null | undefined
-  entryDate?: string | null | undefined
-  role: 'specialist'
-}
-
-export default function Page() {
-  const [user, setUser] = useState<UserProfile | null>(null)
-  const [loading, setLoading] = useState(true)
-
-  useEffect(() => {
-    async function fetchUser() {
-      try {
-        const data = await getCurrentUser()
-
-        if (!data) {
-          setUser(null)
-          return
-        }
+import { ROUTES } from '@/constants/routes'
+import { ChangeUserPasswordButton } from '@/modules/profile/change-password-button'
+import { UserProfileForm } from '@/modules/profile/profile-form'
+import { formatDate } from '@/utils/formatters/format-date'
 
-        const formattedUser: UserProfile = {
-          ...data,
-          role: 'specialist',
-          entryDate: data.created_at
-            ? new Date(data.created_at).toLocaleDateString('pt-BR')
-            : undefined,
-          category: (data as UserProfile).category ?? '',
-          register: (data as UserProfile).register ?? '',
-          avatar_url: (data as UserProfile).avatar_url ?? '',
-        }
-
-        setUser(formattedUser)
-      } catch (error) {
-        console.error('Erro ao carregar dados do usuário:', error)
-      } finally {
-        setLoading(false)
-      }
-    }
-
-    fetchUser()
-  }, [])
-
-  if (loading) {
-    return (
-      <div className='flex h-[60vh] items-center justify-center'>
-        <Loader2 className='text-muted-foreground h-6 w-6 animate-spin' />
-      </div>
-    )
-  }
+export default async function Page() {
+  const user = await getCurrentUser()
 
   if (!user) {
-    return (
-      <div className='text-muted-foreground flex h-[60vh] items-center justify-center'>
-        Não foi possível carregar suas informações.
-      </div>
-    )
+    redirect(ROUTES.auth.signOut)
   }
 
-  const isEspecialist = user.role?.toLowerCase() === 'especialist'
+  const showUpdatedDate = new Date(user.updated_at) >= new Date(user.created_at)
 
   return (
-    <div className='mx-auto max-w-3xl p-6'>
-      <NavButton
-        href=''
-        variant='ghost'
-        className='text-foreground-soft mr-auto'
-      >
-        <ArrowLeftIcon />
-        Voltar
-      </NavButton>
-      <div className='flex gap-3'>
-        <div className='flex flex-col items-center gap-1'>
-          <Avatar className='size-16' />
-          <Button variant='outline'>Escolher</Button>
-        </div>
-        <div className='flex flex-col'>
-          <span>Imagem</span>
-          <span className='text-foreground-soft text-sm'>
-            Min 400x400px, PNG ou JPEG
-          </span>
-        </div>
+    <>
+      <div className='flex items-center gap-4'>
+        <Avatar src={user.avatar_url} className='size-16' />
         <div>
-          <div>
-            <label className='text-muted-foreground text-sm'>
-              Data de entrada
-            </label>
-            <DatePicker
-              value={new Date().toLocaleDateString('pt-BR')}
-              readOnly
-            />
-          </div>
+          <p className='text-xl font-semibold'>{user.name}</p>
+          <span className='text-foreground-soft text-sm'>{user.email}</span>
+        </div>
+      </div>
 
-          <div>
-            <label className='text-muted-foreground text-sm'>
-              Profissional
-            </label>
-            <Input value={user.role ?? ''} readOnly />
-          </div>
+      <Divider />
 
-          {isEspecialist && (
-            <>
-              <div>
-                <label className='text-muted-foreground text-sm'>
-                  Categoria
-                </label>
-                <Input
-                  value={user.category ?? ''}
-                  placeholder='Não informado'
-                  readOnly
-                />
-              </div>
+      <UserProfileForm user={user} />
 
-              <div>
-                <label className='text-muted-foreground text-sm'>
-                  Registro
-                </label>
-                <Input
-                  value={user.register ?? ''}
-                  placeholder='Não informado'
-                  readOnly
-                />
-              </div>
-            </>
-          )}
+      <Divider />
+
+      <ChangeUserPasswordButton className='place-self-start' />
 
-          <div className='pt-4'>
-            <ChangePasswordButton />
-          </div>
-        </div>
-      </div>
-      <ProfileForm />
       <Divider />
-      <ChangePasswordButton />
-    </div>
+
+      <span className='text-foreground-soft text-sm'>
+        Conta registrada em {formatDate(user.created_at)}.
+        {showUpdatedDate &&
+          ` Última atualização realizada em ${formatDate(user.updated_at)}.`}
+      </span>
+    </>
   )
 }
diff --git a/src/components/form/select-input.tsx b/src/components/form/select-input.tsx
index 0cbc3126..5f27e3a1 100644
--- a/src/components/form/select-input.tsx
+++ b/src/components/form/select-input.tsx
@@ -64,12 +64,12 @@ export function SelectInput<T>({
             </Label>
             <Select
               modal={modal}
-              value={field.value}
               options={options}
+              readOnly={readOnly}
+              disabled={disabled}
+              value={field.value}
               placeholder={placeholder}
               onValueChange={handleValueChange}
-              disabled={disabled || readOnly}
-              readOnly={readOnly}
             />
             <FormMessage error={!!fieldState.error?.message}>
               {showMessage}
diff --git a/src/components/sidebar/account.tsx b/src/components/sidebar/account.tsx
index 3d1bb7b8..bcbb72a9 100644
--- a/src/components/sidebar/account.tsx
+++ b/src/components/sidebar/account.tsx
@@ -8,6 +8,7 @@ import { toast } from 'sonner'
 import { Avatar } from '@/components/ui/avatar'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
+import { revalidateClientCache } from '@/helpers/revalidate-client-cache'
 import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
 import { api } from '@/lib/api'
 import { useSidebar } from '@/store/sidebar'
@@ -38,6 +39,8 @@ export function SidebarAccount({ user }: Readonly<SidebarAccountProps>) {
       }
 
       revalidateServerCache(NEXT_CACHE_TAGS.user(user.id))
+      revalidateClientCache('all')
+
       toast.success(response.message)
       router.push(ROUTES.auth.signIn)
     })
@@ -68,7 +71,7 @@ export function SidebarAccount({ user }: Readonly<SidebarAccountProps>) {
         <MenuContent sideOffset={8} className='min-w-32'>
           <MenuItem onClick={() => router.push(ROUTES.dashboard.profile)}>
             <UserCircle2Icon />
-            Perfil
+            Meu perfil
           </MenuItem>
           <Divider className='my-1' />
           <MenuItem onClick={logout} disabled={isPending}>
diff --git a/src/components/ui/avatar.tsx b/src/components/ui/avatar.tsx
index ada78736..c35d967a 100644
--- a/src/components/ui/avatar.tsx
+++ b/src/components/ui/avatar.tsx
@@ -12,7 +12,7 @@ export function Avatar({ src, className, ...props }: Readonly<AvatarProps>) {
   return (
     <div
       className={cn(
-        'text-foreground-soft bg-background flex size-10 shrink-0 items-center justify-center overflow-hidden rounded-full [&_svg]:size-5',
+        'text-foreground-soft bg-background flex size-10 shrink-0 items-center justify-center overflow-hidden rounded-full [&_svg]:size-1/2',
         !src && 'border-border border',
         className,
       )}
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index f3059d90..6ec981e4 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -5,7 +5,7 @@ import { Loader2Icon } from 'lucide-react'
 import { cn } from '@/utils/class-name-merge'
 
 const buttonVariants = cva(
-  'ring-offset-background focus-visible:ring-ring inline-flex shrink-0 cursor-pointer items-center justify-center gap-2 rounded-lg font-medium whitespace-nowrap transition-all focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 aria-readonly:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:transition-colors',
+  'outline-ring flex shrink-0 cursor-pointer items-center justify-center gap-2 rounded-lg font-medium whitespace-nowrap outline-offset-4 transition-colors disabled:pointer-events-none disabled:opacity-50 aria-readonly:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:transition-colors',
   {
     variants: {
       variant: {
diff --git a/src/components/ui/input.tsx b/src/components/ui/input.tsx
index e9543322..a72d45f9 100644
--- a/src/components/ui/input.tsx
+++ b/src/components/ui/input.tsx
@@ -4,7 +4,7 @@ import type { LucideIcon } from 'lucide-react'
 import { cn } from '@/utils/class-name-merge'
 
 export const inputVariants = cva(
-  'bg-background outline-ring w-full shrink-0 rounded-lg border px-3 shadow-xs outline-offset-4 transition-colors read-only:focus-visible:ring-0 read-only:focus-visible:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50',
+  'bg-background outline-ring w-full shrink-0 rounded-lg border px-3 shadow-xs outline-offset-4 transition-colors read-only:outline-none disabled:pointer-events-none disabled:opacity-50',
   {
     variants: {
       variant: {
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
index db98b9bd..5fd58183 100644
--- a/src/components/ui/select.tsx
+++ b/src/components/ui/select.tsx
@@ -53,6 +53,7 @@ export function Select({
   ...props
 }: Readonly<SelectProps>) {
   const selectedOption = options.find((option) => option.value === value)
+  const showIndicator = !props.disabled && !props.readOnly
 
   return (
     <BaseSelect.Root value={value} items={options} {...props}>
@@ -62,10 +63,13 @@ export function Select({
         <BaseSelect.Value>
           {() => (selectedOption ? selectedOption.label : placeholder)}
         </BaseSelect.Value>
-        <BaseSelect.Icon>
-          <ChevronsUpDownIcon className='text-disabled size-4.5 shrink-0' />
-        </BaseSelect.Icon>
+        {showIndicator && (
+          <BaseSelect.Icon>
+            <ChevronsUpDownIcon className='text-disabled size-4.5 shrink-0' />
+          </BaseSelect.Icon>
+        )}
       </BaseSelect.Trigger>
+
       <BaseSelect.Portal>
         <BaseSelect.Positioner
           align={align}
diff --git a/src/constants/section-titles.ts b/src/constants/section-titles.ts
index c55c060f..8bf59ca6 100644
--- a/src/constants/section-titles.ts
+++ b/src/constants/section-titles.ts
@@ -6,6 +6,6 @@ export const SECTION_TITLES = {
   aprovacoes: 'Aprovações',
   equipe: 'Equipe',
   configuracoes: 'Configurações',
-  profile: 'Perfil',
+  perfil: 'Meu perfil',
 }
 export type SectionTitle = keyof typeof SECTION_TITLES
diff --git a/src/helpers/revalidate-client-cache.ts b/src/helpers/revalidate-client-cache.ts
index fef90ea1..2d542135 100644
--- a/src/helpers/revalidate-client-cache.ts
+++ b/src/helpers/revalidate-client-cache.ts
@@ -1,6 +1,11 @@
 import { queryClient } from '@/lib/tanstack-query'
 
-export async function revalidateClientCache(keys: string | string[]) {
+export function revalidateClientCache(keys: string | string[] | 'all') {
+  if (keys === 'all') {
+    queryClient.clear()
+    return
+  }
+
   if (Array.isArray(keys)) {
     for (const key of keys) {
       queryClient.invalidateQueries({ queryKey: [key] })
diff --git a/src/modules/profile/change-password-button.tsx b/src/modules/profile/change-password-button.tsx
index 859e179d..f7ecffdb 100644
--- a/src/modules/profile/change-password-button.tsx
+++ b/src/modules/profile/change-password-button.tsx
@@ -1,23 +1,26 @@
 'use client'
 
 import { RectangleEllipsisIcon } from 'lucide-react'
-import { useState } from 'react'
+import React, { useState } from 'react'
 
+import type { ButtonProps } from '@/components/ui/button'
 import { Dialog, DialogTrigger } from '@/components/ui/dialog'
 
-import { ChangePasswordModal } from './change-password-modal'
+import { ChangeUserPasswordModal } from './change-password-modal'
 
-export function ChangePasswordButton() {
+export function ChangeUserPasswordButton(props?: Readonly<ButtonProps>) {
   const [dialogOpen, setDialogOpen] = useState(false)
 
   return (
     <Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
-      <DialogTrigger className='mr-auto' size='sm'>
+      <DialogTrigger {...props}>
         <RectangleEllipsisIcon />
         Alterar senha
       </DialogTrigger>
 
-      {dialogOpen && <ChangePasswordModal onOpenChange={setDialogOpen} />}
+      {dialogOpen && (
+        <ChangeUserPasswordModal onClose={() => setDialogOpen(false)} />
+      )}
     </Dialog>
   )
 }
diff --git a/src/modules/profile/change-password-modal.tsx b/src/modules/profile/change-password-modal.tsx
index 0fff025b..1db25984 100644
--- a/src/modules/profile/change-password-modal.tsx
+++ b/src/modules/profile/change-password-modal.tsx
@@ -1,13 +1,14 @@
 'use client'
 
 import { zodResolver } from '@hookform/resolvers/zod'
+import { RotateCcwKeyIcon } from 'lucide-react'
 import { FormProvider, useForm } from 'react-hook-form'
+import { toast } from 'sonner'
 import { z } from 'zod'
 
 import { FormContainer } from '@/components/form/form-container'
 import { FormField } from '@/components/form/form-field'
 import { PasswordInput } from '@/components/form/password-input'
-import { Alert } from '@/components/ui/alert'
 import { Button } from '@/components/ui/button'
 import {
   DialogClose,
@@ -15,106 +16,108 @@ import {
   DialogContent,
   DialogFooter,
   DialogHeader,
+  DialogIcon,
   DialogTitle,
 } from '@/components/ui/dialog'
+import { api } from '@/lib/api'
+import { passwordSchema } from '@/schemas'
 
-// TODO: create a shared schema for password change and new password forms
-const changePasswordSchema = z
+const changeUserPasswordSchema = z
   .object({
-    password: z
-      .string()
-      .min(1, 'Insira sua senha')
-      .min(8, 'Sua senha precisa conter 8 ou mais caracteres')
-      .regex(/^(?=.*[A-Z])(?=.*\d)/, 'Senha inválida'),
-    confirmPassword: z.string(),
-    currentPassword: z.string().min(1, 'Digite sua senha atual'),
+    password: z.string().min(1, 'Insira sua senha atual'),
+    new_password: passwordSchema,
+    confirm_password: z.string(),
   })
-  .refine((data) => data.password === data.confirmPassword, {
-    message: 'Suas senhas não coincidem',
-    path: ['confirmPassword'],
+  .refine((data) => data.new_password === data.confirm_password, {
+    message: 'Repita sua nova senha corretamente',
+    path: ['confirm_password'],
   })
 
-type ChangePasswordSchema = z.infer<typeof changePasswordSchema>
+type ChangeUserPasswordSchema = z.infer<typeof changeUserPasswordSchema>
 
-interface PasswordModalProps {
-  onOpenChange: (open: boolean) => void
+interface ChangeUserPasswordModalProps {
+  onClose: () => void
 }
 
-export function ChangePasswordModal({ onOpenChange }: PasswordModalProps) {
-  const methods = useForm<ChangePasswordSchema>({
-    resolver: zodResolver(changePasswordSchema),
-    defaultValues: { password: '', confirmPassword: '', currentPassword: '' },
+export function ChangeUserPasswordModal({
+  onClose,
+}: ChangeUserPasswordModalProps) {
+  const formMethods = useForm<ChangeUserPasswordSchema>({
+    resolver: zodResolver(changeUserPasswordSchema),
+    defaultValues: { password: '', new_password: '', confirm_password: '' },
     mode: 'onBlur',
   })
 
-  const isSubmitting = methods.formState.isSubmitting
-  const errorMessage = methods.formState.errors.root?.message
-  const success = false
+  async function submitForm({
+    password,
+    new_password,
+  }: ChangeUserPasswordSchema) {
+    const response = await api(`/change-password`, {
+      method: 'POST',
+      body: JSON.stringify({ password, new_password }),
+    })
 
-  async function onSubmit(data: ChangePasswordSchema) {
-    console.log('Dados enviados para troca de senha:', data)
-    onOpenChange(false)
+    if (!response.success) {
+      toast.error(response.message)
+      return
+    }
+
+    toast.success(response.message)
+    onClose()
   }
 
   return (
     <DialogContainer>
-      <DialogHeader>
+      <DialogHeader icon={<DialogIcon icon={RotateCcwKeyIcon} />}>
         <DialogTitle>Alterar senha</DialogTitle>
       </DialogHeader>
 
-      <FormProvider {...methods}>
-        <FormContainer onSubmit={methods.handleSubmit(onSubmit)}>
-          <DialogContent className='flex flex-col gap-8'>
+      <FormProvider {...formMethods}>
+        <FormContainer onSubmit={formMethods.handleSubmit(submitForm)}>
+          <DialogContent>
             <FormField>
               <PasswordInput
-                name='currentPassword'
+                name='password'
                 label='Senha atual'
                 placeholder='Digite sua senha atual'
                 isRequired
               />
 
               <PasswordInput
-                name='password'
+                name='new_password'
                 label='Nova senha'
                 placeholder='Crie uma nova senha'
-                isRequired
                 showRequirements
+                isRequired
               />
 
               <PasswordInput
-                name='confirmPassword'
+                name='confirm_password'
                 label='Confirmar nova senha'
                 placeholder='Repita a nova senha'
                 isRequired
               />
             </FormField>
-
-            <DialogFooter>
-              <Button type='submit' loading={isSubmitting} className='flex-1'>
-                Aplicar alterações
-              </Button>
-              <DialogClose
-                className='flex-1'
-                disabled={methods.formState.isSubmitting}
-              >
-                Cancelar
-              </DialogClose>
-            </DialogFooter>
-
-            {success && (
-              <Alert variant='success' className='text-center'>
-                Senha atualizada com sucesso.
-              </Alert>
-            )}
-
-            {errorMessage && (
-              <Alert error className='text-center'>
-                {errorMessage}
-              </Alert>
-            )}
           </DialogContent>
         </FormContainer>
       </FormProvider>
+
+      <DialogFooter>
+        <Button
+          type='submit'
+          loading={formMethods.formState.isSubmitting}
+          onClick={formMethods.handleSubmit(submitForm)}
+          className='flex-1'
+        >
+          Alterar
+        </Button>
+        <DialogClose
+          disabled={formMethods.formState.isSubmitting}
+          className='flex-1'
+        >
+          Voltar
+        </DialogClose>
+      </DialogFooter>
     </DialogContainer>
   )
 }
diff --git a/src/modules/profile/profile-form.tsx b/src/modules/profile/profile-form.tsx
index e5191e75..bfa53fe2 100644
--- a/src/modules/profile/profile-form.tsx
+++ b/src/modules/profile/profile-form.tsx
@@ -1,41 +1,81 @@
 'use client'
 
+import { zodResolver } from '@hookform/resolvers/zod'
 import { FormProvider, useForm } from 'react-hook-form'
+import { z } from 'zod'
 
-import { DateInput } from '@/components/form/date-input'
 import { FormContainer } from '@/components/form/form-container'
-import { FormField } from '@/components/form/form-field'
+import { SelectInput } from '@/components/form/select-input'
 import { TextInput } from '@/components/form/text-input'
+import { Divider } from '@/components/ui/divider'
+import { SPECIALTIES_OPTIONS } from '@/enums/shared'
+import { USERS_ROLE_OPTIONS } from '@/enums/users'
+import {
+  emailSchema,
+  nameSchema,
+  specialtySchema,
+  userRoleSchema,
+} from '@/schemas'
+import type { User } from '@/types/users'
 
-export function ProfileForm() {
-  const formMethods = useForm({
+export const userProfileFormSchema = z.object({
+  name: nameSchema,
+  email: emailSchema,
+  role: userRoleSchema,
+  specialty: specialtySchema.nullable(),
+  registration_id: z.string().max(32).nullable(),
+})
+export type UserProfileFormSchema = z.infer<typeof userProfileFormSchema>
+
+interface UserProfileFormProps {
+  user: User
+}
+
+export function UserProfileForm({ user }: Readonly<UserProfileFormProps>) {
+  const formMethods = useForm<UserProfileFormSchema>({
+    resolver: zodResolver(userProfileFormSchema),
     defaultValues: {
-      name: 'Claudio Luiz Oliveira',
-      entry_date: String(new Date()),
-      professional: 'Enfermagem',
-      specialty: 'Enfermagem',
-      professional_registration: 'COREN-SP 112233',
-    },
+      name: user.name,
+      email: user.email,
+      role: user.role,
+      specialty: user.specialty || '',
+      registration_id: user.registration_id || '',
+    } as UserProfileFormSchema,
     mode: 'onBlur',
   })
 
   return (
     <FormProvider {...formMethods}>
       <FormContainer>
-        <FormField className='grid grid-cols-2 gap-4'>
+        <div className='grid gap-4 lg:grid-cols-3'>
           <TextInput name='name' label='Nome completo' readOnly />
-          <DateInput name='entry_date' label='Data de entrada' readOnly />
-        </FormField>
-
-        <FormField className='grid grid-cols-3 gap-4'>
-          <TextInput name='professional' label='Profissional' readOnly />
-          <TextInput name='specialty' label='Especialidade' readOnly />
-          <TextInput
-            name='professional_registration'
-            label='Registro profissional'
+          <TextInput name='email' label='E-mail' readOnly />
+          <SelectInput
+            name='role'
+            label='Cargo'
+            options={USERS_ROLE_OPTIONS}
             readOnly
           />
-        </FormField>
+        </div>
+
+        {user.role === 'specialist' && (
+          <>
+            <Divider />
+            <div className='grid gap-4 md:grid-cols-2'>
+              <SelectInput
+                name='specialty'
+                label='Especialidade'
+                options={SPECIALTIES_OPTIONS}
+                readOnly
+              />
+              <TextInput
+                name='registration_id'
+                label='Registro profissional'
+                readOnly
+              />
+            </div>
+          </>
+        )}
       </FormContainer>
     </FormProvider>
   )
diff --git a/src/modules/users/table/index.tsx b/src/modules/users/table/index.tsx
index ae86b007..f0ae624e 100644
--- a/src/modules/users/table/index.tsx
+++ b/src/modules/users/table/index.tsx
@@ -77,7 +77,7 @@ export function UsersTable({ users, loading }: Readonly<UsersTableProps>) {
                     '-'
                   )}
                 </TableCell>
-                <TableCell>{user.registration_number ?? '-'}</TableCell>
+                <TableCell>{user.registration_id ?? '-'}</TableCell>
                 <TableCell>
                   <Tag variant={status.variant} size='sm'>
                     {status.label}
diff --git a/src/schemas/index.tsx b/src/schemas/index.tsx
index 5f5161b0..a74bd666 100644
--- a/src/schemas/index.tsx
+++ b/src/schemas/index.tsx
@@ -1,13 +1,16 @@
 import { z } from 'zod'
 
+import { PASSWORD_MIN_LENGTH } from '@/constants/auth'
 import {
   CPF_REGEX,
   NAME_REGEX,
   NON_SPECIAL_CHAR_REGEX,
+  PASSWORD_REGEX,
   PHONE_REGEX,
 } from '@/constants/regex'
 import { PATIENT_CONDITION_ENUM } from '@/enums/patients'
 import { SPECIALTIES_ENUM, UF_LIST, YES_OR_NO_TUPLE } from '@/enums/shared'
+import { USERS_ROLE_ENUM } from '@/enums/users'
 
 export const nameSchema = z
   .string()
@@ -18,6 +21,19 @@ export const nameSchema = z
 
 export const emailSchema = z.string().email('Insira um e-mail válido')
 
+export const passwordSchema = z
+  .string()
+  .min(1, 'Insira sua senha')
+  .min(
+    PASSWORD_MIN_LENGTH,
+    `Sua senha precisa conter ${PASSWORD_MIN_LENGTH} ou mais caracteres`,
+  )
+  .regex(PASSWORD_REGEX, 'Senha inválida')
+
+export const avatarSchema = z.string().url()
+
+export const userRoleSchema = z.enum(USERS_ROLE_ENUM)
+
 export const phoneSchema = z
   .string()
   .nonempty('Informe o telefone')
diff --git a/src/types/users.d.ts b/src/types/users.d.ts
index 85df5416..35fdbf12 100644
--- a/src/types/users.d.ts
+++ b/src/types/users.d.ts
@@ -9,7 +9,7 @@ export type User = {
   avatar_url: string | null
   status: UserStatus
   specialty: Specialty | null
-  registration_number: string | null
+  registration_id: string | null
   updated_at: string
   created_at: string
 }

From 6c4428fa69c9d19a7d730957928c1f1ab51f8616 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Wed, 11 Feb 2026 23:34:08 -0300
Subject: [PATCH 50/77] feat(patients): add race to patients

---
 src/enums/patients.ts                |  34 ++++++
 src/modules/patients/form-schema.tsx |   9 +-
 src/modules/patients/form.tsx        | 160 +++++++++++++++------------
 src/schemas/index.tsx                |  15 ++-
 src/types/patient-support.d.ts       |   3 +
 src/types/patients.d.ts              |  20 ++--
 6 files changed, 156 insertions(+), 85 deletions(-)

diff --git a/src/enums/patients.ts b/src/enums/patients.ts
index 5f345504..9ca7b5d6 100644
--- a/src/enums/patients.ts
+++ b/src/enums/patients.ts
@@ -7,6 +7,21 @@ import {
 
 import { convertObjectToOptions } from '@/helpers/convert-object-to-options'
 
+export const PATIENT_RACES = {
+  white: 'Branca',
+  black: 'Preta',
+  yellow: 'Amarela',
+  mixed_race: 'Parda',
+  indigenous: 'Indígena',
+  prefer_not_to_say: 'Prefiro não informar',
+  other: 'Outro',
+}
+export type PatientRace = keyof typeof PATIENT_RACES
+
+export const PATIENT_RACE_OPTIONS = convertObjectToOptions(PATIENT_RACES)
+
+export const PATIENT_RACES_ENUM = Object.keys(PATIENT_RACES) as [PatientRace]
+
 export const PATIENT_GENDERS = {
   male_cis: 'Homem (Cis)',
   female_cis: 'Mulher (Cis)',
@@ -20,6 +35,10 @@ export type PatientGender = keyof typeof PATIENT_GENDERS
 
 export const PATIENT_GENDER_OPTIONS = convertObjectToOptions(PATIENT_GENDERS)
 
+export const PATIENT_GENDERS_ENUM = Object.keys(PATIENT_GENDERS) as [
+  PatientGender,
+]
+
 export const PATIENT_STATUSES = {
   active: {
     variant: 'success',
@@ -66,6 +85,21 @@ export const PATIENT_CONDITION_ENUM = Object.keys(PATIENT_CONDITIONS) as [
   PatientCondition,
 ]
 
+export const PATIENT_NMO_DIAGNOSTICS = {
+  anti_aqp4_positive: 'Anti-AQP4 positivo',
+  anti_mog_positive: 'Anti-MOG positivo',
+  both_negative: 'Negativo para ambos',
+  no_diagnosis: 'Não',
+} as const
+export type PatientNmoDiagnostic = keyof typeof PATIENT_NMO_DIAGNOSTICS
+
+export const PATIENT_NMO_DIAGNOSTIC_OPTIONS = convertObjectToOptions(
+  PATIENT_NMO_DIAGNOSTICS,
+)
+export const PATIENT_NMO_DIAGNOSTICS_ENUM = Object.keys(
+  PATIENT_NMO_DIAGNOSTICS,
+) as [PatientCondition]
+
 export const PATIENTS_ORDERS = {
   name_asc: 'Nome (Asc.)',
   name_desc: 'Nome (Desc.)',
diff --git a/src/modules/patients/form-schema.tsx b/src/modules/patients/form-schema.tsx
index 7910ef03..822b1e0a 100644
--- a/src/modules/patients/form-schema.tsx
+++ b/src/modules/patients/form-schema.tsx
@@ -8,17 +8,20 @@ import {
   genderSchema,
   kinshipSchema,
   nameSchema,
+  patientNmoDiagnosticSchema,
   phoneSchema,
+  raceSchema,
   stateSchema,
   yesOrNoSchema,
 } from '@/schemas'
 
-export const patientsFormSchema = z
+export const patientFormSchema = z
   .object({
     name: nameSchema,
     date_of_birth: dateOfBirthSchema,
     cpf: cpfSchema,
     gender: genderSchema,
+    race: raceSchema,
     state: stateSchema,
     city: citySchema,
     phone: phoneSchema,
@@ -34,7 +37,7 @@ export const patientsFormSchema = z
       .string()
       .transform((data) => data?.trim())
       .nullable(),
-    has_nmo_diagnosis: yesOrNoSchema,
+    nmo_diagnosis: patientNmoDiagnosticSchema,
     supports: z
       .array(
         z.object({
@@ -76,4 +79,4 @@ export const patientsFormSchema = z
     },
   )
 
-export type PatientsFormSchema = z.infer<typeof patientsFormSchema>
+export type PatientFormSchema = z.infer<typeof patientFormSchema>
diff --git a/src/modules/patients/form.tsx b/src/modules/patients/form.tsx
index 1f5130ad..1967b109 100644
--- a/src/modules/patients/form.tsx
+++ b/src/modules/patients/form.tsx
@@ -21,17 +21,22 @@ import { SelectInput } from '@/components/form/select-input'
 import { TextInput } from '@/components/form/text-input'
 import { Button } from '@/components/ui/button'
 import { Divider } from '@/components/ui/divider'
-import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
-import { PATIENT_GENDER_OPTIONS } from '@/enums/patients'
+import {
+  PATIENT_GENDER_OPTIONS,
+  PATIENT_NMO_DIAGNOSTIC_OPTIONS,
+  PATIENT_RACE_OPTIONS,
+} from '@/enums/patients'
 import {
   BRAZILIAN_STATES_OPTIONS,
   type UF,
   YES_OR_NO_OPTIONS,
 } from '@/enums/shared'
+import { revalidateClientCache } from '@/helpers/revalidate-client-cache'
+import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
 import { useCities } from '@/hooks/cities'
 import { api } from '@/lib/api'
-import { queryClient } from '@/lib/tanstack-query'
 import type { Patient } from '@/types/patients.d.ts'
 import { formatCpfNumber } from '@/utils/formatters/format-cpf-number'
 import { formatPhoneNumber } from '@/utils/formatters/format-phone-number'
@@ -40,7 +45,7 @@ import { removeNonNumbers } from '@/utils/sanitizers'
 import { ComboboxInput } from '../../components/form/combobox-input'
 import { Dialog } from '../../components/ui/dialog'
 import CancelPatientFormModal from './cancel-form-modal'
-import { type PatientsFormSchema, patientsFormSchema } from './form-schema'
+import { type PatientFormSchema, patientFormSchema } from './form-schema'
 
 type PatientFormMode = 'view' | 'edit' | 'create'
 
@@ -59,33 +64,34 @@ export function PatientForm({
 
   const router = useRouter()
 
-  const defaultValues: PatientsFormSchema = {
-    name: patient?.name ?? '',
-    gender: patient?.gender ?? '',
-    date_of_birth: patient?.date_of_birth ?? '',
-    city: patient?.city ?? '',
-    state: patient?.state ?? '',
-    phone: patient?.phone ? formatPhoneNumber(patient.phone) : '',
-    cpf: patient?.cpf ? formatCpfNumber(patient.cpf) : '',
-    email: patient?.email ?? '',
-    has_disability: patient?.has_disability ? 'yes' : 'no',
-    disability_desc: patient?.disability_desc ?? '',
-    need_legal_assistance: patient?.need_legal_assistance ? 'yes' : 'no',
-    take_medication: patient?.take_medication ? 'yes' : 'no',
-    medication_desc: patient?.medication_desc ?? '',
-    has_nmo_diagnosis: patient?.has_nmo_diagnosis ? 'yes' : 'no',
-    supports: patient?.supports?.map((support) => ({
-      ...support,
-      phone: formatPhoneNumber(support.phone),
-    })) ?? [{ name: '', phone: '', kinship: '' }],
-  }
-
-  const formMethods = useForm<PatientsFormSchema>({
-    resolver: zodResolver(patientsFormSchema),
-    defaultValues,
+  const formMethods = useForm<PatientFormSchema>({
+    resolver: zodResolver(patientFormSchema),
+    defaultValues: {
+      name: patient?.name || '',
+      gender: patient?.gender || '',
+      race: patient?.race || '',
+      date_of_birth: patient?.date_of_birth || '',
+      city: patient?.city || '',
+      state: patient?.state || '',
+      phone: patient?.phone ? formatPhoneNumber(patient.phone) : '',
+      cpf: patient?.cpf ? formatCpfNumber(patient.cpf) : '',
+      email: patient?.email || '',
+      has_disability: patient?.has_disability ? 'yes' : 'no',
+      disability_desc: patient?.disability_desc || '',
+      need_legal_assistance: patient?.need_legal_assistance ? 'yes' : 'no',
+      take_medication: patient?.take_medication ? 'yes' : 'no',
+      medication_desc: patient?.medication_desc || '',
+      nmo_diagnosis: patient?.nmo_diagnosis || '',
+      supports: patient?.supports?.map((support) => ({
+        ...support,
+        phone: formatPhoneNumber(support.phone),
+      })) ?? [{ name: '', phone: '', kinship: '' }],
+    } as unknown as PatientFormSchema,
     mode: 'onBlur',
   })
+
   const { clearErrors, setValue, watch, control } = formMethods
+
   const { fields, append, remove } = useFieldArray({
     control,
     name: 'supports',
@@ -120,14 +126,14 @@ export function PatientForm({
     formMethods.reset()
   }
 
-  async function submitForm(data: PatientsFormSchema) {
+  async function submitForm(data: PatientFormSchema) {
     if (formState === 'edit') {
       // TODO: Implement update patient request
       console.log(data)
       return
     }
 
-    const patient = patientsFormSchema.safeParse(data)
+    const patient = patientFormSchema.safeParse(data)
 
     if (!patient.success) {
       toast.error(
@@ -153,7 +159,6 @@ export function PatientForm({
       need_legal_assistance: patient.data.need_legal_assistance === 'yes',
       take_medication: patient.data.take_medication === 'yes',
       medication_desc: patient.data.medication_desc ?? null,
-      has_nmo_diagnosis: patient.data.has_nmo_diagnosis === 'yes',
       supports,
     }
 
@@ -167,7 +172,8 @@ export function PatientForm({
       return
     }
 
-    queryClient.invalidateQueries({ queryKey: [QUERY_CACHE_KEYS.patients] })
+    revalidateClientCache([QUERY_CACHE_KEYS.patients.main])
+    revalidateServerCache(NEXT_CACHE_TAGS.statistics.totalPatients.main)
     toast.success(response.message)
     formMethods.reset()
 
@@ -177,7 +183,7 @@ export function PatientForm({
   return (
     <FormProvider {...formMethods}>
       <FormContainer
-        className='grid gap-x-4 sm:grid-cols-6'
+        className='grid gap-x-4 lg:grid-cols-6'
         onSubmit={formMethods.handleSubmit(submitForm)}
       >
         <TextInput
@@ -187,7 +193,7 @@ export function PatientForm({
           readOnly={isViewMode}
           isRequired={!isViewMode}
           placeholder='Insira o nome completo'
-          wrapperClassName='sm:col-span-2'
+          wrapperClassName='lg:col-span-4'
         />
         <DateInput
           name='date_of_birth'
@@ -195,8 +201,9 @@ export function PatientForm({
           navMode='dropdown'
           readOnly={isViewMode}
           isRequired={!isViewMode}
-          wrapperClassName='sm:col-span-2'
+          wrapperClassName='lg:col-span-2'
         />
+
         <TextInput
           name='cpf'
           label='CPF'
@@ -205,29 +212,46 @@ export function PatientForm({
           readOnly={isViewMode}
           isRequired={!isViewMode}
           placeholder='000.000.000-00'
-          wrapperClassName='sm:col-span-2'
+          wrapperClassName='lg:col-span-2'
         />
-
         <SelectInput
           name='gender'
           label='Gênero'
           options={PATIENT_GENDER_OPTIONS}
           readOnly={isViewMode}
           isRequired={!isViewMode}
-          placeholder='Selecione o gênero'
-          className='sm:col-span-2'
+          placeholder='Selecione'
+          className='lg:col-span-2'
+        />
+        <SelectInput
+          name='race'
+          label='Raça ou Cor'
+          options={PATIENT_RACE_OPTIONS}
+          readOnly={isViewMode}
+          isRequired={!isViewMode}
+          placeholder='Selecionar'
+          className='lg:col-span-2'
         />
 
+        <TextInput
+          name='phone'
+          label='Telefone (WhatsApp)'
+          mask='phone'
+          inputMode='tel'
+          readOnly={isViewMode}
+          isRequired={!isViewMode}
+          placeholder='(00) 00000-0000'
+          wrapperClassName='lg:col-span-2'
+        />
         <ComboboxInput
           name='state'
           label='Estado'
           options={BRAZILIAN_STATES_OPTIONS}
           placeholder='Selecione o estado'
-          className='sm:col-span-2'
-          isRequired={!isViewMode}
+          className='lg:col-span-2'
           onValueChange={handleSelectState}
+          isRequired={!isViewMode}
         />
-
         <ComboboxInput
           name='city'
           label='Cidade'
@@ -236,19 +260,9 @@ export function PatientForm({
           isRequired={!isViewMode}
           disabled={!selectedUF}
           placeholder='Selecione a cidade'
-          className='sm:col-span-2'
+          className='lg:col-span-2'
         />
 
-        <TextInput
-          name='phone'
-          label='Telefone (WhatsApp)'
-          mask='phone'
-          inputMode='tel'
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          placeholder='(00) 00000-0000'
-          wrapperClassName='sm:col-span-3'
-        />
         <TextInput
           name='email'
           label='E-mail'
@@ -256,10 +270,10 @@ export function PatientForm({
           readOnly={isViewMode}
           isRequired={!isViewMode}
           placeholder='Insira o e-mail'
-          wrapperClassName='sm:col-span-3'
+          wrapperClassName='lg:col-span-full'
         />
 
-        <Divider className='sm:col-span-6' />
+        <Divider className='lg:col-span-full' />
 
         <SelectInput
           name='has_disability'
@@ -267,13 +281,13 @@ export function PatientForm({
           options={YES_OR_NO_OPTIONS}
           readOnly={isViewMode}
           isRequired={!isViewMode}
-          className='sm:col-span-2'
+          className='lg:col-span-2'
         />
         <TextInput
           name='disability_desc'
           label='Se sim, qual?'
           readOnly={isViewMode}
-          wrapperClassName='sm:col-span-4'
+          wrapperClassName='lg:col-span-4'
           disabled={formMethods.watch('has_disability') === 'no'}
         />
 
@@ -283,23 +297,23 @@ export function PatientForm({
           options={YES_OR_NO_OPTIONS}
           readOnly={isViewMode}
           isRequired={!isViewMode}
-          className='sm:col-span-2'
+          className='lg:col-span-2'
         />
         <TextInput
           name='medication_desc'
           label='Se sim, qual?'
           readOnly={isViewMode}
-          wrapperClassName='sm:col-span-4'
+          wrapperClassName='lg:col-span-4'
           disabled={formMethods.watch('take_medication') === 'no'}
         />
 
         <SelectInput
-          name='has_nmo_diagnosis'
+          name='nmo_diagnosis'
           label='Possui diagnóstico de NMO?'
-          options={YES_OR_NO_OPTIONS}
+          options={PATIENT_NMO_DIAGNOSTIC_OPTIONS}
           readOnly={isViewMode}
           isRequired={!isViewMode}
-          className='sm:col-span-3'
+          className='lg:col-span-3'
         />
         <SelectInput
           name='need_legal_assistance'
@@ -307,15 +321,15 @@ export function PatientForm({
           options={YES_OR_NO_OPTIONS}
           readOnly={isViewMode}
           isRequired={!isViewMode}
-          className='sm:col-span-3'
+          className='lg:col-span-3'
         />
 
         {(formState === 'create' || patientSupports.length >= 1) && (
-          <Divider className='sm:col-span-6' />
+          <Divider className='lg:col-span-full' />
         )}
 
         {patientSupports.length >= 1 && (
-          <div className='space-y-6 sm:col-span-6'>
+          <div className='space-y-6 lg:col-span-6'>
             <h1 className='text-xl font-medium'>Rede de apoio</h1>
             <div className='grid gap-x-4 gap-y-6 sm:grid-cols-6'>
               {fields.map((support, index) => (
@@ -325,16 +339,16 @@ export function PatientForm({
                     label='Nome completo'
                     maxLength={50}
                     readOnly={isViewMode}
-                    wrapperClassName='sm:col-span-3'
+                    wrapperClassName='lg:col-span-3'
                   />
                   <TextInput
                     name={`supports.${index}.kinship`}
                     label='Parentesco'
                     maxLength={50}
                     readOnly={isViewMode}
-                    wrapperClassName='sm:col-span-1'
+                    wrapperClassName='lg:col-span-1'
                   />
-                  <div className='flex gap-1 sm:col-span-2'>
+                  <div className='flex gap-1 lg:col-span-2'>
                     <TextInput
                       name={`supports.${index}.phone`}
                       label='Telefone (WhatsApp)'
@@ -366,7 +380,7 @@ export function PatientForm({
         )}
 
         {formState === 'create' && (
-          <div className='space-y-6 sm:col-span-6'>
+          <div className='space-y-6 lg:col-span-6'>
             <h1 className='text-xl font-medium'>Rede de apoio</h1>
             <div className='grid gap-x-4 gap-y-6 sm:grid-cols-6'>
               {fields.map((support, index) => (
@@ -377,7 +391,7 @@ export function PatientForm({
                     maxLength={50}
                     isRequired
                     placeholder='Insira o nome completo'
-                    wrapperClassName='sm:col-span-3'
+                    wrapperClassName='lg:col-span-3'
                   />
                   <TextInput
                     name={`supports.${index}.kinship`}
@@ -385,9 +399,9 @@ export function PatientForm({
                     maxLength={50}
                     isRequired
                     placeholder='Selecione o parentesco'
-                    wrapperClassName='sm:col-span-1'
+                    wrapperClassName='lg:col-span-1'
                   />
-                  <div className='flex items-end gap-1 sm:col-span-2'>
+                  <div className='flex items-end gap-1 lg:col-span-2'>
                     <TextInput
                       name={`supports.${index}.phone`}
                       label='Telefone (WhatsApp)'
@@ -420,7 +434,7 @@ export function PatientForm({
           </div>
         )}
 
-        <div className='mt-3 flex justify-end gap-2 sm:col-span-6'>
+        <div className='mt-3 flex justify-end gap-2 lg:col-span-6'>
           {isViewMode && (
             <Button
               type='button'
diff --git a/src/schemas/index.tsx b/src/schemas/index.tsx
index a74bd666..a3e4b941 100644
--- a/src/schemas/index.tsx
+++ b/src/schemas/index.tsx
@@ -8,7 +8,12 @@ import {
   PASSWORD_REGEX,
   PHONE_REGEX,
 } from '@/constants/regex'
-import { PATIENT_CONDITION_ENUM } from '@/enums/patients'
+import {
+  PATIENT_CONDITION_ENUM,
+  PATIENT_GENDERS_ENUM,
+  PATIENT_NMO_DIAGNOSTICS_ENUM,
+  PATIENT_RACES_ENUM,
+} from '@/enums/patients'
 import { SPECIALTIES_ENUM, UF_LIST, YES_OR_NO_TUPLE } from '@/enums/shared'
 import { USERS_ROLE_ENUM } from '@/enums/users'
 
@@ -39,7 +44,9 @@ export const phoneSchema = z
   .nonempty('Informe o telefone')
   .regex(PHONE_REGEX, 'Insira um número de telefone válido')
 
-export const genderSchema = z.string().nonempty('Informe o gênero')
+export const genderSchema = z.enum(PATIENT_GENDERS_ENUM)
+
+export const raceSchema = z.enum(PATIENT_RACES_ENUM)
 
 export const dateOfBirthSchema = z
   .string()
@@ -89,6 +96,10 @@ export const patientConditionSchema = z.enum(PATIENT_CONDITION_ENUM, {
   message: 'O quadro é obrigatório',
 })
 
+export const patientNmoDiagnosticSchema = z.enum(PATIENT_NMO_DIAGNOSTICS_ENUM, {
+  message: 'Este campo é obrigatório',
+})
+
 export const professionalNameSchema = z
   .string()
   .nullable()
diff --git a/src/types/patient-support.d.ts b/src/types/patient-support.d.ts
index e3e432e6..0339b18f 100644
--- a/src/types/patient-support.d.ts
+++ b/src/types/patient-support.d.ts
@@ -1,6 +1,9 @@
 export type PatientSupport = {
   id: string
+  patient_id: string
   name: string
   phone: string
   kinship: string
+  created_at: string
+  updated_at: string
 }
diff --git a/src/types/patients.d.ts b/src/types/patients.d.ts
index 68bb3640..b66ee68b 100644
--- a/src/types/patients.d.ts
+++ b/src/types/patients.d.ts
@@ -1,28 +1,34 @@
-import type { PatientGender, PatientStatus } from '@/enums/patients'
+import type {
+  PatientGender,
+  PatientNmoDiagnostic,
+  PatientRace,
+  PatientStatus,
+} from '@/enums/patients'
+import type { UF } from '@/enums/shared'
 
 import type { PatientSupport } from './patient-support'
 
 export type Patient = {
   id: string
-  user_id: string
+  name: string
+  email: string
+  avatar_url: string | null
   gender: PatientGender
+  race: PatientRace
   date_of_birth: string
   phone: string
   status: PatientStatus
   cpf: string
-  state: string
+  state: UF
   city: string
   has_disability: boolean
   disability_desc: string | null
   need_legal_assistance: boolean
   take_medication: boolean
   medication_desc: string | null
-  has_nmo_diagnosis: boolean
+  nmo_diagnosis: PatientNmoDiagnostic
   created_at: string
   updated_at: string
-  name: string
-  email: string
-  avatar_url: string | null
   supports?: PatientSupport[]
 }
 

From 5f04c618c6bdf58e46a1d8aee0e07ce8ddb4730c Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 13 Feb 2026 00:11:32 -0300
Subject: [PATCH 51/77] refactor(patients): reorganize patients list

---
 src/app/(dashboard)/pacientes/page.tsx        |   4 +-
 .../appointments/cancel-appointment-modal.tsx |   7 +-
 src/modules/appointments/table/index.tsx      |   2 +-
 .../cancel-modal.tsx}                         |  22 +-
 .../patients/{form.tsx => form/index.tsx}     |   8 +-
 .../{form-schema.tsx => form/schema.tsx}      |   0
 src/modules/patients/inactivate-modal.tsx     |   7 +-
 src/modules/patients/list.tsx                 | 137 ++++++++++
 src/modules/patients/table/actions.tsx        |   4 +-
 src/modules/patients/table/index.tsx          | 249 +++++-------------
 .../referrals/cancel-referral-modal.tsx       |   7 +-
 src/types/patients.d.ts                       |   5 +
 12 files changed, 228 insertions(+), 224 deletions(-)
 rename src/modules/patients/{cancel-form-modal.tsx => form/cancel-modal.tsx} (59%)
 rename src/modules/patients/{form.tsx => form/index.tsx} (98%)
 rename src/modules/patients/{form-schema.tsx => form/schema.tsx} (100%)
 create mode 100644 src/modules/patients/list.tsx

diff --git a/src/app/(dashboard)/pacientes/page.tsx b/src/app/(dashboard)/pacientes/page.tsx
index dbbd5954..94e76b1a 100644
--- a/src/app/(dashboard)/pacientes/page.tsx
+++ b/src/app/(dashboard)/pacientes/page.tsx
@@ -1,11 +1,11 @@
 import type { Metadata } from 'next'
 
-import { PatientsTable } from '@/modules/patients/table'
+import { PatientsList } from '@/modules/patients/list'
 
 export const metadata: Metadata = {
   title: 'Pacientes',
 }
 
 export default function Page() {
-  return <PatientsTable />
+  return <PatientsList />
 }
diff --git a/src/modules/appointments/cancel-appointment-modal.tsx b/src/modules/appointments/cancel-appointment-modal.tsx
index 4e81cd8c..f8f960c5 100644
--- a/src/modules/appointments/cancel-appointment-modal.tsx
+++ b/src/modules/appointments/cancel-appointment-modal.tsx
@@ -63,12 +63,7 @@ export function CancelAppointmentModal({
   return (
     <DialogContainer>
       <DialogHeader
-        icon={
-          <DialogIcon
-            icon={CircleXIcon}
-            className='text-error bg-error/10 border-none'
-          />
-        }
+        icon={<DialogIcon icon={CircleXIcon} variant='destructive' />}
       >
         <DialogTitle>Cancelar atendimento</DialogTitle>
       </DialogHeader>
diff --git a/src/modules/appointments/table/index.tsx b/src/modules/appointments/table/index.tsx
index 16e1e102..ff606b16 100644
--- a/src/modules/appointments/table/index.tsx
+++ b/src/modules/appointments/table/index.tsx
@@ -55,7 +55,7 @@ export function AppointmentsTable({
           </TableRow>
         )}
 
-        {!loading &&
+        {!isEmpty &&
           appointments.map((appointment) => {
             const status = APPOINTMENT_STATUSES[appointment.status]
             const condition = PATIENT_CONDITIONS[appointment.condition]
diff --git a/src/modules/patients/cancel-form-modal.tsx b/src/modules/patients/form/cancel-modal.tsx
similarity index 59%
rename from src/modules/patients/cancel-form-modal.tsx
rename to src/modules/patients/form/cancel-modal.tsx
index a0cbaeac..c8d6f496 100644
--- a/src/modules/patients/cancel-form-modal.tsx
+++ b/src/modules/patients/form/cancel-modal.tsx
@@ -1,15 +1,15 @@
 import { CircleAlertIcon } from 'lucide-react'
 
-import { Button } from '../../components/ui/button'
+import { Button } from '@/components/ui/button'
 import {
   DialogClose,
   DialogContainer,
-  DialogDescription,
+  DialogContent,
   DialogFooter,
   DialogHeader,
   DialogIcon,
   DialogTitle,
-} from '../../components/ui/dialog'
+} from '@/components/ui/dialog'
 
 interface CancelPatientFormModalProps {
   onConfirm: () => void
@@ -21,18 +21,14 @@ export default function CancelPatientFormModal({
   return (
     <DialogContainer>
       <DialogHeader
-        icon={
-          <DialogIcon
-            icon={CircleAlertIcon}
-            className='bg-error/10 text-error'
-          />
-        }
+        icon={<DialogIcon icon={CircleAlertIcon} variant='destructive' />}
       >
-        <DialogTitle>Cancelar o cadastro do paciente?</DialogTitle>
-        <DialogDescription>
-          Esta ação é irreversível e todo o progresso será perdido.
-        </DialogDescription>
+        <DialogTitle>Cancelar cadastro</DialogTitle>
       </DialogHeader>
+      <DialogContent className='space-y-2'>
+        <p>Tem certeza que deseja cancelar o cadastro deste paciente?</p>
+        <p>Esta ação é irreversível e todo o progresso será perdido.</p>
+      </DialogContent>
       <DialogFooter>
         <Button className='flex-1' variant='destructive' onClick={onConfirm}>
           Cancelar cadastro
diff --git a/src/modules/patients/form.tsx b/src/modules/patients/form/index.tsx
similarity index 98%
rename from src/modules/patients/form.tsx
rename to src/modules/patients/form/index.tsx
index 1967b109..9dc60630 100644
--- a/src/modules/patients/form.tsx
+++ b/src/modules/patients/form/index.tsx
@@ -42,10 +42,10 @@ import { formatCpfNumber } from '@/utils/formatters/format-cpf-number'
 import { formatPhoneNumber } from '@/utils/formatters/format-phone-number'
 import { removeNonNumbers } from '@/utils/sanitizers'
 
-import { ComboboxInput } from '../../components/form/combobox-input'
-import { Dialog } from '../../components/ui/dialog'
-import CancelPatientFormModal from './cancel-form-modal'
-import { type PatientFormSchema, patientFormSchema } from './form-schema'
+import { ComboboxInput } from '../../../components/form/combobox-input'
+import { Dialog } from '../../../components/ui/dialog'
+import CancelPatientFormModal from './cancel-modal'
+import { type PatientFormSchema, patientFormSchema } from './schema'
 
 type PatientFormMode = 'view' | 'edit' | 'create'
 
diff --git a/src/modules/patients/form-schema.tsx b/src/modules/patients/form/schema.tsx
similarity index 100%
rename from src/modules/patients/form-schema.tsx
rename to src/modules/patients/form/schema.tsx
diff --git a/src/modules/patients/inactivate-modal.tsx b/src/modules/patients/inactivate-modal.tsx
index bf6b8427..545d3a57 100644
--- a/src/modules/patients/inactivate-modal.tsx
+++ b/src/modules/patients/inactivate-modal.tsx
@@ -70,12 +70,7 @@ export function InactivatePatientModal({
   return (
     <DialogContainer className='max-w-md'>
       <DialogHeader
-        icon={
-          <DialogIcon
-            icon={CircleXIcon}
-            className='text-error bg-error/10 border-none'
-          />
-        }
+        icon={<DialogIcon icon={CircleXIcon} variant='destructive' />}
       >
         <DialogTitle>Inativar {name}?</DialogTitle>
         <DialogDescription>Confirme a inativação do paciente</DialogDescription>
diff --git a/src/modules/patients/list.tsx b/src/modules/patients/list.tsx
new file mode 100644
index 00000000..c623a390
--- /dev/null
+++ b/src/modules/patients/list.tsx
@@ -0,0 +1,137 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query'
+import { PlusIcon, Users2Icon } from 'lucide-react'
+import { useEffect, useState } from 'react'
+
+import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
+import { FilterContainer } from '@/components/filters/container'
+import { FilterDate } from '@/components/filters/date'
+import { FilterSelect } from '@/components/filters/filter-select'
+import { SearchInput } from '@/components/filters/search-input'
+import { ShowFilterButton } from '@/components/filters/show-filter-button'
+import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
+import { Card } from '@/components/ui/card'
+import { NavButton } from '@/components/ui/nav-button'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { ROUTES } from '@/constants/routes'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
+import {
+  PATIENT_STATUS_OPTIONS,
+  PATIENTS_ORDER_OPTIONS,
+  type PatientsOrder,
+} from '@/enums/patients'
+import { useParams } from '@/hooks/params'
+import { api } from '@/lib/api'
+import type { PatientsOrderBy, QueryOrderMapping } from '@/types/orders'
+import type { Patient } from '@/types/patients.d.ts'
+
+import { PatientsTable } from './table'
+
+export function PatientsList() {
+  const [showFilters, setShowFilters] = useState(false)
+  const [stableTotal, setStableTotal] = useState(0)
+  const { getParams, paramsQueryKey } = useParams()
+
+  const [page, search, status, orderBy, startDate, endDate] = getParams([
+    QUERY_PARAM_KEYS.page,
+    QUERY_PARAM_KEYS.search,
+    QUERY_PARAM_KEYS.status,
+    QUERY_PARAM_KEYS.orderBy,
+    QUERY_PARAM_KEYS.startDate,
+    QUERY_PARAM_KEYS.endDate,
+  ])
+
+  const ORDER_MAPPING: QueryOrderMapping<PatientsOrder, PatientsOrderBy> = {
+    date_asc: { orderBy: 'date', order: 'ASC' },
+    date_desc: { orderBy: 'date', order: 'DESC' },
+    email_asc: { orderBy: 'email', order: 'ASC' },
+    email_desc: { orderBy: 'email', order: 'DESC' },
+    name_asc: { orderBy: 'name', order: 'ASC' },
+    name_desc: { orderBy: 'name', order: 'DESC' },
+  }
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.patients.main, paramsQueryKey],
+    queryFn: () =>
+      api<{ patients: Patient[]; total: number }>('/patients', {
+        params: {
+          page,
+          search,
+          status,
+          startDate,
+          endDate,
+          ...ORDER_MAPPING[orderBy as PatientsOrder],
+        },
+      }),
+  })
+
+  const patients = response?.data?.patients ?? []
+
+  // Update stable total only when we have actual data to prevent pagination flickering
+  useEffect(() => {
+    if (response?.data?.total !== undefined) {
+      setStableTotal(response.data.total)
+    }
+  }, [response?.data?.total])
+
+  useEffect(() => {
+    if (status || startDate || endDate) {
+      setShowFilters(true)
+    }
+  }, [status, startDate, endDate])
+
+  return (
+    <>
+      <SectionHeader>
+        <SectionHeaderTitle
+          title='Pacientes'
+          icon={<Users2Icon />}
+          total={stableTotal}
+        />
+        <SectionHeaderActions>
+          <SearchInput placeholder='Pesquisar' className='w-40' />
+          <FilterSelect
+            param={QUERY_PARAM_KEYS.orderBy}
+            options={PATIENTS_ORDER_OPTIONS}
+            placeholder='Ordenar por'
+            resetLabel='Limpar ordem'
+            className='w-40'
+          />
+          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
+
+          <NavButton size='sm' href={ROUTES.dashboard.patients.new}>
+            <PlusIcon />
+            Cadastrar
+          </NavButton>
+        </SectionHeaderActions>
+      </SectionHeader>
+
+      {showFilters && (
+        <section className='flex items-end gap-8'>
+          <FilterContainer title='Status' className='w-40'>
+            <FilterSelect
+              param={QUERY_PARAM_KEYS.status}
+              options={PATIENT_STATUS_OPTIONS}
+              placeholder='Todos'
+              resetLabel='Limpar status'
+            />
+          </FilterContainer>
+          <FilterDate />
+          <ClearFiltersButton />
+        </section>
+      )}
+
+      <Card className='p-6'>
+        <PatientsTable patients={patients} loading={isLoading} />
+      </Card>
+
+      <Pagination totalItems={stableTotal} />
+    </>
+  )
+}
diff --git a/src/modules/patients/table/actions.tsx b/src/modules/patients/table/actions.tsx
index bc90775d..7235ec51 100644
--- a/src/modules/patients/table/actions.tsx
+++ b/src/modules/patients/table/actions.tsx
@@ -17,10 +17,10 @@ import { ROUTES } from '@/constants/routes'
 import { AppointmentModal } from '@/modules/appointments/appointment-modal'
 import { InactivatePatientModal } from '@/modules/patients/inactivate-modal'
 import { ReferralModal } from '@/modules/referrals/referral-modal'
-import type { Patient } from '@/types/patients.d.ts'
+import type { PatientListItem } from '@/types/patients.d.ts'
 
 interface PatientsTableActionsProps {
-  patient: Patient
+  patient: PatientListItem
 }
 
 export function PatientsTableActions({ patient }: PatientsTableActionsProps) {
diff --git a/src/modules/patients/table/index.tsx b/src/modules/patients/table/index.tsx
index 876cb474..6df88055 100644
--- a/src/modules/patients/table/index.tsx
+++ b/src/modules/patients/table/index.tsx
@@ -1,24 +1,6 @@
 'use client'
 
-import { useQuery } from '@tanstack/react-query'
-import { PlusIcon, Users2Icon } from 'lucide-react'
-import { useEffect, useState } from 'react'
-
-import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
-import { FilterContainer } from '@/components/filters/container'
-import { FilterDate } from '@/components/filters/date'
-import { FilterSelect } from '@/components/filters/filter-select'
-import { SearchInput } from '@/components/filters/search-input'
-import { ShowFilterButton } from '@/components/filters/show-filter-button'
-import { Pagination } from '@/components/pagination'
-import {
-  SectionHeader,
-  SectionHeaderActions,
-  SectionHeaderTitle,
-} from '@/components/section-header'
 import { Avatar } from '@/components/ui/avatar'
-import { Card } from '@/components/ui/card'
-import { NavButton } from '@/components/ui/nav-button'
 import {
   Table,
   TableBody,
@@ -30,182 +12,81 @@ import {
   TableRow,
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
-import { QUERY_CACHE_KEYS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
-import { QUERY_PARAM_KEYS } from '@/enums/params'
-import {
-  PATIENT_STATUS_OPTIONS,
-  PATIENT_STATUSES,
-  PATIENTS_ORDER_OPTIONS,
-  type PatientsOrder,
-} from '@/enums/patients'
-import { useParams } from '@/hooks/params'
-import { api } from '@/lib/api'
-import type { PatientsOrderBy, QueryOrderMapping } from '@/types/orders'
-import type { Patient } from '@/types/patients.d.ts'
+import { PATIENT_STATUSES } from '@/enums/patients'
+import type { PatientListItem } from '@/types/patients.d.ts'
 import { formatDate } from '@/utils/formatters/format-date'
 import { formatPhoneNumber } from '@/utils/formatters/format-phone-number'
 
 import { PatientsTableActions } from './actions'
 import PatientsTableSkeleton from './skeleton'
 
-export function PatientsTable() {
-  const [showFilters, setShowFilters] = useState(false)
-  const [stableTotal, setStableTotal] = useState(0)
-  const { getParams, paramsQueryKey } = useParams()
-
-  const [page, search, status, orderBy, startDate, endDate] = getParams([
-    QUERY_PARAM_KEYS.page,
-    QUERY_PARAM_KEYS.search,
-    QUERY_PARAM_KEYS.status,
-    QUERY_PARAM_KEYS.orderBy,
-    QUERY_PARAM_KEYS.startDate,
-    QUERY_PARAM_KEYS.endDate,
-  ])
-
-  const ORDER_MAPPING: QueryOrderMapping<PatientsOrder, PatientsOrderBy> = {
-    date_asc: { orderBy: 'date', order: 'ASC' },
-    date_desc: { orderBy: 'date', order: 'DESC' },
-    email_asc: { orderBy: 'email', order: 'ASC' },
-    email_desc: { orderBy: 'email', order: 'DESC' },
-    name_asc: { orderBy: 'name', order: 'ASC' },
-    name_desc: { orderBy: 'name', order: 'DESC' },
-  }
-
-  const { data: response, isLoading } = useQuery({
-    queryKey: [QUERY_CACHE_KEYS.patients.main, paramsQueryKey],
-    queryFn: () =>
-      api<{ patients: Patient[]; total: number }>('/patients', {
-        params: {
-          page,
-          search,
-          status,
-          startDate,
-          endDate,
-          ...ORDER_MAPPING[orderBy as PatientsOrder],
-        },
-      }),
-  })
-
-  const patients = response?.data?.patients ?? []
-  const showPatients = !isLoading && patients.length > 0
-  const showEmptyMessage = !isLoading && patients.length === 0
-
-  // Update stable total only when we have actual data to prevent pagination flickering
-  useEffect(() => {
-    if (response?.data?.total !== undefined) {
-      setStableTotal(response.data.total)
-    }
-  }, [response?.data?.total])
+interface PatientsTableProps {
+  patients: PatientListItem[]
+  loading?: boolean
+}
 
-  useEffect(() => {
-    if (status || startDate || endDate) {
-      setShowFilters(true)
-    }
-  }, [status, startDate, endDate])
+export function PatientsTable({
+  patients,
+  loading,
+}: Readonly<PatientsTableProps>) {
+  const isEmpty = !loading && patients.length <= 0
 
   return (
-    <>
-      <SectionHeader>
-        <SectionHeaderTitle
-          title='Pacientes'
-          icon={<Users2Icon />}
-          total={stableTotal}
-        />
-        <SectionHeaderActions>
-          <SearchInput placeholder='Pesquisar' className='w-40' />
-          <FilterSelect
-            param={QUERY_PARAM_KEYS.orderBy}
-            options={PATIENTS_ORDER_OPTIONS}
-            placeholder='Ordenar por'
-            resetLabel='Limpar ordem'
-            className='w-40'
-          />
-          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
-
-          <NavButton size='sm' href={ROUTES.dashboard.patients.new}>
-            <PlusIcon />
-            Cadastrar
-          </NavButton>
-        </SectionHeaderActions>
-      </SectionHeader>
-
-      {showFilters && (
-        <section className='flex items-end gap-8'>
-          <FilterContainer title='Status' className='w-40'>
-            <FilterSelect
-              param={QUERY_PARAM_KEYS.status}
-              options={PATIENT_STATUS_OPTIONS}
-              placeholder='Todos'
-              resetLabel='Limpar status'
-            />
-          </FilterContainer>
-          <FilterDate />
-          <ClearFiltersButton />
-        </section>
-      )}
-
-      <Card className='p-6'>
-        <Table>
-          <TableHeader>
-            <TableRow>
-              <TableHead className='w-64'>Nome do paciente</TableHead>
-              <TableHead className='w-64'>Telefone</TableHead>
-              <TableHead>E-mail</TableHead>
-              <TableHead className='w-28'>Status</TableHead>
-              <TableHead className='w-40 whitespace-nowrap'>
-                Data de cadastro
-              </TableHead>
-              <TableHead className='w-20 text-center'>Ações</TableHead>
-            </TableRow>
-          </TableHeader>
-
-          <TableBody>
-            {isLoading && <PatientsTableSkeleton />}
-
-            {showPatients &&
-              patients.map((patient) => {
-                const status = PATIENT_STATUSES[patient.status]
-                return (
-                  <TableRow key={patient.id}>
-                    <TableCell>
-                      <TableLink
-                        className='w-64'
-                        href={ROUTES.dashboard.patients.details.info(
-                          patient.id,
-                        )}
-                      >
-                        <Avatar className='size-9' src={patient.avatar_url} />
-                        <span className='truncate'>{patient.name}</span>
-                      </TableLink>
-                    </TableCell>
-                    <TableCell>{formatPhoneNumber(patient.phone)}</TableCell>
-                    <TableCell>{patient.email}</TableCell>
-                    <TableCell>
-                      <Tag variant={status.variant} size='sm'>
-                        {status.label}
-                      </Tag>
-                    </TableCell>
-                    <TableCell>{formatDate(patient.created_at)}</TableCell>
-                    <TableCell className='text-center'>
-                      <PatientsTableActions patient={patient} />
-                    </TableCell>
-                  </TableRow>
-                )
-              })}
-
-            {showEmptyMessage && (
-              <TableRow>
-                <TableEmptyCell colSpan={6}>
-                  Nenhum paciente encontrado
-                </TableEmptyCell>
+    <Table>
+      <TableHeader>
+        <TableRow>
+          <TableHead className='w-64'>Nome do paciente</TableHead>
+          <TableHead className='w-64'>Telefone</TableHead>
+          <TableHead>E-mail</TableHead>
+          <TableHead className='w-28'>Status</TableHead>
+          <TableHead className='w-40 whitespace-nowrap'>
+            Data de cadastro
+          </TableHead>
+          <TableHead className='w-20 text-center'>Ações</TableHead>
+        </TableRow>
+      </TableHeader>
+
+      <TableBody>
+        {loading && <PatientsTableSkeleton />}
+
+        {isEmpty && (
+          <TableRow>
+            <TableEmptyCell colSpan={6}>
+              Nenhum paciente encontrado
+            </TableEmptyCell>
+          </TableRow>
+        )}
+
+        {!isEmpty &&
+          patients.map((patient) => {
+            const status = PATIENT_STATUSES[patient.status]
+            return (
+              <TableRow key={patient.id}>
+                <TableCell>
+                  <TableLink
+                    className='w-64'
+                    href={ROUTES.dashboard.patients.details.info(patient.id)}
+                  >
+                    <Avatar className='size-9' src={patient.avatar_url} />
+                    <span className='truncate'>{patient.name}</span>
+                  </TableLink>
+                </TableCell>
+                <TableCell>{formatPhoneNumber(patient.phone)}</TableCell>
+                <TableCell>{patient.email}</TableCell>
+                <TableCell>
+                  <Tag variant={status.variant} size='sm'>
+                    {status.label}
+                  </Tag>
+                </TableCell>
+                <TableCell>{formatDate(patient.created_at)}</TableCell>
+                <TableCell className='text-center'>
+                  <PatientsTableActions patient={patient} />
+                </TableCell>
               </TableRow>
-            )}
-          </TableBody>
-        </Table>
-      </Card>
-
-      <Pagination totalItems={stableTotal} />
-    </>
+            )
+          })}
+      </TableBody>
+    </Table>
   )
 }
diff --git a/src/modules/referrals/cancel-referral-modal.tsx b/src/modules/referrals/cancel-referral-modal.tsx
index d433d6d8..06326f31 100644
--- a/src/modules/referrals/cancel-referral-modal.tsx
+++ b/src/modules/referrals/cancel-referral-modal.tsx
@@ -64,12 +64,7 @@ export function CancelReferralModal({
   return (
     <DialogContainer>
       <DialogHeader
-        icon={
-          <DialogIcon
-            icon={CircleXIcon}
-            className='text-error bg-error/10 border-none'
-          />
-        }
+        icon={<DialogIcon icon={CircleXIcon} variant='destructive' />}
       >
         <DialogTitle>Cancelar encaminhamento</DialogTitle>
       </DialogHeader>
diff --git a/src/types/patients.d.ts b/src/types/patients.d.ts
index b66ee68b..8555063e 100644
--- a/src/types/patients.d.ts
+++ b/src/types/patients.d.ts
@@ -32,6 +32,11 @@ export type Patient = {
   supports?: PatientSupport[]
 }
 
+export type PatientListItem = Pick<
+  Patient,
+  'id' | 'name' | 'email' | 'phone' | 'avatar_url' | 'status' | 'created_at'
+>
+
 export type PatientDocument = {
   id: string
   name: string

From de4c03a0367747f694dbb92510ece4a673bb2116 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 13 Feb 2026 17:50:52 -0300
Subject: [PATCH 52/77] refactor(patients): update create patient form

---
 .../(dashboard)/pacientes/cadastrar/page.tsx  |  18 +-
 src/components/form/combobox-input.tsx        |  10 +-
 src/components/form/select-input.tsx          |   1 +
 src/components/ui/button.tsx                  |   3 +-
 src/components/ui/combobox.tsx                |   7 +-
 src/components/ui/date-picker.tsx             |   4 +-
 src/components/ui/select.tsx                  |  12 +-
 src/enums/shared.ts                           |   1 +
 src/modules/patients/form/index.tsx           | 662 ++++++++----------
 src/modules/patients/form/schema.tsx          |   6 +-
 src/schemas/index.tsx                         |  37 +-
 11 files changed, 360 insertions(+), 401 deletions(-)

diff --git a/src/app/(dashboard)/pacientes/cadastrar/page.tsx b/src/app/(dashboard)/pacientes/cadastrar/page.tsx
index be748e73..9ff4ee47 100644
--- a/src/app/(dashboard)/pacientes/cadastrar/page.tsx
+++ b/src/app/(dashboard)/pacientes/cadastrar/page.tsx
@@ -1,22 +1,22 @@
-import { UserRoundPlusIcon } from 'lucide-react'
+import { UserPlus2Icon } from 'lucide-react'
 import type { Metadata } from 'next'
 
+import { SectionHeader, SectionHeaderTitle } from '@/components/section-header'
 import { PatientForm } from '@/modules/patients/form'
 
 export const metadata: Metadata = {
-  title: 'Cadastrar novo paciente',
+  title: 'Cadastrar paciente',
 }
 
 export default function Page() {
   return (
     <>
-      <div className='flex items-center gap-4'>
-        <span className='bg-border/50 rounded-lg p-2'>
-          <UserRoundPlusIcon className='text-primary size-5.5' />
-        </span>
-
-        <h1 className='text-xl font-medium'>Cadastrar novo paciente</h1>
-      </div>
+      <SectionHeader>
+        <SectionHeaderTitle
+          title='Cadastrar paciente'
+          icon={<UserPlus2Icon />}
+        />
+      </SectionHeader>
 
       <PatientForm mode='create' />
     </>
diff --git a/src/components/form/combobox-input.tsx b/src/components/form/combobox-input.tsx
index 8e2d4e1a..3b6561c0 100644
--- a/src/components/form/combobox-input.tsx
+++ b/src/components/form/combobox-input.tsx
@@ -10,7 +10,7 @@ import { Label } from '../ui/label'
 import { FormMessage } from './form-message'
 import { RequiredInput } from './required-input'
 
-type ComboboxInputProps = Omit<
+type ComboboxInputProps<T> = Omit<
   ComboboxProps,
   'value' | 'onSelect' | 'variant'
 > & {
@@ -18,10 +18,10 @@ type ComboboxInputProps = Omit<
   message?: string
   className?: string
   isRequired?: boolean
-  onValueChange?: (value: string) => void
+  onValueChange?: (value: T) => void
 }
 
-export function ComboboxInput({
+export function ComboboxInput<T>({
   name,
   label,
   message,
@@ -29,7 +29,7 @@ export function ComboboxInput({
   className,
   onValueChange,
   ...props
-}: Readonly<ComboboxInputProps>) {
+}: Readonly<ComboboxInputProps<T>>) {
   const { control } = useFormContext()
 
   if (!control) {
@@ -55,7 +55,7 @@ export function ComboboxInput({
               variant={fieldState.error && 'error'}
               onSelect={(value) => {
                 field.onChange(value)
-                onValueChange?.(value)
+                onValueChange?.(value as T)
               }}
               {...props}
             />
diff --git a/src/components/form/select-input.tsx b/src/components/form/select-input.tsx
index 5f27e3a1..bebe5b34 100644
--- a/src/components/form/select-input.tsx
+++ b/src/components/form/select-input.tsx
@@ -70,6 +70,7 @@ export function SelectInput<T>({
               value={field.value}
               placeholder={placeholder}
               onValueChange={handleValueChange}
+              variant={fieldState.error && 'error'}
             />
             <FormMessage error={!!fieldState.error?.message}>
               {showMessage}
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index 6ec981e4..4480bdc1 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -19,7 +19,8 @@ const buttonVariants = cva(
           'border-border hover:bg-accent text-accent-foreground bg-background border shadow-xs',
         muted: 'bg-background-soft text-accent-foreground hover:bg-border',
         ghost: 'text-accent-foreground hover:bg-accent bg-transparent',
-        error: 'border-error focus-visible:ring-error hover:bg-accent border',
+        error:
+          'border-error focus-visible:ring-error bg-background hover:bg-accent outline-error border',
       },
       size: {
         default: 'h-10 min-h-10 px-4 [&_svg]:size-5',
diff --git a/src/components/ui/combobox.tsx b/src/components/ui/combobox.tsx
index 93a560ed..13b9a997 100644
--- a/src/components/ui/combobox.tsx
+++ b/src/components/ui/combobox.tsx
@@ -7,14 +7,13 @@ import { CheckIcon, ChevronsUpDownIcon, XIcon } from 'lucide-react'
 import { cn } from '@/utils/class-name-merge'
 
 export const comboboxInputVariants = cva(
-  'border-border bg-background h-10 w-full truncate overflow-hidden rounded-lg border pr-12 pl-3 shadow-xs outline-offset-2 outline-transparent transition-colors disabled:opacity-50 aria-[readonly]:focus-visible:outline-none',
+  'border-border bg-background h-10 w-full truncate overflow-hidden rounded-lg border pr-12 pl-3 shadow-xs outline-offset-4 outline-transparent transition-colors disabled:opacity-50 aria-[readonly]:focus-visible:outline-none',
   {
     variants: {
       variant: {
         default:
-          'border-border text-foreground placeholder:text-disabled focus-visible:outline-ring',
-        error:
-          'border-error focus-visible:ring-error focus-visible:outline-error',
+          'border-border text-foreground placeholder:text-disabled outline-ring',
+        error: 'border-error focus-visible:ring-error outline-error',
       },
     },
     defaultVariants: {
diff --git a/src/components/ui/date-picker.tsx b/src/components/ui/date-picker.tsx
index bd3f9818..e018a78e 100644
--- a/src/components/ui/date-picker.tsx
+++ b/src/components/ui/date-picker.tsx
@@ -19,6 +19,7 @@ export interface DatePickerProps
   value?: string | null
   onSelectDate?: (date: string) => void
   modal?: boolean
+  placeholder?: string
 }
 
 export function DatePicker({
@@ -29,6 +30,7 @@ export function DatePicker({
   onSelectDate,
   modal,
   startDate,
+  placeholder = 'Selecionar data',
   ...props
 }: Readonly<DatePickerProps>) {
   const [open, setOpen] = useState(false)
@@ -68,7 +70,7 @@ export function DatePicker({
         {date ? (
           formatDate(date, { dateStyle: 'short' })
         ) : (
-          <span className='text-disabled'>Selecionar</span>
+          <span className='text-disabled'>{placeholder}</span>
         )}
       </PopoverTrigger>
 
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
index 5fd58183..b887b401 100644
--- a/src/components/ui/select.tsx
+++ b/src/components/ui/select.tsx
@@ -19,15 +19,20 @@ export type SelectOption = {
 }
 
 const selectTriggerVariants = cva(
-  'border-border bg-background data-[placeholder]:text-disabled outline-ring hover:bg-accent flex cursor-pointer items-center justify-between gap-2 rounded-lg border pr-2 pl-3 shadow-xs outline-offset-4 transition-colors disabled:pointer-events-none disabled:opacity-50 aria-[readonly]:pointer-events-none',
+  'bg-background data-[placeholder]:text-disabled hover:bg-accent flex cursor-pointer items-center gap-2 rounded-lg border pr-2 pl-3 text-left shadow-xs outline-offset-4 transition-colors disabled:pointer-events-none disabled:opacity-50 aria-[readonly]:pointer-events-none',
   {
     variants: {
+      variant: {
+        default: 'outline-ring border-border',
+        error: 'outline-error border-error',
+      },
       size: {
         default: 'h-10',
         sm: 'h-9',
       },
     },
     defaultVariants: {
+      variant: 'default',
       size: 'default',
     },
   },
@@ -50,6 +55,7 @@ export function Select({
   className,
   resetLabel,
   placeholder = 'Selecione uma opção',
+  variant,
   ...props
 }: Readonly<SelectProps>) {
   const selectedOption = options.find((option) => option.value === value)
@@ -58,9 +64,9 @@ export function Select({
   return (
     <BaseSelect.Root value={value} items={options} {...props}>
       <BaseSelect.Trigger
-        className={cn('w-full', selectTriggerVariants({ size, className }))}
+        className={selectTriggerVariants({ variant, size, className })}
       >
-        <BaseSelect.Value>
+        <BaseSelect.Value className='w-full truncate whitespace-nowrap'>
           {() => (selectedOption ? selectedOption.label : placeholder)}
         </BaseSelect.Value>
         {showIndicator && (
diff --git a/src/enums/shared.ts b/src/enums/shared.ts
index 4481c4e9..c0ca27cd 100644
--- a/src/enums/shared.ts
+++ b/src/enums/shared.ts
@@ -48,6 +48,7 @@ export const UF_LIST = {
 }
 export type UF = keyof typeof UF_LIST
 export const BRAZILIAN_STATES_OPTIONS = convertObjectToOptions(UF_LIST)
+export const BRAZILIAN_STATES_ENUM = Object.keys(UF_LIST) as [UF]
 
 export const YES_OR_NO = {
   yes: 'Sim',
diff --git a/src/modules/patients/form/index.tsx b/src/modules/patients/form/index.tsx
index 9dc60630..5f738b62 100644
--- a/src/modules/patients/form/index.tsx
+++ b/src/modules/patients/form/index.tsx
@@ -15,11 +15,14 @@ import React from 'react'
 import { FormProvider, useFieldArray, useForm } from 'react-hook-form'
 import { toast } from 'sonner'
 
+import { ComboboxInput } from '@/components/form/combobox-input'
 import { DateInput } from '@/components/form/date-input'
 import { FormContainer } from '@/components/form/form-container'
+import { FormField } from '@/components/form/form-field'
 import { SelectInput } from '@/components/form/select-input'
 import { TextInput } from '@/components/form/text-input'
 import { Button } from '@/components/ui/button'
+import { Dialog } from '@/components/ui/dialog'
 import { Divider } from '@/components/ui/divider'
 import { NEXT_CACHE_TAGS, QUERY_CACHE_KEYS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
@@ -42,444 +45,385 @@ import { formatCpfNumber } from '@/utils/formatters/format-cpf-number'
 import { formatPhoneNumber } from '@/utils/formatters/format-phone-number'
 import { removeNonNumbers } from '@/utils/sanitizers'
 
-import { ComboboxInput } from '../../../components/form/combobox-input'
-import { Dialog } from '../../../components/ui/dialog'
 import CancelPatientFormModal from './cancel-modal'
 import { type PatientFormSchema, patientFormSchema } from './schema'
 
-type PatientFormMode = 'view' | 'edit' | 'create'
+type Action = 'view' | 'edit' | 'create'
 
 interface PatientFormProps {
-  patient?: Patient | null
-  mode?: PatientFormMode
+  patient?: Patient
+  mode?: Action
 }
 
 export function PatientForm({
   patient,
   mode = 'view',
 }: Readonly<PatientFormProps>) {
-  const [isCancelConfirmModalOpen, setIsCancelConfirmModalOpen] =
-    useState(false)
-  const [formState, setFormState] = useState<PatientFormMode>(mode)
+  const [isCancelModalOpen, setIsCancelModalOpen] = useState(false)
+  const [action, setAction] = useState<Action>(mode)
 
   const router = useRouter()
 
+  const patientSupports = patient?.supports?.map((support) => ({
+    ...support,
+    phone: formatPhoneNumber(support.phone),
+  })) ?? [{ name: '', phone: '', kinship: '' }]
+
   const formMethods = useForm<PatientFormSchema>({
     resolver: zodResolver(patientFormSchema),
     defaultValues: {
       name: patient?.name || '',
+      date_of_birth: patient?.date_of_birth || '',
+      cpf: patient?.cpf ? formatCpfNumber(patient.cpf) : '',
       gender: patient?.gender || '',
       race: patient?.race || '',
-      date_of_birth: patient?.date_of_birth || '',
-      city: patient?.city || '',
-      state: patient?.state || '',
       phone: patient?.phone ? formatPhoneNumber(patient.phone) : '',
-      cpf: patient?.cpf ? formatCpfNumber(patient.cpf) : '',
+      state: patient?.state || '',
+      city: patient?.city || '',
       email: patient?.email || '',
       has_disability: patient?.has_disability ? 'yes' : 'no',
       disability_desc: patient?.disability_desc || '',
-      need_legal_assistance: patient?.need_legal_assistance ? 'yes' : 'no',
       take_medication: patient?.take_medication ? 'yes' : 'no',
       medication_desc: patient?.medication_desc || '',
       nmo_diagnosis: patient?.nmo_diagnosis || '',
-      supports: patient?.supports?.map((support) => ({
-        ...support,
-        phone: formatPhoneNumber(support.phone),
-      })) ?? [{ name: '', phone: '', kinship: '' }],
+      need_legal_assistance: patient?.need_legal_assistance ? 'yes' : 'no',
+      supports: patientSupports,
     } as unknown as PatientFormSchema,
     mode: 'onBlur',
   })
 
-  const { clearErrors, setValue, watch, control } = formMethods
-
-  const { fields, append, remove } = useFieldArray({
-    control,
+  const supportMethods = useFieldArray({
+    control: formMethods.control,
     name: 'supports',
   })
 
-  const patientSupports =
-    patient?.supports && patient.supports.length > 0
-      ? patient.supports.map((support) => ({
-          ...support,
-          phone: formatPhoneNumber(support.phone),
-        }))
-      : []
+  const selectedUF = formMethods.watch('state') as UF
+  const cityOptions = useCities(selectedUF)
+  const isViewMode = action === 'view'
 
-  const selectedUF = watch('state') as UF
-  const cities = useCities(selectedUF)
-
-  const isViewMode = formState === 'view'
+  const submitButtonContent = {
+    create: { icon: <UserPlus2Icon />, label: 'Cadastrar' },
+    edit: { icon: <CircleCheckIcon />, label: 'Salvar' },
+    view: null,
+  }
+  const submitButton = submitButtonContent[action]
 
-  function handleSelectState(value: string) {
-    setValue('state', value)
-    setValue('city', '')
-    clearErrors('state')
-    clearErrors('city')
+  function handleSelectState(value: UF) {
+    formMethods.setValue('state', value)
+    formMethods.setValue('city', '')
+    formMethods.clearErrors('state')
+    formMethods.clearErrors('city')
   }
 
   function handleCancel() {
-    if (formState === 'create') {
-      setIsCancelConfirmModalOpen(true)
+    if (action === 'create') {
+      setIsCancelModalOpen(true)
       return
     }
-    setFormState('view')
+    setAction('view')
     formMethods.reset()
   }
 
+  async function createPatient(data: PatientFormSchema) {
+    const payload = {
+      ...data,
+      phone: removeNonNumbers(data.phone),
+      cpf: removeNonNumbers(data.cpf),
+      has_disability: data.has_disability === 'yes',
+      need_legal_assistance: data.need_legal_assistance === 'yes',
+      take_medication: data.take_medication === 'yes',
+      supports: data.supports.map((support) => ({
+        ...support,
+        phone: removeNonNumbers(support.phone),
+      })),
+    }
+
+    return await api('/patients', {
+      method: 'POST',
+      body: JSON.stringify(payload),
+    })
+  }
+
   async function submitForm(data: PatientFormSchema) {
-    if (formState === 'edit') {
+    if (action === 'edit') {
       // TODO: Implement update patient request
       console.log(data)
       return
     }
 
-    const patient = patientFormSchema.safeParse(data)
+    const response = await createPatient(data)
 
-    if (!patient.success) {
-      toast.error(
-        'Verifique se todos os dados estão corretos e tente novamente!',
-      )
+    if (!response.success) {
+      toast.error(response.message)
       return
     }
 
-    const supports =
-      data.supports && data.supports.length > 0
-        ? data.supports.map((contact) => ({
-            ...contact,
-            phone: removeNonNumbers(contact.phone),
-          }))
-        : undefined
-
-    const payload = {
-      ...patient.data,
-      phone: removeNonNumbers(patient.data.phone),
-      cpf: removeNonNumbers(patient.data.cpf),
-      has_disability: patient.data.has_disability === 'yes',
-      disability_desc: patient.data.disability_desc ?? null,
-      need_legal_assistance: patient.data.need_legal_assistance === 'yes',
-      take_medication: patient.data.take_medication === 'yes',
-      medication_desc: patient.data.medication_desc ?? null,
-      supports,
-    }
-
-    const response = await api('/patients', {
-      method: 'POST',
-      body: JSON.stringify(payload),
-    })
+    revalidateClientCache([
+      QUERY_CACHE_KEYS.patients.main,
+      QUERY_CACHE_KEYS.patients.allOptions,
+    ])
 
-    if (!response.success) {
-      toast.error(response.message)
-      return
+    if (action === 'create') {
+      revalidateServerCache(NEXT_CACHE_TAGS.statistics.totalPatients.main)
     }
 
-    revalidateClientCache([QUERY_CACHE_KEYS.patients.main])
-    revalidateServerCache(NEXT_CACHE_TAGS.statistics.totalPatients.main)
     toast.success(response.message)
-    formMethods.reset()
-
     router.push(ROUTES.dashboard.patients.main)
   }
 
   return (
     <FormProvider {...formMethods}>
-      <FormContainer
-        className='grid gap-x-4 lg:grid-cols-6'
-        onSubmit={formMethods.handleSubmit(submitForm)}
-      >
-        <TextInput
-          name='name'
-          label='Nome completo'
-          maxLength={50}
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          placeholder='Insira o nome completo'
-          wrapperClassName='lg:col-span-4'
-        />
-        <DateInput
-          name='date_of_birth'
-          label='Data de nascimento'
-          navMode='dropdown'
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          wrapperClassName='lg:col-span-2'
-        />
-
-        <TextInput
-          name='cpf'
-          label='CPF'
-          mask='cpf'
-          inputMode='numeric'
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          placeholder='000.000.000-00'
-          wrapperClassName='lg:col-span-2'
-        />
-        <SelectInput
-          name='gender'
-          label='Gênero'
-          options={PATIENT_GENDER_OPTIONS}
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          placeholder='Selecione'
-          className='lg:col-span-2'
-        />
-        <SelectInput
-          name='race'
-          label='Raça ou Cor'
-          options={PATIENT_RACE_OPTIONS}
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          placeholder='Selecionar'
-          className='lg:col-span-2'
-        />
-
-        <TextInput
-          name='phone'
-          label='Telefone (WhatsApp)'
-          mask='phone'
-          inputMode='tel'
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          placeholder='(00) 00000-0000'
-          wrapperClassName='lg:col-span-2'
-        />
-        <ComboboxInput
-          name='state'
-          label='Estado'
-          options={BRAZILIAN_STATES_OPTIONS}
-          placeholder='Selecione o estado'
-          className='lg:col-span-2'
-          onValueChange={handleSelectState}
-          isRequired={!isViewMode}
-        />
-        <ComboboxInput
-          name='city'
-          label='Cidade'
-          options={cities}
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          disabled={!selectedUF}
-          placeholder='Selecione a cidade'
-          className='lg:col-span-2'
-        />
-
-        <TextInput
-          name='email'
-          label='E-mail'
-          inputMode='email'
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          placeholder='Insira o e-mail'
-          wrapperClassName='lg:col-span-full'
-        />
-
-        <Divider className='lg:col-span-full' />
-
-        <SelectInput
-          name='has_disability'
-          label='Possui alguma deficiência?'
-          options={YES_OR_NO_OPTIONS}
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          className='lg:col-span-2'
-        />
-        <TextInput
-          name='disability_desc'
-          label='Se sim, qual?'
-          readOnly={isViewMode}
-          wrapperClassName='lg:col-span-4'
-          disabled={formMethods.watch('has_disability') === 'no'}
-        />
-
-        <SelectInput
-          name='take_medication'
-          label='Usa medicamento regularmente?'
-          options={YES_OR_NO_OPTIONS}
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          className='lg:col-span-2'
-        />
-        <TextInput
-          name='medication_desc'
-          label='Se sim, qual?'
-          readOnly={isViewMode}
-          wrapperClassName='lg:col-span-4'
-          disabled={formMethods.watch('take_medication') === 'no'}
-        />
-
-        <SelectInput
-          name='nmo_diagnosis'
-          label='Possui diagnóstico de NMO?'
-          options={PATIENT_NMO_DIAGNOSTIC_OPTIONS}
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          className='lg:col-span-3'
-        />
-        <SelectInput
-          name='need_legal_assistance'
-          label='Precisa de assistência legal?'
-          options={YES_OR_NO_OPTIONS}
-          readOnly={isViewMode}
-          isRequired={!isViewMode}
-          className='lg:col-span-3'
-        />
-
-        {(formState === 'create' || patientSupports.length >= 1) && (
-          <Divider className='lg:col-span-full' />
-        )}
-
-        {patientSupports.length >= 1 && (
-          <div className='space-y-6 lg:col-span-6'>
-            <h1 className='text-xl font-medium'>Rede de apoio</h1>
-            <div className='grid gap-x-4 gap-y-6 sm:grid-cols-6'>
-              {fields.map((support, index) => (
-                <React.Fragment key={support.id}>
-                  <TextInput
-                    name={`supports.${index}.name`}
-                    label='Nome completo'
-                    maxLength={50}
-                    readOnly={isViewMode}
-                    wrapperClassName='lg:col-span-3'
-                  />
-                  <TextInput
-                    name={`supports.${index}.kinship`}
-                    label='Parentesco'
-                    maxLength={50}
-                    readOnly={isViewMode}
-                    wrapperClassName='lg:col-span-1'
-                  />
-                  <div className='flex gap-1 lg:col-span-2'>
-                    <TextInput
-                      name={`supports.${index}.phone`}
-                      label='Telefone (WhatsApp)'
-                      readOnly={isViewMode}
-                      mask='phone'
-                    />
-                    <Button
-                      variant='ghost'
-                      className='text-foreground-soft mt-6'
-                      onClick={() => remove(index)}
-                      disabled={isViewMode}
-                    >
-                      <Trash2Icon />
-                    </Button>
-                  </div>
-                </React.Fragment>
-              ))}
-            </div>
-            <Button
-              variant='outline'
-              className='text-primary'
-              type='button'
-              onClick={() => append({ name: '', kinship: '', phone: '' })}
-              disabled={isViewMode}
-            >
-              <PlusIcon /> Adicionar novo contato
-            </Button>
+      <FormContainer onSubmit={formMethods.handleSubmit(submitForm)}>
+        <FormField className='grid gap-4 lg:grid-cols-7'>
+          <TextInput
+            name='name'
+            label='Nome completo'
+            maxLength={64}
+            placeholder='Insira o nome completo'
+            wrapperClassName='lg:col-span-3'
+            isRequired={!isViewMode}
+            readOnly={isViewMode}
+          />
+          <DateInput
+            name='date_of_birth'
+            label='Data de nascimento'
+            navMode='dropdown'
+            placeholder='Selecione a data'
+            wrapperClassName='lg:col-span-2'
+            isRequired={!isViewMode}
+            readOnly={isViewMode}
+          />
+          <TextInput
+            name='cpf'
+            label='CPF'
+            mask='cpf'
+            inputMode='numeric'
+            maxLength={14}
+            placeholder='000.000.000-00'
+            wrapperClassName='lg:col-span-2'
+            isRequired={!isViewMode}
+            readOnly={isViewMode}
+          />
+
+          <TextInput
+            name='phone'
+            label='Telefone (WhatsApp)'
+            mask='phone'
+            inputMode='tel'
+            maxLength={15}
+            placeholder='(00) 00000-0000'
+            wrapperClassName='lg:col-span-2'
+            isRequired={!isViewMode}
+            readOnly={isViewMode}
+          />
+          <ComboboxInput
+            name='state'
+            label='Estado'
+            options={BRAZILIAN_STATES_OPTIONS}
+            onValueChange={handleSelectState}
+            placeholder='Selecione o estado'
+            className='lg:col-span-2'
+            isRequired={!isViewMode}
+            readOnly={isViewMode}
+          />
+          <ComboboxInput
+            name='city'
+            label='Cidade'
+            options={cityOptions}
+            placeholder='Selecione a cidade'
+            className='lg:col-span-3'
+            isRequired={!isViewMode}
+            readOnly={isViewMode}
+            disabled={!selectedUF}
+          />
+
+          <SelectInput
+            name='gender'
+            label='Gênero'
+            options={PATIENT_GENDER_OPTIONS}
+            placeholder='Selecione o gênero'
+            className='lg:col-span-2'
+            isRequired={!isViewMode}
+            readOnly={isViewMode}
+          />
+          <SelectInput
+            name='race'
+            label='Raça ou Cor'
+            options={PATIENT_RACE_OPTIONS}
+            placeholder='Selecione a raça ou cor'
+            className='lg:col-span-2'
+            isRequired={!isViewMode}
+            readOnly={isViewMode}
+          />
+          <TextInput
+            name='email'
+            label='E-mail'
+            inputMode='email'
+            maxLength={64}
+            placeholder='Insira o e-mail'
+            wrapperClassName='lg:col-span-3'
+            isRequired={!isViewMode}
+            readOnly={isViewMode}
+          />
+        </FormField>
+
+        <Divider />
+
+        <FormField className='grid gap-4 lg:grid-cols-3'>
+          <SelectInput
+            name='has_disability'
+            label='Possui alguma deficiência?'
+            options={YES_OR_NO_OPTIONS}
+            placeholder='Teste'
+            className='lg:col-span-1'
+            isRequired={!isViewMode}
+            readOnly={isViewMode}
+          />
+          <TextInput
+            name='disability_desc'
+            label='Se sim, qual?'
+            maxLength={500}
+            wrapperClassName='lg:col-span-2'
+            readOnly={isViewMode}
+            disabled={formMethods.watch('has_disability') === 'no'}
+          />
+
+          <SelectInput
+            name='take_medication'
+            label='Usa medicamento regularmente?'
+            options={YES_OR_NO_OPTIONS}
+            isRequired={!isViewMode}
+            className='lg:col-span-1'
+            readOnly={isViewMode}
+          />
+          <TextInput
+            name='medication_desc'
+            label='Se sim, qual?'
+            maxLength={500}
+            wrapperClassName='lg:col-span-2'
+            readOnly={isViewMode}
+            disabled={formMethods.watch('take_medication') === 'no'}
+          />
+
+          <SelectInput
+            name='nmo_diagnosis'
+            label='Possui diagnóstico de NMO?'
+            options={PATIENT_NMO_DIAGNOSTIC_OPTIONS}
+            className='lg:col-span-2'
+            isRequired={!isViewMode}
+            readOnly={isViewMode}
+          />
+          <SelectInput
+            name='need_legal_assistance'
+            label='Precisa de assistência legal?'
+            options={YES_OR_NO_OPTIONS}
+            className='lg:col-span-1'
+            isRequired={!isViewMode}
+            readOnly={isViewMode}
+          />
+        </FormField>
+
+        <Divider />
+
+        <section>
+          <h1 className='text-xl font-medium'>Rede de apoio</h1>
+          <div className='mt-6 space-y-6'>
+            {supportMethods.fields.map((support, index) => (
+              <fieldset
+                data-first={index === 0}
+                className='border-border flex items-start gap-4 max-lg:flex-col data-[first=false]:max-lg:border-t data-[first=false]:max-lg:pt-4'
+                key={support.id}
+              >
+                <TextInput
+                  name={`supports.${index}.name`}
+                  label='Nome completo'
+                  maxLength={64}
+                  placeholder='Insira o nome completo'
+                  wrapperClassName='flex-1'
+                  isRequired
+                />
+                <TextInput
+                  name={`supports.${index}.kinship`}
+                  label='Parentesco'
+                  maxLength={32}
+                  placeholder='Insira o parentesco'
+                  wrapperClassName='lg:w-44'
+                  isRequired
+                />
+                <TextInput
+                  name={`supports.${index}.phone`}
+                  label='Telefone (WhatsApp)'
+                  mask='phone'
+                  maxLength={15}
+                  placeholder='(00) 00000-0000'
+                  wrapperClassName={
+                    index === 0 && !isViewMode ? 'lg:w-58' : 'lg:w-44'
+                  }
+                  readOnly={isViewMode}
+                  isRequired
+                />
+                {index > 0 && !isViewMode && (
+                  <Button
+                    size='icon'
+                    type='button'
+                    variant='ghost'
+                    className='text-error max-lg:w-full max-lg:border lg:mt-7'
+                    onClick={() => supportMethods.remove(index)}
+                  >
+                    <Trash2Icon />
+                  </Button>
+                )}
+              </fieldset>
+            ))}
+            {action !== 'view' && (
+              <Button
+                type='button'
+                variant='outline'
+                onClick={() =>
+                  supportMethods.append({ name: '', kinship: '', phone: '' })
+                }
+              >
+                <PlusIcon /> Adicionar novo contato
+              </Button>
+            )}
           </div>
-        )}
-
-        {formState === 'create' && (
-          <div className='space-y-6 lg:col-span-6'>
-            <h1 className='text-xl font-medium'>Rede de apoio</h1>
-            <div className='grid gap-x-4 gap-y-6 sm:grid-cols-6'>
-              {fields.map((support, index) => (
-                <React.Fragment key={support.id}>
-                  <TextInput
-                    name={`supports.${index}.name`}
-                    label='Nome completo'
-                    maxLength={50}
-                    isRequired
-                    placeholder='Insira o nome completo'
-                    wrapperClassName='lg:col-span-3'
-                  />
-                  <TextInput
-                    name={`supports.${index}.kinship`}
-                    label='Parentesco'
-                    maxLength={50}
-                    isRequired
-                    placeholder='Selecione o parentesco'
-                    wrapperClassName='lg:col-span-1'
-                  />
-                  <div className='flex items-end gap-1 lg:col-span-2'>
-                    <TextInput
-                      name={`supports.${index}.phone`}
-                      label='Telefone (WhatsApp)'
-                      readOnly={isViewMode}
-                      mask='phone'
-                      isRequired
-                    />
-                    <Button
-                      size='icon'
-                      type='button'
-                      variant='ghost'
-                      className='text-foreground-soft'
-                      disabled={index === 0}
-                      onClick={() => (index > 0 ? remove(index) : null)}
-                    >
-                      <Trash2Icon />
-                    </Button>
-                  </div>
-                </React.Fragment>
-              ))}
-            </div>
+        </section>
+
+        <div className='mt-3 flex flex-row-reverse gap-2 max-lg:flex-col'>
+          {isViewMode && (
             <Button
               type='button'
               variant='outline'
-              onClick={() => append({ name: '', kinship: '', phone: '' })}
-              disabled={isViewMode}
+              onClick={() => setAction('edit')}
             >
-              <PlusIcon /> Adicionar novo contato
+              <ClipboardEditIcon /> Editar
             </Button>
-          </div>
-        )}
+          )}
 
-        <div className='mt-3 flex justify-end gap-2 lg:col-span-6'>
-          {isViewMode && (
+          {!isViewMode && (
             <Button
-              type='button'
-              variant='outline'
-              onClick={() => setFormState('edit')}
+              type='submit'
+              className='lg:w-48'
+              loading={formMethods.formState.isSubmitting}
             >
-              <ClipboardEditIcon /> Editar
+              {submitButton?.icon} {submitButton?.label}
             </Button>
           )}
 
           {!isViewMode && (
-            <>
-              <Button
-                type='button'
-                variant='outline'
-                disabled={formMethods.formState.isSubmitting}
-                onClick={handleCancel}
-              >
-                <CircleXIcon /> Cancelar
-              </Button>
-              <Button
-                type='submit'
-                loading={formMethods.formState.isSubmitting}
-              >
-                {formState === 'create' ? (
-                  <>
-                    <UserPlus2Icon />
-                    <span>Cadastrar</span>
-                  </>
-                ) : (
-                  <>
-                    <CircleCheckIcon />
-                    <span>Salvar</span>
-                  </>
-                )}
-              </Button>
-            </>
+            <Button
+              type='button'
+              variant='outline'
+              disabled={formMethods.formState.isSubmitting}
+              onClick={handleCancel}
+            >
+              <CircleXIcon /> Cancelar
+            </Button>
           )}
         </div>
 
-        <Dialog
-          open={isCancelConfirmModalOpen}
-          onOpenChange={setIsCancelConfirmModalOpen}
-        >
-          {isCancelConfirmModalOpen && (
+        <Dialog open={isCancelModalOpen} onOpenChange={setIsCancelModalOpen}>
+          {isCancelModalOpen && (
             <CancelPatientFormModal onConfirm={() => router.back()} />
           )}
         </Dialog>
diff --git a/src/modules/patients/form/schema.tsx b/src/modules/patients/form/schema.tsx
index 822b1e0a..49c7c306 100644
--- a/src/modules/patients/form/schema.tsx
+++ b/src/modules/patients/form/schema.tsx
@@ -29,13 +29,13 @@ export const patientFormSchema = z
     has_disability: yesOrNoSchema,
     disability_desc: z
       .string()
-      .transform((data) => data?.trim())
+      .transform((data) => data.trim())
       .nullable(),
     need_legal_assistance: yesOrNoSchema,
     take_medication: yesOrNoSchema,
     medication_desc: z
       .string()
-      .transform((data) => data?.trim())
+      .transform((data) => data.trim())
       .nullable(),
     nmo_diagnosis: patientNmoDiagnosticSchema,
     supports: z
@@ -46,7 +46,7 @@ export const patientFormSchema = z
           phone: phoneSchema,
         }),
       )
-      .optional(),
+      .min(1),
   })
   .refine(
     (data) => {
diff --git a/src/schemas/index.tsx b/src/schemas/index.tsx
index a3e4b941..34e89db9 100644
--- a/src/schemas/index.tsx
+++ b/src/schemas/index.tsx
@@ -14,7 +14,11 @@ import {
   PATIENT_NMO_DIAGNOSTICS_ENUM,
   PATIENT_RACES_ENUM,
 } from '@/enums/patients'
-import { SPECIALTIES_ENUM, UF_LIST, YES_OR_NO_TUPLE } from '@/enums/shared'
+import {
+  BRAZILIAN_STATES_ENUM,
+  SPECIALTIES_ENUM,
+  YES_OR_NO_TUPLE,
+} from '@/enums/shared'
 import { USERS_ROLE_ENUM } from '@/enums/users'
 
 export const nameSchema = z
@@ -41,40 +45,41 @@ export const userRoleSchema = z.enum(USERS_ROLE_ENUM)
 
 export const phoneSchema = z
   .string()
-  .nonempty('Informe o telefone')
+  .nonempty('Insira o telefone')
   .regex(PHONE_REGEX, 'Insira um número de telefone válido')
 
-export const genderSchema = z.enum(PATIENT_GENDERS_ENUM)
+export const genderSchema = z.enum(PATIENT_GENDERS_ENUM, {
+  message: 'Selecione um gênero',
+})
 
-export const raceSchema = z.enum(PATIENT_RACES_ENUM)
+export const raceSchema = z.enum(PATIENT_RACES_ENUM, {
+  message: 'Selecione uma raça ou cor',
+})
 
 export const dateOfBirthSchema = z
   .string()
-  .datetime('Informe uma data válida')
+  .datetime('Insira uma data válida')
   .refine(
     (value) => {
       const date = new Date(value)
       return date >= new Date('1900-01-01') && date <= new Date()
     },
-    { message: 'Informe uma data válida' },
+    { message: 'Insira uma data válida' },
   )
 
-export const stateSchema = z
-  .string()
-  .nonempty('Informe o estado')
-  .refine((value) => value in UF_LIST, {
-    message: 'Selecione um estado válido',
-  })
+export const stateSchema = z.enum(BRAZILIAN_STATES_ENUM, {
+  message: 'Selecione o estado',
+})
 
 export const citySchema = z
   .string()
-  .nonempty('Informe a cidade')
-  .refine((input) => input.trim(), { message: 'Informe a cidade' })
+  .nonempty('Selecione a cidade')
+  .refine((input) => input.trim(), { message: 'Selecione a cidade' })
 
 export const cpfSchema = z
   .string()
-  .nonempty('Informe o CPF')
-  .regex(CPF_REGEX, 'Informe um CPF válido')
+  .nonempty('Insira o CPF')
+  .regex(CPF_REGEX, 'Insira um CPF válido')
 
 export const kinshipSchema = z
   .string()

From c4fe904251a06c664fb1380d09a5558bb0889ac4 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Fri, 13 Feb 2026 18:08:49 -0300
Subject: [PATCH 53/77] refactor(patients): update patient details page

---
 .../pacientes/[id]/informacoes/page.tsx       | 47 +++++++++----------
 .../triagem/seus-dados/patient-data-form.tsx  |  4 +-
 .../appointments/new-appointment-button.tsx   | 20 ++++++--
 src/modules/patients/inactivate-button.tsx    |  9 ++--
 src/modules/referrals/new-referral-button.tsx | 16 ++++++-
 5 files changed, 61 insertions(+), 35 deletions(-)

diff --git a/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx b/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
index de1f9e89..bfe18f10 100644
--- a/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
+++ b/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
@@ -1,9 +1,13 @@
-import { UserRoundIcon } from 'lucide-react'
+import { User2Icon } from 'lucide-react'
 import type { Metadata } from 'next'
-import { redirect } from 'next/navigation'
 
 import { getPatient } from '@/actions/patients/get-patient'
-import { ROUTES } from '@/constants/routes'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
+import { NewAppointmentButton } from '@/modules/appointments/new-appointment-button'
 import { PatientForm } from '@/modules/patients/form'
 import { InactivatePatientButton } from '@/modules/patients/inactivate-button'
 import { NewReferralButton } from '@/modules/referrals/new-referral-button'
@@ -12,19 +16,13 @@ export const metadata: Metadata = {
   title: 'Informações do paciente',
 }
 
-interface PatientHistoryPageParams {
+interface PageParams {
   params: Promise<{ id: string }>
 }
 
-export default async function Page({
-  params,
-}: Readonly<PatientHistoryPageParams>) {
+export default async function Page({ params }: Readonly<PageParams>) {
   const patientId = (await params).id
 
-  if (!patientId) {
-    redirect(ROUTES.dashboard.patients.main)
-  }
-
   const patient = await getPatient(patientId)
 
   if (!patient) {
@@ -35,19 +33,20 @@ export default async function Page({
 
   return (
     <>
-      <header className='mb-3 flex justify-between'>
-        <div className='flex items-center gap-4'>
-          <span className='bg-border/50 rounded-lg p-2'>
-            <UserRoundIcon className='text-primary size-5.5' />
-          </span>
-          <h1 className='text-xl font-medium'>Informações do paciente</h1>
-        </div>
-
-        <div className='flex gap-2'>
-          {isPatientActive && <InactivatePatientButton patient={patient} />}
-          <NewReferralButton id={patient.id} />
-        </div>
-      </header>
+      <SectionHeader className='mb-3'>
+        <SectionHeaderTitle
+          title='Informações do paciente'
+          icon={<User2Icon />}
+        />
+
+        {isPatientActive && (
+          <SectionHeaderActions>
+            <InactivatePatientButton patient={patient} size='sm' />
+            <NewReferralButton patientId={patient.id} size='sm' />
+            <NewAppointmentButton patientId={patient.id} size='sm' />
+          </SectionHeaderActions>
+        )}
+      </SectionHeader>
 
       <PatientForm patient={patient} mode='view' />
     </>
diff --git a/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx b/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
index d8b2dde6..51d71e27 100644
--- a/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
+++ b/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
@@ -37,14 +37,14 @@ export function ScreeningPatientDataForm() {
       state: '',
       phone: '',
       cpf: '',
-    },
+    } as unknown as ScreeningPatientDataFormSchema,
     mode: 'onBlur',
   })
   const { clearErrors, setValue, watch, reset } = formMethods
   const UF = watch('state') as UF
   const cities = useCities(UF)
 
-  function handleSelectState(value: string) {
+  function handleSelectState(value: UF) {
     setValue('state', value)
     setValue('city', '')
     clearErrors('state')
diff --git a/src/modules/appointments/new-appointment-button.tsx b/src/modules/appointments/new-appointment-button.tsx
index 7538c85c..5ef7c187 100644
--- a/src/modules/appointments/new-appointment-button.tsx
+++ b/src/modules/appointments/new-appointment-button.tsx
@@ -1,6 +1,6 @@
 'use client'
 
-import { PlusIcon } from 'lucide-react'
+import { ClipboardPlusIcon } from 'lucide-react'
 import { useState } from 'react'
 
 import { Dialog, DialogTrigger } from '@/components/ui/dialog'
@@ -8,17 +8,29 @@ import { Dialog, DialogTrigger } from '@/components/ui/dialog'
 import type { ButtonProps } from '../../components/ui/button'
 import { AppointmentModal } from './appointment-modal'
 
-export function NewAppointmentButton(props: Readonly<ButtonProps>) {
+interface NewAppointmentButtonProps extends ButtonProps {
+  patientId?: string
+}
+
+export function NewAppointmentButton({
+  patientId,
+  ...props
+}: Readonly<NewAppointmentButtonProps>) {
   const [modalOpen, setModalOpen] = useState(false)
 
   return (
     <Dialog open={modalOpen} onOpenChange={setModalOpen}>
       <DialogTrigger {...props}>
-        <PlusIcon />
+        <ClipboardPlusIcon />
         Novo atendimento
       </DialogTrigger>
 
-      {modalOpen && <AppointmentModal onClose={() => setModalOpen(false)} />}
+      {modalOpen && (
+        <AppointmentModal
+          patientId={patientId}
+          onClose={() => setModalOpen(false)}
+        />
+      )}
     </Dialog>
   )
 }
diff --git a/src/modules/patients/inactivate-button.tsx b/src/modules/patients/inactivate-button.tsx
index e4c34743..66c832d3 100644
--- a/src/modules/patients/inactivate-button.tsx
+++ b/src/modules/patients/inactivate-button.tsx
@@ -3,24 +3,27 @@
 import { UserRoundMinusIcon } from 'lucide-react'
 import { useState } from 'react'
 
+import type { ButtonProps } from '@/components/ui/button'
 import { Dialog, DialogTrigger } from '@/components/ui/dialog'
 import { InactivatePatientModal } from '@/modules/patients/inactivate-modal'
 import type { Patient } from '@/types/patients.d.ts'
 
-interface InactivatePatientButtonProps {
+interface InactivatePatientButtonProps extends ButtonProps {
   patient: Patient
 }
 
 export function InactivatePatientButton({
   patient,
+  variant = 'outline',
+  ...props
 }: Readonly<InactivatePatientButtonProps>) {
   const [isInactivateModalOpen, setInactivateModalOpen] = useState(false)
 
   return (
     <Dialog open={isInactivateModalOpen} onOpenChange={setInactivateModalOpen}>
-      <DialogTrigger variant='outline'>
+      <DialogTrigger variant={variant} {...props}>
         <UserRoundMinusIcon />
-        Inativar paciente
+        Inativar
       </DialogTrigger>
 
       {isInactivateModalOpen && (
diff --git a/src/modules/referrals/new-referral-button.tsx b/src/modules/referrals/new-referral-button.tsx
index 74401f77..92a5057f 100644
--- a/src/modules/referrals/new-referral-button.tsx
+++ b/src/modules/referrals/new-referral-button.tsx
@@ -8,7 +8,14 @@ import { Dialog, DialogTrigger } from '@/components/ui/dialog'
 import type { ButtonProps } from '../../components/ui/button'
 import { ReferralModal } from './referral-modal'
 
-export function NewReferralButton(props: Readonly<ButtonProps>) {
+interface NewReferralButtonProps extends ButtonProps {
+  patientId?: string
+}
+
+export function NewReferralButton({
+  patientId,
+  ...props
+}: Readonly<NewReferralButtonProps>) {
   const [modalOpen, setModalOpen] = useState(false)
 
   return (
@@ -18,7 +25,12 @@ export function NewReferralButton(props: Readonly<ButtonProps>) {
         Encaminhar
       </DialogTrigger>
 
-      {modalOpen && <ReferralModal onClose={() => setModalOpen(false)} />}
+      {modalOpen && (
+        <ReferralModal
+          patientId={patientId}
+          onClose={() => setModalOpen(false)}
+        />
+      )}
     </Dialog>
   )
 }

From bd9fe96e7b7107413b88f679cf6327a0decc45d8 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sat, 14 Feb 2026 00:11:37 -0300
Subject: [PATCH 54/77] feat(patients): add appointments to patient details

---
 .../pacientes/[id]/atendimentos/page.tsx      |   9 +-
 src/components/filters/date.tsx               |   2 +
 src/components/ui/button.tsx                  |   2 +-
 src/enums/patients.ts                         |  18 ++
 src/modules/appointments/table/index.tsx      | 100 ++++++++---
 src/modules/appointments/table/skeleton.tsx   |  35 ----
 .../dashboard/upcoming-appointments-card.tsx  |   2 +-
 src/modules/patients/appointments-list.tsx    | 166 ++++++++++++++++++
 src/types/orders.d.ts                         |   7 +
 9 files changed, 271 insertions(+), 70 deletions(-)
 delete mode 100644 src/modules/appointments/table/skeleton.tsx
 create mode 100644 src/modules/patients/appointments-list.tsx

diff --git a/src/app/(dashboard)/pacientes/[id]/atendimentos/page.tsx b/src/app/(dashboard)/pacientes/[id]/atendimentos/page.tsx
index f3297cac..38b69806 100644
--- a/src/app/(dashboard)/pacientes/[id]/atendimentos/page.tsx
+++ b/src/app/(dashboard)/pacientes/[id]/atendimentos/page.tsx
@@ -1,7 +1,6 @@
 import type { Metadata } from 'next'
-import { redirect } from 'next/navigation'
 
-import { ROUTES } from '@/constants/routes'
+import { PatientAppointmentsList } from '@/modules/patients/appointments-list'
 
 export const metadata: Metadata = {
   title: 'Atendimentos',
@@ -14,9 +13,5 @@ interface PageParams {
 export default async function Page({ params }: Readonly<PageParams>) {
   const patientId = (await params).id
 
-  if (!patientId) {
-    redirect(ROUTES.dashboard.patients.main)
-  }
-
-  return <div>Atendimentos do paciente</div>
+  return <PatientAppointmentsList patientId={patientId} />
 }
diff --git a/src/components/filters/date.tsx b/src/components/filters/date.tsx
index bfdd7673..45d6645d 100644
--- a/src/components/filters/date.tsx
+++ b/src/components/filters/date.tsx
@@ -42,6 +42,7 @@ export function FilterDate({
         <DatePicker
           size='sm'
           value={startDate}
+          placeholder='Selecionar'
           onSelectDate={handleSelectStartDate}
           allowFutureDates={allowFutureDates}
         />
@@ -51,6 +52,7 @@ export function FilterDate({
           size='sm'
           value={endDate}
           onSelectDate={handleSelectEndDate}
+          placeholder='Selecionar'
           startDate={startDate}
           disabled={!startDate}
           allowFutureDates={allowFutureDates}
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index 4480bdc1..403f2d45 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -5,7 +5,7 @@ import { Loader2Icon } from 'lucide-react'
 import { cn } from '@/utils/class-name-merge'
 
 const buttonVariants = cva(
-  'outline-ring flex shrink-0 cursor-pointer items-center justify-center gap-2 rounded-lg font-medium whitespace-nowrap outline-offset-4 transition-colors disabled:pointer-events-none disabled:opacity-50 aria-readonly:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:transition-colors',
+  'outline-ring inline-flex shrink-0 cursor-pointer items-center justify-center gap-2 rounded-lg font-medium whitespace-nowrap outline-offset-4 transition-colors disabled:pointer-events-none disabled:opacity-50 aria-readonly:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:transition-colors',
   {
     variants: {
       variant: {
diff --git a/src/enums/patients.ts b/src/enums/patients.ts
index 9ca7b5d6..3bb7d253 100644
--- a/src/enums/patients.ts
+++ b/src/enums/patients.ts
@@ -111,3 +111,21 @@ export const PATIENTS_ORDERS = {
 export type PatientsOrder = keyof typeof PATIENTS_ORDERS
 
 export const PATIENTS_ORDER_OPTIONS = convertObjectToOptions(PATIENTS_ORDERS)
+
+export const PATIENT_APPOINTMENTS_ORDER = {
+  date_asc: 'Data (Asc.)',
+  date_desc: 'Data (Desc.)',
+  status_asc: 'Status (Asc.)',
+  status_desc: 'Status (Desc.)',
+  category_asc: 'Categoria (Asc.)',
+  category_desc: 'Categoria (Desc.)',
+  condition_asc: 'Quadro geral (Asc.)',
+  condition_desc: 'Quadro geral (Desc.)',
+  professional_asc: 'Profissional (Asc.)',
+  professional_desc: 'Profissional (Desc.)',
+}
+export type PatientAppointmentsOrder = keyof typeof PATIENT_APPOINTMENTS_ORDER
+
+export const PATIENT_APPOINTMENTS_ORDER_OPTIONS = convertObjectToOptions(
+  PATIENT_APPOINTMENTS_ORDER,
+)
diff --git a/src/modules/appointments/table/index.tsx b/src/modules/appointments/table/index.tsx
index ff606b16..9161dcdb 100644
--- a/src/modules/appointments/table/index.tsx
+++ b/src/modules/appointments/table/index.tsx
@@ -1,4 +1,5 @@
 import { Avatar } from '@/components/ui/avatar'
+import { Skeleton } from '@/components/ui/skeleton'
 import {
   Table,
   TableBody,
@@ -18,38 +19,43 @@ import type { Appointment } from '@/types/appointments'
 import { formatDate } from '@/utils/formatters/format-date'
 
 import { AppointmentsTableActions } from './actions'
-import { AppointmentsTableSkeleton } from './skeleton'
+
+type HideAppointmentsColumns = 'name' | 'status'
 
 interface AppointmentsTableProps {
   appointments: Appointment[]
+  hideColumns?: HideAppointmentsColumns[]
   loading?: boolean
 }
 
 export function AppointmentsTable({
   appointments,
+  hideColumns = [],
   loading,
 }: Readonly<AppointmentsTableProps>) {
+  const skeletons = Array.from({ length: 10 }).map((_, index) => index)
+
   const isEmpty = !loading && appointments.length <= 0
+  const showPatientName = !hideColumns.includes('name')
+  const showStatus = !hideColumns.includes('status')
 
   return (
     <Table>
       <TableHeader>
         <TableRow>
-          <TableHead className='w-64'>Paciente</TableHead>
+          {showPatientName && <TableHead className='w-64'>Paciente</TableHead>}
           <TableHead className='w-36'>Data</TableHead>
           <TableHead className='w-48'>Categoria</TableHead>
           <TableHead>Profissional</TableHead>
           <TableHead className='w-36'>Quadro geral</TableHead>
-          <TableHead className='w-36'>Status</TableHead>
+          {showStatus && <TableHead className='w-36'>Status</TableHead>}
           <TableHead className='w-20 text-center'>Ações</TableHead>
         </TableRow>
       </TableHeader>
       <TableBody>
-        {loading && <AppointmentsTableSkeleton />}
-
         {isEmpty && (
           <TableRow>
-            <TableEmptyCell colSpan={6}>
+            <TableEmptyCell colSpan={7}>
               Nenhum atendimento registrado
             </TableEmptyCell>
           </TableRow>
@@ -63,20 +69,24 @@ export function AppointmentsTable({
 
             return (
               <TableRow key={appointment.id}>
-                <TableCell>
-                  <TableLink
-                    className='w-64'
-                    href={ROUTES.dashboard.patients.details.info(
-                      appointment.patient_id,
-                    )}
-                  >
-                    <Avatar
-                      className='size-9'
-                      src={appointment.patient.avatar_url}
-                    />
-                    <span className='truncate'>{appointment.patient.name}</span>
-                  </TableLink>
-                </TableCell>
+                {showPatientName && (
+                  <TableCell>
+                    <TableLink
+                      className='w-64'
+                      href={ROUTES.dashboard.patients.details.info(
+                        appointment.patient_id,
+                      )}
+                    >
+                      <Avatar
+                        className='size-9'
+                        src={appointment.patient.avatar_url}
+                      />
+                      <span className='truncate'>
+                        {appointment.patient.name}
+                      </span>
+                    </TableLink>
+                  </TableCell>
+                )}
                 <TableCell>{formatDate(appointment.date)}</TableCell>
                 <TableCell>
                   <Tag size='sm'>{SPECIALTIES[appointment.category]}</Tag>
@@ -88,17 +98,55 @@ export function AppointmentsTable({
                     {condition.label}
                   </Tag>
                 </TableCell>
-                <TableCell>
-                  <Tag variant={status.variant} size='sm'>
-                    {status.label}
-                  </Tag>
-                </TableCell>
+                {showStatus && (
+                  <TableCell>
+                    <Tag variant={status.variant} size='sm'>
+                      {status.label}
+                    </Tag>
+                  </TableCell>
+                )}
                 <TableCell className='text-center'>
-                  <AppointmentsTableActions appointment={appointment} />
+                  {appointment.status !== 'canceled' && (
+                    <AppointmentsTableActions appointment={appointment} />
+                  )}
                 </TableCell>
               </TableRow>
             )
           })}
+
+        {loading &&
+          skeletons.map((skeleton) => (
+            <TableRow key={skeleton}>
+              {showPatientName && (
+                <TableCell>
+                  <div className='flex w-64 items-center gap-2'>
+                    <Skeleton className='size-9 rounded-full' />
+                    <Skeleton className='h-5 w-44 rounded-md' />
+                  </div>
+                </TableCell>
+              )}
+              <TableCell>
+                <Skeleton className='h-5 w-24 rounded-md' />
+              </TableCell>
+              <TableCell>
+                <Skeleton className='h-6 w-36 rounded-md' />
+              </TableCell>
+              <TableCell>
+                <Skeleton className='h-5 w-40 rounded-md' />
+              </TableCell>
+              <TableCell>
+                <Skeleton className='h-6 w-24 rounded-md' />
+              </TableCell>
+              {showStatus && (
+                <TableCell>
+                  <Skeleton className='h-6 w-28 rounded-md' />
+                </TableCell>
+              )}
+              <TableCell>
+                <Skeleton className='mx-auto size-8 rounded-md' />
+              </TableCell>
+            </TableRow>
+          ))}
       </TableBody>
     </Table>
   )
diff --git a/src/modules/appointments/table/skeleton.tsx b/src/modules/appointments/table/skeleton.tsx
deleted file mode 100644
index f46526a0..00000000
--- a/src/modules/appointments/table/skeleton.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import { Skeleton } from '@/components/ui/skeleton'
-import { TableCell, TableRow } from '@/components/ui/table'
-
-export function AppointmentsTableSkeleton() {
-  const skeletons = Array.from({ length: 10 }).map((_, index) => index)
-
-  return skeletons.map((skeleton) => (
-    <TableRow key={skeleton}>
-      <TableCell>
-        <div className='flex w-64 items-center gap-2'>
-          <Skeleton className='size-9 rounded-full' />
-          <Skeleton className='h-5 w-44 rounded-md' />
-        </div>
-      </TableCell>
-      <TableCell>
-        <Skeleton className='h-5 w-24 rounded-md' />
-      </TableCell>
-      <TableCell>
-        <Skeleton className='h-6 w-36 rounded-md' />
-      </TableCell>
-      <TableCell>
-        <Skeleton className='h-5 w-40 rounded-md' />
-      </TableCell>
-      <TableCell>
-        <Skeleton className='h-6 w-24 rounded-md' />
-      </TableCell>
-      <TableCell>
-        <Skeleton className='h-6 w-28 rounded-md' />
-      </TableCell>
-      <TableCell>
-        <Skeleton className='mx-auto size-8 rounded-md' />
-      </TableCell>
-    </TableRow>
-  ))
-}
diff --git a/src/modules/dashboard/upcoming-appointments-card.tsx b/src/modules/dashboard/upcoming-appointments-card.tsx
index d3346ba8..063b0ed2 100644
--- a/src/modules/dashboard/upcoming-appointments-card.tsx
+++ b/src/modules/dashboard/upcoming-appointments-card.tsx
@@ -53,7 +53,7 @@ export async function DashboardUpcomingAppointmentsCard() {
         </SectionHeaderActions>
       </SectionHeader>
 
-      <AppointmentsTable appointments={appointments} />
+      <AppointmentsTable appointments={appointments} hideColumns={['status']} />
     </Card>
   )
 }
diff --git a/src/modules/patients/appointments-list.tsx b/src/modules/patients/appointments-list.tsx
new file mode 100644
index 00000000..4e57ef2d
--- /dev/null
+++ b/src/modules/patients/appointments-list.tsx
@@ -0,0 +1,166 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query'
+import { ClipboardCheckIcon } from 'lucide-react'
+import { useEffect, useState } from 'react'
+
+import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
+import { FilterContainer } from '@/components/filters/container'
+import { FilterDate } from '@/components/filters/date'
+import { FilterSelect } from '@/components/filters/filter-select'
+import { ShowFilterButton } from '@/components/filters/show-filter-button'
+import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
+import { Card } from '@/components/ui/card'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import {
+  APPOINTMENT_STATUS_OPTIONS,
+  APPOINTMENTS_ORDER_OPTIONS,
+} from '@/enums/appointments'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
+import type { PatientAppointmentsOrder } from '@/enums/patients'
+import { SPECIALTIES_OPTIONS } from '@/enums/shared'
+import { useParams } from '@/hooks/params'
+import { api } from '@/lib/api'
+import { NewAppointmentButton } from '@/modules/appointments/new-appointment-button'
+import { AppointmentsTable } from '@/modules/appointments/table'
+import type { Appointment } from '@/types/appointments'
+import type {
+  PatientAppointmentsOrderBy,
+  QueryOrderMapping,
+} from '@/types/orders'
+
+interface PatientAppointmentsListProps {
+  patientId: string
+}
+
+export function PatientAppointmentsList({
+  patientId,
+}: Readonly<PatientAppointmentsListProps>) {
+  const [showFilters, setShowFilters] = useState(false)
+  const [stableTotal, setStableTotal] = useState(0)
+  const { getParams, paramsQueryKey } = useParams()
+
+  const [page, category, status, orderBy, startDate, endDate] = getParams([
+    QUERY_PARAM_KEYS.page,
+    QUERY_PARAM_KEYS.category,
+    QUERY_PARAM_KEYS.status,
+    QUERY_PARAM_KEYS.orderBy,
+    QUERY_PARAM_KEYS.startDate,
+    QUERY_PARAM_KEYS.endDate,
+  ])
+
+  const ORDER_MAPPING: QueryOrderMapping<
+    PatientAppointmentsOrder,
+    PatientAppointmentsOrderBy
+  > = {
+    date_asc: { orderBy: 'date', order: 'ASC' },
+    date_desc: { orderBy: 'date', order: 'DESC' },
+    status_asc: { orderBy: 'status', order: 'ASC' },
+    status_desc: { orderBy: 'status', order: 'DESC' },
+    category_asc: { orderBy: 'category', order: 'ASC' },
+    category_desc: { orderBy: 'category', order: 'DESC' },
+    condition_asc: { orderBy: 'condition', order: 'ASC' },
+    condition_desc: { orderBy: 'condition', order: 'DESC' },
+    professional_asc: { orderBy: 'professional', order: 'ASC' },
+    professional_desc: { orderBy: 'professional', order: 'DESC' },
+  }
+
+  const orderByQuery =
+    ORDER_MAPPING[orderBy as PatientAppointmentsOrder] ??
+    ORDER_MAPPING['date_asc']
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.appointments.main, patientId, paramsQueryKey],
+    queryFn: () =>
+      api<{ appointments: Appointment[]; total: number }>(
+        `/appointments/${patientId}`,
+        {
+          params: {
+            page,
+            category,
+            status,
+            startDate,
+            endDate,
+            ...orderByQuery,
+          },
+        },
+      ),
+  })
+
+  const appointments = response?.data?.appointments ?? []
+
+  // Update stable total only when we have actual data to prevent pagination flickering
+  useEffect(() => {
+    if (response?.data?.total !== undefined) {
+      setStableTotal(response.data.total)
+    }
+  }, [response?.data?.total])
+
+  useEffect(() => {
+    if (category || startDate || endDate) {
+      setShowFilters(true)
+    }
+  }, [category, startDate, endDate])
+
+  return (
+    <>
+      <SectionHeader>
+        <SectionHeaderTitle
+          title='Atendimentos'
+          icon={<ClipboardCheckIcon />}
+          total={stableTotal}
+        />
+        <SectionHeaderActions>
+          <FilterSelect
+            param={QUERY_PARAM_KEYS.orderBy}
+            options={APPOINTMENTS_ORDER_OPTIONS}
+            placeholder='Ordenar por'
+            resetLabel='Limpar ordem'
+            className='w-52'
+          />
+          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
+
+          <NewAppointmentButton patientId={patientId} size='sm' />
+        </SectionHeaderActions>
+      </SectionHeader>
+
+      {showFilters && (
+        <section className='flex flex-wrap items-end gap-6'>
+          <FilterContainer title='Categoria' className='w-46'>
+            <FilterSelect
+              param={QUERY_PARAM_KEYS.category}
+              options={SPECIALTIES_OPTIONS}
+              placeholder='Todas'
+              resetLabel='Limpar categoria'
+            />
+          </FilterContainer>
+          <FilterContainer title='Status' className='w-46'>
+            <FilterSelect
+              param={QUERY_PARAM_KEYS.status}
+              options={APPOINTMENT_STATUS_OPTIONS}
+              placeholder='Todos'
+              resetLabel='Limpar status'
+            />
+          </FilterContainer>
+          <FilterDate allowFutureDates />
+          <ClearFiltersButton />
+        </section>
+      )}
+
+      <Card className='p-6'>
+        <AppointmentsTable
+          appointments={appointments}
+          hideColumns={['name']}
+          loading={isLoading}
+        />
+      </Card>
+
+      <Pagination totalItems={stableTotal} />
+    </>
+  )
+}
diff --git a/src/types/orders.d.ts b/src/types/orders.d.ts
index 3ec5bdaf..cce3b9b4 100644
--- a/src/types/orders.d.ts
+++ b/src/types/orders.d.ts
@@ -11,6 +11,13 @@ export type InvitesOrderBy = 'email' | 'date'
 
 export type PatientsOrderBy = 'name' | 'email' | 'status' | 'date'
 
+export type PatientAppointmentsOrderBy =
+  | 'date'
+  | 'status'
+  | 'category'
+  | 'condition'
+  | 'professional'
+
 export type AppointmentsOrderBy =
   | 'date'
   | 'patient'

From 174f4b8c1ff0020d6060d4fb70a522a5cb4e16f3 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sat, 14 Feb 2026 00:15:50 -0300
Subject: [PATCH 55/77] fix(patients): fix patient appointments request
 endpoint

---
 src/modules/patients/appointments-list.tsx | 22 ++++++++++------------
 1 file changed, 10 insertions(+), 12 deletions(-)

diff --git a/src/modules/patients/appointments-list.tsx b/src/modules/patients/appointments-list.tsx
index 4e57ef2d..b7f5d306 100644
--- a/src/modules/patients/appointments-list.tsx
+++ b/src/modules/patients/appointments-list.tsx
@@ -77,19 +77,17 @@ export function PatientAppointmentsList({
   const { data: response, isLoading } = useQuery({
     queryKey: [QUERY_CACHE_KEYS.appointments.main, patientId, paramsQueryKey],
     queryFn: () =>
-      api<{ appointments: Appointment[]; total: number }>(
-        `/appointments/${patientId}`,
-        {
-          params: {
-            page,
-            category,
-            status,
-            startDate,
-            endDate,
-            ...orderByQuery,
-          },
+      api<{ appointments: Appointment[]; total: number }>(`/appointments`, {
+        params: {
+          patientId,
+          page,
+          category,
+          status,
+          startDate,
+          endDate,
+          ...orderByQuery,
         },
-      ),
+      }),
   })
 
   const appointments = response?.data?.appointments ?? []

From 11fd834706d0b9c72954c627aa4e279ba8bb3c77 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sat, 14 Feb 2026 00:25:28 -0300
Subject: [PATCH 56/77] feat(patients): add referrals to patient details

---
 .../pacientes/[id]/encaminhamentos/page.tsx   |   9 +-
 src/app/(dashboard)/pacientes/page.tsx        |   2 +-
 src/enums/patients.ts                         |  18 ++
 .../patients/{list.tsx => patients-list.tsx}  |   0
 src/modules/patients/referrals-list.tsx       | 160 ++++++++++++++++++
 src/modules/referrals/table/index.tsx         |  79 ++++++---
 src/modules/referrals/table/skeleton.tsx      |  35 ----
 src/types/orders.d.ts                         |   7 +
 8 files changed, 248 insertions(+), 62 deletions(-)
 rename src/modules/patients/{list.tsx => patients-list.tsx} (100%)
 create mode 100644 src/modules/patients/referrals-list.tsx
 delete mode 100644 src/modules/referrals/table/skeleton.tsx

diff --git a/src/app/(dashboard)/pacientes/[id]/encaminhamentos/page.tsx b/src/app/(dashboard)/pacientes/[id]/encaminhamentos/page.tsx
index ac65867a..43e138b6 100644
--- a/src/app/(dashboard)/pacientes/[id]/encaminhamentos/page.tsx
+++ b/src/app/(dashboard)/pacientes/[id]/encaminhamentos/page.tsx
@@ -1,7 +1,6 @@
 import type { Metadata } from 'next'
-import { redirect } from 'next/navigation'
 
-import { ROUTES } from '@/constants/routes'
+import { PatientReferralsList } from '@/modules/patients/referrals-list'
 
 export const metadata: Metadata = {
   title: 'Encaminhamentos',
@@ -14,9 +13,5 @@ interface PageParams {
 export default async function Page({ params }: Readonly<PageParams>) {
   const patientId = (await params).id
 
-  if (!patientId) {
-    redirect(ROUTES.dashboard.patients.main)
-  }
-
-  return <div>Encaminhamentos do paciente</div>
+  return <PatientReferralsList patientId={patientId} />
 }
diff --git a/src/app/(dashboard)/pacientes/page.tsx b/src/app/(dashboard)/pacientes/page.tsx
index 94e76b1a..9e7f2b3d 100644
--- a/src/app/(dashboard)/pacientes/page.tsx
+++ b/src/app/(dashboard)/pacientes/page.tsx
@@ -1,6 +1,6 @@
 import type { Metadata } from 'next'
 
-import { PatientsList } from '@/modules/patients/list'
+import { PatientsList } from '@/modules/patients/patients-list'
 
 export const metadata: Metadata = {
   title: 'Pacientes',
diff --git a/src/enums/patients.ts b/src/enums/patients.ts
index 3bb7d253..e2a7d6cc 100644
--- a/src/enums/patients.ts
+++ b/src/enums/patients.ts
@@ -129,3 +129,21 @@ export type PatientAppointmentsOrder = keyof typeof PATIENT_APPOINTMENTS_ORDER
 export const PATIENT_APPOINTMENTS_ORDER_OPTIONS = convertObjectToOptions(
   PATIENT_APPOINTMENTS_ORDER,
 )
+
+export const PATIENT_REFERRALS_ORDER = {
+  date_asc: 'Data (Asc.)',
+  date_desc: 'Data (Desc.)',
+  status_asc: 'Status (Asc.)',
+  status_desc: 'Status (Desc.)',
+  category_asc: 'Categoria (Asc.)',
+  category_desc: 'Categoria (Desc.)',
+  condition_asc: 'Quadro geral (Asc.)',
+  condition_desc: 'Quadro geral (Desc.)',
+  professional_asc: 'Profissional (Asc.)',
+  professional_desc: 'Profissional (Desc.)',
+}
+export type PatientReferralsOrder = keyof typeof PATIENT_REFERRALS_ORDER
+
+export const PATIENT_REFERRALS_ORDER_OPTIONS = convertObjectToOptions(
+  PATIENT_REFERRALS_ORDER,
+)
diff --git a/src/modules/patients/list.tsx b/src/modules/patients/patients-list.tsx
similarity index 100%
rename from src/modules/patients/list.tsx
rename to src/modules/patients/patients-list.tsx
diff --git a/src/modules/patients/referrals-list.tsx b/src/modules/patients/referrals-list.tsx
new file mode 100644
index 00000000..3f02b9a3
--- /dev/null
+++ b/src/modules/patients/referrals-list.tsx
@@ -0,0 +1,160 @@
+'use client'
+
+import { useQuery } from '@tanstack/react-query'
+import { ClipboardPasteIcon } from 'lucide-react'
+import { useEffect, useState } from 'react'
+
+import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
+import { FilterContainer } from '@/components/filters/container'
+import { FilterDate } from '@/components/filters/date'
+import { FilterSelect } from '@/components/filters/filter-select'
+import { ShowFilterButton } from '@/components/filters/show-filter-button'
+import { Pagination } from '@/components/pagination'
+import {
+  SectionHeader,
+  SectionHeaderActions,
+  SectionHeaderTitle,
+} from '@/components/section-header'
+import { Card } from '@/components/ui/card'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { QUERY_PARAM_KEYS } from '@/enums/params'
+import type { PatientReferralsOrder } from '@/enums/patients'
+import {
+  REFERRAL_STATUS_OPTIONS,
+  REFERRALS_ORDER_OPTIONS,
+} from '@/enums/referrals'
+import { SPECIALTIES_OPTIONS } from '@/enums/shared'
+import { useParams } from '@/hooks/params'
+import { api } from '@/lib/api'
+import { NewReferralButton } from '@/modules/referrals/new-referral-button'
+import { ReferralsTable } from '@/modules/referrals/table'
+import type { PatientReferralsOrderBy, QueryOrderMapping } from '@/types/orders'
+import type { Referral } from '@/types/referrals'
+
+interface PatientReferralsListProps {
+  patientId: string
+}
+
+export function PatientReferralsList({
+  patientId,
+}: Readonly<PatientReferralsListProps>) {
+  const [showFilters, setShowFilters] = useState(false)
+  const [stableTotal, setStableTotal] = useState(0)
+  const { getParams, paramsQueryKey } = useParams()
+
+  const [page, category, status, orderBy, startDate, endDate] = getParams([
+    QUERY_PARAM_KEYS.page,
+    QUERY_PARAM_KEYS.category,
+    QUERY_PARAM_KEYS.status,
+    QUERY_PARAM_KEYS.orderBy,
+    QUERY_PARAM_KEYS.startDate,
+    QUERY_PARAM_KEYS.endDate,
+  ])
+
+  const ORDER_MAPPING: QueryOrderMapping<
+    PatientReferralsOrder,
+    PatientReferralsOrderBy
+  > = {
+    date_asc: { orderBy: 'date', order: 'ASC' },
+    date_desc: { orderBy: 'date', order: 'DESC' },
+    status_asc: { orderBy: 'status', order: 'ASC' },
+    status_desc: { orderBy: 'status', order: 'DESC' },
+    category_asc: { orderBy: 'category', order: 'ASC' },
+    category_desc: { orderBy: 'category', order: 'DESC' },
+    condition_asc: { orderBy: 'condition', order: 'ASC' },
+    condition_desc: { orderBy: 'condition', order: 'DESC' },
+    professional_asc: { orderBy: 'professional', order: 'ASC' },
+    professional_desc: { orderBy: 'professional', order: 'DESC' },
+  }
+
+  const orderByQuery =
+    ORDER_MAPPING[orderBy as PatientReferralsOrder] ?? ORDER_MAPPING['date_asc']
+
+  const { data: response, isLoading } = useQuery({
+    queryKey: [QUERY_CACHE_KEYS.referrals.main, patientId, paramsQueryKey],
+    queryFn: () =>
+      api<{ referrals: Referral[]; total: number }>(`/referrals`, {
+        params: {
+          patientId,
+          page,
+          category,
+          status,
+          startDate,
+          endDate,
+          ...orderByQuery,
+        },
+      }),
+  })
+
+  const referrals = response?.data?.referrals ?? []
+
+  // Update stable total only when we have actual data to prevent pagination flickering
+  useEffect(() => {
+    if (response?.data?.total !== undefined) {
+      setStableTotal(response.data.total)
+    }
+  }, [response?.data?.total])
+
+  useEffect(() => {
+    if (category || startDate || endDate) {
+      setShowFilters(true)
+    }
+  }, [category, startDate, endDate])
+
+  return (
+    <>
+      <SectionHeader>
+        <SectionHeaderTitle
+          title='Encaminhamentos'
+          icon={<ClipboardPasteIcon />}
+          total={stableTotal}
+        />
+        <SectionHeaderActions>
+          <FilterSelect
+            param={QUERY_PARAM_KEYS.orderBy}
+            options={REFERRALS_ORDER_OPTIONS}
+            placeholder='Ordenar por'
+            resetLabel='Limpar ordem'
+            className='w-52'
+          />
+          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
+
+          <NewReferralButton patientId={patientId} size='sm' />
+        </SectionHeaderActions>
+      </SectionHeader>
+
+      {showFilters && (
+        <section className='flex flex-wrap items-end gap-6'>
+          <FilterContainer title='Categoria' className='w-46'>
+            <FilterSelect
+              param={QUERY_PARAM_KEYS.category}
+              options={SPECIALTIES_OPTIONS}
+              placeholder='Todas'
+              resetLabel='Limpar categoria'
+            />
+          </FilterContainer>
+          <FilterContainer title='Status' className='w-46'>
+            <FilterSelect
+              param={QUERY_PARAM_KEYS.status}
+              options={REFERRAL_STATUS_OPTIONS}
+              placeholder='Todos'
+              resetLabel='Limpar status'
+            />
+          </FilterContainer>
+          <FilterDate allowFutureDates />
+          <ClearFiltersButton />
+        </section>
+      )}
+
+      <Card className='p-6'>
+        <ReferralsTable
+          referrals={referrals}
+          hideColumns={['name']}
+          loading={isLoading}
+        />
+      </Card>
+
+      <Pagination totalItems={stableTotal} />
+    </>
+  )
+}
diff --git a/src/modules/referrals/table/index.tsx b/src/modules/referrals/table/index.tsx
index 0e42bfad..18da206a 100644
--- a/src/modules/referrals/table/index.tsx
+++ b/src/modules/referrals/table/index.tsx
@@ -1,4 +1,5 @@
 import { Avatar } from '@/components/ui/avatar'
+import { Skeleton } from '@/components/ui/skeleton'
 import {
   Table,
   TableBody,
@@ -18,24 +19,30 @@ import type { Referral } from '@/types/referrals'
 import { formatDate } from '@/utils/formatters/format-date'
 
 import { ReferralsTableActions } from './actions'
-import { ReferralsTableSkeleton } from './skeleton'
+
+type HideReferralsColumns = 'name'
 
 interface ReferralsTableProps {
   referrals: Referral[]
+  hideColumns?: HideReferralsColumns[]
   loading?: boolean
 }
 
 export function ReferralsTable({
   referrals,
+  hideColumns = [],
   loading,
 }: Readonly<ReferralsTableProps>) {
+  const skeletons = Array.from({ length: 10 }).map((_, index) => index)
+
   const isEmpty = !loading && referrals.length <= 0
+  const showPatientName = !hideColumns.includes('name')
 
   return (
     <Table>
       <TableHeader>
         <TableRow>
-          <TableHead className='w-64'>Paciente</TableHead>
+          {showPatientName && <TableHead className='w-64'>Paciente</TableHead>}
           <TableHead className='w-36'>Data</TableHead>
           <TableHead className='w-48'>Categoria</TableHead>
           <TableHead>Profissional</TableHead>
@@ -45,8 +52,6 @@ export function ReferralsTable({
         </TableRow>
       </TableHeader>
       <TableBody>
-        {loading && <ReferralsTableSkeleton />}
-
         {isEmpty && (
           <TableRow>
             <TableEmptyCell colSpan={6}>
@@ -63,20 +68,22 @@ export function ReferralsTable({
 
             return (
               <TableRow key={referral.id}>
-                <TableCell>
-                  <TableLink
-                    className='w-64'
-                    href={ROUTES.dashboard.patients.details.info(
-                      referral.patient_id,
-                    )}
-                  >
-                    <Avatar
-                      className='size-9'
-                      src={referral.patient.avatar_url}
-                    />
-                    <span className='truncate'>{referral.patient.name}</span>
-                  </TableLink>
-                </TableCell>
+                {showPatientName && (
+                  <TableCell>
+                    <TableLink
+                      className='w-64'
+                      href={ROUTES.dashboard.patients.details.info(
+                        referral.patient_id,
+                      )}
+                    >
+                      <Avatar
+                        className='size-9'
+                        src={referral.patient.avatar_url}
+                      />
+                      <span className='truncate'>{referral.patient.name}</span>
+                    </TableLink>
+                  </TableCell>
+                )}
                 <TableCell>{formatDate(referral.date)}</TableCell>
                 <TableCell>
                   <Tag size='sm'>{SPECIALTIES[referral.category]}</Tag>
@@ -94,11 +101,45 @@ export function ReferralsTable({
                   </Tag>
                 </TableCell>
                 <TableCell className='text-center'>
-                  <ReferralsTableActions referral={referral} />
+                  {referral.status !== 'canceled' && (
+                    <ReferralsTableActions referral={referral} />
+                  )}
                 </TableCell>
               </TableRow>
             )
           })}
+
+        {loading &&
+          skeletons.map((skeleton) => (
+            <TableRow key={skeleton}>
+              {showPatientName && (
+                <TableCell>
+                  <div className='flex w-64 items-center gap-2'>
+                    <Skeleton className='size-9 rounded-full' />
+                    <Skeleton className='h-5 w-44 rounded-md' />
+                  </div>
+                </TableCell>
+              )}
+              <TableCell>
+                <Skeleton className='h-5 w-24 rounded-md' />
+              </TableCell>
+              <TableCell>
+                <Skeleton className='h-6 w-36 rounded-md' />
+              </TableCell>
+              <TableCell>
+                <Skeleton className='h-5 w-40 rounded-md' />
+              </TableCell>
+              <TableCell>
+                <Skeleton className='h-6 w-24 rounded-md' />
+              </TableCell>
+              <TableCell>
+                <Skeleton className='h-6 w-28 rounded-md' />
+              </TableCell>
+              <TableCell>
+                <Skeleton className='mx-auto size-8 rounded-md' />
+              </TableCell>
+            </TableRow>
+          ))}
       </TableBody>
     </Table>
   )
diff --git a/src/modules/referrals/table/skeleton.tsx b/src/modules/referrals/table/skeleton.tsx
deleted file mode 100644
index 762f42a4..00000000
--- a/src/modules/referrals/table/skeleton.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import { Skeleton } from '@/components/ui/skeleton'
-import { TableCell, TableRow } from '@/components/ui/table'
-
-export function ReferralsTableSkeleton() {
-  const skeletons = Array.from({ length: 10 }).map((_, index) => index)
-
-  return skeletons.map((skeleton) => (
-    <TableRow key={skeleton}>
-      <TableCell>
-        <div className='flex w-64 items-center gap-2'>
-          <Skeleton className='size-9 rounded-full' />
-          <Skeleton className='h-5 w-44 rounded-md' />
-        </div>
-      </TableCell>
-      <TableCell>
-        <Skeleton className='h-5 w-24 rounded-md' />
-      </TableCell>
-      <TableCell>
-        <Skeleton className='h-6 w-36 rounded-md' />
-      </TableCell>
-      <TableCell>
-        <Skeleton className='h-5 w-40 rounded-md' />
-      </TableCell>
-      <TableCell>
-        <Skeleton className='h-6 w-24 rounded-md' />
-      </TableCell>
-      <TableCell>
-        <Skeleton className='h-6 w-28 rounded-md' />
-      </TableCell>
-      <TableCell>
-        <Skeleton className='mx-auto size-8 rounded-md' />
-      </TableCell>
-    </TableRow>
-  ))
-}
diff --git a/src/types/orders.d.ts b/src/types/orders.d.ts
index cce3b9b4..504ee502 100644
--- a/src/types/orders.d.ts
+++ b/src/types/orders.d.ts
@@ -18,6 +18,13 @@ export type PatientAppointmentsOrderBy =
   | 'condition'
   | 'professional'
 
+export type PatientReferralsOrderBy =
+  | 'date'
+  | 'status'
+  | 'category'
+  | 'condition'
+  | 'professional'
+
 export type AppointmentsOrderBy =
   | 'date'
   | 'patient'

From 61aa17cb2b219cd0460a16b34d5827f854ddfcfe Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sat, 14 Feb 2026 00:37:07 -0300
Subject: [PATCH 57/77] feat(patients): add breadcrumbs for appointments and
 referrals

---
 src/constants/breadcrumbs/dashboard.ts | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/constants/breadcrumbs/dashboard.ts b/src/constants/breadcrumbs/dashboard.ts
index 2aee2a8d..047c1c3e 100644
--- a/src/constants/breadcrumbs/dashboard.ts
+++ b/src/constants/breadcrumbs/dashboard.ts
@@ -38,6 +38,16 @@ export const DASHBOARD_BREADCRUMBS: Breadcrumbs = {
       name: 'Documentos',
       path: ROUTES.dashboard.patients.main,
     },
+    atendimentos: {
+      icon: ClipboardCheckIcon,
+      name: 'Atendimentos do paciente',
+      path: ROUTES.dashboard.patients.main,
+    },
+    encaminhamentos: {
+      icon: ClipboardPasteIcon,
+      name: 'Encaminhamentos do paciente',
+      path: ROUTES.dashboard.patients.main,
+    },
     cadastrar: {
       icon: UserRoundPlusIcon,
       name: 'Cadastrar novo paciente',

From 811bc5d8fa51d5fd6cb9f666c9949403f80e2d88 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sat, 14 Feb 2026 23:16:26 -0300
Subject: [PATCH 58/77] feat(patients): create patient history page

---
 .../get-total-appointments-by-category.ts     | 51 ++++++++++
 .../statistics/get-total-appointments.ts      |  1 +
 .../get-total-referrals-by-category.ts        | 48 ++++++++++
 src/actions/statistics/get-total-referrals.ts |  1 +
 .../pacientes/[id]/historico/loading.tsx      | 34 +++++++
 .../pacientes/[id]/historico/page.tsx         | 96 +++++++++++++++++--
 .../pacientes/[id]/informacoes/loading.tsx    |  5 +
 .../pacientes/[id]/informacoes/page.tsx       |  4 +-
 src/components/ui/page-loader.tsx             | 14 +++
 src/constants/cache.ts                        |  8 ++
 10 files changed, 255 insertions(+), 7 deletions(-)
 create mode 100644 src/actions/statistics/get-total-appointments-by-category.ts
 create mode 100644 src/actions/statistics/get-total-referrals-by-category.ts
 create mode 100644 src/app/(dashboard)/pacientes/[id]/historico/loading.tsx
 create mode 100644 src/app/(dashboard)/pacientes/[id]/informacoes/loading.tsx
 create mode 100644 src/components/ui/page-loader.tsx

diff --git a/src/actions/statistics/get-total-appointments-by-category.ts b/src/actions/statistics/get-total-appointments-by-category.ts
new file mode 100644
index 00000000..3fe0d90a
--- /dev/null
+++ b/src/actions/statistics/get-total-appointments-by-category.ts
@@ -0,0 +1,51 @@
+'use server'
+
+import { DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS } from '@/config/cache'
+import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import type { QueryPeriod } from '@/enums/queries'
+import type { Specialty } from '@/enums/shared'
+import { api } from '@/lib/api'
+
+type GetTotalAppointmentsByCategoryParams = {
+  period?: QueryPeriod
+  patientId?: string
+}
+
+interface GetTotalAppointmentsByCategoryProps {
+  params?: GetTotalAppointmentsByCategoryParams
+  cacheKey?: string
+}
+
+export async function getTotalAppointmentsByCategory({
+  params,
+  cacheKey,
+}: GetTotalAppointmentsByCategoryProps = {}) {
+  try {
+    const response = await api<{
+      categories: Array<{ category: Specialty; total: number }>
+      total: number
+    }>('/statistics/appointments/by-category', {
+      includeCookies: true,
+      cache: 'force-cache',
+      params,
+      next: {
+        revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
+        tags: cacheKey
+          ? [
+              NEXT_CACHE_TAGS.statistics.totalAppointmentsByCategory.main,
+              cacheKey,
+            ]
+          : [NEXT_CACHE_TAGS.statistics.totalAppointmentsByCategory.main],
+      },
+    })
+
+    if (!response.data) {
+      return null
+    }
+
+    return response.data
+  } catch (error) {
+    console.error('Failed to fetch total appointments by category:', error)
+    return null
+  }
+}
diff --git a/src/actions/statistics/get-total-appointments.ts b/src/actions/statistics/get-total-appointments.ts
index 1be47bc0..e585ce49 100644
--- a/src/actions/statistics/get-total-appointments.ts
+++ b/src/actions/statistics/get-total-appointments.ts
@@ -7,6 +7,7 @@ import { api } from '@/lib/api'
 
 type GetTotalAppointmentsParams = {
   period?: QueryPeriod
+  patientId?: string
 }
 
 interface GetTotalAppointmentsProps {
diff --git a/src/actions/statistics/get-total-referrals-by-category.ts b/src/actions/statistics/get-total-referrals-by-category.ts
new file mode 100644
index 00000000..1e84e75f
--- /dev/null
+++ b/src/actions/statistics/get-total-referrals-by-category.ts
@@ -0,0 +1,48 @@
+'use server'
+
+import { DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS } from '@/config/cache'
+import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import type { QueryPeriod } from '@/enums/queries'
+import type { Specialty } from '@/enums/shared'
+import { api } from '@/lib/api'
+
+type GetTotalReferralsByCategoryParams = {
+  period?: QueryPeriod
+  patientId?: string
+}
+
+interface GetTotalReferralsByCategoryProps {
+  params?: GetTotalReferralsByCategoryParams
+  cacheKey?: string
+}
+
+export async function getTotalReferralsByCategory({
+  params,
+  cacheKey,
+}: GetTotalReferralsByCategoryProps = {}) {
+  try {
+    const response = await api<{
+      categories: Array<{ category: Specialty; total: number }>
+      total: number
+    }>('/statistics/referrals/by-category', {
+      includeCookies: true,
+      cache: 'force-cache',
+      params,
+      next: {
+        revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
+        tags: cacheKey
+          ? [NEXT_CACHE_TAGS.statistics.totalReferralsByCategory.main, cacheKey]
+          : [NEXT_CACHE_TAGS.statistics.totalReferralsByCategory.main],
+      },
+    })
+
+    if (!response.data) {
+      return null
+    }
+
+    return response.data
+  } catch (error) {
+    console.error('Failed to fetch total referrals by category:', error)
+    return null
+  }
+}
diff --git a/src/actions/statistics/get-total-referrals.ts b/src/actions/statistics/get-total-referrals.ts
index 828a7ee1..c82540d4 100644
--- a/src/actions/statistics/get-total-referrals.ts
+++ b/src/actions/statistics/get-total-referrals.ts
@@ -7,6 +7,7 @@ import { api } from '@/lib/api'
 
 type GetTotalReferralsParams = {
   period?: QueryPeriod
+  patientId?: string
 }
 
 interface GetTotalReferralsProps {
diff --git a/src/app/(dashboard)/pacientes/[id]/historico/loading.tsx b/src/app/(dashboard)/pacientes/[id]/historico/loading.tsx
new file mode 100644
index 00000000..07b3e8f7
--- /dev/null
+++ b/src/app/(dashboard)/pacientes/[id]/historico/loading.tsx
@@ -0,0 +1,34 @@
+import {
+  ChartBarDecreasingIcon,
+  ClipboardCheckIcon,
+  ClipboardPasteIcon,
+} from 'lucide-react'
+
+import { DashboardCardChart } from '@/components/dashboard/cards/chart'
+import { SummaryCard } from '@/components/summary-card'
+import { Skeleton } from '@/components/ui/skeleton'
+
+export default function Loading() {
+  return (
+    <div className='grid gap-6 sm:grid-cols-2'>
+      <SummaryCard icon={ClipboardCheckIcon} label='Atendimentos' loading />
+      <SummaryCard icon={ClipboardPasteIcon} label='Encaminhamentos' loading />
+      <DashboardCardChart
+        title='Atendimentos por categoria'
+        icon={ChartBarDecreasingIcon}
+      >
+        <div className='flex h-full min-h-60 items-center justify-center'>
+          <Skeleton className='size-full rounded-xl' />
+        </div>
+      </DashboardCardChart>
+      <DashboardCardChart
+        title='Encaminhamentos por categoria'
+        icon={ChartBarDecreasingIcon}
+      >
+        <div className='flex h-full min-h-60 items-center justify-center'>
+          <Skeleton className='size-full rounded-xl' />
+        </div>
+      </DashboardCardChart>
+    </div>
+  )
+}
diff --git a/src/app/(dashboard)/pacientes/[id]/historico/page.tsx b/src/app/(dashboard)/pacientes/[id]/historico/page.tsx
index 616563f2..3beea3a6 100644
--- a/src/app/(dashboard)/pacientes/[id]/historico/page.tsx
+++ b/src/app/(dashboard)/pacientes/[id]/historico/page.tsx
@@ -1,7 +1,18 @@
+import {
+  ChartBarDecreasingIcon,
+  ClipboardCheckIcon,
+  ClipboardPasteIcon,
+} from 'lucide-react'
 import type { Metadata } from 'next'
-import { redirect } from 'next/navigation'
 
-import { ROUTES } from '@/constants/routes'
+import { getTotalAppointments } from '@/actions/statistics/get-total-appointments'
+import { getTotalAppointmentsByCategory } from '@/actions/statistics/get-total-appointments-by-category'
+import { getTotalReferrals } from '@/actions/statistics/get-total-referrals'
+import { getTotalReferralsByCategory } from '@/actions/statistics/get-total-referrals-by-category'
+import { BarChart } from '@/components/charts/bar'
+import { DashboardCardChart } from '@/components/dashboard/cards/chart'
+import { SummaryCard } from '@/components/summary-card'
+import { SPECIALTIES } from '@/enums/shared'
 
 export const metadata: Metadata = {
   title: 'Histórico',
@@ -16,9 +27,82 @@ export default async function Page({
 }: Readonly<PatientHistoryPageParams>) {
   const patientId = (await params).id
 
-  if (!patientId) {
-    redirect(ROUTES.dashboard.patients.main)
-  }
+  const actionParams = { params: { patientId } }
 
-  return <div>Histórico do paciente</div>
+  const [
+    totalAppointments,
+    totalAppointmentsByCategory,
+    totalReferrals,
+    totalReferralsByCategory,
+  ] = await Promise.all([
+    getTotalAppointments(actionParams),
+    getTotalAppointmentsByCategory(actionParams),
+    getTotalReferrals(actionParams),
+    getTotalReferralsByCategory(actionParams),
+  ])
+
+  const totalAppointmentCategories =
+    totalAppointmentsByCategory?.categories ?? []
+  const totalAppointmentsByCategoryValues = totalAppointmentCategories.map(
+    (item) => ({
+      label: SPECIALTIES[item.category],
+      value: Number(item.total),
+    }),
+  )
+
+  const totalReferralCategories = totalReferralsByCategory?.categories ?? []
+  const totalReferralsByCategoryValues = totalReferralCategories.map(
+    (item) => ({
+      label: SPECIALTIES[item.category],
+      value: Number(item.total),
+    }),
+  )
+
+  return (
+    <div className='grid gap-6 sm:grid-cols-2'>
+      <SummaryCard
+        icon={ClipboardCheckIcon}
+        label='Atendimentos'
+        value={totalAppointments?.total}
+      />
+      <SummaryCard
+        icon={ClipboardPasteIcon}
+        label='Encaminhamentos'
+        value={totalReferrals?.total}
+      />
+
+      <DashboardCardChart
+        title='Atendimentos por categoria'
+        icon={ChartBarDecreasingIcon}
+      >
+        <div className='flex h-full min-h-60 items-center justify-center'>
+          {totalAppointmentsByCategoryValues.length > 0 ? (
+            <div className='size-full min-h-40'>
+              <BarChart data={totalAppointmentsByCategoryValues} />
+            </div>
+          ) : (
+            <p className='text-foreground-soft text-sm'>
+              Nenhum atendimento registrado.
+            </p>
+          )}
+        </div>
+      </DashboardCardChart>
+      <DashboardCardChart
+        title='Encaminhamentos por categoria'
+        icon={ChartBarDecreasingIcon}
+      >
+        <div className='flex h-full min-h-60 items-center justify-center'>
+          {totalReferralsByCategoryValues.length > 0 ? (
+            <div className='size-full min-h-40'>
+              <BarChart data={totalReferralsByCategoryValues} />
+            </div>
+          ) : (
+            <p className='text-foreground-soft text-sm'>
+              Nenhum atendimento registrado.
+            </p>
+          )}
+        </div>
+      </DashboardCardChart>
+    </div>
+  )
 }
diff --git a/src/app/(dashboard)/pacientes/[id]/informacoes/loading.tsx b/src/app/(dashboard)/pacientes/[id]/informacoes/loading.tsx
new file mode 100644
index 00000000..3dd0f40e
--- /dev/null
+++ b/src/app/(dashboard)/pacientes/[id]/informacoes/loading.tsx
@@ -0,0 +1,5 @@
+import { PageLoader } from '@/components/ui/page-loader'
+
+export default function Loading() {
+  return <PageLoader text='Carregando informações do paciente...' />
+}
diff --git a/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx b/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
index bfe18f10..7b1936c2 100644
--- a/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
+++ b/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
@@ -1,5 +1,6 @@
 import { User2Icon } from 'lucide-react'
 import type { Metadata } from 'next'
+import { redirect } from 'next/navigation'
 
 import { getPatient } from '@/actions/patients/get-patient'
 import {
@@ -7,6 +8,7 @@ import {
   SectionHeaderActions,
   SectionHeaderTitle,
 } from '@/components/section-header'
+import { ROUTES } from '@/constants/routes'
 import { NewAppointmentButton } from '@/modules/appointments/new-appointment-button'
 import { PatientForm } from '@/modules/patients/form'
 import { InactivatePatientButton } from '@/modules/patients/inactivate-button'
@@ -26,7 +28,7 @@ export default async function Page({ params }: Readonly<PageParams>) {
   const patient = await getPatient(patientId)
 
   if (!patient) {
-    return <p>Paciente não encontrado</p>
+    redirect(ROUTES.dashboard.patients.main)
   }
 
   const isPatientActive = patient.status === 'active'
diff --git a/src/components/ui/page-loader.tsx b/src/components/ui/page-loader.tsx
new file mode 100644
index 00000000..0d84247d
--- /dev/null
+++ b/src/components/ui/page-loader.tsx
@@ -0,0 +1,14 @@
+import { Loader2Icon } from 'lucide-react'
+
+interface PageLoaderProps {
+  text: string
+}
+
+export function PageLoader({ text }: Readonly<PageLoaderProps>) {
+  return (
+    <div className='flex flex-1 animate-pulse flex-col items-center justify-center gap-3'>
+      <Loader2Icon className='size-10 animate-spin' />
+      <span>{text}</span>
+    </div>
+  )
+}
diff --git a/src/constants/cache.ts b/src/constants/cache.ts
index ed822b85..bfddd160 100644
--- a/src/constants/cache.ts
+++ b/src/constants/cache.ts
@@ -14,6 +14,10 @@ export const NEXT_CACHE_TAGS = {
       main: 'total-appointments',
       query: (query: string) => `total-appointments/${query}`,
     },
+    totalAppointmentsByCategory: {
+      main: 'total-appointments-by-category',
+      query: (query: string) => `total-appointments-by-category/${query}`,
+    },
     totalPatients: {
       main: 'total-patients',
       query: (query: string) => `total-patients/${query}`,
@@ -30,6 +34,10 @@ export const NEXT_CACHE_TAGS = {
       main: 'total-referrals',
       query: (query: string) => `total-referrals/${query}`,
     },
+    totalReferralsByCategory: {
+      main: 'total-referrals-by-category',
+      query: (query: string) => `total-referrals-by-category/${query}`,
+    },
   },
 }
 

From add32f0a28c58e3843f60468df2a97eddd3ddb2e Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sun, 15 Feb 2026 23:52:24 -0300
Subject: [PATCH 59/77] chore(patients): rename deactivate patient modal to fix
 typo

---
 src/components/ui/dialog.tsx                  | 23 +++++++------
 ...ivate-button.tsx => deactivate-button.tsx} | 18 +++++-----
 ...ctivate-modal.tsx => deactivate-modal.tsx} | 16 ++++-----
 src/modules/patients/table/actions.tsx        | 17 +++++-----
 src/modules/users/change-status-modal.tsx     | 33 ++++++++-----------
 src/modules/users/table/actions.tsx           |  2 +-
 6 files changed, 52 insertions(+), 57 deletions(-)
 rename src/modules/patients/{inactivate-button.tsx => deactivate-button.tsx} (54%)
 rename src/modules/patients/{inactivate-modal.tsx => deactivate-modal.tsx} (86%)

diff --git a/src/components/ui/dialog.tsx b/src/components/ui/dialog.tsx
index df17a6a1..65b48e81 100644
--- a/src/components/ui/dialog.tsx
+++ b/src/components/ui/dialog.tsx
@@ -80,18 +80,21 @@ interface DialogIconProps extends React.ComponentProps<'div'> {
   icon: LucideIcon
 }
 
-const dialogIconVariants = cva('border-border size-12 rounded-full p-2.5', {
-  variants: {
-    variant: {
-      default: 'text-foreground-soft border',
-      destructive: 'text-error bg-error/10',
-      success: 'text-success bg-success/10',
+const dialogIconVariants = cva(
+  'border-border size-12 overflow-visible rounded-full p-2.5',
+  {
+    variants: {
+      variant: {
+        default: 'text-foreground-soft border',
+        destructive: 'text-error bg-error/10',
+        success: 'text-success bg-success/10',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
     },
   },
-  defaultVariants: {
-    variant: 'default',
-  },
-})
+)
 
 type DialogIconComponentProps = DialogIconProps &
   VariantProps<typeof dialogIconVariants>
diff --git a/src/modules/patients/inactivate-button.tsx b/src/modules/patients/deactivate-button.tsx
similarity index 54%
rename from src/modules/patients/inactivate-button.tsx
rename to src/modules/patients/deactivate-button.tsx
index 66c832d3..3ac34330 100644
--- a/src/modules/patients/inactivate-button.tsx
+++ b/src/modules/patients/deactivate-button.tsx
@@ -5,32 +5,32 @@ import { useState } from 'react'
 
 import type { ButtonProps } from '@/components/ui/button'
 import { Dialog, DialogTrigger } from '@/components/ui/dialog'
-import { InactivatePatientModal } from '@/modules/patients/inactivate-modal'
+import { DeactivatePatientModal } from '@/modules/patients/deactivate-modal'
 import type { Patient } from '@/types/patients.d.ts'
 
-interface InactivatePatientButtonProps extends ButtonProps {
+interface DeactivatePatientButtonProps extends ButtonProps {
   patient: Patient
 }
 
-export function InactivatePatientButton({
+export function DeactivatePatientButton({
   patient,
   variant = 'outline',
   ...props
-}: Readonly<InactivatePatientButtonProps>) {
-  const [isInactivateModalOpen, setInactivateModalOpen] = useState(false)
+}: Readonly<DeactivatePatientButtonProps>) {
+  const [isModalOpen, setIsModalOpen] = useState(false)
 
   return (
-    <Dialog open={isInactivateModalOpen} onOpenChange={setInactivateModalOpen}>
+    <Dialog open={isModalOpen} onOpenChange={setIsModalOpen}>
       <DialogTrigger variant={variant} {...props}>
         <UserRoundMinusIcon />
         Inativar
       </DialogTrigger>
 
-      {isInactivateModalOpen && (
-        <InactivatePatientModal
+      {isModalOpen && (
+        <DeactivatePatientModal
           id={patient.id}
           name={patient.name}
-          onClose={() => setInactivateModalOpen(false)}
+          onClose={() => setIsModalOpen(false)}
         />
       )}
     </Dialog>
diff --git a/src/modules/patients/inactivate-modal.tsx b/src/modules/patients/deactivate-modal.tsx
similarity index 86%
rename from src/modules/patients/inactivate-modal.tsx
rename to src/modules/patients/deactivate-modal.tsx
index 545d3a57..d82c25cd 100644
--- a/src/modules/patients/inactivate-modal.tsx
+++ b/src/modules/patients/deactivate-modal.tsx
@@ -24,32 +24,32 @@ import { revalidateClientCache } from '@/helpers/revalidate-client-cache'
 import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
 import { api } from '@/lib/api'
 
-interface InactivatePatientModalProps {
+interface DeactivatePatientModalProps {
   id: string
   name: string
   onClose: () => void
 }
 
-export function InactivatePatientModal({
+export function DeactivatePatientModal({
   id,
   name,
   onClose,
-}: Readonly<InactivatePatientModalProps>) {
-  const inactivatePatientFormSchema = z.object({
+}: Readonly<DeactivatePatientModalProps>) {
+  const deactivatePatientFormSchema = z.object({
     name: z.string().refine((val) => val === name, {
       message: `Insira o nome do paciente corretamente: ${name}`,
     }),
   })
-  type InactivatePatientFormSchema = z.infer<typeof inactivatePatientFormSchema>
+  type DeactivatePatientFormSchema = z.infer<typeof deactivatePatientFormSchema>
 
-  const formMethods = useForm<InactivatePatientFormSchema>({
-    resolver: zodResolver(inactivatePatientFormSchema),
+  const formMethods = useForm<DeactivatePatientFormSchema>({
+    resolver: zodResolver(deactivatePatientFormSchema),
     defaultValues: { name: '' },
     mode: 'onSubmit',
   })
 
   async function submitForm() {
-    const response = await api(`/patients/${id}/inactivate`, {
+    const response = await api(`/patients/${id}/deactivate`, {
       method: 'PATCH',
     })
 
diff --git a/src/modules/patients/table/actions.tsx b/src/modules/patients/table/actions.tsx
index 7235ec51..4979c0d5 100644
--- a/src/modules/patients/table/actions.tsx
+++ b/src/modules/patients/table/actions.tsx
@@ -15,7 +15,7 @@ import { Divider } from '@/components/ui/divider'
 import { Menu, MenuContent, MenuItem, MenuTrigger } from '@/components/ui/menu'
 import { ROUTES } from '@/constants/routes'
 import { AppointmentModal } from '@/modules/appointments/appointment-modal'
-import { InactivatePatientModal } from '@/modules/patients/inactivate-modal'
+import { DeactivatePatientModal } from '@/modules/patients/deactivate-modal'
 import { ReferralModal } from '@/modules/referrals/referral-modal'
 import type { PatientListItem } from '@/types/patients.d.ts'
 
@@ -26,8 +26,7 @@ interface PatientsTableActionsProps {
 export function PatientsTableActions({ patient }: PatientsTableActionsProps) {
   const [isReferralModalOpen, setReferralModalOpen] = useState(false)
   const [isAppointmentModalOpen, setAppointmentModalOpen] = useState(false)
-  const [isInactivateModalOpen, setInactivateModalOpen] = useState(false)
-
+  const [isDeactivateModalOpen, setDeactivateModalOpen] = useState(false)
   const router = useRouter()
 
   const isPatientActive = patient.status === 'active'
@@ -68,7 +67,7 @@ export function PatientsTableActions({ patient }: PatientsTableActionsProps) {
               <Divider className='my-1' />
               <MenuItem
                 variant='destructive'
-                onClick={() => setInactivateModalOpen(true)}
+                onClick={() => setDeactivateModalOpen(true)}
               >
                 <XCircleIcon />
                 Inativar paciente
@@ -103,14 +102,14 @@ export function PatientsTableActions({ patient }: PatientsTableActionsProps) {
             )}
           </Dialog>
           <Dialog
-            open={isInactivateModalOpen}
-            onOpenChange={setInactivateModalOpen}
+            open={isDeactivateModalOpen}
+            onOpenChange={setDeactivateModalOpen}
           >
-            {isInactivateModalOpen && (
-              <InactivatePatientModal
+            {isDeactivateModalOpen && (
+              <DeactivatePatientModal
                 id={patient.id}
                 name={patient.name}
-                onClose={() => setInactivateModalOpen(false)}
+                onClose={() => setDeactivateModalOpen(false)}
               />
             )}
           </Dialog>
diff --git a/src/modules/users/change-status-modal.tsx b/src/modules/users/change-status-modal.tsx
index 62240787..e297ae20 100644
--- a/src/modules/users/change-status-modal.tsx
+++ b/src/modules/users/change-status-modal.tsx
@@ -31,24 +31,24 @@ export function ChangeUserStatusModal({
 }: Readonly<ChangeUserStatusModalModalProps>) {
   const [isPending, startTransition] = useTransition()
 
-  const actionToPerfom = user.status === 'active' ? 'inactivate' : 'activate'
+  const actionToPerfom = user.status === 'active' ? 'deactivate' : 'activate'
 
-  const actionContent = {
-    inactivate: {
+  const actionsContent = {
+    deactivate: {
       icon: CircleXIcon,
-      action: 'Inativar',
+      label: 'Inativar',
       result: 'perderá o',
       variant: 'destructive',
     },
     activate: {
       icon: CircleCheckIcon,
-      action: 'Ativar',
+      label: 'Ativar',
       result: 'terá',
       variant: 'success',
     },
   } as const
 
-  const selectedAction = actionContent[actionToPerfom]
+  const action = actionsContent[actionToPerfom]
 
   async function changeUserStatus() {
     startTransition(async () => {
@@ -72,34 +72,27 @@ export function ChangeUserStatusModal({
   return (
     <DialogContainer>
       <DialogHeader
-        icon={
-          <DialogIcon
-            icon={selectedAction.icon}
-            variant={selectedAction.variant}
-          />
-        }
+        icon={<DialogIcon icon={action.icon} variant={action.variant} />}
       >
-        <DialogTitle>{selectedAction.action} usuário</DialogTitle>
+        <DialogTitle>{action.label} usuário</DialogTitle>
       </DialogHeader>
 
       <DialogContent className='space-y-2'>
         <p>
-          Você tem certeza que deseja {selectedAction.action.toLowerCase()} o
-          usuário <span className='font-semibold'>{user.name}</span>?
-        </p>
-        <p>
-          Ao confirmar, este usuário {selectedAction.result} acesso ao sistema.
+          Você tem certeza que deseja {action.label.toLowerCase()} o usuário{' '}
+          <span className='font-semibold'>{user.name}</span>?
         </p>
+        <p>Ao confirmar, este usuário {action.result} acesso ao sistema.</p>
       </DialogContent>
 
       <DialogFooter>
         <Button
           className='flex-1'
           loading={isPending}
-          variant={selectedAction.variant}
+          variant={action.variant}
           onClick={changeUserStatus}
         >
-          {selectedAction.action}
+          {action.label}
         </Button>
         <DialogClose className='flex-1' disabled={isPending}>
           Voltar
diff --git a/src/modules/users/table/actions.tsx b/src/modules/users/table/actions.tsx
index 29123f8f..65b4f3a3 100644
--- a/src/modules/users/table/actions.tsx
+++ b/src/modules/users/table/actions.tsx
@@ -32,7 +32,7 @@ export function UsersTableActions({ user }: Readonly<UsersTableActionsProps>) {
     active: {
       variant: 'destructive',
       icon: <XCircleIcon />,
-      label: 'Desativar',
+      label: 'Inativar',
     },
     inactive: {
       variant: 'success',

From 9b9817eb121a8ea3e9a620abfe6290a163e30776 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Sun, 15 Feb 2026 23:53:16 -0300
Subject: [PATCH 60/77] feat(patients): implement patient update and patient
 supports requests

---
 .../pacientes/[id]/informacoes/page.tsx       |  41 +++-
 .../delete-patient-support-button.tsx         |  87 +++++++
 .../new-patient-support-button.tsx            |  34 +++
 .../patient-support-modal.tsx                 | 146 ++++++++++++
 .../update-patient-support-button.tsx         |  35 +++
 src/modules/patients/form/index.tsx           | 218 +++++++++---------
 src/modules/patients/form/schema.tsx          | 112 ++++-----
 7 files changed, 510 insertions(+), 163 deletions(-)
 create mode 100644 src/modules/patient-supports/delete-patient-support-button.tsx
 create mode 100644 src/modules/patient-supports/new-patient-support-button.tsx
 create mode 100644 src/modules/patient-supports/patient-support-modal.tsx
 create mode 100644 src/modules/patient-supports/update-patient-support-button.tsx

diff --git a/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx b/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
index 7b1936c2..4faf3990 100644
--- a/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
+++ b/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
@@ -8,11 +8,16 @@ import {
   SectionHeaderActions,
   SectionHeaderTitle,
 } from '@/components/section-header'
+import { Card } from '@/components/ui/card'
 import { ROUTES } from '@/constants/routes'
 import { NewAppointmentButton } from '@/modules/appointments/new-appointment-button'
+import { DeletePatientSupportButton } from '@/modules/patient-supports/delete-patient-support-button'
+import { NewPatientSupportButton } from '@/modules/patient-supports/new-patient-support-button'
+import { UpdatePatientSupportButton } from '@/modules/patient-supports/update-patient-support-button'
+import { DeactivatePatientButton } from '@/modules/patients/deactivate-button'
 import { PatientForm } from '@/modules/patients/form'
-import { InactivatePatientButton } from '@/modules/patients/inactivate-button'
 import { NewReferralButton } from '@/modules/referrals/new-referral-button'
+import { formatPhoneNumber } from '@/utils/formatters/format-phone-number'
 
 export const metadata: Metadata = {
   title: 'Informações do paciente',
@@ -31,6 +36,7 @@ export default async function Page({ params }: Readonly<PageParams>) {
     redirect(ROUTES.dashboard.patients.main)
   }
 
+  const patientSupports = patient.supports ?? []
   const isPatientActive = patient.status === 'active'
 
   return (
@@ -43,7 +49,7 @@ export default async function Page({ params }: Readonly<PageParams>) {
 
         {isPatientActive && (
           <SectionHeaderActions>
-            <InactivatePatientButton patient={patient} size='sm' />
+            <DeactivatePatientButton patient={patient} size='sm' />
             <NewReferralButton patientId={patient.id} size='sm' />
             <NewAppointmentButton patientId={patient.id} size='sm' />
           </SectionHeaderActions>
@@ -51,6 +57,37 @@ export default async function Page({ params }: Readonly<PageParams>) {
       </SectionHeader>
 
       <PatientForm patient={patient} mode='view' />
+
+      <section className='space-y-6'>
+        <h2 className='text-xl font-medium'>Rede de apoio</h2>
+        {patientSupports.length > 0 ? (
+          <div className='flex flex-wrap gap-4'>
+            {patientSupports.map((support) => (
+              <Card key={support.id} className='p-6'>
+                <h3 className='pr-6 text-lg font-medium'>{support.name}</h3>
+                <div className='divide-border mt-1 space-x-3 divide-x'>
+                  <span className='text-foreground-soft pr-3'>
+                    {support.kinship}
+                  </span>
+                  <span className='mt-2 pr-6'>
+                    {formatPhoneNumber(support.phone)}
+                  </span>
+                </div>
+                <div className='mt-4 flex justify-end gap-2'>
+                  <UpdatePatientSupportButton patientSupport={support} />
+                  <DeletePatientSupportButton patientSupport={support} />
+                </div>
+              </Card>
+            ))}
+          </div>
+        ) : (
+          <p className='text-foreground-soft'>
+            Nenhum contato de apoio cadastrado para este paciente.
+          </p>
+        )}
+
+        {isPatientActive && <NewPatientSupportButton patientId={patientId} />}
+      </section>
     </>
   )
 }
diff --git a/src/modules/patient-supports/delete-patient-support-button.tsx b/src/modules/patient-supports/delete-patient-support-button.tsx
new file mode 100644
index 00000000..6df433c2
--- /dev/null
+++ b/src/modules/patient-supports/delete-patient-support-button.tsx
@@ -0,0 +1,87 @@
+'use client'
+
+import { CircleAlertIcon, XIcon } from 'lucide-react'
+import { useState, useTransition } from 'react'
+import { toast } from 'sonner'
+
+import { Button } from '@/components/ui/button'
+import {
+  Dialog,
+  DialogClose,
+  DialogContainer,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogIcon,
+  DialogTitle,
+  DialogTrigger,
+} from '@/components/ui/dialog'
+import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
+import { api } from '@/lib/api'
+import type { PatientSupport } from '@/types/patient-support'
+
+interface DeletePatientSupportButtonProps {
+  patientSupport: PatientSupport
+}
+
+export function DeletePatientSupportButton({
+  patientSupport,
+}: Readonly<DeletePatientSupportButtonProps>) {
+  const [isModalOpen, setIsModalOpen] = useState(false)
+  const [isPending, startTransition] = useTransition()
+
+  async function deletePatientSupport() {
+    startTransition(async () => {
+      const response = await api(`/patient-supports/${patientSupport.id}`, {
+        method: 'DELETE',
+      })
+
+      if (!response.success) {
+        toast.error(response.message)
+        return
+      }
+
+      revalidateServerCache(NEXT_CACHE_TAGS.patient(patientSupport.patient_id))
+
+      toast.success(response.message)
+      setIsModalOpen(false)
+    })
+  }
+
+  return (
+    <Dialog open={isModalOpen} onOpenChange={setIsModalOpen}>
+      <DialogTrigger size='xs' variant='outline'>
+        <XIcon className='text-error' />
+        Excluir
+      </DialogTrigger>
+      <DialogContainer>
+        <DialogHeader
+          icon={<DialogIcon icon={CircleAlertIcon} variant='destructive' />}
+        >
+          <DialogTitle>Excluir contato de apoio</DialogTitle>
+        </DialogHeader>
+        <DialogContent className='space-y-2'>
+          <p>
+            Tem certeza que deseja excluir o contato{' '}
+            <strong>{patientSupport.name}</strong>?
+          </p>
+          <p>Esta ação é irreversível e não poderá ser desfeita.</p>
+        </DialogContent>
+        <DialogFooter>
+          <Button
+            className='flex-1'
+            loading={isPending}
+            variant='destructive'
+            onClick={deletePatientSupport}
+          >
+            Excluir contato
+          </Button>
+          <DialogClose className='flex-1' disabled={isPending}>
+            Voltar
+          </DialogClose>
+        </DialogFooter>
+      </DialogContainer>
+    </Dialog>
+  )
+}
diff --git a/src/modules/patient-supports/new-patient-support-button.tsx b/src/modules/patient-supports/new-patient-support-button.tsx
new file mode 100644
index 00000000..975ce8f2
--- /dev/null
+++ b/src/modules/patient-supports/new-patient-support-button.tsx
@@ -0,0 +1,34 @@
+'use client'
+
+import { PlusIcon } from 'lucide-react'
+import { useState } from 'react'
+
+import { Dialog, DialogTrigger } from '@/components/ui/dialog'
+
+import { PatientSupportModal } from './patient-support-modal'
+
+interface NewPatientSupportButtonProps {
+  patientId: string
+}
+
+export function NewPatientSupportButton({
+  patientId,
+}: Readonly<NewPatientSupportButtonProps>) {
+  const [isModalOpen, setIsModalOpen] = useState(false)
+
+  return (
+    <Dialog open={isModalOpen} onOpenChange={setIsModalOpen}>
+      <DialogTrigger>
+        <PlusIcon /> Novo contato
+      </DialogTrigger>
+
+      {isModalOpen && (
+        <PatientSupportModal
+          mode='create'
+          patientId={patientId}
+          onClose={() => setIsModalOpen(false)}
+        />
+      )}
+    </Dialog>
+  )
+}
diff --git a/src/modules/patient-supports/patient-support-modal.tsx b/src/modules/patient-supports/patient-support-modal.tsx
new file mode 100644
index 00000000..5a792e9b
--- /dev/null
+++ b/src/modules/patient-supports/patient-support-modal.tsx
@@ -0,0 +1,146 @@
+'use client'
+
+import { zodResolver } from '@hookform/resolvers/zod'
+import { EditIcon } from 'lucide-react'
+import { FormProvider, useForm } from 'react-hook-form'
+import { toast } from 'sonner'
+import { z } from 'zod'
+
+import { FormContainer } from '@/components/form/form-container'
+import { TextInput } from '@/components/form/text-input'
+import { Button } from '@/components/ui/button'
+import {
+  DialogClose,
+  DialogContainer,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogIcon,
+  DialogTitle,
+} from '@/components/ui/dialog'
+import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
+import { api } from '@/lib/api'
+import { kinshipSchema, nameSchema, phoneSchema } from '@/schemas'
+import type { PatientSupport } from '@/types/patient-support'
+import { formatPhoneNumber } from '@/utils/formatters/format-phone-number'
+import { removeNonNumbers } from '@/utils/sanitizers'
+
+const patientSupportFormSchema = z.object({
+  name: nameSchema,
+  kinship: kinshipSchema,
+  phone: phoneSchema,
+})
+type PatientSupportFormSchema = z.infer<typeof patientSupportFormSchema>
+
+type PatientSupportModalMode = 'create' | 'edit'
+
+interface PatientSupportModalProps {
+  mode: PatientSupportModalMode
+  onClose: () => void
+  patientId?: string
+  patientSupport?: PatientSupport
+}
+
+export function PatientSupportModal({
+  mode,
+  patientId,
+  patientSupport,
+  onClose,
+}: Readonly<PatientSupportModalProps>) {
+  const ensurePatientId = patientId || patientSupport?.patient_id || ''
+
+  const formMethods = useForm<PatientSupportFormSchema>({
+    resolver: zodResolver(patientSupportFormSchema),
+    mode: 'onBlur',
+    defaultValues: {
+      name: patientSupport?.name || '',
+      kinship: patientSupport?.kinship || '',
+      phone: patientSupport?.phone
+        ? formatPhoneNumber(patientSupport?.phone)
+        : '',
+    },
+  })
+
+  async function submitForm({
+    name,
+    kinship,
+    phone,
+  }: PatientSupportFormSchema) {
+    const body = JSON.stringify({
+      name,
+      kinship,
+      phone: removeNonNumbers(phone),
+    })
+
+    const response =
+      mode === 'create'
+        ? await api(`/patient-supports/${patientId}`, { method: 'POST', body })
+        : await api(`/patient-supports/${patientSupport?.id}`, {
+            method: 'PUT',
+            body,
+          })
+
+    if (!response.success) {
+      toast.error(response.message)
+      return
+    }
+
+    revalidateServerCache(NEXT_CACHE_TAGS.patient(ensurePatientId))
+    toast.success(response.message)
+    onClose()
+  }
+
+  return (
+    <DialogContainer className='max-w-sm'>
+      <DialogHeader icon={<DialogIcon icon={EditIcon} />}>
+        <DialogTitle>Editar contato de apoio</DialogTitle>
+      </DialogHeader>
+
+      <DialogContent>
+        <FormProvider {...formMethods}>
+          <FormContainer onSubmit={formMethods.handleSubmit(submitForm)}>
+            <TextInput
+              name='name'
+              label='Nome completo'
+              maxLength={64}
+              placeholder='Insira o nome completo'
+              isRequired
+            />
+            <TextInput
+              name='kinship'
+              label='Parentesco'
+              maxLength={32}
+              placeholder='Insira o parentesco'
+              isRequired
+            />
+            <TextInput
+              name='phone'
+              label='Telefone (WhatsApp)'
+              mask='phone'
+              maxLength={15}
+              placeholder='(00) 00000-0000'
+              isRequired
+            />
+          </FormContainer>
+        </FormProvider>
+      </DialogContent>
+
+      <DialogFooter>
+        <Button
+          className='flex-1'
+          loading={formMethods.formState.isSubmitting}
+          onClick={formMethods.handleSubmit(submitForm)}
+        >
+          Atualizar contato
+        </Button>
+        <DialogClose
+          className='flex-1'
+          disabled={formMethods.formState.isSubmitting}
+        >
+          Voltar
+        </DialogClose>
+      </DialogFooter>
+    </DialogContainer>
+  )
+}
diff --git a/src/modules/patient-supports/update-patient-support-button.tsx b/src/modules/patient-supports/update-patient-support-button.tsx
new file mode 100644
index 00000000..3eee9220
--- /dev/null
+++ b/src/modules/patient-supports/update-patient-support-button.tsx
@@ -0,0 +1,35 @@
+'use client'
+
+import { EditIcon } from 'lucide-react'
+import { useState } from 'react'
+
+import { Dialog, DialogTrigger } from '@/components/ui/dialog'
+import type { PatientSupport } from '@/types/patient-support'
+
+import { PatientSupportModal } from './patient-support-modal'
+
+interface UpdatePatientSupportButtonProps {
+  patientSupport: PatientSupport
+}
+
+export function UpdatePatientSupportButton({
+  patientSupport,
+}: Readonly<UpdatePatientSupportButtonProps>) {
+  const [isModalOpen, setIsModalOpen] = useState(false)
+
+  return (
+    <Dialog open={isModalOpen} onOpenChange={setIsModalOpen}>
+      <DialogTrigger size='xs' variant='outline'>
+        <EditIcon /> Editar
+      </DialogTrigger>
+
+      {isModalOpen && (
+        <PatientSupportModal
+          mode='edit'
+          patientSupport={patientSupport}
+          onClose={() => setIsModalOpen(false)}
+        />
+      )}
+    </Dialog>
+  )
+}
diff --git a/src/modules/patients/form/index.tsx b/src/modules/patients/form/index.tsx
index 5f738b62..546892fd 100644
--- a/src/modules/patients/form/index.tsx
+++ b/src/modules/patients/form/index.tsx
@@ -10,10 +10,11 @@ import {
   UserPlus2Icon,
 } from 'lucide-react'
 import { useRouter } from 'next/navigation'
-import { useState } from 'react'
+import { useMemo, useState } from 'react'
 import React from 'react'
 import { FormProvider, useFieldArray, useForm } from 'react-hook-form'
 import { toast } from 'sonner'
+import type { z } from 'zod'
 
 import { ComboboxInput } from '@/components/form/combobox-input'
 import { DateInput } from '@/components/form/date-input'
@@ -46,13 +47,13 @@ import { formatPhoneNumber } from '@/utils/formatters/format-phone-number'
 import { removeNonNumbers } from '@/utils/sanitizers'
 
 import CancelPatientFormModal from './cancel-modal'
-import { type PatientFormSchema, patientFormSchema } from './schema'
+import { getPatientFormSchema } from './schema'
 
-type Action = 'view' | 'edit' | 'create'
+type Mode = 'view' | 'edit' | 'create'
 
 interface PatientFormProps {
   patient?: Patient
-  mode?: Action
+  mode?: Mode
 }
 
 export function PatientForm({
@@ -60,14 +61,16 @@ export function PatientForm({
   mode = 'view',
 }: Readonly<PatientFormProps>) {
   const [isCancelModalOpen, setIsCancelModalOpen] = useState(false)
-  const [action, setAction] = useState<Action>(mode)
-
+  const [action, setAction] = useState<Mode>(mode)
   const router = useRouter()
 
-  const patientSupports = patient?.supports?.map((support) => ({
-    ...support,
-    phone: formatPhoneNumber(support.phone),
-  })) ?? [{ name: '', phone: '', kinship: '' }]
+  const patientFormSchema = useMemo(
+    () => getPatientFormSchema(action),
+    [action],
+  )
+  type PatientFormSchema = z.infer<typeof patientFormSchema>
+
+  const isCreateForm = action === 'create'
 
   const formMethods = useForm<PatientFormSchema>({
     resolver: zodResolver(patientFormSchema),
@@ -87,7 +90,9 @@ export function PatientForm({
       medication_desc: patient?.medication_desc || '',
       nmo_diagnosis: patient?.nmo_diagnosis || '',
       need_legal_assistance: patient?.need_legal_assistance ? 'yes' : 'no',
-      supports: patientSupports,
+      supports: isCreateForm
+        ? [{ name: '', phone: '', kinship: '' }]
+        : undefined,
     } as unknown as PatientFormSchema,
     mode: 'onBlur',
   })
@@ -101,12 +106,12 @@ export function PatientForm({
   const cityOptions = useCities(selectedUF)
   const isViewMode = action === 'view'
 
-  const submitButtonContent = {
+  const submitButtons = {
     create: { icon: <UserPlus2Icon />, label: 'Cadastrar' },
     edit: { icon: <CircleCheckIcon />, label: 'Salvar' },
     view: null,
   }
-  const submitButton = submitButtonContent[action]
+  const submitButton = submitButtons[action]
 
   function handleSelectState(value: UF) {
     formMethods.setValue('state', value)
@@ -116,15 +121,15 @@ export function PatientForm({
   }
 
   function handleCancel() {
-    if (action === 'create') {
+    if (isCreateForm) {
       setIsCancelModalOpen(true)
       return
     }
-    setAction('view')
     formMethods.reset()
+    setAction('view')
   }
 
-  async function createPatient(data: PatientFormSchema) {
+  async function submitForm(data: PatientFormSchema) {
     const payload = {
       ...data,
       phone: removeNonNumbers(data.phone),
@@ -132,43 +137,40 @@ export function PatientForm({
       has_disability: data.has_disability === 'yes',
       need_legal_assistance: data.need_legal_assistance === 'yes',
       take_medication: data.take_medication === 'yes',
-      supports: data.supports.map((support) => ({
-        ...support,
-        phone: removeNonNumbers(support.phone),
-      })),
+      supports: isCreateForm
+        ? data.supports?.map((support) => ({
+            ...support,
+            phone: removeNonNumbers(support.phone),
+          }))
+        : undefined,
     }
 
-    return await api('/patients', {
-      method: 'POST',
-      body: JSON.stringify(payload),
-    })
-  }
-
-  async function submitForm(data: PatientFormSchema) {
-    if (action === 'edit') {
-      // TODO: Implement update patient request
-      console.log(data)
-      return
-    }
+    const body = JSON.stringify(payload)
 
-    const response = await createPatient(data)
+    const response = isCreateForm
+      ? await api('/patients', { method: 'POST', body })
+      : await api(`/patients/${patient?.id}`, { method: 'PUT', body })
 
     if (!response.success) {
       toast.error(response.message)
       return
     }
 
+    toast.success(response.message)
+
     revalidateClientCache([
       QUERY_CACHE_KEYS.patients.main,
       QUERY_CACHE_KEYS.patients.allOptions,
     ])
 
-    if (action === 'create') {
-      revalidateServerCache(NEXT_CACHE_TAGS.statistics.totalPatients.main)
+    if (patient) {
+      revalidateServerCache(NEXT_CACHE_TAGS.patient(patient.id))
     }
 
-    toast.success(response.message)
-    router.push(ROUTES.dashboard.patients.main)
+    if (isCreateForm) {
+      revalidateServerCache(NEXT_CACHE_TAGS.statistics.totalPatients.main)
+      router.push(ROUTES.dashboard.patients.main)
+    }
   }
 
   return (
@@ -323,74 +325,76 @@ export function PatientForm({
           />
         </FormField>
 
-        <Divider />
-
-        <section>
-          <h1 className='text-xl font-medium'>Rede de apoio</h1>
-          <div className='mt-6 space-y-6'>
-            {supportMethods.fields.map((support, index) => (
-              <fieldset
-                data-first={index === 0}
-                className='border-border flex items-start gap-4 max-lg:flex-col data-[first=false]:max-lg:border-t data-[first=false]:max-lg:pt-4'
-                key={support.id}
-              >
-                <TextInput
-                  name={`supports.${index}.name`}
-                  label='Nome completo'
-                  maxLength={64}
-                  placeholder='Insira o nome completo'
-                  wrapperClassName='flex-1'
-                  isRequired
-                />
-                <TextInput
-                  name={`supports.${index}.kinship`}
-                  label='Parentesco'
-                  maxLength={32}
-                  placeholder='Insira o parentesco'
-                  wrapperClassName='lg:w-44'
-                  isRequired
-                />
-                <TextInput
-                  name={`supports.${index}.phone`}
-                  label='Telefone (WhatsApp)'
-                  mask='phone'
-                  maxLength={15}
-                  placeholder='(00) 00000-0000'
-                  wrapperClassName={
-                    index === 0 && !isViewMode ? 'lg:w-58' : 'lg:w-44'
-                  }
-                  readOnly={isViewMode}
-                  isRequired
-                />
-                {index > 0 && !isViewMode && (
-                  <Button
-                    size='icon'
-                    type='button'
-                    variant='ghost'
-                    className='text-error max-lg:w-full max-lg:border lg:mt-7'
-                    onClick={() => supportMethods.remove(index)}
+        {isCreateForm && (
+          <>
+            <Divider />
+            <section>
+              <h2 className='text-xl font-medium'>Rede de apoio</h2>
+              <div className='mt-6 space-y-6'>
+                {supportMethods.fields.map((support, index) => (
+                  <fieldset
+                    data-first={index === 0}
+                    className='border-border flex items-start gap-4 max-lg:flex-col data-[first=false]:max-lg:border-t data-[first=false]:max-lg:pt-4'
+                    key={support.id}
                   >
-                    <Trash2Icon />
-                  </Button>
-                )}
-              </fieldset>
-            ))}
-            {action !== 'view' && (
-              <Button
-                type='button'
-                variant='outline'
-                onClick={() =>
-                  supportMethods.append({ name: '', kinship: '', phone: '' })
-                }
-              >
-                <PlusIcon /> Adicionar novo contato
-              </Button>
-            )}
-          </div>
-        </section>
-
-        <div className='mt-3 flex flex-row-reverse gap-2 max-lg:flex-col'>
-          {isViewMode && (
+                    <TextInput
+                      name={`supports.${index}.name`}
+                      label='Nome completo'
+                      maxLength={64}
+                      placeholder='Insira o nome completo'
+                      wrapperClassName='flex-1'
+                      isRequired
+                    />
+                    <TextInput
+                      name={`supports.${index}.kinship`}
+                      label='Parentesco'
+                      maxLength={32}
+                      placeholder='Insira o parentesco'
+                      wrapperClassName='lg:w-44'
+                      isRequired
+                    />
+                    <TextInput
+                      name={`supports.${index}.phone`}
+                      label='Telefone (WhatsApp)'
+                      mask='phone'
+                      maxLength={15}
+                      placeholder='(00) 00000-0000'
+                      wrapperClassName={
+                        index === 0 && !isViewMode ? 'lg:w-58' : 'lg:w-44'
+                      }
+                      readOnly={isViewMode}
+                      isRequired
+                    />
+                    {index > 0 && !isViewMode && (
+                      <Button
+                        size='icon'
+                        type='button'
+                        variant='ghost'
+                        className='text-error max-lg:w-full max-lg:border lg:mt-7'
+                        onClick={() => supportMethods.remove(index)}
+                      >
+                        <Trash2Icon />
+                      </Button>
+                    )}
+                  </fieldset>
+                ))}
+                <Button
+                  size='sm'
+                  type='button'
+                  variant='outline'
+                  onClick={() =>
+                    supportMethods.append({ name: '', kinship: '', phone: '' })
+                  }
+                >
+                  <PlusIcon /> Adicionar contato
+                </Button>
+              </div>
+            </section>
+          </>
+        )}
+
+        <div className='flex flex-row-reverse gap-2 max-lg:flex-col'>
+          {isViewMode && patient?.status === 'active' && (
             <Button
               type='button'
               variant='outline'
@@ -403,7 +407,7 @@ export function PatientForm({
           {!isViewMode && (
             <Button
               type='submit'
-              className='lg:w-48'
+              className='min-w-36'
               loading={formMethods.formState.isSubmitting}
             >
               {submitButton?.icon} {submitButton?.label}
@@ -424,7 +428,9 @@ export function PatientForm({
 
         <Dialog open={isCancelModalOpen} onOpenChange={setIsCancelModalOpen}>
           {isCancelModalOpen && (
-            <CancelPatientFormModal onConfirm={() => router.back()} />
+            <CancelPatientFormModal
+              onConfirm={() => router.push(ROUTES.dashboard.patients.main)}
+            />
           )}
         </Dialog>
       </FormContainer>
diff --git a/src/modules/patients/form/schema.tsx b/src/modules/patients/form/schema.tsx
index 49c7c306..45364442 100644
--- a/src/modules/patients/form/schema.tsx
+++ b/src/modules/patients/form/schema.tsx
@@ -15,68 +15,70 @@ import {
   yesOrNoSchema,
 } from '@/schemas'
 
-export const patientFormSchema = z
-  .object({
-    name: nameSchema,
-    date_of_birth: dateOfBirthSchema,
-    cpf: cpfSchema,
-    gender: genderSchema,
-    race: raceSchema,
-    state: stateSchema,
-    city: citySchema,
-    phone: phoneSchema,
-    email: emailSchema,
-    has_disability: yesOrNoSchema,
-    disability_desc: z
-      .string()
-      .transform((data) => data.trim())
-      .nullable(),
-    need_legal_assistance: yesOrNoSchema,
-    take_medication: yesOrNoSchema,
-    medication_desc: z
-      .string()
-      .transform((data) => data.trim())
-      .nullable(),
-    nmo_diagnosis: patientNmoDiagnosticSchema,
-    supports: z
-      .array(
-        z.object({
-          name: nameSchema,
-          kinship: kinshipSchema,
-          phone: phoneSchema,
-        }),
-      )
-      .min(1),
-  })
-  .refine(
-    (data) => {
+export const getPatientFormSchema = (mode: 'create' | 'edit' | 'view') =>
+  z
+    .object({
+      name: nameSchema,
+      date_of_birth: dateOfBirthSchema,
+      cpf: cpfSchema,
+      gender: genderSchema,
+      race: raceSchema,
+      state: stateSchema,
+      city: citySchema,
+      phone: phoneSchema,
+      email: emailSchema,
+      has_disability: yesOrNoSchema,
+      disability_desc: z
+        .string()
+        .transform((data) => data.trim())
+        .nullable(),
+      need_legal_assistance: yesOrNoSchema,
+      take_medication: yesOrNoSchema,
+      medication_desc: z
+        .string()
+        .transform((data) => data.trim())
+        .nullable(),
+      nmo_diagnosis: patientNmoDiagnosticSchema,
+      supports: z
+        .array(
+          z.object({
+            name: nameSchema,
+            kinship: kinshipSchema,
+            phone: phoneSchema,
+          }),
+        )
+        .optional(),
+    })
+    .superRefine((data, ctx) => {
+      if (mode === 'create') {
+        if (!data.supports || data.supports.length === 0) {
+          ctx.addIssue({
+            code: z.ZodIssueCode.custom,
+            path: ['supports'],
+            message: 'Informe ao menos um contato da rede de apoio',
+          })
+        }
+      }
+
       if (data.has_disability === 'yes' && !data.disability_desc) {
-        return false
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          path: ['disability_desc'],
+          message: 'Descrição da deficiência é obrigatória',
+        })
       }
       if (data.has_disability === 'no') {
         data.disability_desc = null
       }
-      return true
-    },
-    {
-      path: ['disability_desc'],
-      message: 'Descrição da deficiência é obrigatória',
-    },
-  )
-  .refine(
-    (data) => {
+
       if (data.take_medication === 'yes' && !data.medication_desc) {
-        return false
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          path: ['medication_desc'],
+          message: 'Descrição do medicamento é obrigatória',
+        })
       }
       if (data.take_medication === 'no') {
         data.medication_desc = null
       }
-      return true
-    },
-    {
-      path: ['medication_desc'],
-      message: 'Descrição do medicamento é obrigatória',
-    },
-  )
-
-export type PatientFormSchema = z.infer<typeof patientFormSchema>
+    })

From 72c7f2237fe63e90bc0a603d62b9fac137d77be9 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 16 Feb 2026 00:01:45 -0300
Subject: [PATCH 61/77] feat(profile): add loading state to profile page

---
 src/app/(dashboard)/perfil/loading.tsx | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 src/app/(dashboard)/perfil/loading.tsx

diff --git a/src/app/(dashboard)/perfil/loading.tsx b/src/app/(dashboard)/perfil/loading.tsx
new file mode 100644
index 00000000..d03d7a42
--- /dev/null
+++ b/src/app/(dashboard)/perfil/loading.tsx
@@ -0,0 +1,5 @@
+import { PageLoader } from '@/components/ui/page-loader'
+
+export default function Loading() {
+  return <PageLoader text='Carregando informações...' />
+}

From afcb083f2e1cd94f485eb88ecf5ffdc7f6e752b3 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 16 Feb 2026 00:02:32 -0300
Subject: [PATCH 62/77] chore(components): disable decimals on bar chart axis

---
 src/components/charts/bar.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/components/charts/bar.tsx b/src/components/charts/bar.tsx
index ecb45e44..babcda36 100644
--- a/src/components/charts/bar.tsx
+++ b/src/components/charts/bar.tsx
@@ -49,6 +49,8 @@ export function BarChart({
           axisLine={false}
           tickLine={false}
           tick={{ fontSize: '0.75rem', fill: 'var(--color-disabled)' }}
+          domain={[0, 'dataMax']}
+          allowDecimals={false}
         />
 
         <YAxis

From 9193294c35cef17eacc4981e72cd1c6ef43fc0ad Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 16 Feb 2026 00:05:10 -0300
Subject: [PATCH 63/77] chore(components): update section title color

---
 src/components/section-header.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/section-header.tsx b/src/components/section-header.tsx
index c27b728e..ba60f7b3 100644
--- a/src/components/section-header.tsx
+++ b/src/components/section-header.tsx
@@ -41,7 +41,7 @@ export function SectionHeaderTitle({
       </div>
       <div className='flex items-center gap-2'>
         {total > 0 && <span className='text-3xl font-semibold'>{total}</span>}
-        <p className='text-foreground-soft text-xl'>{title}</p>
+        <p className='text-xl'>{title}</p>
       </div>
     </div>
   )

From 597e0917763a075f13bd54610bb81ec5db44118e Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 16 Feb 2026 00:23:21 -0300
Subject: [PATCH 64/77] feat(patients): update patient support cards with
 dropdown actions menu

---
 .../pacientes/[id]/informacoes/page.tsx       | 22 ++---
 .../delete-patient-support-button.tsx         | 87 -------------------
 .../delete-patient-support-modal.tsx          | 80 +++++++++++++++++
 .../patient-support-card-actions.tsx          | 82 +++++++++++++++++
 .../update-patient-support-button.tsx         | 35 --------
 5 files changed, 171 insertions(+), 135 deletions(-)
 delete mode 100644 src/modules/patient-supports/delete-patient-support-button.tsx
 create mode 100644 src/modules/patient-supports/delete-patient-support-modal.tsx
 create mode 100644 src/modules/patient-supports/patient-support-card-actions.tsx
 delete mode 100644 src/modules/patient-supports/update-patient-support-button.tsx

diff --git a/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx b/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
index 4faf3990..87999760 100644
--- a/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
+++ b/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
@@ -9,11 +9,11 @@ import {
   SectionHeaderTitle,
 } from '@/components/section-header'
 import { Card } from '@/components/ui/card'
+import { Divider } from '@/components/ui/divider'
 import { ROUTES } from '@/constants/routes'
 import { NewAppointmentButton } from '@/modules/appointments/new-appointment-button'
-import { DeletePatientSupportButton } from '@/modules/patient-supports/delete-patient-support-button'
 import { NewPatientSupportButton } from '@/modules/patient-supports/new-patient-support-button'
-import { UpdatePatientSupportButton } from '@/modules/patient-supports/update-patient-support-button'
+import { PatientSupportCardActions } from '@/modules/patient-supports/patient-support-card-actions'
 import { DeactivatePatientButton } from '@/modules/patients/deactivate-button'
 import { PatientForm } from '@/modules/patients/form'
 import { NewReferralButton } from '@/modules/referrals/new-referral-button'
@@ -63,20 +63,16 @@ export default async function Page({ params }: Readonly<PageParams>) {
         {patientSupports.length > 0 ? (
           <div className='flex flex-wrap gap-4'>
             {patientSupports.map((support) => (
-              <Card key={support.id} className='p-6'>
-                <h3 className='pr-6 text-lg font-medium'>{support.name}</h3>
-                <div className='divide-border mt-1 space-x-3 divide-x'>
-                  <span className='text-foreground-soft pr-3'>
+              <Card key={support.id} className='relative p-6 pr-16'>
+                <h3 className='text-lg font-medium'>{support.name}</h3>
+                <div className='mt-1 flex gap-3'>
+                  <span className='text-foreground-soft'>
                     {support.kinship}
                   </span>
-                  <span className='mt-2 pr-6'>
-                    {formatPhoneNumber(support.phone)}
-                  </span>
-                </div>
-                <div className='mt-4 flex justify-end gap-2'>
-                  <UpdatePatientSupportButton patientSupport={support} />
-                  <DeletePatientSupportButton patientSupport={support} />
+                  <Divider flexItem orientation='vertical' />
+                  <span>{formatPhoneNumber(support.phone)}</span>
                 </div>
+                <PatientSupportCardActions patientSupport={support} />
               </Card>
             ))}
           </div>
diff --git a/src/modules/patient-supports/delete-patient-support-button.tsx b/src/modules/patient-supports/delete-patient-support-button.tsx
deleted file mode 100644
index 6df433c2..00000000
--- a/src/modules/patient-supports/delete-patient-support-button.tsx
+++ /dev/null
@@ -1,87 +0,0 @@
-'use client'
-
-import { CircleAlertIcon, XIcon } from 'lucide-react'
-import { useState, useTransition } from 'react'
-import { toast } from 'sonner'
-
-import { Button } from '@/components/ui/button'
-import {
-  Dialog,
-  DialogClose,
-  DialogContainer,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogIcon,
-  DialogTitle,
-  DialogTrigger,
-} from '@/components/ui/dialog'
-import { NEXT_CACHE_TAGS } from '@/constants/cache'
-import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
-import { api } from '@/lib/api'
-import type { PatientSupport } from '@/types/patient-support'
-
-interface DeletePatientSupportButtonProps {
-  patientSupport: PatientSupport
-}
-
-export function DeletePatientSupportButton({
-  patientSupport,
-}: Readonly<DeletePatientSupportButtonProps>) {
-  const [isModalOpen, setIsModalOpen] = useState(false)
-  const [isPending, startTransition] = useTransition()
-
-  async function deletePatientSupport() {
-    startTransition(async () => {
-      const response = await api(`/patient-supports/${patientSupport.id}`, {
-        method: 'DELETE',
-      })
-
-      if (!response.success) {
-        toast.error(response.message)
-        return
-      }
-
-      revalidateServerCache(NEXT_CACHE_TAGS.patient(patientSupport.patient_id))
-
-      toast.success(response.message)
-      setIsModalOpen(false)
-    })
-  }
-
-  return (
-    <Dialog open={isModalOpen} onOpenChange={setIsModalOpen}>
-      <DialogTrigger size='xs' variant='outline'>
-        <XIcon className='text-error' />
-        Excluir
-      </DialogTrigger>
-      <DialogContainer>
-        <DialogHeader
-          icon={<DialogIcon icon={CircleAlertIcon} variant='destructive' />}
-        >
-          <DialogTitle>Excluir contato de apoio</DialogTitle>
-        </DialogHeader>
-        <DialogContent className='space-y-2'>
-          <p>
-            Tem certeza que deseja excluir o contato{' '}
-            <strong>{patientSupport.name}</strong>?
-          </p>
-          <p>Esta ação é irreversível e não poderá ser desfeita.</p>
-        </DialogContent>
-        <DialogFooter>
-          <Button
-            className='flex-1'
-            loading={isPending}
-            variant='destructive'
-            onClick={deletePatientSupport}
-          >
-            Excluir contato
-          </Button>
-          <DialogClose className='flex-1' disabled={isPending}>
-            Voltar
-          </DialogClose>
-        </DialogFooter>
-      </DialogContainer>
-    </Dialog>
-  )
-}
diff --git a/src/modules/patient-supports/delete-patient-support-modal.tsx b/src/modules/patient-supports/delete-patient-support-modal.tsx
new file mode 100644
index 00000000..de56fe8e
--- /dev/null
+++ b/src/modules/patient-supports/delete-patient-support-modal.tsx
@@ -0,0 +1,80 @@
+'use client'
+
+import { CircleAlertIcon } from 'lucide-react'
+import { useTransition } from 'react'
+import { toast } from 'sonner'
+
+import { Button } from '@/components/ui/button'
+import {
+  DialogClose,
+  DialogContainer,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogIcon,
+  DialogTitle,
+} from '@/components/ui/dialog'
+import { NEXT_CACHE_TAGS } from '@/constants/cache'
+import { revalidateServerCache } from '@/helpers/revalidate-server-cache'
+import { api } from '@/lib/api'
+import type { PatientSupport } from '@/types/patient-support'
+
+interface DeletePatientSupportModalProps {
+  patientSupport: PatientSupport
+  onClose: () => void
+}
+
+export function DeletePatientSupportModal({
+  patientSupport,
+  onClose,
+}: Readonly<DeletePatientSupportModalProps>) {
+  const [isPending, startTransition] = useTransition()
+
+  async function deletePatientSupport() {
+    startTransition(async () => {
+      const response = await api(`/patient-supports/${patientSupport.id}`, {
+        method: 'DELETE',
+      })
+
+      if (!response.success) {
+        toast.error(response.message)
+        return
+      }
+
+      revalidateServerCache(NEXT_CACHE_TAGS.patient(patientSupport.patient_id))
+
+      toast.success(response.message)
+      onClose()
+    })
+  }
+
+  return (
+    <DialogContainer>
+      <DialogHeader
+        icon={<DialogIcon icon={CircleAlertIcon} variant='destructive' />}
+      >
+        <DialogTitle>Excluir contato de apoio</DialogTitle>
+      </DialogHeader>
+      <DialogContent className='space-y-2'>
+        <p>
+          Tem certeza que deseja excluir o contato{' '}
+          <strong>{patientSupport.name}</strong>?
+        </p>
+        <p>Esta ação é irreversível e não poderá ser desfeita.</p>
+      </DialogContent>
+      <DialogFooter>
+        <Button
+          className='flex-1'
+          loading={isPending}
+          variant='destructive'
+          onClick={deletePatientSupport}
+        >
+          Excluir contato
+        </Button>
+        <DialogClose className='flex-1' disabled={isPending}>
+          Voltar
+        </DialogClose>
+      </DialogFooter>
+    </DialogContainer>
+  )
+}
diff --git a/src/modules/patient-supports/patient-support-card-actions.tsx b/src/modules/patient-supports/patient-support-card-actions.tsx
new file mode 100644
index 00000000..54059d44
--- /dev/null
+++ b/src/modules/patient-supports/patient-support-card-actions.tsx
@@ -0,0 +1,82 @@
+'use client'
+
+import { ClipboardPenIcon, EllipsisIcon, XCircleIcon } from 'lucide-react'
+import { useState } from 'react'
+
+import { Dialog } from '@/components/ui/dialog'
+import { Divider } from '@/components/ui/divider'
+import { Menu, MenuContent, MenuItem, MenuTrigger } from '@/components/ui/menu'
+import type { PatientSupport } from '@/types/patient-support'
+
+import { DeletePatientSupportModal } from './delete-patient-support-modal'
+import { PatientSupportModal } from './patient-support-modal'
+
+type PatientSupportModalMode = 'edit' | 'delete'
+
+interface PatientSupportCardActionsProps {
+  patientSupport: PatientSupport
+}
+
+export function PatientSupportCardActions({
+  patientSupport,
+}: Readonly<PatientSupportCardActionsProps>) {
+  const [isModalOpen, setIsModalOpen] =
+    useState<PatientSupportModalMode | null>(null)
+
+  return (
+    <>
+      <Menu>
+        <MenuTrigger
+          size='icon_sm'
+          variant='ghost'
+          className='absolute top-5 right-4 size-8'
+        >
+          <EllipsisIcon />
+          <span className='sr-only'>Ações</span>
+        </MenuTrigger>
+
+        <MenuContent side='top'>
+          <MenuItem onClick={() => setIsModalOpen('edit')}>
+            <ClipboardPenIcon />
+            Editar
+          </MenuItem>
+
+          <Divider className='my-1' />
+
+          <MenuItem
+            variant='destructive'
+            onClick={() => setIsModalOpen('delete')}
+          >
+            <XCircleIcon />
+            Excluir
+          </MenuItem>
+        </MenuContent>
+      </Menu>
+
+      {isModalOpen === 'edit' && (
+        <Dialog
+          open={isModalOpen === 'edit'}
+          onOpenChange={(open) => setIsModalOpen(open ? 'edit' : null)}
+        >
+          <PatientSupportModal
+            mode='edit'
+            patientSupport={patientSupport}
+            onClose={() => setIsModalOpen(null)}
+          />
+        </Dialog>
+      )}
+
+      {isModalOpen === 'delete' && (
+        <Dialog
+          open={isModalOpen === 'delete'}
+          onOpenChange={(open) => setIsModalOpen(open ? 'delete' : null)}
+        >
+          <DeletePatientSupportModal
+            patientSupport={patientSupport}
+            onClose={() => setIsModalOpen(null)}
+          />
+        </Dialog>
+      )}
+    </>
+  )
+}
diff --git a/src/modules/patient-supports/update-patient-support-button.tsx b/src/modules/patient-supports/update-patient-support-button.tsx
deleted file mode 100644
index 3eee9220..00000000
--- a/src/modules/patient-supports/update-patient-support-button.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-'use client'
-
-import { EditIcon } from 'lucide-react'
-import { useState } from 'react'
-
-import { Dialog, DialogTrigger } from '@/components/ui/dialog'
-import type { PatientSupport } from '@/types/patient-support'
-
-import { PatientSupportModal } from './patient-support-modal'
-
-interface UpdatePatientSupportButtonProps {
-  patientSupport: PatientSupport
-}
-
-export function UpdatePatientSupportButton({
-  patientSupport,
-}: Readonly<UpdatePatientSupportButtonProps>) {
-  const [isModalOpen, setIsModalOpen] = useState(false)
-
-  return (
-    <Dialog open={isModalOpen} onOpenChange={setIsModalOpen}>
-      <DialogTrigger size='xs' variant='outline'>
-        <EditIcon /> Editar
-      </DialogTrigger>
-
-      {isModalOpen && (
-        <PatientSupportModal
-          mode='edit'
-          patientSupport={patientSupport}
-          onClose={() => setIsModalOpen(false)}
-        />
-      )}
-    </Dialog>
-  )
-}

From a06ecc31ff5bcb27e56771792b0fb12c32490d40 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 16 Feb 2026 10:22:57 -0300
Subject: [PATCH 65/77] feat(build): bump next and react to latest version

---
 README.md                       |  23 +-
 env.sample                      |   3 +-
 package-lock.json               | 463 +++++++++++++++++---------------
 package.json                    |   6 +-
 src/{middleware.ts => proxy.ts} |   2 +-
 tsconfig.json                   |  16 +-
 6 files changed, 273 insertions(+), 240 deletions(-)
 rename src/{middleware.ts => proxy.ts} (94%)

diff --git a/README.md b/README.md
index a3f13f24..d0bf65c8 100644
--- a/README.md
+++ b/README.md
@@ -7,7 +7,7 @@ O sistema otimiza o fluxo de atendimento com integração de dados em uma interf
 ## Tecnologias utilizadas
 
 - **Typescript**: Tipagem estática para maior segurança no desenvolvimento;
-- **Next.js 15**: Framework React para renderização híbrida e roteamento eficiente;
+- **Next.js 16**: Framework React para renderização híbrida e roteamento eficiente;
 - **Tailwind CSS**: Framework CSS utilitário;
 - **React Hook Form + Zod**: Gerenciamento de formulários com validação robusta.
 
@@ -15,30 +15,31 @@ O sistema otimiza o fluxo de atendimento com integração de dados em uma interf
 
 ### Pré-requisitos
 
-- Node.js (versão 18 ou superior)
-- npm
+- Node.js - versão 20.9.0 (LTS) ou superior
+- NPM (Node package manager)
+- Docker
 
-### Passos para Configuração
+### Instalação e configuração
 
-#### 1. Clone o repositório
+#### 1. Clone o repositório e instale as dependências
 
 ```bash
 git clone https://github.com/ipecode-br/abnmo-frontend
 cd abnmo-frontend
+npm install
 ```
 
-#### 2. Configure variáveis de ambiente
+#### 2. Configure as variáveis de ambiente
 
-Copie o arquivo de exemplo `env.sample` e renomoeie para `.env.local`. Ou crie um arquivo com o mesmo nome contendo as seguintes variáveis de ambiente:
+Copie o arquivo de exemplo `env.sample` e renomeie para `.env.local` ou execute o comando:
 
-```
-NEXT_PUBLIC_API_URL=
+```bash
+cp env.sample .env.local
 ```
 
-#### 3. Instale dependências e inicie a aplicação
+#### 3. Inicie a aplicação
 
 ```bash
-npm install
 npm run dev
 ```
 
diff --git a/env.sample b/env.sample
index a731a742..563225dc 100644
--- a/env.sample
+++ b/env.sample
@@ -1,2 +1 @@
-NEXT_PUBLIC_API_URL="http://localhost:3333"
-NEXT_PUBLIC_API_IBGE="https://servicodados.ibge.gov.br/api/v1"
\ No newline at end of file
+NEXT_PUBLIC_API_URL="http://localhost:3333"
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index b6f09f19..de61c707 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -21,11 +21,11 @@
         "date-fns": "4.1.0",
         "jsonwebtoken": "9.0.2",
         "lucide-react": "0.531.0",
-        "next": "15.5.3",
+        "next": "16.1.6",
         "prettier": "3.6.2",
-        "react": "^19.0.0",
+        "react": "19.2.4",
         "react-day-picker": "9.8.0",
-        "react-dom": "^19.0.0",
+        "react-dom": "19.2.4",
         "react-hook-form": "7.55.0",
         "recharts": "3.1.0",
         "sonner": "2.0.4",
@@ -1078,9 +1078,9 @@
       }
     },
     "node_modules/@emnapi/runtime": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.5.0.tgz",
-      "integrity": "sha512-97/BJ3iXHww3djw6hYIfErCZFee7qCtrneuLa20UXFCOTCfBM2cvQHjWJ2EG0s0MtdNwInarqCTz35i4wWXHsQ==",
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.8.1.tgz",
+      "integrity": "sha512-mehfKSMWjjNol8659Z8KxEMrdSJDDot5SXMq00dM8BN4o+CLNXQ0xH2V7EchNHV4RmbZLmmPdEaXZc5H2FXmDg==",
       "license": "MIT",
       "optional": true,
       "dependencies": {
@@ -1344,10 +1344,20 @@
         "url": "https://github.com/sponsors/nzakas"
       }
     },
+    "node_modules/@img/colour": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/@img/colour/-/colour-1.0.0.tgz",
+      "integrity": "sha512-A5P/LfWGFSl6nsckYtjw9da+19jB8hkJ6ACTGcDfEJ0aE+l2n2El7dsVM7UVHZQ9s2lmYMWlrS21YLy2IR1LUw==",
+      "license": "MIT",
+      "optional": true,
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/@img/sharp-darwin-arm64": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.34.3.tgz",
-      "integrity": "sha512-ryFMfvxxpQRsgZJqBd4wsttYQbCxsJksrv9Lw/v798JcQ8+w84mBWuXwl+TT0WJ/WrYOLaYpwQXi3sA9nTIaIg==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.34.5.tgz",
+      "integrity": "sha512-imtQ3WMJXbMY4fxb/Ndp6HBTNVtWCUI0WdobyheGf5+ad6xX8VIDO8u2xE4qc/fr08CKG/7dDseFtn6M6g/r3w==",
       "cpu": [
         "arm64"
       ],
@@ -1363,13 +1373,13 @@
         "url": "https://opencollective.com/libvips"
       },
       "optionalDependencies": {
-        "@img/sharp-libvips-darwin-arm64": "1.2.0"
+        "@img/sharp-libvips-darwin-arm64": "1.2.4"
       }
     },
     "node_modules/@img/sharp-darwin-x64": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-darwin-x64/-/sharp-darwin-x64-0.34.3.tgz",
-      "integrity": "sha512-yHpJYynROAj12TA6qil58hmPmAwxKKC7reUqtGLzsOHfP7/rniNGTL8tjWX6L3CTV4+5P4ypcS7Pp+7OB+8ihA==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-darwin-x64/-/sharp-darwin-x64-0.34.5.tgz",
+      "integrity": "sha512-YNEFAF/4KQ/PeW0N+r+aVVsoIY0/qxxikF2SWdp+NRkmMB7y9LBZAVqQ4yhGCm/H3H270OSykqmQMKLBhBJDEw==",
       "cpu": [
         "x64"
       ],
@@ -1385,13 +1395,13 @@
         "url": "https://opencollective.com/libvips"
       },
       "optionalDependencies": {
-        "@img/sharp-libvips-darwin-x64": "1.2.0"
+        "@img/sharp-libvips-darwin-x64": "1.2.4"
       }
     },
     "node_modules/@img/sharp-libvips-darwin-arm64": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-arm64/-/sharp-libvips-darwin-arm64-1.2.0.tgz",
-      "integrity": "sha512-sBZmpwmxqwlqG9ueWFXtockhsxefaV6O84BMOrhtg/YqbTaRdqDE7hxraVE3y6gVM4eExmfzW4a8el9ArLeEiQ==",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-arm64/-/sharp-libvips-darwin-arm64-1.2.4.tgz",
+      "integrity": "sha512-zqjjo7RatFfFoP0MkQ51jfuFZBnVE2pRiaydKJ1G/rHZvnsrHAOcQALIi9sA5co5xenQdTugCvtb1cuf78Vf4g==",
       "cpu": [
         "arm64"
       ],
@@ -1405,9 +1415,9 @@
       }
     },
     "node_modules/@img/sharp-libvips-darwin-x64": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-x64/-/sharp-libvips-darwin-x64-1.2.0.tgz",
-      "integrity": "sha512-M64XVuL94OgiNHa5/m2YvEQI5q2cl9d/wk0qFTDVXcYzi43lxuiFTftMR1tOnFQovVXNZJ5TURSDK2pNe9Yzqg==",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-x64/-/sharp-libvips-darwin-x64-1.2.4.tgz",
+      "integrity": "sha512-1IOd5xfVhlGwX+zXv2N93k0yMONvUlANylbJw1eTah8K/Jtpi15KC+WSiaX/nBmbm2HxRM1gZ0nSdjSsrZbGKg==",
       "cpu": [
         "x64"
       ],
@@ -1421,9 +1431,9 @@
       }
     },
     "node_modules/@img/sharp-libvips-linux-arm": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm/-/sharp-libvips-linux-arm-1.2.0.tgz",
-      "integrity": "sha512-mWd2uWvDtL/nvIzThLq3fr2nnGfyr/XMXlq8ZJ9WMR6PXijHlC3ksp0IpuhK6bougvQrchUAfzRLnbsen0Cqvw==",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm/-/sharp-libvips-linux-arm-1.2.4.tgz",
+      "integrity": "sha512-bFI7xcKFELdiNCVov8e44Ia4u2byA+l3XtsAj+Q8tfCwO6BQ8iDojYdvoPMqsKDkuoOo+X6HZA0s0q11ANMQ8A==",
       "cpu": [
         "arm"
       ],
@@ -1437,9 +1447,9 @@
       }
     },
     "node_modules/@img/sharp-libvips-linux-arm64": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm64/-/sharp-libvips-linux-arm64-1.2.0.tgz",
-      "integrity": "sha512-RXwd0CgG+uPRX5YYrkzKyalt2OJYRiJQ8ED/fi1tq9WQW2jsQIn0tqrlR5l5dr/rjqq6AHAxURhj2DVjyQWSOA==",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm64/-/sharp-libvips-linux-arm64-1.2.4.tgz",
+      "integrity": "sha512-excjX8DfsIcJ10x1Kzr4RcWe1edC9PquDRRPx3YVCvQv+U5p7Yin2s32ftzikXojb1PIFc/9Mt28/y+iRklkrw==",
       "cpu": [
         "arm64"
       ],
@@ -1453,9 +1463,9 @@
       }
     },
     "node_modules/@img/sharp-libvips-linux-ppc64": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-ppc64/-/sharp-libvips-linux-ppc64-1.2.0.tgz",
-      "integrity": "sha512-Xod/7KaDDHkYu2phxxfeEPXfVXFKx70EAFZ0qyUdOjCcxbjqyJOEUpDe6RIyaunGxT34Anf9ue/wuWOqBW2WcQ==",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-ppc64/-/sharp-libvips-linux-ppc64-1.2.4.tgz",
+      "integrity": "sha512-FMuvGijLDYG6lW+b/UvyilUWu5Ayu+3r2d1S8notiGCIyYU/76eig1UfMmkZ7vwgOrzKzlQbFSuQfgm7GYUPpA==",
       "cpu": [
         "ppc64"
       ],
@@ -1468,10 +1478,26 @@
         "url": "https://opencollective.com/libvips"
       }
     },
+    "node_modules/@img/sharp-libvips-linux-riscv64": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-riscv64/-/sharp-libvips-linux-riscv64-1.2.4.tgz",
+      "integrity": "sha512-oVDbcR4zUC0ce82teubSm+x6ETixtKZBh/qbREIOcI3cULzDyb18Sr/Wcyx7NRQeQzOiHTNbZFF1UwPS2scyGA==",
+      "cpu": [
+        "riscv64"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
     "node_modules/@img/sharp-libvips-linux-s390x": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-s390x/-/sharp-libvips-linux-s390x-1.2.0.tgz",
-      "integrity": "sha512-eMKfzDxLGT8mnmPJTNMcjfO33fLiTDsrMlUVcp6b96ETbnJmd4uvZxVJSKPQfS+odwfVaGifhsB07J1LynFehw==",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-s390x/-/sharp-libvips-linux-s390x-1.2.4.tgz",
+      "integrity": "sha512-qmp9VrzgPgMoGZyPvrQHqk02uyjA0/QrTO26Tqk6l4ZV0MPWIW6LTkqOIov+J1yEu7MbFQaDpwdwJKhbJvuRxQ==",
       "cpu": [
         "s390x"
       ],
@@ -1485,9 +1511,9 @@
       }
     },
     "node_modules/@img/sharp-libvips-linux-x64": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-x64/-/sharp-libvips-linux-x64-1.2.0.tgz",
-      "integrity": "sha512-ZW3FPWIc7K1sH9E3nxIGB3y3dZkpJlMnkk7z5tu1nSkBoCgw2nSRTFHI5pB/3CQaJM0pdzMF3paf9ckKMSE9Tg==",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-x64/-/sharp-libvips-linux-x64-1.2.4.tgz",
+      "integrity": "sha512-tJxiiLsmHc9Ax1bz3oaOYBURTXGIRDODBqhveVHonrHJ9/+k89qbLl0bcJns+e4t4rvaNBxaEZsFtSfAdquPrw==",
       "cpu": [
         "x64"
       ],
@@ -1501,9 +1527,9 @@
       }
     },
     "node_modules/@img/sharp-libvips-linuxmusl-arm64": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-arm64/-/sharp-libvips-linuxmusl-arm64-1.2.0.tgz",
-      "integrity": "sha512-UG+LqQJbf5VJ8NWJ5Z3tdIe/HXjuIdo4JeVNADXBFuG7z9zjoegpzzGIyV5zQKi4zaJjnAd2+g2nna8TZvuW9Q==",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-arm64/-/sharp-libvips-linuxmusl-arm64-1.2.4.tgz",
+      "integrity": "sha512-FVQHuwx1IIuNow9QAbYUzJ+En8KcVm9Lk5+uGUQJHaZmMECZmOlix9HnH7n1TRkXMS0pGxIJokIVB9SuqZGGXw==",
       "cpu": [
         "arm64"
       ],
@@ -1517,9 +1543,9 @@
       }
     },
     "node_modules/@img/sharp-libvips-linuxmusl-x64": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-x64/-/sharp-libvips-linuxmusl-x64-1.2.0.tgz",
-      "integrity": "sha512-SRYOLR7CXPgNze8akZwjoGBoN1ThNZoqpOgfnOxmWsklTGVfJiGJoC/Lod7aNMGA1jSsKWM1+HRX43OP6p9+6Q==",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-x64/-/sharp-libvips-linuxmusl-x64-1.2.4.tgz",
+      "integrity": "sha512-+LpyBk7L44ZIXwz/VYfglaX/okxezESc6UxDSoyo2Ks6Jxc4Y7sGjpgU9s4PMgqgjj1gZCylTieNamqA1MF7Dg==",
       "cpu": [
         "x64"
       ],
@@ -1533,9 +1559,9 @@
       }
     },
     "node_modules/@img/sharp-linux-arm": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm/-/sharp-linux-arm-0.34.3.tgz",
-      "integrity": "sha512-oBK9l+h6KBN0i3dC8rYntLiVfW8D8wH+NPNT3O/WBHeW0OQWCjfWksLUaPidsrDKpJgXp3G3/hkmhptAW0I3+A==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm/-/sharp-linux-arm-0.34.5.tgz",
+      "integrity": "sha512-9dLqsvwtg1uuXBGZKsxem9595+ujv0sJ6Vi8wcTANSFpwV/GONat5eCkzQo/1O6zRIkh0m/8+5BjrRr7jDUSZw==",
       "cpu": [
         "arm"
       ],
@@ -1551,13 +1577,13 @@
         "url": "https://opencollective.com/libvips"
       },
       "optionalDependencies": {
-        "@img/sharp-libvips-linux-arm": "1.2.0"
+        "@img/sharp-libvips-linux-arm": "1.2.4"
       }
     },
     "node_modules/@img/sharp-linux-arm64": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm64/-/sharp-linux-arm64-0.34.3.tgz",
-      "integrity": "sha512-QdrKe3EvQrqwkDrtuTIjI0bu6YEJHTgEeqdzI3uWJOH6G1O8Nl1iEeVYRGdj1h5I21CqxSvQp1Yv7xeU3ZewbA==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm64/-/sharp-linux-arm64-0.34.5.tgz",
+      "integrity": "sha512-bKQzaJRY/bkPOXyKx5EVup7qkaojECG6NLYswgktOZjaXecSAeCWiZwwiFf3/Y+O1HrauiE3FVsGxFg8c24rZg==",
       "cpu": [
         "arm64"
       ],
@@ -1573,13 +1599,13 @@
         "url": "https://opencollective.com/libvips"
       },
       "optionalDependencies": {
-        "@img/sharp-libvips-linux-arm64": "1.2.0"
+        "@img/sharp-libvips-linux-arm64": "1.2.4"
       }
     },
     "node_modules/@img/sharp-linux-ppc64": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-ppc64/-/sharp-linux-ppc64-0.34.3.tgz",
-      "integrity": "sha512-GLtbLQMCNC5nxuImPR2+RgrviwKwVql28FWZIW1zWruy6zLgA5/x2ZXk3mxj58X/tszVF69KK0Is83V8YgWhLA==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-ppc64/-/sharp-linux-ppc64-0.34.5.tgz",
+      "integrity": "sha512-7zznwNaqW6YtsfrGGDA6BRkISKAAE1Jo0QdpNYXNMHu2+0dTrPflTLNkpc8l7MUP5M16ZJcUvysVWWrMefZquA==",
       "cpu": [
         "ppc64"
       ],
@@ -1595,13 +1621,35 @@
         "url": "https://opencollective.com/libvips"
       },
       "optionalDependencies": {
-        "@img/sharp-libvips-linux-ppc64": "1.2.0"
+        "@img/sharp-libvips-linux-ppc64": "1.2.4"
+      }
+    },
+    "node_modules/@img/sharp-linux-riscv64": {
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-riscv64/-/sharp-linux-riscv64-0.34.5.tgz",
+      "integrity": "sha512-51gJuLPTKa7piYPaVs8GmByo7/U7/7TZOq+cnXJIHZKavIRHAP77e3N2HEl3dgiqdD/w0yUfiJnII77PuDDFdw==",
+      "cpu": [
+        "riscv64"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linux-riscv64": "1.2.4"
       }
     },
     "node_modules/@img/sharp-linux-s390x": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-s390x/-/sharp-linux-s390x-0.34.3.tgz",
-      "integrity": "sha512-3gahT+A6c4cdc2edhsLHmIOXMb17ltffJlxR0aC2VPZfwKoTGZec6u5GrFgdR7ciJSsHT27BD3TIuGcuRT0KmQ==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-s390x/-/sharp-linux-s390x-0.34.5.tgz",
+      "integrity": "sha512-nQtCk0PdKfho3eC5MrbQoigJ2gd1CgddUMkabUj+rBevs8tZ2cULOx46E7oyX+04WGfABgIwmMC0VqieTiR4jg==",
       "cpu": [
         "s390x"
       ],
@@ -1617,13 +1665,13 @@
         "url": "https://opencollective.com/libvips"
       },
       "optionalDependencies": {
-        "@img/sharp-libvips-linux-s390x": "1.2.0"
+        "@img/sharp-libvips-linux-s390x": "1.2.4"
       }
     },
     "node_modules/@img/sharp-linux-x64": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-x64/-/sharp-linux-x64-0.34.3.tgz",
-      "integrity": "sha512-8kYso8d806ypnSq3/Ly0QEw90V5ZoHh10yH0HnrzOCr6DKAPI6QVHvwleqMkVQ0m+fc7EH8ah0BB0QPuWY6zJQ==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-x64/-/sharp-linux-x64-0.34.5.tgz",
+      "integrity": "sha512-MEzd8HPKxVxVenwAa+JRPwEC7QFjoPWuS5NZnBt6B3pu7EG2Ge0id1oLHZpPJdn3OQK+BQDiw9zStiHBTJQQQQ==",
       "cpu": [
         "x64"
       ],
@@ -1639,13 +1687,13 @@
         "url": "https://opencollective.com/libvips"
       },
       "optionalDependencies": {
-        "@img/sharp-libvips-linux-x64": "1.2.0"
+        "@img/sharp-libvips-linux-x64": "1.2.4"
       }
     },
     "node_modules/@img/sharp-linuxmusl-arm64": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-arm64/-/sharp-linuxmusl-arm64-0.34.3.tgz",
-      "integrity": "sha512-vAjbHDlr4izEiXM1OTggpCcPg9tn4YriK5vAjowJsHwdBIdx0fYRsURkxLG2RLm9gyBq66gwtWI8Gx0/ov+JKQ==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-arm64/-/sharp-linuxmusl-arm64-0.34.5.tgz",
+      "integrity": "sha512-fprJR6GtRsMt6Kyfq44IsChVZeGN97gTD331weR1ex1c1rypDEABN6Tm2xa1wE6lYb5DdEnk03NZPqA7Id21yg==",
       "cpu": [
         "arm64"
       ],
@@ -1661,13 +1709,13 @@
         "url": "https://opencollective.com/libvips"
       },
       "optionalDependencies": {
-        "@img/sharp-libvips-linuxmusl-arm64": "1.2.0"
+        "@img/sharp-libvips-linuxmusl-arm64": "1.2.4"
       }
     },
     "node_modules/@img/sharp-linuxmusl-x64": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-x64/-/sharp-linuxmusl-x64-0.34.3.tgz",
-      "integrity": "sha512-gCWUn9547K5bwvOn9l5XGAEjVTTRji4aPTqLzGXHvIr6bIDZKNTA34seMPgM0WmSf+RYBH411VavCejp3PkOeQ==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-x64/-/sharp-linuxmusl-x64-0.34.5.tgz",
+      "integrity": "sha512-Jg8wNT1MUzIvhBFxViqrEhWDGzqymo3sV7z7ZsaWbZNDLXRJZoRGrjulp60YYtV4wfY8VIKcWidjojlLcWrd8Q==",
       "cpu": [
         "x64"
       ],
@@ -1683,20 +1731,20 @@
         "url": "https://opencollective.com/libvips"
       },
       "optionalDependencies": {
-        "@img/sharp-libvips-linuxmusl-x64": "1.2.0"
+        "@img/sharp-libvips-linuxmusl-x64": "1.2.4"
       }
     },
     "node_modules/@img/sharp-wasm32": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-wasm32/-/sharp-wasm32-0.34.3.tgz",
-      "integrity": "sha512-+CyRcpagHMGteySaWos8IbnXcHgfDn7pO2fiC2slJxvNq9gDipYBN42/RagzctVRKgxATmfqOSulgZv5e1RdMg==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-wasm32/-/sharp-wasm32-0.34.5.tgz",
+      "integrity": "sha512-OdWTEiVkY2PHwqkbBI8frFxQQFekHaSSkUIJkwzclWZe64O1X4UlUjqqqLaPbUpMOQk6FBu/HtlGXNblIs0huw==",
       "cpu": [
         "wasm32"
       ],
       "license": "Apache-2.0 AND LGPL-3.0-or-later AND MIT",
       "optional": true,
       "dependencies": {
-        "@emnapi/runtime": "^1.4.4"
+        "@emnapi/runtime": "^1.7.0"
       },
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
@@ -1706,9 +1754,9 @@
       }
     },
     "node_modules/@img/sharp-win32-arm64": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-win32-arm64/-/sharp-win32-arm64-0.34.3.tgz",
-      "integrity": "sha512-MjnHPnbqMXNC2UgeLJtX4XqoVHHlZNd+nPt1kRPmj63wURegwBhZlApELdtxM2OIZDRv/DFtLcNhVbd1z8GYXQ==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-win32-arm64/-/sharp-win32-arm64-0.34.5.tgz",
+      "integrity": "sha512-WQ3AgWCWYSb2yt+IG8mnC6Jdk9Whs7O0gxphblsLvdhSpSTtmu69ZG1Gkb6NuvxsNACwiPV6cNSZNzt0KPsw7g==",
       "cpu": [
         "arm64"
       ],
@@ -1725,9 +1773,9 @@
       }
     },
     "node_modules/@img/sharp-win32-ia32": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-win32-ia32/-/sharp-win32-ia32-0.34.3.tgz",
-      "integrity": "sha512-xuCdhH44WxuXgOM714hn4amodJMZl3OEvf0GVTm0BEyMeA2to+8HEdRPShH0SLYptJY1uBw+SCFP9WVQi1Q/cw==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-win32-ia32/-/sharp-win32-ia32-0.34.5.tgz",
+      "integrity": "sha512-FV9m/7NmeCmSHDD5j4+4pNI8Cp3aW+JvLoXcTUo0IqyjSfAZJ8dIUmijx1qaJsIiU+Hosw6xM5KijAWRJCSgNg==",
       "cpu": [
         "ia32"
       ],
@@ -1744,9 +1792,9 @@
       }
     },
     "node_modules/@img/sharp-win32-x64": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/@img/sharp-win32-x64/-/sharp-win32-x64-0.34.3.tgz",
-      "integrity": "sha512-OWwz05d++TxzLEv4VnsTz5CmZ6mI6S05sfQGEMrNrQcOEERbX46332IvE7pO/EUiw7jUrrS40z/M7kPyjfl04g==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-win32-x64/-/sharp-win32-x64-0.34.5.tgz",
+      "integrity": "sha512-+29YMsqY2/9eFEiW93eqWnuLcWcufowXewwSNIT6UwZdUUCrM3oFjMWH/Z6/TMmb4hlFenmfAVbpWeup2jryCw==",
       "cpu": [
         "x64"
       ],
@@ -2299,9 +2347,9 @@
       }
     },
     "node_modules/@next/env": {
-      "version": "15.5.3",
-      "resolved": "https://registry.npmjs.org/@next/env/-/env-15.5.3.tgz",
-      "integrity": "sha512-RSEDTRqyihYXygx/OJXwvVupfr9m04+0vH8vyy0HfZ7keRto6VX9BbEk0J2PUk0VGy6YhklJUSrgForov5F9pw==",
+      "version": "16.1.6",
+      "resolved": "https://registry.npmjs.org/@next/env/-/env-16.1.6.tgz",
+      "integrity": "sha512-N1ySLuZjnAtN3kFnwhAwPvZah8RJxKasD7x1f8shFqhncnWZn4JMfg37diLNuoHsLAlrDfM3g4mawVdtAG8XLQ==",
       "license": "MIT"
     },
     "node_modules/@next/eslint-plugin-next": {
@@ -2314,9 +2362,9 @@
       }
     },
     "node_modules/@next/swc-darwin-arm64": {
-      "version": "15.5.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-15.5.3.tgz",
-      "integrity": "sha512-nzbHQo69+au9wJkGKTU9lP7PXv0d1J5ljFpvb+LnEomLtSbJkbZyEs6sbF3plQmiOB2l9OBtN2tNSvCH1nQ9Jg==",
+      "version": "16.1.6",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-16.1.6.tgz",
+      "integrity": "sha512-wTzYulosJr/6nFnqGW7FrG3jfUUlEf8UjGA0/pyypJl42ExdVgC6xJgcXQ+V8QFn6niSG2Pb8+MIG1mZr2vczw==",
       "cpu": [
         "arm64"
       ],
@@ -2330,9 +2378,9 @@
       }
     },
     "node_modules/@next/swc-darwin-x64": {
-      "version": "15.5.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-15.5.3.tgz",
-      "integrity": "sha512-w83w4SkOOhekJOcA5HBvHyGzgV1W/XvOfpkrxIse4uPWhYTTRwtGEM4v/jiXwNSJvfRvah0H8/uTLBKRXlef8g==",
+      "version": "16.1.6",
+      "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-16.1.6.tgz",
+      "integrity": "sha512-BLFPYPDO+MNJsiDWbeVzqvYd4NyuRrEYVB5k2N3JfWncuHAy2IVwMAOlVQDFjj+krkWzhY2apvmekMkfQR0CUQ==",
       "cpu": [
         "x64"
       ],
@@ -2346,9 +2394,9 @@
       }
     },
     "node_modules/@next/swc-linux-arm64-gnu": {
-      "version": "15.5.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-15.5.3.tgz",
-      "integrity": "sha512-+m7pfIs0/yvgVu26ieaKrifV8C8yiLe7jVp9SpcIzg7XmyyNE7toC1fy5IOQozmr6kWl/JONC51osih2RyoXRw==",
+      "version": "16.1.6",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-16.1.6.tgz",
+      "integrity": "sha512-OJYkCd5pj/QloBvoEcJ2XiMnlJkRv9idWA/j0ugSuA34gMT6f5b7vOiCQHVRpvStoZUknhl6/UxOXL4OwtdaBw==",
       "cpu": [
         "arm64"
       ],
@@ -2362,9 +2410,9 @@
       }
     },
     "node_modules/@next/swc-linux-arm64-musl": {
-      "version": "15.5.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-15.5.3.tgz",
-      "integrity": "sha512-u3PEIzuguSenoZviZJahNLgCexGFhso5mxWCrrIMdvpZn6lkME5vc/ADZG8UUk5K1uWRy4hqSFECrON6UKQBbQ==",
+      "version": "16.1.6",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-16.1.6.tgz",
+      "integrity": "sha512-S4J2v+8tT3NIO9u2q+S0G5KdvNDjXfAv06OhfOzNDaBn5rw84DGXWndOEB7d5/x852A20sW1M56vhC/tRVbccQ==",
       "cpu": [
         "arm64"
       ],
@@ -2378,9 +2426,9 @@
       }
     },
     "node_modules/@next/swc-linux-x64-gnu": {
-      "version": "15.5.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-15.5.3.tgz",
-      "integrity": "sha512-lDtOOScYDZxI2BENN9m0pfVPJDSuUkAD1YXSvlJF0DKwZt0WlA7T7o3wrcEr4Q+iHYGzEaVuZcsIbCps4K27sA==",
+      "version": "16.1.6",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-16.1.6.tgz",
+      "integrity": "sha512-2eEBDkFlMMNQnkTyPBhQOAyn2qMxyG2eE7GPH2WIDGEpEILcBPI/jdSv4t6xupSP+ot/jkfrCShLAa7+ZUPcJQ==",
       "cpu": [
         "x64"
       ],
@@ -2394,9 +2442,9 @@
       }
     },
     "node_modules/@next/swc-linux-x64-musl": {
-      "version": "15.5.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-15.5.3.tgz",
-      "integrity": "sha512-9vWVUnsx9PrY2NwdVRJ4dUURAQ8Su0sLRPqcCCxtX5zIQUBES12eRVHq6b70bbfaVaxIDGJN2afHui0eDm+cLg==",
+      "version": "16.1.6",
+      "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-16.1.6.tgz",
+      "integrity": "sha512-oicJwRlyOoZXVlxmIMaTq7f8pN9QNbdes0q2FXfRsPhfCi8n8JmOZJm5oo1pwDaFbnnD421rVU409M3evFbIqg==",
       "cpu": [
         "x64"
       ],
@@ -2410,9 +2458,9 @@
       }
     },
     "node_modules/@next/swc-win32-arm64-msvc": {
-      "version": "15.5.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-15.5.3.tgz",
-      "integrity": "sha512-1CU20FZzY9LFQigRi6jM45oJMU3KziA5/sSG+dXeVaTm661snQP6xu3ykGxxwU5sLG3sh14teO/IOEPVsQMRfA==",
+      "version": "16.1.6",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-16.1.6.tgz",
+      "integrity": "sha512-gQmm8izDTPgs+DCWH22kcDmuUp7NyiJgEl18bcr8irXA5N2m2O+JQIr6f3ct42GOs9c0h8QF3L5SzIxcYAAXXw==",
       "cpu": [
         "arm64"
       ],
@@ -2426,9 +2474,9 @@
       }
     },
     "node_modules/@next/swc-win32-x64-msvc": {
-      "version": "15.5.3",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-15.5.3.tgz",
-      "integrity": "sha512-JMoLAq3n3y5tKXPQwCK5c+6tmwkuFDa2XAxz8Wm4+IVthdBZdZGh+lmiLUHg9f9IDwIQpUjp+ysd6OkYTyZRZw==",
+      "version": "16.1.6",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-16.1.6.tgz",
+      "integrity": "sha512-NRfO39AIrzBnixKbjuo2YiYhB6o9d8v/ymU9m/Xk8cyVk+k7XylniXkHwjs4s70wedVffc6bQNbufk5v0xEm0A==",
       "cpu": [
         "x64"
       ],
@@ -5271,6 +5319,15 @@
       "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true
     },
+    "node_modules/baseline-browser-mapping": {
+      "version": "2.9.19",
+      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.9.19.tgz",
+      "integrity": "sha512-ipDqC8FrAl/76p2SSWKSI+H9tFwm7vYqXQrItCuiVPt26Km0jS+NzSsBWAaBusvSbQcfJG+JitdMm+wZAgTYqg==",
+      "license": "Apache-2.0",
+      "bin": {
+        "baseline-browser-mapping": "dist/cli.js"
+      }
+    },
     "node_modules/brace-expansion": {
       "version": "1.1.12",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
@@ -5630,25 +5687,11 @@
       "integrity": "sha512-lHl4d5/ONEbLlJvaJNtsF/Lz+WvB07u2ycqTYbdrq7UypDXailES4valYb2eWiJFxZlVmpGekfqoxQhzyFdT4Q==",
       "dev": true
     },
-    "node_modules/color": {
-      "version": "4.2.3",
-      "resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
-      "integrity": "sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==",
-      "license": "MIT",
-      "optional": true,
-      "dependencies": {
-        "color-convert": "^2.0.1",
-        "color-string": "^1.9.0"
-      },
-      "engines": {
-        "node": ">=12.5.0"
-      }
-    },
     "node_modules/color-convert": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
       "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-      "devOptional": true,
+      "dev": true,
       "dependencies": {
         "color-name": "~1.1.4"
       },
@@ -5660,18 +5703,7 @@
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
       "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-      "devOptional": true
-    },
-    "node_modules/color-string": {
-      "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/color-string/-/color-string-1.9.1.tgz",
-      "integrity": "sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==",
-      "license": "MIT",
-      "optional": true,
-      "dependencies": {
-        "color-name": "^1.0.0",
-        "simple-swizzle": "^0.2.2"
-      }
+      "dev": true
     },
     "node_modules/colorette": {
       "version": "2.0.20",
@@ -6214,9 +6246,9 @@
       }
     },
     "node_modules/detect-libc": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz",
-      "integrity": "sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==",
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
+      "integrity": "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==",
       "devOptional": true,
       "license": "Apache-2.0",
       "engines": {
@@ -6238,10 +6270,11 @@
       "integrity": "sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ=="
     },
     "node_modules/diff": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
-      "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==",
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.4.tgz",
+      "integrity": "sha512-X07nttJQkwkfKfvTPG/KSnE2OMdcUCao6+eXF3wmnIQRn2aPAHH3VxDbDOdegkd6JbPsXqShpvEOHfAT+nCNwQ==",
       "dev": true,
+      "license": "BSD-3-Clause",
       "engines": {
         "node": ">=0.3.1"
       }
@@ -6691,6 +6724,7 @@
       "resolved": "https://registry.npmjs.org/eslint-config-next/-/eslint-config-next-15.2.4.tgz",
       "integrity": "sha512-v4gYjd4eYIme8qzaJItpR5MMBXJ0/YV07u7eb50kEnlEmX7yhOjdUdzz70v4fiINYRjLf8X8TbogF0k7wlz6sA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@next/eslint-plugin-next": "15.2.4",
         "@rushstack/eslint-patch": "^1.10.3",
@@ -6811,7 +6845,6 @@
       "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.31.0.tgz",
       "integrity": "sha512-ixmkI62Rbc2/w8Vfxyh1jQRTdRTF52VxwRVHl/ykPAmqG+Nb7/kNn+byLP0LxPgI7zWA16Jt82SybJInmMia3A==",
       "dev": true,
-      "peer": true,
       "dependencies": {
         "@rtsao/scc": "^1.1.0",
         "array-includes": "^3.1.8",
@@ -7946,13 +7979,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/is-arrayish": {
-      "version": "0.3.4",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.4.tgz",
-      "integrity": "sha512-m6UrgzFVUYawGBh1dUsWR5M2Clqic9RVXC/9f8ceNlv2IcO9j9J/z8UoCLPqtsPBFNzEpfR3xftohbfqDx8EQA==",
-      "license": "MIT",
-      "optional": true
-    },
     "node_modules/is-async-function": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/is-async-function/-/is-async-function-2.1.1.tgz",
@@ -10035,10 +10061,11 @@
       }
     },
     "node_modules/lodash": {
-      "version": "4.17.21",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
-      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
-      "dev": true
+      "version": "4.17.23",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.23.tgz",
+      "integrity": "sha512-LgVTMpQtIopCi79SJeDiP0TfWi5CNEc/L/aRdTh3yIvmZXTnheWpKjSZhnvMl8iXbC1tFg9gdHHDMLoV7CnG+w==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/lodash.camelcase": {
       "version": "4.3.0",
@@ -10413,13 +10440,14 @@
       "dev": true
     },
     "node_modules/next": {
-      "version": "15.5.3",
-      "resolved": "https://registry.npmjs.org/next/-/next-15.5.3.tgz",
-      "integrity": "sha512-r/liNAx16SQj4D+XH/oI1dlpv9tdKJ6cONYPwwcCC46f2NjpaRWY+EKCzULfgQYV6YKXjHBchff2IZBSlZmJNw==",
+      "version": "16.1.6",
+      "resolved": "https://registry.npmjs.org/next/-/next-16.1.6.tgz",
+      "integrity": "sha512-hkyRkcu5x/41KoqnROkfTm2pZVbKxvbZRuNvKXLRXxs3VfyO0WhY50TQS40EuKO9SW3rBj/sF3WbVwDACeMZyw==",
       "license": "MIT",
       "dependencies": {
-        "@next/env": "15.5.3",
+        "@next/env": "16.1.6",
         "@swc/helpers": "0.5.15",
+        "baseline-browser-mapping": "^2.8.3",
         "caniuse-lite": "^1.0.30001579",
         "postcss": "8.4.31",
         "styled-jsx": "5.1.6"
@@ -10428,18 +10456,18 @@
         "next": "dist/bin/next"
       },
       "engines": {
-        "node": "^18.18.0 || ^19.8.0 || >= 20.0.0"
+        "node": ">=20.9.0"
       },
       "optionalDependencies": {
-        "@next/swc-darwin-arm64": "15.5.3",
-        "@next/swc-darwin-x64": "15.5.3",
-        "@next/swc-linux-arm64-gnu": "15.5.3",
-        "@next/swc-linux-arm64-musl": "15.5.3",
-        "@next/swc-linux-x64-gnu": "15.5.3",
-        "@next/swc-linux-x64-musl": "15.5.3",
-        "@next/swc-win32-arm64-msvc": "15.5.3",
-        "@next/swc-win32-x64-msvc": "15.5.3",
-        "sharp": "^0.34.3"
+        "@next/swc-darwin-arm64": "16.1.6",
+        "@next/swc-darwin-x64": "16.1.6",
+        "@next/swc-linux-arm64-gnu": "16.1.6",
+        "@next/swc-linux-arm64-musl": "16.1.6",
+        "@next/swc-linux-x64-gnu": "16.1.6",
+        "@next/swc-linux-x64-musl": "16.1.6",
+        "@next/swc-win32-arm64-msvc": "16.1.6",
+        "@next/swc-win32-x64-msvc": "16.1.6",
+        "sharp": "^0.34.4"
       },
       "peerDependencies": {
         "@opentelemetry/api": "^1.1.0",
@@ -11215,9 +11243,10 @@
       ]
     },
     "node_modules/react": {
-      "version": "19.1.0",
-      "resolved": "https://registry.npmjs.org/react/-/react-19.1.0.tgz",
-      "integrity": "sha512-FS+XFBNvn3GTAWq26joslQgWNoFu08F4kl0J4CgdNKADkdSGXQyTCnKteIAJy96Br6YbpEU1LSzV5dYtjMkMDg==",
+      "version": "19.2.4",
+      "resolved": "https://registry.npmjs.org/react/-/react-19.2.4.tgz",
+      "integrity": "sha512-9nfp2hYpCwOjAN+8TZFGhtWEwgvWHXqESH8qT89AT/lWklpLON22Lc8pEtnpsZz7VmawabSU0gCjnj8aC0euHQ==",
+      "license": "MIT",
       "peer": true,
       "engines": {
         "node": ">=0.10.0"
@@ -11244,15 +11273,16 @@
       }
     },
     "node_modules/react-dom": {
-      "version": "19.1.0",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.1.0.tgz",
-      "integrity": "sha512-Xs1hdnE+DyKgeHJeJznQmYMIBG3TKIHJJT95Q58nHLSrElKlGQqDTR2HQ9fx5CN/Gk6Vh/kupBTDLU11/nDk/g==",
+      "version": "19.2.4",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.4.tgz",
+      "integrity": "sha512-AXJdLo8kgMbimY95O2aKQqsz2iWi9jMgKJhRBAxECE4IFxfcazB2LmzloIoibJI3C12IlY20+KFaLv+71bUJeQ==",
+      "license": "MIT",
       "peer": true,
       "dependencies": {
-        "scheduler": "^0.26.0"
+        "scheduler": "^0.27.0"
       },
       "peerDependencies": {
-        "react": "^19.1.0"
+        "react": "^19.2.4"
       }
     },
     "node_modules/react-hook-form": {
@@ -11724,14 +11754,15 @@
       }
     },
     "node_modules/scheduler": {
-      "version": "0.26.0",
-      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.26.0.tgz",
-      "integrity": "sha512-NlHwttCI/l5gCPR3D1nNXtWABUmBwvZpEQiD4IXSbIDq8BzLIK/7Ir5gTFSGZDUu37K5cMNp0hFtzO38sC7gWA=="
+      "version": "0.27.0",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz",
+      "integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==",
+      "license": "MIT"
     },
     "node_modules/semver": {
-      "version": "7.7.2",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
-      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
+      "version": "7.7.4",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.4.tgz",
+      "integrity": "sha512-vFKC2IEtQnVhpT78h1Yp8wzwrf8CM+MzKMHGJZfBtzhZNycRFnXsHk6E5TxIkkMsgNS7mdX3AGB7x2QM2di4lA==",
       "license": "ISC",
       "bin": {
         "semver": "bin/semver.js"
@@ -11787,16 +11818,16 @@
       }
     },
     "node_modules/sharp": {
-      "version": "0.34.3",
-      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.34.3.tgz",
-      "integrity": "sha512-eX2IQ6nFohW4DbvHIOLRB3MHFpYqaqvXd3Tp5e/T/dSH83fxaNJQRvDMhASmkNTsNTVF2/OOopzRCt7xokgPfg==",
+      "version": "0.34.5",
+      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.34.5.tgz",
+      "integrity": "sha512-Ou9I5Ft9WNcCbXrU9cMgPBcCK8LiwLqcbywW3t4oDV37n1pzpuNLsYiAV8eODnjbtQlSDwZ2cUEeQz4E54Hltg==",
       "hasInstallScript": true,
       "license": "Apache-2.0",
       "optional": true,
       "dependencies": {
-        "color": "^4.2.3",
-        "detect-libc": "^2.0.4",
-        "semver": "^7.7.2"
+        "@img/colour": "^1.0.0",
+        "detect-libc": "^2.1.2",
+        "semver": "^7.7.3"
       },
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
@@ -11805,28 +11836,30 @@
         "url": "https://opencollective.com/libvips"
       },
       "optionalDependencies": {
-        "@img/sharp-darwin-arm64": "0.34.3",
-        "@img/sharp-darwin-x64": "0.34.3",
-        "@img/sharp-libvips-darwin-arm64": "1.2.0",
-        "@img/sharp-libvips-darwin-x64": "1.2.0",
-        "@img/sharp-libvips-linux-arm": "1.2.0",
-        "@img/sharp-libvips-linux-arm64": "1.2.0",
-        "@img/sharp-libvips-linux-ppc64": "1.2.0",
-        "@img/sharp-libvips-linux-s390x": "1.2.0",
-        "@img/sharp-libvips-linux-x64": "1.2.0",
-        "@img/sharp-libvips-linuxmusl-arm64": "1.2.0",
-        "@img/sharp-libvips-linuxmusl-x64": "1.2.0",
-        "@img/sharp-linux-arm": "0.34.3",
-        "@img/sharp-linux-arm64": "0.34.3",
-        "@img/sharp-linux-ppc64": "0.34.3",
-        "@img/sharp-linux-s390x": "0.34.3",
-        "@img/sharp-linux-x64": "0.34.3",
-        "@img/sharp-linuxmusl-arm64": "0.34.3",
-        "@img/sharp-linuxmusl-x64": "0.34.3",
-        "@img/sharp-wasm32": "0.34.3",
-        "@img/sharp-win32-arm64": "0.34.3",
-        "@img/sharp-win32-ia32": "0.34.3",
-        "@img/sharp-win32-x64": "0.34.3"
+        "@img/sharp-darwin-arm64": "0.34.5",
+        "@img/sharp-darwin-x64": "0.34.5",
+        "@img/sharp-libvips-darwin-arm64": "1.2.4",
+        "@img/sharp-libvips-darwin-x64": "1.2.4",
+        "@img/sharp-libvips-linux-arm": "1.2.4",
+        "@img/sharp-libvips-linux-arm64": "1.2.4",
+        "@img/sharp-libvips-linux-ppc64": "1.2.4",
+        "@img/sharp-libvips-linux-riscv64": "1.2.4",
+        "@img/sharp-libvips-linux-s390x": "1.2.4",
+        "@img/sharp-libvips-linux-x64": "1.2.4",
+        "@img/sharp-libvips-linuxmusl-arm64": "1.2.4",
+        "@img/sharp-libvips-linuxmusl-x64": "1.2.4",
+        "@img/sharp-linux-arm": "0.34.5",
+        "@img/sharp-linux-arm64": "0.34.5",
+        "@img/sharp-linux-ppc64": "0.34.5",
+        "@img/sharp-linux-riscv64": "0.34.5",
+        "@img/sharp-linux-s390x": "0.34.5",
+        "@img/sharp-linux-x64": "0.34.5",
+        "@img/sharp-linuxmusl-arm64": "0.34.5",
+        "@img/sharp-linuxmusl-x64": "0.34.5",
+        "@img/sharp-wasm32": "0.34.5",
+        "@img/sharp-win32-arm64": "0.34.5",
+        "@img/sharp-win32-ia32": "0.34.5",
+        "@img/sharp-win32-x64": "0.34.5"
       }
     },
     "node_modules/shebang-command": {
@@ -11934,16 +11967,6 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/simple-swizzle": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.4.tgz",
-      "integrity": "sha512-nAu1WFPQSMNr2Zn9PGSZK9AGn4t/y97lEm+MXTtUDwfP0ksAIX4nO+6ruD9Jwut4C49SB1Ws+fbXsm/yScWOHw==",
-      "license": "MIT",
-      "optional": true,
-      "dependencies": {
-        "is-arrayish": "^0.3.1"
-      }
-    },
     "node_modules/sisteransi": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/sisteransi/-/sisteransi-1.0.5.tgz",
diff --git a/package.json b/package.json
index c0541f50..88283869 100644
--- a/package.json
+++ b/package.json
@@ -29,11 +29,11 @@
     "date-fns": "4.1.0",
     "jsonwebtoken": "9.0.2",
     "lucide-react": "0.531.0",
-    "next": "15.5.3",
+    "next": "16.1.6",
     "prettier": "3.6.2",
-    "react": "^19.0.0",
+    "react": "19.2.4",
     "react-day-picker": "9.8.0",
-    "react-dom": "^19.0.0",
+    "react-dom": "19.2.4",
     "react-hook-form": "7.55.0",
     "recharts": "3.1.0",
     "sonner": "2.0.4",
diff --git a/src/middleware.ts b/src/proxy.ts
similarity index 94%
rename from src/middleware.ts
rename to src/proxy.ts
index c2aaadad..e4bf33ee 100644
--- a/src/middleware.ts
+++ b/src/proxy.ts
@@ -3,7 +3,7 @@ import { NextResponse } from 'next/server'
 
 import { ROUTES } from './constants/routes'
 
-export async function middleware(request: NextRequest) {
+export function proxy(request: NextRequest) {
   const cookies = request.cookies
   const pathname = request.nextUrl.pathname
 
diff --git a/tsconfig.json b/tsconfig.json
index a2580271..984ebe5e 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -11,14 +11,24 @@
     "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "jsx": "preserve",
+    "jsx": "react-jsx",
     "incremental": true,
-    "plugins": [{ "name": "next" }],
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ],
     "paths": {
       "@/*": ["./src/*"],
       "@images/*": ["./public/images/*"]
     }
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    ".next/types/**/*.ts",
+    ".next/dev/types/**/*.ts"
+  ],
   "exclude": ["node_modules"]
 }

From 9dcbaaa2461b78ad745697acaaceb620eaed53f6 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 16 Feb 2026 10:37:53 -0300
Subject: [PATCH 66/77] feat(build): update eslint version and config

---
 eslint.config.mjs |  53 ++---
 package-lock.json | 560 +++++++++++++++++++++++++++++++++++++++-------
 package.json      |   4 +-
 3 files changed, 501 insertions(+), 116 deletions(-)

diff --git a/eslint.config.mjs b/eslint.config.mjs
index f3c0bff3..d7948163 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -1,48 +1,33 @@
-import { dirname } from 'node:path'
-import { fileURLToPath } from 'node:url'
-
-import { FlatCompat } from '@eslint/eslintrc'
-import pluginJs from '@eslint/js'
-import eslintConfigPrettier from 'eslint-config-prettier'
+import { defineConfig, globalIgnores } from 'eslint/config'
+import nextVitals from 'eslint-config-next/core-web-vitals'
+import nextTs from 'eslint-config-next/typescript'
+import prettier from 'eslint-config-prettier/flat'
 import eslintPluginPrettier from 'eslint-plugin-prettier'
-import pluginReact from 'eslint-plugin-react'
 import simpleImportSort from 'eslint-plugin-simple-import-sort'
-import tseslint from 'typescript-eslint'
-
-const __filename = fileURLToPath(import.meta.url)
-const __dirname = dirname(__filename)
-
-const compat = new FlatCompat({
-  baseDirectory: __dirname,
-})
 
-const eslintConfig = [
-  ...compat.extends('next/core-web-vitals', 'next/typescript'),
-  eslintConfigPrettier,
-  pluginJs.configs.recommended,
-  pluginReact.configs.flat.recommended,
-  ...tseslint.configs.recommended,
-  {
-    ignores: ['.next/**', 'node_modules/**'],
-  },
+const eslintConfig = defineConfig([
+  ...nextVitals,
+  ...nextTs,
+  prettier,
+  globalIgnores([
+    '.next/**',
+    'out/**',
+    'build/**',
+    'next-env.d.ts',
+    'node_modules/**',
+  ]),
   {
-    files: ['**/*.{js,mjs,cjs,ts,jsx,tsx}', './*.{js,mjs,cjs,ts,jsx,tsx}'],
+    files: ['**/*.{js,mjs,cjs,ts,jsx,tsx}'],
     plugins: {
-      prettier: eslintPluginPrettier,
       'simple-import-sort': simpleImportSort,
-    },
-    settings: {
-      react: { version: 'detect' },
+      prettier: eslintPluginPrettier,
     },
     rules: {
-      'prettier/prettier': 'error',
       'simple-import-sort/imports': 'error',
       'simple-import-sort/exports': 'error',
-      // ignore
-      'react/react-in-jsx-scope': 'off',
-      '@typescript-eslint/no-empty-object-type': 'off',
+      'prettier/prettier': 'error',
     },
   },
-]
+])
 
 export default eslintConfig
diff --git a/package-lock.json b/package-lock.json
index de61c707..2478a2fc 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -47,7 +47,7 @@
         "@types/react": "^19",
         "@types/react-dom": "^19",
         "eslint": "9.33.0",
-        "eslint-config-next": "15.2.4",
+        "eslint-config-next": "16.1.6",
         "eslint-config-prettier": "10.1.1",
         "eslint-plugin-prettier": "5.2.6",
         "eslint-plugin-react": "7.37.5",
@@ -1098,10 +1098,11 @@
       }
     },
     "node_modules/@eslint-community/eslint-utils": {
-      "version": "4.5.1",
-      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.5.1.tgz",
-      "integrity": "sha512-soEIOALTfTK6EjmKMMoLugwaP0rzkad90iIWd1hMO9ARkSAyjfMfkRRhLvD5qH7vvM0Cg72pieUfR6yh6XxC4w==",
+      "version": "4.9.1",
+      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.9.1.tgz",
+      "integrity": "sha512-phrYmNiYppR7znFEdqgfWHXR6NCkZEK7hwWDHZUjit/2/U0r6XvkDl0SYnoM51Hq7FhCGdLDT6zxCCOY1hexsQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "eslint-visitor-keys": "^3.4.3"
       },
@@ -1128,10 +1129,11 @@
       }
     },
     "node_modules/@eslint-community/regexpp": {
-      "version": "4.12.1",
-      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.12.1.tgz",
-      "integrity": "sha512-CCZCDJuduB9OUkFkY2IgppNZMi2lBQgD2qzwXkEia16cge2pijY/aXi96CJMquDMn3nJdlPV1A5KrJEXwfLNzQ==",
+      "version": "4.12.2",
+      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.12.2.tgz",
+      "integrity": "sha512-EriSTlt5OC9/7SXkRSCAhfSxxoSUgBm33OH+IkwbdpgoqsSsUg7y3uh+IICI/Qg4BBWr3U2i39RpmycbxMq4ew==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": "^12.0.0 || ^14.0.0 || >=16.0.0"
       }
@@ -2353,10 +2355,11 @@
       "license": "MIT"
     },
     "node_modules/@next/eslint-plugin-next": {
-      "version": "15.2.4",
-      "resolved": "https://registry.npmjs.org/@next/eslint-plugin-next/-/eslint-plugin-next-15.2.4.tgz",
-      "integrity": "sha512-O8ScvKtnxkp8kL9TpJTTKnMqlkZnS+QxwoQnJwPGBxjBbzd6OVVPEJ5/pMNrktSyXQD/chEfzfFzYLM6JANOOQ==",
+      "version": "16.1.6",
+      "resolved": "https://registry.npmjs.org/@next/eslint-plugin-next/-/eslint-plugin-next-16.1.6.tgz",
+      "integrity": "sha512-/Qq3PTagA6+nYVfryAtQ7/9FEr/6YVyvOtl6rZnGsbReGLf0jZU6gkpr1FuChAQpvV46a78p4cmHOVP8mbfSMQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "fast-glob": "3.3.1"
       }
@@ -3653,12 +3656,6 @@
       "integrity": "sha512-zt6OdqaDoOnJ1ZYsCYGt9YmWzDXl4vQdKTyJev62gFhRGKdx7mcT54V9KIjg+d2wi9EXsPvAPKe7i7WjfVWB8g==",
       "dev": true
     },
-    "node_modules/@rushstack/eslint-patch": {
-      "version": "1.11.0",
-      "resolved": "https://registry.npmjs.org/@rushstack/eslint-patch/-/eslint-patch-1.11.0.tgz",
-      "integrity": "sha512-zxnHvoMQVqewTJr/W4pKjF0bMGiKJv1WX7bSrkl46Hg0QjESbzBROWK0Wg4RphzSOS5Jiy7eFimmM3UgMrMZbQ==",
-      "dev": true
-    },
     "node_modules/@sinclair/typebox": {
       "version": "0.27.8",
       "resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.27.8.tgz",
@@ -4447,6 +4444,42 @@
         "typescript": ">=4.8.4 <5.9.0"
       }
     },
+    "node_modules/@typescript-eslint/project-service": {
+      "version": "8.55.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.55.0.tgz",
+      "integrity": "sha512-zRcVVPFUYWa3kNnjaZGXSu3xkKV1zXy8M4nO/pElzQhFweb7PPtluDLQtKArEOGmjXoRjnUZ29NjOiF0eCDkcQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/tsconfig-utils": "^8.55.0",
+        "@typescript-eslint/types": "^8.55.0",
+        "debug": "^4.4.3"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/project-service/node_modules/@typescript-eslint/types": {
+      "version": "8.55.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.55.0.tgz",
+      "integrity": "sha512-ujT0Je8GI5BJWi+/mMoR0wxwVEQaxM+pi30xuMiJETlX80OPovb2p9E8ss87gnSVtYXtJoU9U1Cowcr6w2FE0w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
     "node_modules/@typescript-eslint/scope-manager": {
       "version": "8.29.0",
       "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.29.0.tgz",
@@ -4464,6 +4497,23 @@
         "url": "https://opencollective.com/typescript-eslint"
       }
     },
+    "node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.55.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.55.0.tgz",
+      "integrity": "sha512-1R9cXqY7RQd7WuqSN47PK9EDpgFUK3VqdmbYrvWJZYDd0cavROGn+74ktWBlmJ13NXUQKlZ/iAEQHI/V0kKe0Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
     "node_modules/@typescript-eslint/type-utils": {
       "version": "8.29.0",
       "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.29.0.tgz",
@@ -5007,17 +5057,20 @@
       "dev": true
     },
     "node_modules/array-includes": {
-      "version": "3.1.8",
-      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.8.tgz",
-      "integrity": "sha512-itaWrbYbqpGXkGhZPGUulwnhVf5Hpy1xiCFsGqyIGglbBxmG5vSjxQen3/WGOjPpNEv1RtBLKxbmVXm8HpJStQ==",
+      "version": "3.1.9",
+      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.9.tgz",
+      "integrity": "sha512-FmeCCAenzH0KH381SPT5FZmiA/TmpndpcaShhfgEN9eCVjnFBqq3l1xrI42y8+PPLI6hypzou4GXw00WHmPBLQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.7",
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
         "define-properties": "^1.2.1",
-        "es-abstract": "^1.23.2",
-        "es-object-atoms": "^1.0.0",
-        "get-intrinsic": "^1.2.4",
-        "is-string": "^1.0.7"
+        "es-abstract": "^1.24.0",
+        "es-object-atoms": "^1.1.1",
+        "get-intrinsic": "^1.3.0",
+        "is-string": "^1.1.1",
+        "math-intrinsics": "^1.1.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -6136,10 +6189,11 @@
       "integrity": "sha512-hTIP/z+t+qKwBDcmmsnmjWTduxCg+5KfdqWQvb2X/8C9+knYY6epN/pfxdDuyVlSVeFz0sM5eEfwIUQ70U4ckg=="
     },
     "node_modules/debug": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
-      "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==",
+      "version": "4.4.3",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
+      "integrity": "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "ms": "^2.1.3"
       },
@@ -6440,27 +6494,28 @@
       "dev": true
     },
     "node_modules/es-abstract": {
-      "version": "1.23.9",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.23.9.tgz",
-      "integrity": "sha512-py07lI0wjxAC/DcfK1S6G7iANonniZwTISvdPzk9hzeH0IZIshbuuFxLIU96OyF89Yb9hiqWn8M/bY83KY5vzA==",
+      "version": "1.24.1",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.24.1.tgz",
+      "integrity": "sha512-zHXBLhP+QehSSbsS9Pt23Gg964240DPd6QCf8WpkqEXxQ7fhdZzYsocOr5u7apWonsS5EjZDmTF+/slGMyasvw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "array-buffer-byte-length": "^1.0.2",
         "arraybuffer.prototype.slice": "^1.0.4",
         "available-typed-arrays": "^1.0.7",
         "call-bind": "^1.0.8",
-        "call-bound": "^1.0.3",
+        "call-bound": "^1.0.4",
         "data-view-buffer": "^1.0.2",
         "data-view-byte-length": "^1.0.2",
         "data-view-byte-offset": "^1.0.1",
         "es-define-property": "^1.0.1",
         "es-errors": "^1.3.0",
-        "es-object-atoms": "^1.0.0",
+        "es-object-atoms": "^1.1.1",
         "es-set-tostringtag": "^2.1.0",
         "es-to-primitive": "^1.3.0",
         "function.prototype.name": "^1.1.8",
-        "get-intrinsic": "^1.2.7",
-        "get-proto": "^1.0.0",
+        "get-intrinsic": "^1.3.0",
+        "get-proto": "^1.0.1",
         "get-symbol-description": "^1.1.0",
         "globalthis": "^1.0.4",
         "gopd": "^1.2.0",
@@ -6472,21 +6527,24 @@
         "is-array-buffer": "^3.0.5",
         "is-callable": "^1.2.7",
         "is-data-view": "^1.0.2",
+        "is-negative-zero": "^2.0.3",
         "is-regex": "^1.2.1",
+        "is-set": "^2.0.3",
         "is-shared-array-buffer": "^1.0.4",
         "is-string": "^1.1.1",
         "is-typed-array": "^1.1.15",
-        "is-weakref": "^1.1.0",
+        "is-weakref": "^1.1.1",
         "math-intrinsics": "^1.1.0",
-        "object-inspect": "^1.13.3",
+        "object-inspect": "^1.13.4",
         "object-keys": "^1.1.1",
         "object.assign": "^4.1.7",
         "own-keys": "^1.0.1",
-        "regexp.prototype.flags": "^1.5.3",
+        "regexp.prototype.flags": "^1.5.4",
         "safe-array-concat": "^1.1.3",
         "safe-push-apply": "^1.0.0",
         "safe-regex-test": "^1.1.0",
         "set-proto": "^1.0.0",
+        "stop-iteration-iterator": "^1.1.0",
         "string.prototype.trim": "^1.2.10",
         "string.prototype.trimend": "^1.0.9",
         "string.prototype.trimstart": "^1.0.8",
@@ -6495,7 +6553,7 @@
         "typed-array-byte-offset": "^1.0.4",
         "typed-array-length": "^1.0.7",
         "unbox-primitive": "^1.1.0",
-        "which-typed-array": "^1.1.18"
+        "which-typed-array": "^1.1.19"
       },
       "engines": {
         "node": ">= 0.4"
@@ -6720,25 +6778,24 @@
       }
     },
     "node_modules/eslint-config-next": {
-      "version": "15.2.4",
-      "resolved": "https://registry.npmjs.org/eslint-config-next/-/eslint-config-next-15.2.4.tgz",
-      "integrity": "sha512-v4gYjd4eYIme8qzaJItpR5MMBXJ0/YV07u7eb50kEnlEmX7yhOjdUdzz70v4fiINYRjLf8X8TbogF0k7wlz6sA==",
+      "version": "16.1.6",
+      "resolved": "https://registry.npmjs.org/eslint-config-next/-/eslint-config-next-16.1.6.tgz",
+      "integrity": "sha512-vKq40io2B0XtkkNDYyleATwblNt8xuh3FWp8SpSz3pt7P01OkBFlKsJZ2mWt5WsCySlDQLckb1zMY9yE9Qy0LA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@next/eslint-plugin-next": "15.2.4",
-        "@rushstack/eslint-patch": "^1.10.3",
-        "@typescript-eslint/eslint-plugin": "^5.4.2 || ^6.0.0 || ^7.0.0 || ^8.0.0",
-        "@typescript-eslint/parser": "^5.4.2 || ^6.0.0 || ^7.0.0 || ^8.0.0",
+        "@next/eslint-plugin-next": "16.1.6",
         "eslint-import-resolver-node": "^0.3.6",
         "eslint-import-resolver-typescript": "^3.5.2",
-        "eslint-plugin-import": "^2.31.0",
+        "eslint-plugin-import": "^2.32.0",
         "eslint-plugin-jsx-a11y": "^6.10.0",
         "eslint-plugin-react": "^7.37.0",
-        "eslint-plugin-react-hooks": "^5.0.0"
+        "eslint-plugin-react-hooks": "^7.0.0",
+        "globals": "16.4.0",
+        "typescript-eslint": "^8.46.0"
       },
       "peerDependencies": {
-        "eslint": "^7.23.0 || ^8.0.0 || ^9.0.0",
+        "eslint": ">=9.0.0",
         "typescript": ">=3.3.1"
       },
       "peerDependenciesMeta": {
@@ -6747,6 +6804,261 @@
         }
       }
     },
+    "node_modules/eslint-config-next/node_modules/@typescript-eslint/eslint-plugin": {
+      "version": "8.55.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.55.0.tgz",
+      "integrity": "sha512-1y/MVSz0NglV1ijHC8OT49mPJ4qhPYjiK08YUQVbIOyu+5k862LKUHFkpKHWu//zmr7hDR2rhwUm6gnCGNmGBQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/regexpp": "^4.12.2",
+        "@typescript-eslint/scope-manager": "8.55.0",
+        "@typescript-eslint/type-utils": "8.55.0",
+        "@typescript-eslint/utils": "8.55.0",
+        "@typescript-eslint/visitor-keys": "8.55.0",
+        "ignore": "^7.0.5",
+        "natural-compare": "^1.4.0",
+        "ts-api-utils": "^2.4.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "@typescript-eslint/parser": "^8.55.0",
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/eslint-config-next/node_modules/@typescript-eslint/parser": {
+      "version": "8.55.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.55.0.tgz",
+      "integrity": "sha512-4z2nCSBfVIMnbuu8uinj+f0o4qOeggYJLbjpPHka3KH1om7e+H9yLKTYgksTaHcGco+NClhhY2vyO3HsMH1RGw==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@typescript-eslint/scope-manager": "8.55.0",
+        "@typescript-eslint/types": "8.55.0",
+        "@typescript-eslint/typescript-estree": "8.55.0",
+        "@typescript-eslint/visitor-keys": "8.55.0",
+        "debug": "^4.4.3"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/eslint-config-next/node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.55.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.55.0.tgz",
+      "integrity": "sha512-fVu5Omrd3jeqeQLiB9f1YsuK/iHFOwb04bCtY4BSCLgjNbOD33ZdV6KyEqplHr+IlpgT0QTZ/iJ+wT7hvTx49Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.55.0",
+        "@typescript-eslint/visitor-keys": "8.55.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/eslint-config-next/node_modules/@typescript-eslint/type-utils": {
+      "version": "8.55.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.55.0.tgz",
+      "integrity": "sha512-x1iH2unH4qAt6I37I2CGlsNs+B9WGxurP2uyZLRz6UJoZWDBx9cJL1xVN/FiOmHEONEg6RIufdvyT0TEYIgC5g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.55.0",
+        "@typescript-eslint/typescript-estree": "8.55.0",
+        "@typescript-eslint/utils": "8.55.0",
+        "debug": "^4.4.3",
+        "ts-api-utils": "^2.4.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/eslint-config-next/node_modules/@typescript-eslint/types": {
+      "version": "8.55.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.55.0.tgz",
+      "integrity": "sha512-ujT0Je8GI5BJWi+/mMoR0wxwVEQaxM+pi30xuMiJETlX80OPovb2p9E8ss87gnSVtYXtJoU9U1Cowcr6w2FE0w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/eslint-config-next/node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.55.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.55.0.tgz",
+      "integrity": "sha512-EwrH67bSWdx/3aRQhCoxDaHM+CrZjotc2UCCpEDVqfCE+7OjKAGWNY2HsCSTEVvWH2clYQK8pdeLp42EVs+xQw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/project-service": "8.55.0",
+        "@typescript-eslint/tsconfig-utils": "8.55.0",
+        "@typescript-eslint/types": "8.55.0",
+        "@typescript-eslint/visitor-keys": "8.55.0",
+        "debug": "^4.4.3",
+        "minimatch": "^9.0.5",
+        "semver": "^7.7.3",
+        "tinyglobby": "^0.2.15",
+        "ts-api-utils": "^2.4.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/eslint-config-next/node_modules/@typescript-eslint/utils": {
+      "version": "8.55.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.55.0.tgz",
+      "integrity": "sha512-BqZEsnPGdYpgyEIkDC1BadNY8oMwckftxBT+C8W0g1iKPdeqKZBtTfnvcq0nf60u7MkjFO8RBvpRGZBPw4L2ow==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.9.1",
+        "@typescript-eslint/scope-manager": "8.55.0",
+        "@typescript-eslint/types": "8.55.0",
+        "@typescript-eslint/typescript-estree": "8.55.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/eslint-config-next/node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.55.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.55.0.tgz",
+      "integrity": "sha512-AxNRwEie8Nn4eFS1FzDMJWIISMGoXMb037sgCBJ3UR6o0fQTzr2tqN9WT+DkWJPhIdQCfV7T6D387566VtnCJA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.55.0",
+        "eslint-visitor-keys": "^4.2.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/eslint-config-next/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/eslint-config-next/node_modules/globals": {
+      "version": "16.4.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-16.4.0.tgz",
+      "integrity": "sha512-ob/2LcVVaVGCYN+r14cnwnoDPUufjiYgSqRhiFD0Q1iI4Odora5RE8Iv1D24hAz5oMophRGkGz+yuvQmmUMnMw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/eslint-config-next/node_modules/ignore": {
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz",
+      "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/eslint-config-next/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/eslint-config-next/node_modules/typescript-eslint": {
+      "version": "8.55.0",
+      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.55.0.tgz",
+      "integrity": "sha512-HE4wj+r5lmDVS9gdaN0/+iqNvPZwGfnJ5lZuz7s5vLlg9ODw0bIiiETaios9LvFI1U94/VBXGm3CB2Y5cNFMpw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/eslint-plugin": "8.55.0",
+        "@typescript-eslint/parser": "8.55.0",
+        "@typescript-eslint/typescript-estree": "8.55.0",
+        "@typescript-eslint/utils": "8.55.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
     "node_modules/eslint-config-prettier": {
       "version": "10.1.1",
       "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-10.1.1.tgz",
@@ -6815,10 +7127,11 @@
       }
     },
     "node_modules/eslint-module-utils": {
-      "version": "2.12.0",
-      "resolved": "https://registry.npmjs.org/eslint-module-utils/-/eslint-module-utils-2.12.0.tgz",
-      "integrity": "sha512-wALZ0HFoytlyh/1+4wuZ9FJCD/leWHQzzrxJ8+rebyReSLk7LApMyd3WJaLVoN+D5+WIdJyDK1c6JnE65V4Zyg==",
+      "version": "2.12.1",
+      "resolved": "https://registry.npmjs.org/eslint-module-utils/-/eslint-module-utils-2.12.1.tgz",
+      "integrity": "sha512-L8jSWTze7K2mTg0vos/RuLRS5soomksDPoJLXIslC7c8Wmut3bx7CPpJijDcBZtxQ5lrbUdM+s0OlNbz0DCDNw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "debug": "^3.2.7"
       },
@@ -6836,34 +7149,36 @@
       "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
       "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "ms": "^2.1.1"
       }
     },
     "node_modules/eslint-plugin-import": {
-      "version": "2.31.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.31.0.tgz",
-      "integrity": "sha512-ixmkI62Rbc2/w8Vfxyh1jQRTdRTF52VxwRVHl/ykPAmqG+Nb7/kNn+byLP0LxPgI7zWA16Jt82SybJInmMia3A==",
+      "version": "2.32.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.32.0.tgz",
+      "integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@rtsao/scc": "^1.1.0",
-        "array-includes": "^3.1.8",
-        "array.prototype.findlastindex": "^1.2.5",
-        "array.prototype.flat": "^1.3.2",
-        "array.prototype.flatmap": "^1.3.2",
+        "array-includes": "^3.1.9",
+        "array.prototype.findlastindex": "^1.2.6",
+        "array.prototype.flat": "^1.3.3",
+        "array.prototype.flatmap": "^1.3.3",
         "debug": "^3.2.7",
         "doctrine": "^2.1.0",
         "eslint-import-resolver-node": "^0.3.9",
-        "eslint-module-utils": "^2.12.0",
+        "eslint-module-utils": "^2.12.1",
         "hasown": "^2.0.2",
-        "is-core-module": "^2.15.1",
+        "is-core-module": "^2.16.1",
         "is-glob": "^4.0.3",
         "minimatch": "^3.1.2",
         "object.fromentries": "^2.0.8",
         "object.groupby": "^1.0.3",
-        "object.values": "^1.2.0",
+        "object.values": "^1.2.1",
         "semver": "^6.3.1",
-        "string.prototype.trimend": "^1.0.8",
+        "string.prototype.trimend": "^1.0.9",
         "tsconfig-paths": "^3.15.0"
       },
       "engines": {
@@ -6983,17 +7298,49 @@
       }
     },
     "node_modules/eslint-plugin-react-hooks": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-5.2.0.tgz",
-      "integrity": "sha512-+f15FfK64YQwZdJNELETdn5ibXEUQmW1DZL6KXhNnc2heoy/sg9VJJeT7n8TlMWouzWqSWavFkIhHyIbIAEapg==",
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-7.0.1.tgz",
+      "integrity": "sha512-O0d0m04evaNzEPoSW+59Mezf8Qt0InfgGIBJnpC0h3NH/WjUAR7BIKUfysC6todmtiZ/A0oUVS8Gce0WhBrHsA==",
       "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/core": "^7.24.4",
+        "@babel/parser": "^7.24.4",
+        "hermes-parser": "^0.25.1",
+        "zod": "^3.25.0 || ^4.0.0",
+        "zod-validation-error": "^3.5.0 || ^4.0.0"
+      },
       "engines": {
-        "node": ">=10"
+        "node": ">=18"
       },
       "peerDependencies": {
         "eslint": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0 || ^9.0.0"
       }
     },
+    "node_modules/eslint-plugin-react-hooks/node_modules/zod": {
+      "version": "4.3.6",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-4.3.6.tgz",
+      "integrity": "sha512-rftlrkhHZOcjDwkGlnUtZZkvaPHCsDATp4pGpuOOMDaTdDDXF91wuVDJoWoPsKX/3YPQ5fHuF3STjcYyKr+Qhg==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "funding": {
+        "url": "https://github.com/sponsors/colinhacks"
+      }
+    },
+    "node_modules/eslint-plugin-react-hooks/node_modules/zod-validation-error": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/zod-validation-error/-/zod-validation-error-4.0.2.tgz",
+      "integrity": "sha512-Q6/nZLe6jxuU80qb/4uJ4t5v2VEZ44lzQjPDhYJNztRQ4wyWc6VF3D3Kb/fAuPetZQnhS3hnajCf9CsWesghLQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "zod": "^3.25.0 || ^4.0.0"
+      }
+    },
     "node_modules/eslint-plugin-react/node_modules/resolve": {
       "version": "2.0.0-next.5",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-2.0.0-next.5.tgz",
@@ -7203,6 +7550,7 @@
       "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.1.tgz",
       "integrity": "sha512-kNFPyjhh5cKjrUltxs+wFx+ZkbRaxxmZ+X0ZU31SOsxCEtP9VPgtq2teZw1DebupL5GmDaNQ6yKMMVcM41iqDg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@nodelib/fs.stat": "^2.0.2",
         "@nodelib/fs.walk": "^1.2.3",
@@ -7219,6 +7567,7 @@
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
       "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
       "dev": true,
+      "license": "ISC",
       "dependencies": {
         "is-glob": "^4.0.1"
       },
@@ -7750,6 +8099,23 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/hermes-estree": {
+      "version": "0.25.1",
+      "resolved": "https://registry.npmjs.org/hermes-estree/-/hermes-estree-0.25.1.tgz",
+      "integrity": "sha512-0wUoCcLp+5Ev5pDW2OriHC2MJCbwLwuRx+gAqMTOkGKJJiBCLjtrvy4PWUGn6MIVefecRpzoOZ/UV6iGdOr+Cw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/hermes-parser": {
+      "version": "0.25.1",
+      "resolved": "https://registry.npmjs.org/hermes-parser/-/hermes-parser-0.25.1.tgz",
+      "integrity": "sha512-6pEjquH3rqaI6cYAXYPcz9MS4rY6R4ngRgrgfDshRptUZIc3lw0MCIJIGDj9++mfySOuPTHB4nrSW99BCvOPIA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "hermes-estree": "0.25.1"
+      }
+    },
     "node_modules/html-encoding-sniffer": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-3.0.0.tgz",
@@ -8185,6 +8551,19 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/is-negative-zero": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.3.tgz",
+      "integrity": "sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-number": {
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
@@ -12088,6 +12467,20 @@
         "node": ">=8"
       }
     },
+    "node_modules/stop-iteration-iterator": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/stop-iteration-iterator/-/stop-iteration-iterator-1.1.0.tgz",
+      "integrity": "sha512-eLoXW/DHyl62zxY4SCaIgnRhuMr6ri4juEYARS8E6sCEqzKpOiE521Ucofdx+KnDZl5xmvGYaaKCk5FEOxJCoQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "internal-slot": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/string-argv": {
       "version": "0.3.2",
       "resolved": "https://registry.npmjs.org/string-argv/-/string-argv-0.3.2.tgz",
@@ -12464,13 +12857,14 @@
       "dev": true
     },
     "node_modules/tinyglobby": {
-      "version": "0.2.12",
-      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.12.tgz",
-      "integrity": "sha512-qkf4trmKSIiMTs/E63cxH+ojC2unam7rJ0WrauAzpT3ECNTxGRMlaXxVbfxMUC/w0LaYk6jQ4y/nGR9uBO3tww==",
+      "version": "0.2.15",
+      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.15.tgz",
+      "integrity": "sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "fdir": "^6.4.3",
-        "picomatch": "^4.0.2"
+        "fdir": "^6.5.0",
+        "picomatch": "^4.0.3"
       },
       "engines": {
         "node": ">=12.0.0"
@@ -12480,10 +12874,14 @@
       }
     },
     "node_modules/tinyglobby/node_modules/fdir": {
-      "version": "6.4.3",
-      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.3.tgz",
-      "integrity": "sha512-PMXmW2y1hDDfTSRc9gaXIuCCRpuoz3Kaz8cUelp3smouvfT632ozg2vrT6lJsHKKOF59YLbOGfAWGUcKEfRMQw==",
+      "version": "6.5.0",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
+      "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
       "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.0.0"
+      },
       "peerDependencies": {
         "picomatch": "^3 || ^4"
       },
@@ -12494,10 +12892,11 @@
       }
     },
     "node_modules/tinyglobby/node_modules/picomatch": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz",
-      "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==",
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
+      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "dev": true,
+      "license": "MIT",
       "peer": true,
       "engines": {
         "node": ">=12"
@@ -12552,10 +12951,11 @@
       }
     },
     "node_modules/ts-api-utils": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.1.0.tgz",
-      "integrity": "sha512-CUgTZL1irw8u29bzrOD/nH85jqyc74D6SshFgujOIA7osm2Rz7dYH77agkx7H4FBNxDq7Cjf+IjaX/8zwFW+ZQ==",
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.4.0.tgz",
+      "integrity": "sha512-3TaVTaAv2gTiMB35i3FiGJaRfwb3Pyn/j3m/bfAvGe8FB7CF6u+LMYqYlDh7reQf7UNvoTvdfAqHGmPGOSsPmA==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=18.12"
       },
diff --git a/package.json b/package.json
index 88283869..d4fd79e7 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,7 @@
     "start": "next start",
     "lint:prettier:check": "prettier --check .",
     "lint:prettier:fix": "prettier --write .",
-    "lint:eslint:check": "next lint . && tsc --noEmit",
+    "lint:eslint:check": "eslint . && tsc --noEmit",
     "lint:tsc": "tsc --noEmit",
     "prepare": "husky"
   },
@@ -55,7 +55,7 @@
     "@types/react": "^19",
     "@types/react-dom": "^19",
     "eslint": "9.33.0",
-    "eslint-config-next": "15.2.4",
+    "eslint-config-next": "16.1.6",
     "eslint-config-prettier": "10.1.1",
     "eslint-plugin-prettier": "5.2.6",
     "eslint-plugin-react": "7.37.5",

From 2345ad74606bb3d2fc47635661a01b99e4669535 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 16 Feb 2026 10:51:40 -0300
Subject: [PATCH 67/77] refactor(helpers): replace `revalidateTag` with
 `updateTag` from next 16

---
 src/helpers/revalidate-server-cache.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/helpers/revalidate-server-cache.ts b/src/helpers/revalidate-server-cache.ts
index 6f851dc3..383b8023 100644
--- a/src/helpers/revalidate-server-cache.ts
+++ b/src/helpers/revalidate-server-cache.ts
@@ -1,14 +1,14 @@
 'use server'
 
-import { revalidateTag } from 'next/cache'
+import { updateTag } from 'next/cache'
 
 export async function revalidateServerCache(tags: string | string[]) {
   if (Array.isArray(tags)) {
     for (const tag of tags) {
-      revalidateTag(tag)
+      updateTag(tag)
     }
     return
   }
 
-  revalidateTag(tags)
+  updateTag(tags)
 }

From 2cae6467bbad7b2c6a48d85adfd64a76cbaa1530 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 16 Feb 2026 11:01:32 -0300
Subject: [PATCH 68/77] fix(patients): set state form to `view` after updating
 successfully

---
 src/modules/patients/form/index.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/modules/patients/form/index.tsx b/src/modules/patients/form/index.tsx
index 546892fd..44d1b1f6 100644
--- a/src/modules/patients/form/index.tsx
+++ b/src/modules/patients/form/index.tsx
@@ -165,6 +165,7 @@ export function PatientForm({
 
     if (patient) {
       revalidateServerCache(NEXT_CACHE_TAGS.patient(patient.id))
+      setAction('view')
     }
 
     if (isCreateForm) {

From aaf69064b4042b0f4c9858c801550a349cd98749 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 16 Feb 2026 11:04:22 -0300
Subject: [PATCH 69/77] fix(patients): only show support card actions for
 active patients

---
 src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx b/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
index 87999760..c7166177 100644
--- a/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
+++ b/src/app/(dashboard)/pacientes/[id]/informacoes/page.tsx
@@ -72,7 +72,9 @@ export default async function Page({ params }: Readonly<PageParams>) {
                   <Divider flexItem orientation='vertical' />
                   <span>{formatPhoneNumber(support.phone)}</span>
                 </div>
-                <PatientSupportCardActions patientSupport={support} />
+                {isPatientActive && (
+                  <PatientSupportCardActions patientSupport={support} />
+                )}
               </Card>
             ))}
           </div>

From 9a3017bc515b3c9e33149743e20c2a4ba61b032d Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Mon, 16 Feb 2026 22:27:32 -0300
Subject: [PATCH 70/77] feat(auth): implement new user registration

---
 src/actions/auth.ts                           |   2 +-
 src/actions/token.ts                          |  25 ---
 .../{users.ts => users/get-current-user.ts}   |   7 +-
 src/actions/users/get-user-from-token.ts      |  15 ++
 src/app/(dashboard)/perfil/page.tsx           |   2 +-
 src/app/_paciente/_header/index.tsx           |   2 +-
 src/app/_paciente/_header/user-dropdown.tsx   |   2 +-
 .../_paciente/documentos/pendentes/page.tsx   |   2 +-
 src/app/api/sair/route.ts                     |   5 +-
 src/app/conta/cadastrar/page.tsx              |  52 ++++-
 .../conta/cadastrar/sign-up-form-schema.tsx   |  50 -----
 src/app/conta/cadastrar/sign-up-form.tsx      | 108 ----------
 src/components/sidebar/index.tsx              |   2 +-
 src/constants/cookies.ts                      |   4 +
 src/helpers/extract-token-data.ts             |  32 +++
 src/modules/auth/sign-up-form.tsx             | 192 ++++++++++++++++++
 src/proxy.ts                                  |   5 +-
 17 files changed, 303 insertions(+), 204 deletions(-)
 delete mode 100644 src/actions/token.ts
 rename src/actions/{users.ts => users/get-current-user.ts} (76%)
 create mode 100644 src/actions/users/get-user-from-token.ts
 delete mode 100644 src/app/conta/cadastrar/sign-up-form-schema.tsx
 delete mode 100644 src/app/conta/cadastrar/sign-up-form.tsx
 create mode 100644 src/constants/cookies.ts
 create mode 100644 src/helpers/extract-token-data.ts
 create mode 100644 src/modules/auth/sign-up-form.tsx

diff --git a/src/actions/auth.ts b/src/actions/auth.ts
index 020baf2c..f7b7bcd0 100644
--- a/src/actions/auth.ts
+++ b/src/actions/auth.ts
@@ -6,7 +6,7 @@ import { ROUTES } from '@/constants/routes'
 import { definePermissionsFor } from '@/lib/permissions'
 import type { Action, Subject } from '@/lib/permissions/schemas'
 
-import { getUserFromToken } from './token'
+import { getUserFromToken } from './users/get-user-from-token'
 
 export async function canUser(action: Action, subject: Subject) {
   const user = await getUserFromToken()
diff --git a/src/actions/token.ts b/src/actions/token.ts
deleted file mode 100644
index 4346449a..00000000
--- a/src/actions/token.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-'use server'
-
-import jwt from 'jsonwebtoken'
-
-import type { Role } from '@/lib/permissions/schemas'
-
-import { getCookie } from './cookies'
-
-export async function getUserFromToken() {
-  const accessToken = await getCookie('access_token')
-
-  if (!accessToken) return null
-
-  const tokenWithoutPrefix = accessToken.slice(2)
-  const extractedToken = tokenWithoutPrefix.split('.').slice(0, 3).join('.')
-
-  const payload = jwt.decode(extractedToken) as { sub: string; role: Role }
-
-  if (!payload) return null
-
-  const id = payload.sub
-  const role = payload.role
-
-  return { id, role }
-}
diff --git a/src/actions/users.ts b/src/actions/users/get-current-user.ts
similarity index 76%
rename from src/actions/users.ts
rename to src/actions/users/get-current-user.ts
index 73a2cae7..61ab6ceb 100644
--- a/src/actions/users.ts
+++ b/src/actions/users/get-current-user.ts
@@ -2,16 +2,15 @@
 
 import { redirect } from 'next/navigation'
 
+import { DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS } from '@/config/cache'
 import { NEXT_CACHE_TAGS } from '@/constants/cache'
 import { ROUTES } from '@/constants/routes'
 import { api } from '@/lib/api'
 import type { User } from '@/types/users.d.ts'
 
-import { getUserFromToken } from './token'
+import { getUserFromToken } from './get-user-from-token'
 
 export async function getCurrentUser() {
-  const REVALIDATE_IN_SECONDS = 3600
-
   const user = await getUserFromToken()
 
   if (!user?.id) return null
@@ -20,7 +19,7 @@ export async function getCurrentUser() {
     includeCookies: true,
     cache: 'force-cache',
     next: {
-      revalidate: REVALIDATE_IN_SECONDS,
+      revalidate: DEFAULT_NEXT_CACHE_REVALIDATE_IN_SECONDS,
       tags: [NEXT_CACHE_TAGS.user(user.id)],
     },
   })
diff --git a/src/actions/users/get-user-from-token.ts b/src/actions/users/get-user-from-token.ts
new file mode 100644
index 00000000..66ee2686
--- /dev/null
+++ b/src/actions/users/get-user-from-token.ts
@@ -0,0 +1,15 @@
+'use server'
+
+import { COOKIES } from '@/constants/cookies'
+import type { UserRole } from '@/enums/users'
+import { extractTokenData } from '@/helpers/extract-token-data'
+
+export async function getUserFromToken() {
+  const user = await extractTokenData<{ sub: string; role: UserRole }>({
+    cookie: COOKIES.accessToken,
+  })
+
+  if (!user?.sub) return null
+
+  return { id: user.sub, role: user.role }
+}
diff --git a/src/app/(dashboard)/perfil/page.tsx b/src/app/(dashboard)/perfil/page.tsx
index e6653fee..2b8cfd35 100644
--- a/src/app/(dashboard)/perfil/page.tsx
+++ b/src/app/(dashboard)/perfil/page.tsx
@@ -1,6 +1,6 @@
 import { redirect } from 'next/navigation'
 
-import { getCurrentUser } from '@/actions/users'
+import { getCurrentUser } from '@/actions/users/get-current-user'
 import { Avatar } from '@/components/ui/avatar'
 import { Divider } from '@/components/ui/divider'
 import { ROUTES } from '@/constants/routes'
diff --git a/src/app/_paciente/_header/index.tsx b/src/app/_paciente/_header/index.tsx
index 7107f2be..f8182060 100644
--- a/src/app/_paciente/_header/index.tsx
+++ b/src/app/_paciente/_header/index.tsx
@@ -3,7 +3,7 @@ import { SettingsIcon } from 'lucide-react'
 import Image from 'next/image'
 import Link from 'next/link'
 
-import { getCurrentUser } from '@/actions/users'
+import { getCurrentUser } from '@/actions/users/get-current-user'
 import { PatientHeaderAccessibilityDropdown } from '@/app/_paciente/_header/accessibility-dropdown'
 import { PatientHeaderUserDropdown } from '@/app/_paciente/_header/user-dropdown'
 import { Breadcrumbs } from '@/components/breadcrumbs'
diff --git a/src/app/_paciente/_header/user-dropdown.tsx b/src/app/_paciente/_header/user-dropdown.tsx
index e54fe1a8..83a236dd 100644
--- a/src/app/_paciente/_header/user-dropdown.tsx
+++ b/src/app/_paciente/_header/user-dropdown.tsx
@@ -5,7 +5,7 @@ import { useRouter } from 'next/navigation'
 import { useTransition } from 'react'
 import { toast } from 'sonner'
 
-import { getUserFromToken } from '@/actions/token'
+import { getUserFromToken } from '@/actions/users/get-user-from-token'
 import { Avatar } from '@/components/ui/avatar'
 import { Divider } from '@/components/ui/divider'
 import { DropdownMenu } from '@/components/ui/dropdown'
diff --git a/src/app/_paciente/documentos/pendentes/page.tsx b/src/app/_paciente/documentos/pendentes/page.tsx
index 7a52561e..4b4af455 100644
--- a/src/app/_paciente/documentos/pendentes/page.tsx
+++ b/src/app/_paciente/documentos/pendentes/page.tsx
@@ -1,7 +1,7 @@
 import { Metadata } from 'next'
 import React from 'react'
 
-import { getCurrentUser } from '@/actions/users'
+import { getCurrentUser } from '@/actions/users/get-current-user'
 import { PatientRequirementCard } from '@/modules/patients/cards/patient-requirement-card'
 import type { PatientRequirement } from '@/types/patient-requirements.d.ts'
 
diff --git a/src/app/api/sair/route.ts b/src/app/api/sair/route.ts
index 05806e49..aaaf83f2 100644
--- a/src/app/api/sair/route.ts
+++ b/src/app/api/sair/route.ts
@@ -1,14 +1,15 @@
 import { cookies } from 'next/headers'
 import { type NextRequest, NextResponse } from 'next/server'
 
+import { COOKIES } from '@/constants/cookies'
 import { ROUTES } from '@/constants/routes'
 
-export async function GET(request: NextRequest) {
+export async function POST(request: NextRequest) {
   const redirectUrl = request.nextUrl.clone()
   redirectUrl.pathname = ROUTES.auth.signIn
 
   const cookieStore = await cookies()
-  cookieStore.delete('access_token')
+  cookieStore.delete(COOKIES.accessToken)
 
   return NextResponse.redirect(redirectUrl)
 }
diff --git a/src/app/conta/cadastrar/page.tsx b/src/app/conta/cadastrar/page.tsx
index 22db6fd1..df0829fe 100644
--- a/src/app/conta/cadastrar/page.tsx
+++ b/src/app/conta/cadastrar/page.tsx
@@ -1,27 +1,65 @@
 import image from '@images/brand/icon.svg'
 import type { Metadata } from 'next'
+import { redirect } from 'next/navigation'
 
 import { AuthCard } from '@/components/auth/auth-card'
 import { Divider } from '@/components/ui/divider'
 import { NavLink } from '@/components/ui/nav-link'
 import { ROUTES } from '@/constants/routes'
-
-import { SignUpForm } from './sign-up-form'
+import type { UserRole } from '@/enums/users'
+import { extractTokenData } from '@/helpers/extract-token-data'
+import { SignUpForm } from '@/modules/auth/sign-up-form'
 
 export const metadata: Metadata = {
   title: 'Cadastrar conta',
 }
 
-export default function Page() {
+interface PageProps {
+  searchParams: Promise<{ token?: string }>
+}
+
+export default async function Page({ searchParams }: Readonly<PageProps>) {
+  const { token } = await searchParams
+
+  if (!token) {
+    redirect(ROUTES.auth.signIn)
+  }
+
+  const tokenValue = await extractTokenData<{
+    email: string
+    role: UserRole
+  }>({ token })
+
+  const CARD_CONTENT = {
+    valid: {
+      title: 'Cadastrar conta',
+      description: 'Este convite expirou ou é inválido',
+    },
+    invalid: {
+      title: 'Convite inválido',
+      description: 'Este convite expirou ou é inválido',
+    },
+  }
+
+  const isTokenValid = !!tokenValue
+  const content = isTokenValid ? CARD_CONTENT['valid'] : CARD_CONTENT['invalid']
+
   return (
     <AuthCard
       image={image}
-      title='Cadastrar conta'
-      description='Insira seus dados para criar sua conta'
+      title={content.title}
+      description={content.description}
     >
-      <SignUpForm />
+      {isTokenValid ? (
+        <SignUpForm token={token} role={tokenValue.role} />
+      ) : (
+        <p className='text-center'>
+          Por favor, solicite um novo convite para realizar o cadastro da sua
+          conta.
+        </p>
+      )}
 
-      <Divider text='ou' />
+      <Divider />
 
       <p className='text-foreground-soft text-center text-sm'>
         Já tem uma conta?{' '}
diff --git a/src/app/conta/cadastrar/sign-up-form-schema.tsx b/src/app/conta/cadastrar/sign-up-form-schema.tsx
deleted file mode 100644
index 1fc62e1f..00000000
--- a/src/app/conta/cadastrar/sign-up-form-schema.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import { z } from 'zod'
-
-import { PASSWORD_MIN_LENGTH } from '@/constants/auth'
-import {
-  NAME_REGEX,
-  NON_SPECIAL_CHAR_REGEX,
-  PASSWORD_REGEX,
-} from '@/constants/regex'
-
-export const signUpFormSchema = z
-  .object({
-    name: z
-      .string()
-      .min(1, 'Insira seu nome completo')
-      .min(3, 'O nome deve conter mais de 3 caracteres')
-      .regex(
-        NON_SPECIAL_CHAR_REGEX,
-        'Números e caracteres especiais são inválidos',
-      )
-      .regex(NAME_REGEX, 'Insira seu nome e sobrenome'),
-    email: z.string().email('Insira um e-mail válido'),
-    password: z
-      .string()
-      .min(1, 'Insira sua senha')
-      .min(
-        PASSWORD_MIN_LENGTH,
-        `Sua senha precisa conter ${PASSWORD_MIN_LENGTH} ou mais caracteres`,
-      )
-      .regex(PASSWORD_REGEX, 'Senha inválida'),
-    confirmPassword: z.string(),
-    consent: z.boolean(),
-  })
-  .refine((data) => data.password === data.confirmPassword, {
-    message: 'Suas senhas não coincidem',
-    path: ['confirmPassword'],
-  })
-  .refine((data) => data.consent === true, {
-    message: 'Seu consentimento é obrigatório',
-    path: ['consent'],
-  })
-
-export type SignUpFormSchema = z.infer<typeof signUpFormSchema>
-
-export const signUpFormDefaultValues: SignUpFormSchema = {
-  name: '',
-  email: '',
-  password: '',
-  confirmPassword: '',
-  consent: false,
-}
diff --git a/src/app/conta/cadastrar/sign-up-form.tsx b/src/app/conta/cadastrar/sign-up-form.tsx
deleted file mode 100644
index 9c4802f3..00000000
--- a/src/app/conta/cadastrar/sign-up-form.tsx
+++ /dev/null
@@ -1,108 +0,0 @@
-'use client'
-
-import { zodResolver } from '@hookform/resolvers/zod'
-import { MailIcon, User2Icon } from 'lucide-react'
-import { useRouter } from 'next/navigation'
-import { FormProvider, useForm } from 'react-hook-form'
-import { toast } from 'sonner'
-
-import { CheckboxInput } from '@/components/form/checkbox-input'
-import { FormContainer } from '@/components/form/form-container'
-import { FormField } from '@/components/form/form-field'
-import { PasswordInput } from '@/components/form/password-input'
-import { TextInput } from '@/components/form/text-input'
-import { Alert } from '@/components/ui/alert'
-import { Button } from '@/components/ui/button'
-import { NavLink } from '@/components/ui/nav-link'
-import { ROUTES } from '@/constants/routes'
-import { api } from '@/lib/api'
-
-import {
-  signUpFormDefaultValues,
-  type SignUpFormSchema,
-  signUpFormSchema,
-} from './sign-up-form-schema'
-
-export function SignUpForm() {
-  const router = useRouter()
-  const formMethods = useForm<SignUpFormSchema>({
-    resolver: zodResolver(signUpFormSchema),
-    defaultValues: signUpFormDefaultValues,
-    mode: 'onBlur',
-  })
-
-  const isSubmitting = formMethods.formState.isSubmitting
-  const errorMessage = formMethods.formState.errors.root?.message
-
-  async function registerUser({ name, email, password }: SignUpFormSchema) {
-    const response = await api('/register', {
-      method: 'POST',
-      body: JSON.stringify({ name, email, password }),
-    })
-
-    if (!response.success) {
-      return formMethods.setError('root', { message: response.message })
-    }
-
-    toast.success(response.message)
-    router.push(ROUTES.patient.main)
-  }
-
-  // TODO: add link to policies
-
-  return (
-    <FormProvider {...formMethods}>
-      <FormContainer onSubmit={formMethods.handleSubmit(registerUser)}>
-        <FormField>
-          <TextInput
-            name='name'
-            label='Nome completo'
-            icon={User2Icon}
-            placeholder='Digite seu nome completo'
-            isRequired
-          />
-          <TextInput
-            name='email'
-            label='E-mail'
-            icon={MailIcon}
-            placeholder='Digite seu e-mail'
-            isRequired
-          />
-          <PasswordInput
-            name='password'
-            label='Senha'
-            placeholder='Digite sua senha'
-            isRequired
-            showRequirements
-          />
-          <PasswordInput
-            name='confirmPassword'
-            label='Confirmar senha'
-            placeholder='Repita sua senha'
-            isRequired
-          />
-        </FormField>
-
-        <CheckboxInput
-          name='consent'
-          label={
-            <span className='text-xs'>
-              Li e concordo com os <NavLink href='#'>Termos de Uso</NavLink> e{' '}
-              <NavLink href='#'>Política de Privacidade</NavLink>
-            </span>
-          }
-        />
-
-        <Button type='submit' loading={isSubmitting}>
-          Cadastrar
-        </Button>
-
-        {errorMessage && (
-          <Alert error={!!errorMessage} className='text-center'>
-            {errorMessage}
-          </Alert>
-        )}
-      </FormContainer>
-    </FormProvider>
-  )
-}
diff --git a/src/components/sidebar/index.tsx b/src/components/sidebar/index.tsx
index 8e00229a..bf9c09ee 100644
--- a/src/components/sidebar/index.tsx
+++ b/src/components/sidebar/index.tsx
@@ -6,7 +6,7 @@ import {
   Users2Icon,
 } from 'lucide-react'
 
-import { getCurrentUser } from '@/actions/users'
+import { getCurrentUser } from '@/actions/users/get-current-user'
 import { Divider } from '@/components/ui/divider'
 import { ROUTES } from '@/constants/routes'
 
diff --git a/src/constants/cookies.ts b/src/constants/cookies.ts
new file mode 100644
index 00000000..d016caab
--- /dev/null
+++ b/src/constants/cookies.ts
@@ -0,0 +1,4 @@
+export const COOKIES = {
+  accessToken: 'access_token',
+  refreshToken: 'refresh_token',
+}
diff --git a/src/helpers/extract-token-data.ts b/src/helpers/extract-token-data.ts
new file mode 100644
index 00000000..05bb2ba7
--- /dev/null
+++ b/src/helpers/extract-token-data.ts
@@ -0,0 +1,32 @@
+'use server'
+
+import jwt from 'jsonwebtoken'
+
+import { getCookie } from '@/actions/cookies'
+
+interface ExtractTokenDataProps {
+  cookie?: string
+  token?: string
+}
+
+export async function extractTokenData<T>({
+  cookie,
+  token,
+}: ExtractTokenDataProps) {
+  let value: string | undefined = token
+
+  if (cookie) {
+    const cookieValue = await getCookie(cookie)
+    const tokenWithoutPrefix = cookieValue?.slice(2)
+    const extractedToken = tokenWithoutPrefix?.split('.').slice(0, 3).join('.')
+    value = extractedToken
+  }
+
+  if (!value) return null
+
+  const payload = jwt.decode(value) as T
+
+  if (!payload) return null
+
+  return payload
+}
diff --git a/src/modules/auth/sign-up-form.tsx b/src/modules/auth/sign-up-form.tsx
new file mode 100644
index 00000000..15603f0e
--- /dev/null
+++ b/src/modules/auth/sign-up-form.tsx
@@ -0,0 +1,192 @@
+'use client'
+
+import { zodResolver } from '@hookform/resolvers/zod'
+import { User2Icon } from 'lucide-react'
+import { useRouter } from 'next/navigation'
+import { FormProvider, useForm } from 'react-hook-form'
+import { toast } from 'sonner'
+import { z } from 'zod'
+
+import { CheckboxInput } from '@/components/form/checkbox-input'
+import { FormContainer } from '@/components/form/form-container'
+import { FormField } from '@/components/form/form-field'
+import { PasswordInput } from '@/components/form/password-input'
+import { SelectInput } from '@/components/form/select-input'
+import { TextInput } from '@/components/form/text-input'
+import { Button } from '@/components/ui/button'
+import { NavLink } from '@/components/ui/nav-link'
+import { ROUTES } from '@/constants/routes'
+import { SPECIALTIES_OPTIONS, type Specialty } from '@/enums/shared'
+import { type UserRole, USERS_ROLE_ENUM } from '@/enums/users'
+import { api } from '@/lib/api'
+import { nameSchema, passwordSchema, specialtySchema } from '@/schemas'
+
+export const signUpFormSchema = z
+  .object({
+    role: z.enum(USERS_ROLE_ENUM),
+    name: nameSchema,
+    specialty: z.union([specialtySchema, z.literal('')]),
+    registration_id: z.string().max(32).optional(),
+    password: passwordSchema,
+    confirm_password: z.string(),
+    consent: z.boolean(),
+  })
+  .superRefine((data, ctx) => {
+    if (data.password !== data.confirm_password) {
+      ctx.addIssue({
+        code: z.ZodIssueCode.custom,
+        path: ['confirm_password'],
+        message: 'Suas senhas não coincidem',
+      })
+    }
+    if (!data.consent) {
+      ctx.addIssue({
+        code: z.ZodIssueCode.custom,
+        path: ['consent'],
+        message: 'Seu consentimento é obrigatório',
+      })
+    }
+    if (data.role === 'specialist') {
+      if (!data.specialty) {
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          path: ['specialty'],
+          message: 'Especialidade é obrigatória',
+        })
+      }
+      if (!data.registration_id) {
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          path: ['registration_id'],
+          message: 'Registro profissional é obrigatório',
+        })
+      }
+    }
+  })
+export type SignUpFormSchema = z.infer<typeof signUpFormSchema>
+
+type RegisterUserPayload = {
+  role: UserRole
+  name: string
+  password: string
+  invite_token: string
+  specialty?: Specialty
+  registration_id?: string
+}
+
+interface SignUpFormProps {
+  token: string
+  role: UserRole
+}
+
+export function SignUpForm({ token, role }: Readonly<SignUpFormProps>) {
+  const router = useRouter()
+  const formMethods = useForm<SignUpFormSchema>({
+    resolver: zodResolver(signUpFormSchema),
+    mode: 'onBlur',
+    defaultValues: {
+      role,
+      name: '',
+      specialty: '',
+      registration_id: '',
+      password: '',
+      confirm_password: '',
+      consent: false,
+    } as unknown as SignUpFormSchema,
+  })
+
+  async function registerUser({
+    role,
+    name,
+    password,
+    specialty,
+    registration_id,
+  }: SignUpFormSchema) {
+    const payload: RegisterUserPayload = {
+      role,
+      name,
+      password,
+      invite_token: token,
+    }
+
+    if (specialty && registration_id) {
+      payload.specialty = specialty
+      payload.registration_id = registration_id
+    }
+
+    const response = await api('/register/user', {
+      method: 'POST',
+      body: JSON.stringify(payload),
+    })
+
+    if (!response.success) {
+      toast.error(response.message)
+      return
+    }
+
+    toast.success(response.message)
+    router.push(ROUTES.dashboard.main)
+  }
+
+  // TODO: add link to policies
+
+  return (
+    <FormProvider {...formMethods}>
+      <FormContainer onSubmit={formMethods.handleSubmit(registerUser)}>
+        <FormField>
+          <TextInput
+            name='name'
+            label='Nome completo'
+            icon={User2Icon}
+            placeholder='Insira seu nome completo'
+            isRequired
+          />
+
+          {role === 'specialist' && (
+            <>
+              <SelectInput
+                name='specialty'
+                label='Especialidade'
+                options={SPECIALTIES_OPTIONS}
+                isRequired
+              />
+              <TextInput
+                name='registration_id'
+                label='Registro profissional'
+                placeholder='Insira seu registro profissional'
+                isRequired
+              />
+            </>
+          )}
+          <PasswordInput
+            name='password'
+            label='Senha'
+            placeholder='Digite sua senha'
+            showRequirements
+            isRequired
+          />
+          <PasswordInput
+            name='confirm_password'
+            label='Confirmar senha'
+            placeholder='Repita sua senha'
+            isRequired
+          />
+        </FormField>
+
+        <CheckboxInput
+          name='consent'
+          label={
+            <span className='text-xs'>
+              Li e concordo com os <NavLink href='#'>Termos de Uso</NavLink> e{' '}
+              <NavLink href='#'>Política de Privacidade</NavLink>
+            </span>
+          }
+        />
+
+        <Button type='submit' loading={formMethods.formState.isSubmitting}>
+          Cadastrar
+        </Button>
+      </FormContainer>
+    </FormProvider>
+  )
+}
diff --git a/src/proxy.ts b/src/proxy.ts
index e4bf33ee..799cff0e 100644
--- a/src/proxy.ts
+++ b/src/proxy.ts
@@ -1,14 +1,15 @@
 import type { NextRequest } from 'next/server'
 import { NextResponse } from 'next/server'
 
+import { COOKIES } from './constants/cookies'
 import { ROUTES } from './constants/routes'
 
 export function proxy(request: NextRequest) {
   const cookies = request.cookies
   const pathname = request.nextUrl.pathname
 
-  const accessToken = cookies.get('access_token')
-  const refreshToken = cookies.get('refresh_token')
+  const accessToken = cookies.get(COOKIES.accessToken)
+  const refreshToken = cookies.get(COOKIES.refreshToken)
   const isAuthRoute = pathname.startsWith('/conta')
 
   if (isAuthRoute && (accessToken || refreshToken)) {

From a3a34b61753fd5cfe94191ad5ba61ade1ade151b Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Tue, 17 Feb 2026 11:43:42 -0300
Subject: [PATCH 71/77] feat(auth): implement recover and reset password

---
 src/app/conta/entrar/page.tsx                 |  8 +-
 .../nova-senha/new-password-form-schema.tsx   | 28 ------
 .../conta/nova-senha/new-password-form.tsx    | 81 ------------------
 src/app/conta/nova-senha/page.tsx             | 12 ++-
 src/app/conta/recuperar-senha/page.tsx        |  5 +-
 .../recuperar-senha/recover-form-schema.tsx   | 11 ---
 .../conta/recuperar-senha/recover-form.tsx    | 84 ------------------
 src/modules/auth/recover-password-form.tsx    | 79 +++++++++++++++++
 src/modules/auth/reset-password-form.tsx      | 85 +++++++++++++++++++
 src/modules/auth/sign-in-form.tsx             | 52 +++---------
 10 files changed, 187 insertions(+), 258 deletions(-)
 delete mode 100644 src/app/conta/nova-senha/new-password-form-schema.tsx
 delete mode 100644 src/app/conta/nova-senha/new-password-form.tsx
 delete mode 100644 src/app/conta/recuperar-senha/recover-form-schema.tsx
 delete mode 100644 src/app/conta/recuperar-senha/recover-form.tsx
 create mode 100644 src/modules/auth/recover-password-form.tsx
 create mode 100644 src/modules/auth/reset-password-form.tsx

diff --git a/src/app/conta/entrar/page.tsx b/src/app/conta/entrar/page.tsx
index 615c5815..9d03248a 100644
--- a/src/app/conta/entrar/page.tsx
+++ b/src/app/conta/entrar/page.tsx
@@ -2,15 +2,13 @@ import image from '@images/brand/icon.svg'
 import type { Metadata } from 'next'
 
 import { AuthCard } from '@/components/auth/auth-card'
-import { Divider } from '@/components/ui/divider'
-import { NavLink } from '@/components/ui/nav-link'
-import { ROUTES } from '@/constants/routes'
 import { SignInForm } from '@/modules/auth/sign-in-form'
 
 export const metadata: Metadata = {
   title: 'Acessar conta',
 }
 
+// TODO: redirect patients to new screening flow when it's ready
 export default function Page() {
   return (
     <AuthCard
@@ -20,7 +18,7 @@ export default function Page() {
     >
       <SignInForm />
 
-      <Divider text='ou' />
+      {/* <Divider text='ou' />
 
       <p className='text-foreground-soft text-center text-sm'>
         Não tem uma conta?{' '}
@@ -30,7 +28,7 @@ export default function Page() {
         >
           Registre-se como paciente aqui
         </NavLink>
-      </p>
+      </p> */}
     </AuthCard>
   )
 }
diff --git a/src/app/conta/nova-senha/new-password-form-schema.tsx b/src/app/conta/nova-senha/new-password-form-schema.tsx
deleted file mode 100644
index 5674ae55..00000000
--- a/src/app/conta/nova-senha/new-password-form-schema.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import { z } from 'zod'
-
-import { PASSWORD_MIN_LENGTH } from '@/constants/auth'
-import { PASSWORD_REGEX } from '@/constants/regex'
-
-export const newPasswordFormSchema = z
-  .object({
-    password: z
-      .string()
-      .min(1, 'Insira sua senha')
-      .min(
-        PASSWORD_MIN_LENGTH,
-        `Sua senha precisa conter ${PASSWORD_MIN_LENGTH} ou mais caracteres`,
-      )
-      .regex(PASSWORD_REGEX, 'Senha inválida'),
-    confirmPassword: z.string(),
-  })
-  .refine((data) => data.password === data.confirmPassword, {
-    message: 'Suas senhas não coincidem',
-    path: ['confirmPassword'],
-  })
-
-export type NewPasswordFormSchema = z.infer<typeof newPasswordFormSchema>
-
-export const newPasswordFormDefaultValues: NewPasswordFormSchema = {
-  password: '',
-  confirmPassword: '',
-}
diff --git a/src/app/conta/nova-senha/new-password-form.tsx b/src/app/conta/nova-senha/new-password-form.tsx
deleted file mode 100644
index 2efd2fb3..00000000
--- a/src/app/conta/nova-senha/new-password-form.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-'use client'
-
-import { zodResolver } from '@hookform/resolvers/zod'
-import { redirect } from 'next/navigation'
-import { useState } from 'react'
-import { FormProvider, useForm } from 'react-hook-form'
-
-import { FormContainer } from '@/components/form/form-container'
-import { FormField } from '@/components/form/form-field'
-import { PasswordInput } from '@/components/form/password-input'
-import { Alert } from '@/components/ui/alert'
-import { Button } from '@/components/ui/button'
-import { ROUTES } from '@/constants/routes'
-import { wait } from '@/utils/wait'
-
-import {
-  newPasswordFormDefaultValues,
-  type NewPasswordFormSchema,
-  newPasswordFormSchema,
-} from './new-password-form-schema'
-
-export function NewPasswordForm() {
-  const [success, setSuccess] = useState(false)
-
-  const formMethods = useForm<NewPasswordFormSchema>({
-    resolver: zodResolver(newPasswordFormSchema),
-    defaultValues: newPasswordFormDefaultValues,
-    mode: 'onBlur',
-  })
-  const isSubmitting = formMethods.formState.isSubmitting
-  const errorMessage = formMethods.formState.errors.root?.message
-
-  async function saveNewPassword(data: NewPasswordFormSchema) {
-    // TODO: implement function when API is available
-    setSuccess(false)
-    await wait(500)
-    console.log(data)
-
-    setSuccess(true)
-
-    setTimeout(() => redirect(ROUTES.auth.signIn), 2000)
-  }
-
-  return (
-    <FormProvider {...formMethods}>
-      <FormContainer onSubmit={formMethods.handleSubmit(saveNewPassword)}>
-        <FormField>
-          <PasswordInput
-            name='password'
-            label='Senha'
-            placeholder='Digite sua senha'
-            isRequired
-            showRequirements
-          />
-          <PasswordInput
-            name='confirmPassword'
-            label='Confirmar senha'
-            placeholder='Repita sua senha'
-            isRequired
-          />
-        </FormField>
-
-        <Button type='submit' loading={isSubmitting}>
-          Redefinir senha
-        </Button>
-
-        {success && (
-          <Alert variant='success' className='text-center'>
-            Senha atualizada com sucesso.
-          </Alert>
-        )}
-
-        {errorMessage && (
-          <Alert error={!!errorMessage} className='text-center'>
-            {errorMessage}
-          </Alert>
-        )}
-      </FormContainer>
-    </FormProvider>
-  )
-}
diff --git a/src/app/conta/nova-senha/page.tsx b/src/app/conta/nova-senha/page.tsx
index 6e2bc452..f9f9c749 100644
--- a/src/app/conta/nova-senha/page.tsx
+++ b/src/app/conta/nova-senha/page.tsx
@@ -1,33 +1,31 @@
 import image from '@images/brand/icon.svg'
 import type { Metadata } from 'next'
+import { redirect } from 'next/navigation'
 
 import { AuthCard } from '@/components/auth/auth-card'
 import { Divider } from '@/components/ui/divider'
 import { NavLink } from '@/components/ui/nav-link'
 import { ROUTES } from '@/constants/routes'
-
-import { NewPasswordForm } from './new-password-form'
+import { ResetPasswordForm } from '@/modules/auth/reset-password-form'
 
 export const metadata: Metadata = {
   title: 'Redefinir senha',
 }
 
 interface PageProps {
-  searchParams: Promise<{
-    token?: string
-  }>
+  searchParams: Promise<{ token?: string }>
 }
 
 export default async function Page({ searchParams }: Readonly<PageProps>) {
   const { token } = await searchParams
 
   if (!token) {
-    console.error('Token is missing')
+    redirect(ROUTES.auth.signIn)
   }
 
   return (
     <AuthCard image={image} title='Redefinir senha'>
-      <NewPasswordForm />
+      <ResetPasswordForm token={token} />
 
       <Divider />
 
diff --git a/src/app/conta/recuperar-senha/page.tsx b/src/app/conta/recuperar-senha/page.tsx
index ba142e97..0d1f32c7 100644
--- a/src/app/conta/recuperar-senha/page.tsx
+++ b/src/app/conta/recuperar-senha/page.tsx
@@ -5,8 +5,7 @@ import { AuthCard } from '@/components/auth/auth-card'
 import { Divider } from '@/components/ui/divider'
 import { NavLink } from '@/components/ui/nav-link'
 import { ROUTES } from '@/constants/routes'
-
-import { RecoverForm } from './recover-form'
+import { RecoverPasswordForm } from '@/modules/auth/recover-password-form'
 
 export const metadata: Metadata = {
   title: 'Recuperar senha',
@@ -19,7 +18,7 @@ export default function Page() {
       title='Recuperar senha'
       description='Insira seu e-mail para recuperar sua senha'
     >
-      <RecoverForm />
+      <RecoverPasswordForm />
 
       <Divider />
 
diff --git a/src/app/conta/recuperar-senha/recover-form-schema.tsx b/src/app/conta/recuperar-senha/recover-form-schema.tsx
deleted file mode 100644
index 2e6da5f0..00000000
--- a/src/app/conta/recuperar-senha/recover-form-schema.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { z } from 'zod'
-
-export const recoverFormSchema = z.object({
-  email: z.string().email('Insira um e-mail válido'),
-})
-
-export type RecoverFormSchema = z.infer<typeof recoverFormSchema>
-
-export const recoverFormDefaultValues: RecoverFormSchema = {
-  email: '',
-}
diff --git a/src/app/conta/recuperar-senha/recover-form.tsx b/src/app/conta/recuperar-senha/recover-form.tsx
deleted file mode 100644
index bc94be85..00000000
--- a/src/app/conta/recuperar-senha/recover-form.tsx
+++ /dev/null
@@ -1,84 +0,0 @@
-'use client'
-
-import { zodResolver } from '@hookform/resolvers/zod'
-import { MailIcon } from 'lucide-react'
-import { useState } from 'react'
-import { FormProvider, useForm } from 'react-hook-form'
-
-import { FormContainer } from '@/components/form/form-container'
-import { TextInput } from '@/components/form/text-input'
-import { Alert } from '@/components/ui/alert'
-import { Button } from '@/components/ui/button'
-import { wait } from '@/utils/wait'
-
-import {
-  recoverFormDefaultValues,
-  type RecoverFormSchema,
-  recoverFormSchema,
-} from './recover-form-schema'
-
-type SuccessMessage = {
-  message: string
-  email: string
-}
-
-export function RecoverForm() {
-  const [successMessage, setSuccessMessage] = useState<SuccessMessage | null>(
-    null,
-  )
-
-  const formMethods = useForm<RecoverFormSchema>({
-    resolver: zodResolver(recoverFormSchema),
-    defaultValues: recoverFormDefaultValues,
-    mode: 'onBlur',
-  })
-  const isSubmitting = formMethods.formState.isSubmitting
-  const errorMessage = formMethods.formState.errors.root?.message
-
-  async function sendRecoverEmail({ email }: RecoverFormSchema) {
-    // TODO: implement function when API is available
-    setSuccessMessage(null)
-    await wait(500)
-
-    if (email === 'erro@ipecode.com.br') {
-      return formMethods.setError('root', {
-        message: 'Ocorreu algum erro. Por favor, tente novamente.',
-      })
-    }
-
-    setSuccessMessage({
-      message: 'E-mail de recuperação de senha enviado para ',
-      email,
-    })
-  }
-
-  return (
-    <FormProvider {...formMethods}>
-      <FormContainer onSubmit={formMethods.handleSubmit(sendRecoverEmail)}>
-        <TextInput
-          name='email'
-          label='E-mail'
-          icon={MailIcon}
-          placeholder='Digite seu e-mail'
-        />
-
-        <Button type='submit' loading={isSubmitting}>
-          Enviar
-        </Button>
-
-        {successMessage && (
-          <Alert variant='success' className='text-center'>
-            {successMessage.message}
-            <strong>{successMessage.email}</strong>
-          </Alert>
-        )}
-
-        {errorMessage && (
-          <Alert error={!!errorMessage} className='text-center'>
-            {errorMessage}
-          </Alert>
-        )}
-      </FormContainer>
-    </FormProvider>
-  )
-}
diff --git a/src/modules/auth/recover-password-form.tsx b/src/modules/auth/recover-password-form.tsx
new file mode 100644
index 00000000..0e9aac04
--- /dev/null
+++ b/src/modules/auth/recover-password-form.tsx
@@ -0,0 +1,79 @@
+'use client'
+
+import { zodResolver } from '@hookform/resolvers/zod'
+import { MailIcon } from 'lucide-react'
+import { useState } from 'react'
+import { FormProvider, useForm } from 'react-hook-form'
+import { z } from 'zod'
+
+import { FormContainer } from '@/components/form/form-container'
+import { TextInput } from '@/components/form/text-input'
+import { Alert } from '@/components/ui/alert'
+import { Button } from '@/components/ui/button'
+import { api } from '@/lib/api'
+import { emailSchema } from '@/schemas'
+
+export const recoverPasswordFormSchema = z.object({
+  email: emailSchema,
+})
+export type RecoverPasswordFormSchema = z.infer<
+  typeof recoverPasswordFormSchema
+>
+
+export function RecoverPasswordForm() {
+  const [successMessage, setSuccessMessage] = useState('')
+
+  const formMethods = useForm<RecoverPasswordFormSchema>({
+    resolver: zodResolver(recoverPasswordFormSchema),
+    defaultValues: { email: '' },
+    mode: 'onBlur',
+  })
+
+  const errorMessage = formMethods.formState.errors.root?.message
+
+  async function submitForm({ email }: RecoverPasswordFormSchema) {
+    setSuccessMessage('')
+
+    const response = await api('/recover-password', {
+      method: 'POST',
+      body: JSON.stringify({ email }),
+    })
+
+    if (!response.success) {
+      return formMethods.setError('root', { message: response.message })
+    }
+
+    setSuccessMessage(
+      'Solicitação enviada com sucesso! Caso o e-mail esteja registrado, você receberá um link para redefinição da senha em seu e-mail.',
+    )
+  }
+
+  return (
+    <FormProvider {...formMethods}>
+      <FormContainer onSubmit={formMethods.handleSubmit(submitForm)}>
+        <TextInput
+          name='email'
+          label='E-mail'
+          icon={MailIcon}
+          placeholder='Digite seu e-mail'
+        />
+
+        <Button type='submit' loading={formMethods.formState.isSubmitting}>
+          Enviar
+        </Button>
+
+        {successMessage && (
+          <Alert variant='success' className='text-center'>
+            {successMessage}
+          </Alert>
+        )}
+
+        {errorMessage && (
+          <Alert error={!!errorMessage} className='text-center'>
+            {errorMessage}
+          </Alert>
+        )}
+      </FormContainer>
+    </FormProvider>
+  )
+}
diff --git a/src/modules/auth/reset-password-form.tsx b/src/modules/auth/reset-password-form.tsx
new file mode 100644
index 00000000..939edcf7
--- /dev/null
+++ b/src/modules/auth/reset-password-form.tsx
@@ -0,0 +1,85 @@
+'use client'
+
+import { zodResolver } from '@hookform/resolvers/zod'
+import { useRouter } from 'next/navigation'
+import { FormProvider, useForm } from 'react-hook-form'
+import { toast } from 'sonner'
+import { z } from 'zod'
+
+import { FormContainer } from '@/components/form/form-container'
+import { FormField } from '@/components/form/form-field'
+import { PasswordInput } from '@/components/form/password-input'
+import { Button } from '@/components/ui/button'
+import { ROUTES } from '@/constants/routes'
+import { api } from '@/lib/api'
+import { passwordSchema } from '@/schemas'
+
+export const resetPasswordFormSchema = z
+  .object({
+    password: passwordSchema,
+    confirm_password: z.string(),
+    reset_token: z.string(),
+  })
+  .refine((data) => data.password === data.confirm_password, {
+    message: 'Suas senhas não coincidem',
+    path: ['confirm_password'],
+  })
+export type ResetPasswordFormSchema = z.infer<typeof resetPasswordFormSchema>
+
+interface ResetPasswordFormProps {
+  token: string
+}
+
+export function ResetPasswordForm({ token }: Readonly<ResetPasswordFormProps>) {
+  const router = useRouter()
+
+  const formMethods = useForm<ResetPasswordFormSchema>({
+    resolver: zodResolver(resetPasswordFormSchema),
+    defaultValues: { password: '', confirm_password: '', reset_token: token },
+    mode: 'onBlur',
+  })
+
+  async function submitForm({
+    password,
+    reset_token,
+  }: ResetPasswordFormSchema) {
+    const response = await api('/reset-password', {
+      method: 'POST',
+      body: JSON.stringify({ password, reset_token }),
+    })
+
+    if (!response.success) {
+      toast.error(response.message)
+      return
+    }
+
+    toast.success(response.message)
+    router.push(ROUTES.dashboard.main)
+  }
+
+  return (
+    <FormProvider {...formMethods}>
+      <FormContainer onSubmit={formMethods.handleSubmit(submitForm)}>
+        <FormField>
+          <PasswordInput
+            name='password'
+            label='Senha'
+            placeholder='Digite sua senha'
+            showRequirements
+            isRequired
+          />
+          <PasswordInput
+            name='confirm_password'
+            label='Confirmar senha'
+            placeholder='Repita sua senha'
+            isRequired
+          />
+        </FormField>
+
+        <Button type='submit' loading={formMethods.formState.isSubmitting}>
+          Redefinir senha
+        </Button>
+      </FormContainer>
+    </FormProvider>
+  )
+}
diff --git a/src/modules/auth/sign-in-form.tsx b/src/modules/auth/sign-in-form.tsx
index 711f1463..85eb3249 100644
--- a/src/modules/auth/sign-in-form.tsx
+++ b/src/modules/auth/sign-in-form.tsx
@@ -3,7 +3,6 @@
 import { zodResolver } from '@hookform/resolvers/zod'
 import { MailIcon } from 'lucide-react'
 import { useRouter } from 'next/navigation'
-import { useTransition } from 'react'
 import { FormProvider, useForm } from 'react-hook-form'
 import { z } from 'zod'
 
@@ -11,7 +10,6 @@ import { CheckboxInput } from '@/components/form/checkbox-input'
 import { FormContainer } from '@/components/form/form-container'
 import { FormField } from '@/components/form/form-field'
 import { PasswordInput } from '@/components/form/password-input'
-import { SelectInput } from '@/components/form/select-input'
 import { TextInput } from '@/components/form/text-input'
 import { Alert } from '@/components/ui/alert'
 import { Button } from '@/components/ui/button'
@@ -23,55 +21,40 @@ export const signInFormSchema = z.object({
   email: z.string().email('Insira um e-mail válido'),
   password: z.string().min(8, 'Sua senha deve conter 8 ou mais caracteres'),
   keepLoggedIn: z.boolean().optional(),
-  type: z.enum(['patient', 'user']),
 })
 export type SignInFormSchema = z.infer<typeof signInFormSchema>
 
 export function SignInForm() {
-  const [isPending, startTransition] = useTransition()
   const router = useRouter()
 
   const formMethods = useForm<SignInFormSchema>({
     resolver: zodResolver(signInFormSchema),
-    defaultValues: {
-      email: '',
-      password: '',
-      keepLoggedIn: false,
-      type: 'user',
-    },
+    defaultValues: { email: '', password: '', keepLoggedIn: false },
     mode: 'onBlur',
   })
   const formErrorMessage = formMethods.formState.errors.root?.message
 
-  async function signIn({
+  async function submitForm({
     email,
     password,
     keepLoggedIn,
-    type,
   }: SignInFormSchema) {
-    startTransition(async () => {
-      const response = await api('/login', {
-        method: 'POST',
-        body: JSON.stringify({
-          email,
-          password,
-          keep_logged_in: keepLoggedIn,
-          account_type: type,
-        }),
-      })
+    const response = await api('/login', {
+      method: 'POST',
+      body: JSON.stringify({ email, password, keep_logged_in: keepLoggedIn }),
+    })
 
-      if (!response.success) {
-        formMethods.setError('root', { message: response.message })
-        return
-      }
+    if (!response.success) {
+      formMethods.setError('root', { message: response.message })
+      return
+    }
 
-      router.push(type === 'user' ? ROUTES.dashboard.main : ROUTES.patient.main)
-    })
+    router.push(true ? ROUTES.dashboard.main : ROUTES.patient.main)
   }
 
   return (
     <FormProvider {...formMethods}>
-      <FormContainer onSubmit={formMethods.handleSubmit(signIn)}>
+      <FormContainer onSubmit={formMethods.handleSubmit(submitForm)}>
         <FormField className='gap-4'>
           <TextInput
             name='email'
@@ -84,15 +67,6 @@ export function SignInForm() {
             label='Senha'
             placeholder='Digite sua senha'
           />
-          <SelectInput
-            name='type'
-            label='Tipo de acesso'
-            options={[
-              { label: 'Paciente', value: 'patient' },
-              { label: 'Administração', value: 'user' },
-            ]}
-            className='sm:col-span-2'
-          />
         </FormField>
 
         <div className='flex items-center justify-between gap-x-3 gap-y-5 text-sm max-[28rem]:flex-col'>
@@ -106,7 +80,7 @@ export function SignInForm() {
           </NavLink>
         </div>
 
-        <Button type='submit' loading={isPending}>
+        <Button type='submit' loading={formMethods.formState.isSubmitting}>
           Entrar
         </Button>
 

From f60f8de756079f20f2aac7052f35cfcb864325cc Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Tue, 17 Feb 2026 17:03:50 -0300
Subject: [PATCH 72/77] feat(users): implement update user modal

---
 src/components/form/password-requirements.tsx |   2 +-
 .../{auth => }/get-password-requirement.ts    |   0
 src/modules/auth/sign-in-form.tsx             |   8 +-
 src/modules/auth/sign-up-form.tsx             |   9 +-
 src/modules/users/table/actions.tsx           |  18 +-
 src/modules/users/table/index.tsx             |   9 +-
 src/modules/users/update-modal.tsx            | 183 ++++++++++++++++++
 src/schemas/index.tsx                         |   2 +
 8 files changed, 213 insertions(+), 18 deletions(-)
 rename src/helpers/{auth => }/get-password-requirement.ts (100%)
 create mode 100644 src/modules/users/update-modal.tsx

diff --git a/src/components/form/password-requirements.tsx b/src/components/form/password-requirements.tsx
index 96880fa2..55766565 100644
--- a/src/components/form/password-requirements.tsx
+++ b/src/components/form/password-requirements.tsx
@@ -1,6 +1,6 @@
 import { CheckIcon, DotIcon } from 'lucide-react'
 
-import { getPasswordRequirements } from '@/helpers/auth/get-password-requirement'
+import { getPasswordRequirements } from '@/helpers/get-password-requirement'
 import { cn } from '@/utils/class-name-merge'
 
 import { FormMessage } from './form-message'
diff --git a/src/helpers/auth/get-password-requirement.ts b/src/helpers/get-password-requirement.ts
similarity index 100%
rename from src/helpers/auth/get-password-requirement.ts
rename to src/helpers/get-password-requirement.ts
diff --git a/src/modules/auth/sign-in-form.tsx b/src/modules/auth/sign-in-form.tsx
index 85eb3249..0eb8a9a0 100644
--- a/src/modules/auth/sign-in-form.tsx
+++ b/src/modules/auth/sign-in-form.tsx
@@ -39,7 +39,7 @@ export function SignInForm() {
     password,
     keepLoggedIn,
   }: SignInFormSchema) {
-    const response = await api('/login', {
+    const response = await api<{ account_type: 'user' | 'patient' }>('/login', {
       method: 'POST',
       body: JSON.stringify({ email, password, keep_logged_in: keepLoggedIn }),
     })
@@ -49,7 +49,11 @@ export function SignInForm() {
       return
     }
 
-    router.push(true ? ROUTES.dashboard.main : ROUTES.patient.main)
+    router.push(
+      response.data?.account_type === 'user'
+        ? ROUTES.dashboard.main
+        : ROUTES.patient.main,
+    )
   }
 
   return (
diff --git a/src/modules/auth/sign-up-form.tsx b/src/modules/auth/sign-up-form.tsx
index 15603f0e..ff894e16 100644
--- a/src/modules/auth/sign-up-form.tsx
+++ b/src/modules/auth/sign-up-form.tsx
@@ -19,14 +19,19 @@ import { ROUTES } from '@/constants/routes'
 import { SPECIALTIES_OPTIONS, type Specialty } from '@/enums/shared'
 import { type UserRole, USERS_ROLE_ENUM } from '@/enums/users'
 import { api } from '@/lib/api'
-import { nameSchema, passwordSchema, specialtySchema } from '@/schemas'
+import {
+  nameSchema,
+  passwordSchema,
+  specialtySchema,
+  userRegistrationId,
+} from '@/schemas'
 
 export const signUpFormSchema = z
   .object({
     role: z.enum(USERS_ROLE_ENUM),
     name: nameSchema,
     specialty: z.union([specialtySchema, z.literal('')]),
-    registration_id: z.string().max(32).optional(),
+    registration_id: userRegistrationId.optional(),
     password: passwordSchema,
     confirm_password: z.string(),
     consent: z.boolean(),
diff --git a/src/modules/users/table/actions.tsx b/src/modules/users/table/actions.tsx
index 65b4f3a3..d8449bf7 100644
--- a/src/modules/users/table/actions.tsx
+++ b/src/modules/users/table/actions.tsx
@@ -4,19 +4,17 @@ import {
   CheckCircle2Icon,
   ClipboardPenIcon,
   EllipsisIcon,
-  UserSquare2Icon,
   XCircleIcon,
 } from 'lucide-react'
-import { useRouter } from 'next/navigation'
 import { useState } from 'react'
 
 import { Dialog } from '@/components/ui/dialog'
 import { Divider } from '@/components/ui/divider'
 import { Menu, MenuContent, MenuItem, MenuTrigger } from '@/components/ui/menu'
-import { ROUTES } from '@/constants/routes'
 import type { User } from '@/types/users'
 
 import { ChangeUserStatusModal } from '../change-status-modal'
+import { UpdateUserModal } from '../update-modal'
 
 type UserModalMode = 'view' | 'edit' | 'status'
 
@@ -26,7 +24,6 @@ interface UsersTableActionsProps {
 
 export function UsersTableActions({ user }: Readonly<UsersTableActionsProps>) {
   const [modalOpen, setModalOpen] = useState<UserModalMode | null>(null)
-  const router = useRouter()
 
   const changingStatusData = {
     active: {
@@ -57,12 +54,12 @@ export function UsersTableActions({ user }: Readonly<UsersTableActionsProps>) {
             Editar
           </MenuItem>
 
-          <MenuItem
+          {/* <MenuItem
             onClick={() => router.push(ROUTES.dashboard.users.details(user.id))}
           >
             <UserSquare2Icon />
             Informações do usuário
-          </MenuItem>
+          </MenuItem> */}
 
           <Divider className='my-1' />
 
@@ -76,6 +73,15 @@ export function UsersTableActions({ user }: Readonly<UsersTableActionsProps>) {
         </MenuContent>
       </Menu>
 
+      {modalOpen === 'edit' && (
+        <Dialog
+          open={modalOpen === 'edit'}
+          onOpenChange={(open) => setModalOpen(open ? 'edit' : null)}
+        >
+          <UpdateUserModal user={user} onClose={() => setModalOpen(null)} />
+        </Dialog>
+      )}
+
       {modalOpen === 'status' && (
         <Dialog
           open={modalOpen === 'status'}
diff --git a/src/modules/users/table/index.tsx b/src/modules/users/table/index.tsx
index f0ae624e..e8a5d38e 100644
--- a/src/modules/users/table/index.tsx
+++ b/src/modules/users/table/index.tsx
@@ -6,11 +6,9 @@ import {
   TableEmptyCell,
   TableHead,
   TableHeader,
-  TableLink,
   TableRow,
 } from '@/components/ui/table'
 import { Tag } from '@/components/ui/tag'
-import { ROUTES } from '@/constants/routes'
 import { SPECIALTIES } from '@/enums/shared'
 import { USER_ROLES, USER_STATUSES } from '@/enums/users'
 import type { User } from '@/types/users'
@@ -58,13 +56,10 @@ export function UsersTable({ users, loading }: Readonly<UsersTableProps>) {
             return (
               <TableRow key={user.id}>
                 <TableCell>
-                  <TableLink
-                    className='w-64'
-                    href={ROUTES.dashboard.users.details(user.id)}
-                  >
+                  <div className='flex w-64 items-center gap-2'>
                     <Avatar className='size-9' src={user.avatar_url} />
                     <span className='truncate'>{user.name}</span>
-                  </TableLink>
+                  </div>
                 </TableCell>
                 <TableCell>{formatDate(user.created_at)}</TableCell>
                 <TableCell>
diff --git a/src/modules/users/update-modal.tsx b/src/modules/users/update-modal.tsx
new file mode 100644
index 00000000..d64cfa38
--- /dev/null
+++ b/src/modules/users/update-modal.tsx
@@ -0,0 +1,183 @@
+'use client'
+
+import { zodResolver } from '@hookform/resolvers/zod'
+import { ClipboardPenIcon } from 'lucide-react'
+import { FormProvider, useForm } from 'react-hook-form'
+import { toast } from 'sonner'
+import { z } from 'zod'
+
+import { FormContainer } from '@/components/form/form-container'
+import { SelectInput } from '@/components/form/select-input'
+import { TextInput } from '@/components/form/text-input'
+import { Button } from '@/components/ui/button'
+import {
+  DialogClose,
+  DialogContainer,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogIcon,
+  DialogTitle,
+} from '@/components/ui/dialog'
+import { QUERY_CACHE_KEYS } from '@/constants/cache'
+import { SPECIALTIES_OPTIONS } from '@/enums/shared'
+import { USERS_ROLE_OPTIONS } from '@/enums/users'
+import { revalidateClientCache } from '@/helpers/revalidate-client-cache'
+import { api } from '@/lib/api'
+import {
+  emailSchema,
+  nameSchema,
+  specialtySchema,
+  userRegistrationId,
+  userRoleSchema,
+} from '@/schemas'
+import type { User } from '@/types/users'
+
+const updateUserFormSchema = z
+  .object({
+    name: nameSchema,
+    email: emailSchema,
+    role: userRoleSchema,
+    specialty: specialtySchema.nullable().optional(),
+    registration_id: userRegistrationId.nullable().optional(),
+  })
+  .refine(
+    (data) => {
+      if (data.role === 'specialist') return data.specialty
+      return true
+    },
+    {
+      message: 'Especialidade é obrigatória',
+      path: ['specialty'],
+    },
+  )
+  .refine(
+    (data) => {
+      if (data.role === 'specialist') return data.registration_id
+      return true
+    },
+    {
+      message: 'Registro profissional é obrigatório',
+      path: ['registration_id'],
+    },
+  )
+
+type UpdateUserFormSchema = z.infer<typeof updateUserFormSchema>
+
+interface UpdateUserModalProps {
+  user: User
+  onClose: () => void
+}
+
+export function UpdateUserModal({
+  user,
+  onClose,
+}: Readonly<UpdateUserModalProps>) {
+  const formMethods = useForm<UpdateUserFormSchema>({
+    resolver: zodResolver(updateUserFormSchema),
+    mode: 'onBlur',
+    defaultValues: {
+      name: user.name,
+      email: user.email,
+      role: user.role,
+      specialty: user.specialty || null,
+      registration_id: user.registration_id || null,
+    },
+  })
+
+  const isSpecialist = user.role === 'specialist'
+
+  async function submitForm({
+    name,
+    specialty,
+    registration_id,
+  }: UpdateUserFormSchema) {
+    const response = await api(`/users/${user.id}`, {
+      method: 'PUT',
+      body: JSON.stringify({
+        name: name,
+        specialty: isSpecialist ? specialty : null,
+        registration_id: isSpecialist ? registration_id : null,
+      }),
+    })
+
+    if (!response.success) {
+      toast.error(response.message)
+      return
+    }
+
+    revalidateClientCache(QUERY_CACHE_KEYS.users.main)
+
+    toast.success(response.message)
+    onClose()
+  }
+
+  return (
+    <DialogContainer className='max-w-md'>
+      <DialogHeader icon={<DialogIcon icon={ClipboardPenIcon} />}>
+        <DialogTitle>Editar usuário</DialogTitle>
+      </DialogHeader>
+
+      <DialogContent>
+        <FormProvider {...formMethods}>
+          <FormContainer
+            className='gap-4'
+            onSubmit={formMethods.handleSubmit(submitForm)}
+          >
+            <TextInput
+              name='name'
+              label='Nome completo'
+              placeholder='Insira o nome'
+              isRequired
+            />
+
+            <TextInput name='email' label='E-mail' readOnly />
+
+            <SelectInput
+              name='role'
+              label='Função'
+              options={USERS_ROLE_OPTIONS}
+              readOnly
+            />
+
+            {isSpecialist && (
+              <>
+                <SelectInput
+                  name='specialty'
+                  label='Especialidade'
+                  options={SPECIALTIES_OPTIONS}
+                  placeholder='Selecione a especialidade'
+                  isRequired
+                />
+
+                <TextInput
+                  name='registration_id'
+                  label='Registro profissional'
+                  maxLength={32}
+                  placeholder='Insira o número do registro'
+                  isRequired
+                />
+              </>
+            )}
+          </FormContainer>
+        </FormProvider>
+      </DialogContent>
+
+      <DialogFooter>
+        <Button
+          className='flex-1'
+          loading={formMethods.formState.isSubmitting}
+          onClick={formMethods.handleSubmit(submitForm)}
+        >
+          Confirmar
+        </Button>
+        <DialogClose
+          className='flex-1'
+          disabled={formMethods.formState.isSubmitting}
+        >
+          Voltar
+        </DialogClose>
+      </DialogFooter>
+    </DialogContainer>
+  )
+}
diff --git a/src/schemas/index.tsx b/src/schemas/index.tsx
index 34e89db9..f012ec4d 100644
--- a/src/schemas/index.tsx
+++ b/src/schemas/index.tsx
@@ -43,6 +43,8 @@ export const avatarSchema = z.string().url()
 
 export const userRoleSchema = z.enum(USERS_ROLE_ENUM)
 
+export const userRegistrationId = z.string().max(32)
+
 export const phoneSchema = z
   .string()
   .nonempty('Insira o telefone')

From f25f053e2267cd5e0fb3b80ba5383c23219fe4f3 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Tue, 17 Feb 2026 17:13:48 -0300
Subject: [PATCH 73/77] test(input): update default expect classes

---
 tests/components/ui/input.test.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/tests/components/ui/input.test.tsx b/tests/components/ui/input.test.tsx
index a610b1b9..93f74aab 100644
--- a/tests/components/ui/input.test.tsx
+++ b/tests/components/ui/input.test.tsx
@@ -12,7 +12,7 @@ describe('Input', () => {
     const inputElement = screen.getByRole('textbox')
     expect(inputElement).toBeInTheDocument()
     expect(inputElement).toHaveClass(
-      'w-full rounded-lg border px-3 shadow-xs transition-colors disabled:cursor-not-allowed disabled:opacity-50 border-border text-foreground',
+      'w-full rounded-lg border px-3 shadow-xs transition-colors disabled:pointer-events-none disabled:opacity-50 border-border text-foreground',
     )
   })
   it('should render an error Input', () => {
@@ -20,7 +20,7 @@ describe('Input', () => {
 
     const inputElement = screen.getByRole('textbox')
     expect(inputElement).toBeInTheDocument()
-    expect(inputElement).toHaveClass('border-error focus-visible:ring-error')
+    expect(inputElement).toHaveClass('border-error outline-error')
   })
   it('should render a default Input with icon', () => {
     render(<Input icon={Atom} />)

From 7098b3fa9db6076a5499312dd650ce5cb77afaff Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Tue, 17 Feb 2026 17:17:29 -0300
Subject: [PATCH 74/77] build: add `force-dynamic` directive to pages that
 requires cookies data

---
 src/app/(dashboard)/atendimentos/page.tsx    | 2 ++
 src/app/(dashboard)/encaminhamentos/page.tsx | 2 ++
 src/app/(dashboard)/page.tsx                 | 2 ++
 3 files changed, 6 insertions(+)

diff --git a/src/app/(dashboard)/atendimentos/page.tsx b/src/app/(dashboard)/atendimentos/page.tsx
index d5172be7..b2e17583 100644
--- a/src/app/(dashboard)/atendimentos/page.tsx
+++ b/src/app/(dashboard)/atendimentos/page.tsx
@@ -4,6 +4,8 @@ import { TotalAppointmentsCard } from '@/modules/appointments/total-appointments
 import { TotalAppointmentsByCategoryCard } from '@/modules/appointments/total-by-category-card'
 import { TotalAppointmentsByStateCard } from '@/modules/appointments/total-by-state-card'
 
+export const dynamic = 'force-dynamic'
+
 export default function Page() {
   return (
     <div className='grid gap-6 sm:grid-cols-2'>
diff --git a/src/app/(dashboard)/encaminhamentos/page.tsx b/src/app/(dashboard)/encaminhamentos/page.tsx
index 456be1ea..4839e3a8 100644
--- a/src/app/(dashboard)/encaminhamentos/page.tsx
+++ b/src/app/(dashboard)/encaminhamentos/page.tsx
@@ -4,6 +4,8 @@ import { TotalReferralsByCategoryCard } from '@/modules/referrals/total-by-categ
 import { TotalReferralsByStateCard } from '@/modules/referrals/total-by-state-card'
 import { TotalReferralsCard } from '@/modules/referrals/total-referrals-card'
 
+export const dynamic = 'force-dynamic'
+
 export default function Page() {
   return (
     <div className='grid gap-6 sm:grid-cols-2'>
diff --git a/src/app/(dashboard)/page.tsx b/src/app/(dashboard)/page.tsx
index a49a291a..771e0a91 100644
--- a/src/app/(dashboard)/page.tsx
+++ b/src/app/(dashboard)/page.tsx
@@ -6,6 +6,8 @@ import { DashboardPatientsByGenderCard } from '@/modules/dashboard/patients-by-g
 import { DashboardSummaryCards } from '@/modules/dashboard/summary-cards'
 import { DashboardUpcomingAppointmentsCard } from '@/modules/dashboard/upcoming-appointments-card'
 
+export const dynamic = 'force-dynamic'
+
 export default function Page() {
   return (
     <div className='grid gap-6 sm:grid-cols-6'>

From 0c0c29e978f3edc1a01dbac4932e54ca47950ac8 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Tue, 17 Feb 2026 21:24:50 -0300
Subject: [PATCH 75/77] fix(eslint): apply eslint errors and warnings

---
 .../triagem/seus-dados/patient-data-form.tsx  |  1 +
 src/components/ui/calendar/dropdown-nav.tsx   | 19 +++---------
 src/components/ui/date-picker.tsx             | 23 ++++-----------
 src/modules/appointments/list.tsx             | 29 +++++++------------
 .../approved-list-table.tsx                   | 16 ++++------
 .../pending-requirements.tsx                  | 16 ++++------
 .../under-review-requirements.tsx             | 15 ++++------
 src/modules/patients/appointments-list.tsx    | 28 +++++++-----------
 src/modules/patients/form/index.tsx           | 18 +++++++-----
 src/modules/patients/patients-list.tsx        | 28 +++++++-----------
 src/modules/patients/referrals-list.tsx       | 28 +++++++-----------
 src/modules/referrals/list.tsx                | 28 +++++++-----------
 src/modules/users/invites/list.tsx            | 14 ++-------
 src/modules/users/list.tsx                    | 29 +++++++------------
 14 files changed, 101 insertions(+), 191 deletions(-)

diff --git a/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx b/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
index 51d71e27..cba30295 100644
--- a/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
+++ b/src/app/_paciente/triagem/seus-dados/patient-data-form.tsx
@@ -41,6 +41,7 @@ export function ScreeningPatientDataForm() {
     mode: 'onBlur',
   })
   const { clearErrors, setValue, watch, reset } = formMethods
+  // eslint-disable-next-line react-hooks/incompatible-library
   const UF = watch('state') as UF
   const cities = useCities(UF)
 
diff --git a/src/components/ui/calendar/dropdown-nav.tsx b/src/components/ui/calendar/dropdown-nav.tsx
index 6d193564..237972fc 100644
--- a/src/components/ui/calendar/dropdown-nav.tsx
+++ b/src/components/ui/calendar/dropdown-nav.tsx
@@ -1,5 +1,4 @@
 import { ChevronLeftIcon, ChevronRightIcon } from 'lucide-react'
-import { useEffect, useState } from 'react'
 import { NavProps, useDayPicker } from 'react-day-picker'
 
 import { Button } from '../button'
@@ -35,10 +34,10 @@ export function CalendarDropdownNav({
   nextMonth,
 }: Readonly<NavProps>) {
   const { months, goToMonth } = useDayPicker()
-  const { date: dateCurrent } = months[0]
+  const dateCurrent = months[0]?.date ?? new Date()
 
-  const [yearSelected, setYearSeleted] = useState<number>(currentYear)
-  const [monthSelected, setMonthSeleted] = useState<string>('')
+  const monthSelected = monthsOfYear[dateCurrent.getMonth()]
+  const yearSelected = dateCurrent.getFullYear()
 
   // Check if we're in a restricted mode (no nextMonth means we're at the limit)
   const isRestricted =
@@ -66,13 +65,6 @@ export function CalendarDropdownNav({
     value: String(year),
   }))
 
-  useEffect(() => {
-    if (!months.length) return
-
-    setMonthSeleted(monthsOfYear[dateCurrent.getMonth()])
-    setYearSeleted(dateCurrent.getFullYear())
-  }, [dateCurrent, months.length])
-
   return (
     <div className='bg-accent flex items-center justify-center gap-1 rounded-lg p-1.5'>
       <Button
@@ -92,7 +84,6 @@ export function CalendarDropdownNav({
         options={monthOptions}
         className='w-20'
         onValueChange={(value: string) => {
-          setMonthSeleted(value)
           goToMonth(new Date(yearSelected, monthsOfYear.indexOf(value)))
         }}
       />
@@ -104,9 +95,7 @@ export function CalendarDropdownNav({
         value={yearSelected.toString()}
         className='w-22'
         onValueChange={(value: string) => {
-          const year = Number(value)
-          setYearSeleted(year)
-          goToMonth(new Date(year, monthsOfYear.indexOf(monthSelected)))
+          goToMonth(new Date(Number(value), dateCurrent.getMonth()))
         }}
       />
 
diff --git a/src/components/ui/date-picker.tsx b/src/components/ui/date-picker.tsx
index e018a78e..5a4adb09 100644
--- a/src/components/ui/date-picker.tsx
+++ b/src/components/ui/date-picker.tsx
@@ -3,7 +3,7 @@
 import 'react-day-picker/style.css'
 
 import { CalendarDaysIcon } from 'lucide-react'
-import { useCallback, useEffect, useState } from 'react'
+import { useCallback, useState } from 'react'
 
 import { cn } from '@/utils/class-name-merge'
 import { formatDate } from '@/utils/formatters/format-date'
@@ -34,28 +34,17 @@ export function DatePicker({
   ...props
 }: Readonly<DatePickerProps>) {
   const [open, setOpen] = useState(false)
-  const [date, setDate] = useState(value ?? '')
 
   const handleCalendarSelect = useCallback(
     (selectedDate: Date | undefined) => {
-      if (!selectedDate) {
-        return
-      }
+      if (!selectedDate) return
 
-      if (onSelectDate) {
-        onSelectDate(selectedDate ? selectedDate.toISOString() : '')
-      }
-
-      setDate(selectedDate.toISOString())
+      onSelectDate?.(selectedDate.toISOString())
       setOpen(false)
     },
     [onSelectDate],
   )
 
-  useEffect(() => {
-    setDate(value ?? '')
-  }, [value])
-
   return (
     <Popover open={open} onOpenChange={setOpen} modal={modal}>
       <PopoverTrigger
@@ -67,8 +56,8 @@ export function DatePicker({
         {...props}
       >
         <CalendarDaysIcon />
-        {date ? (
-          formatDate(date, { dateStyle: 'short' })
+        {value ? (
+          formatDate(value, { dateStyle: 'short' })
         ) : (
           <span className='text-disabled'>{placeholder}</span>
         )}
@@ -80,7 +69,7 @@ export function DatePicker({
           startDate={startDate}
           onSelect={handleCalendarSelect}
           allowFutureDates={allowFutureDates}
-          selected={date ? new Date(date) : undefined}
+          selected={value ? new Date(value) : undefined}
         />
       </PopoverContent>
     </Popover>
diff --git a/src/modules/appointments/list.tsx b/src/modules/appointments/list.tsx
index 6bb48f5d..0a5c384b 100644
--- a/src/modules/appointments/list.tsx
+++ b/src/modules/appointments/list.tsx
@@ -2,7 +2,7 @@
 
 import { useQuery } from '@tanstack/react-query'
 import { ClipboardCheckIcon } from 'lucide-react'
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 
 import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
 import { FilterContainer } from '@/components/filters/container'
@@ -34,8 +34,7 @@ import { NewAppointmentButton } from './new-appointment-button'
 import { AppointmentsTable } from './table'
 
 export function AppointmentsList() {
-  const [showFilters, setShowFilters] = useState(false)
-  const [stableTotal, setStableTotal] = useState(0)
+  const [manualShowFilters, setManualShowFilters] = useState(false)
   const { getParams, paramsQueryKey } = useParams()
 
   const [page, search, category, status, orderBy, startDate, endDate] =
@@ -71,6 +70,7 @@ export function AppointmentsList() {
     ORDER_MAPPING[orderBy as AppointmentsOrder] ?? ORDER_MAPPING['name_asc']
 
   const { data: response, isLoading } = useQuery({
+    placeholderData: (previousData) => previousData,
     queryKey: [QUERY_CACHE_KEYS.appointments.main, paramsQueryKey],
     queryFn: () =>
       api<{ appointments: Appointment[]; total: number }>('/appointments', {
@@ -87,19 +87,10 @@ export function AppointmentsList() {
   })
 
   const appointments = response?.data?.appointments ?? []
+  const total = response?.data?.total ?? 0
 
-  // Update stable total only when we have actual data to prevent pagination flickering
-  useEffect(() => {
-    if (response?.data?.total !== undefined) {
-      setStableTotal(response.data.total)
-    }
-  }, [response?.data?.total])
-
-  useEffect(() => {
-    if (category || startDate || endDate) {
-      setShowFilters(true)
-    }
-  }, [category, startDate, endDate])
+  const hasActiveFilters = Boolean(category || status || startDate || endDate)
+  const showFilters = manualShowFilters || hasActiveFilters
 
   return (
     <>
@@ -107,7 +98,7 @@ export function AppointmentsList() {
         <SectionHeaderTitle
           title='Atendimentos'
           icon={<ClipboardCheckIcon />}
-          total={stableTotal}
+          total={total}
         />
         <SectionHeaderActions>
           <SearchInput placeholder='Pesquisar' className='w-48' />
@@ -118,7 +109,9 @@ export function AppointmentsList() {
             resetLabel='Limpar ordem'
             className='w-52'
           />
-          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
+          <ShowFilterButton
+            onClick={() => setManualShowFilters(!manualShowFilters)}
+          />
 
           <NewAppointmentButton size='sm' />
         </SectionHeaderActions>
@@ -151,7 +144,7 @@ export function AppointmentsList() {
         <AppointmentsTable appointments={appointments} loading={isLoading} />
       </Card>
 
-      <Pagination totalItems={stableTotal} />
+      <Pagination totalItems={total} />
     </>
   )
 }
diff --git a/src/modules/patient-requirements/approved-list-table.tsx b/src/modules/patient-requirements/approved-list-table.tsx
index 08a8ff21..839153ef 100644
--- a/src/modules/patient-requirements/approved-list-table.tsx
+++ b/src/modules/patient-requirements/approved-list-table.tsx
@@ -2,7 +2,6 @@
 
 import { useQuery } from '@tanstack/react-query'
 import { ClipboardCheckIcon } from 'lucide-react'
-import { useEffect, useState } from 'react'
 
 import { FilterSelect } from '@/components/filters/filter-select'
 import { SearchInput } from '@/components/filters/search-input'
@@ -43,7 +42,6 @@ import { ApprovedPatientRequirementsListTableActions } from './approved-list-tab
 import ApprovedPatientRequirementsListTableSkeleton from './approved-list-table-skeleton'
 
 export function ApprovedPatientRequirementsListTable() {
-  const [stableTotal, setStableTotal] = useState(0)
   const { getParams } = useParams()
 
   const [page, search, orderBy] = getParams([
@@ -78,14 +76,10 @@ export function ApprovedPatientRequirementsListTable() {
   })
 
   const requirements = response?.data?.requirements ?? []
-  const isEmpty = requirements.length === 0
-  const hasActiveFilters = !!search
+  const total = response?.data?.total ?? 0
 
-  useEffect(() => {
-    if (response?.data) {
-      setStableTotal(response.data.total)
-    }
-  }, [response?.data])
+  const isEmpty = !isLoading && requirements.length <= 0
+  const hasActiveFilters = !!search
 
   return (
     <>
@@ -93,7 +87,7 @@ export function ApprovedPatientRequirementsListTable() {
         <SectionHeaderTitle
           title='Aprovações'
           icon={<ClipboardCheckIcon />}
-          total={stableTotal}
+          total={total}
         />
         <SectionHeaderActions>
           <SearchInput placeholder='Pesquisar nome...' className='w-56' />
@@ -161,7 +155,7 @@ export function ApprovedPatientRequirementsListTable() {
         </Table>
       </Card>
 
-      <Pagination totalItems={stableTotal} />
+      <Pagination totalItems={total} />
     </>
   )
 }
diff --git a/src/modules/patient-requirements/pending-requirements.tsx b/src/modules/patient-requirements/pending-requirements.tsx
index 8fa923e4..b0b38b22 100644
--- a/src/modules/patient-requirements/pending-requirements.tsx
+++ b/src/modules/patient-requirements/pending-requirements.tsx
@@ -3,7 +3,6 @@
 import { useQuery } from '@tanstack/react-query'
 import { differenceInDays } from 'date-fns'
 import { Calendar, CircleAlert, ClockArrowUpIcon } from 'lucide-react'
-import { useEffect, useState } from 'react'
 
 import { FilterSelect } from '@/components/filters/filter-select'
 import { SearchInput } from '@/components/filters/search-input'
@@ -38,11 +37,10 @@ import { AddPatientRequirementButton } from './add-patient-requirement-button'
 
 // TODO: add dropdown menu
 export function PendingPatientRequirements() {
-  const [stableTotal, setStableTotal] = useState(0)
-
   const { getParams } = useParams()
 
   const perPage = 12
+
   const [page, search, orderBy] = getParams([
     QUERY_PARAM_KEYS.page,
     QUERY_PARAM_KEYS.search,
@@ -83,22 +81,18 @@ export function PendingPatientRequirements() {
   })
 
   const requirements = response?.data?.requirements ?? []
+  const total = response?.data?.total ?? 0
+
   const isEmpty = requirements.length === 0
   const hasActiveFilters = !!search
 
-  useEffect(() => {
-    if (response?.data) {
-      setStableTotal(response.data.total)
-    }
-  }, [response?.data])
-
   return (
     <>
       <SectionHeader>
         <SectionHeaderTitle
           title='Envios pendentes'
           icon={<ClockArrowUpIcon />}
-          total={stableTotal}
+          total={total}
         />
         <SectionHeaderActions>
           <SearchInput placeholder='Pesquisar nome...' className='w-56' />
@@ -177,7 +171,7 @@ export function PendingPatientRequirements() {
           })}
       </Card>
 
-      <Pagination perPage={perPage} totalItems={stableTotal} />
+      <Pagination perPage={perPage} totalItems={total} />
     </>
   )
 }
diff --git a/src/modules/patient-requirements/under-review-requirements.tsx b/src/modules/patient-requirements/under-review-requirements.tsx
index 3583eb64..b25d8f77 100644
--- a/src/modules/patient-requirements/under-review-requirements.tsx
+++ b/src/modules/patient-requirements/under-review-requirements.tsx
@@ -2,7 +2,6 @@
 
 import { useQuery } from '@tanstack/react-query'
 import { CircleAlertIcon, ClipboardClockIcon } from 'lucide-react'
-import { useEffect, useState } from 'react'
 
 import { FilterSelect } from '@/components/filters/filter-select'
 import { SearchInput } from '@/components/filters/search-input'
@@ -35,10 +34,10 @@ import { AddPatientRequirementButton } from './add-patient-requirement-button'
 
 // TODO: add dropdown actions menu
 export function UnderReviewPatientRequirements() {
-  const [stableTotal, setStableTotal] = useState(0)
   const { getParams } = useParams()
 
   const perPage = 12
+
   const [page, search, orderBy] = getParams([
     QUERY_PARAM_KEYS.page,
     QUERY_PARAM_KEYS.search,
@@ -79,22 +78,18 @@ export function UnderReviewPatientRequirements() {
   })
 
   const requirements = response?.data?.requirements ?? []
+  const total = response?.data?.total ?? 0
+
   const isEmpty = requirements.length === 0
   const hasActiveFilters = !!search
 
-  useEffect(() => {
-    if (response?.data) {
-      setStableTotal(response.data.total)
-    }
-  }, [response?.data])
-
   return (
     <>
       <SectionHeader>
         <SectionHeaderTitle
           title='Aprovações pendentes'
           icon={<ClipboardClockIcon />}
-          total={stableTotal}
+          total={total}
         />
         <SectionHeaderActions>
           <SearchInput placeholder='Pesquisar nome...' className='w-56' />
@@ -147,7 +142,7 @@ export function UnderReviewPatientRequirements() {
           ))}
       </Card>
 
-      <Pagination perPage={perPage} totalItems={stableTotal} />
+      <Pagination perPage={perPage} totalItems={total} />
     </>
   )
 }
diff --git a/src/modules/patients/appointments-list.tsx b/src/modules/patients/appointments-list.tsx
index b7f5d306..2a7b357c 100644
--- a/src/modules/patients/appointments-list.tsx
+++ b/src/modules/patients/appointments-list.tsx
@@ -2,7 +2,7 @@
 
 import { useQuery } from '@tanstack/react-query'
 import { ClipboardCheckIcon } from 'lucide-react'
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 
 import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
 import { FilterContainer } from '@/components/filters/container'
@@ -41,8 +41,7 @@ interface PatientAppointmentsListProps {
 export function PatientAppointmentsList({
   patientId,
 }: Readonly<PatientAppointmentsListProps>) {
-  const [showFilters, setShowFilters] = useState(false)
-  const [stableTotal, setStableTotal] = useState(0)
+  const [manualShowFilters, setManualShowFilters] = useState(false)
   const { getParams, paramsQueryKey } = useParams()
 
   const [page, category, status, orderBy, startDate, endDate] = getParams([
@@ -91,19 +90,10 @@ export function PatientAppointmentsList({
   })
 
   const appointments = response?.data?.appointments ?? []
+  const total = response?.data?.total ?? 0
 
-  // Update stable total only when we have actual data to prevent pagination flickering
-  useEffect(() => {
-    if (response?.data?.total !== undefined) {
-      setStableTotal(response.data.total)
-    }
-  }, [response?.data?.total])
-
-  useEffect(() => {
-    if (category || startDate || endDate) {
-      setShowFilters(true)
-    }
-  }, [category, startDate, endDate])
+  const hasActiveFilters = Boolean(category || status || startDate || endDate)
+  const showFilters = manualShowFilters || hasActiveFilters
 
   return (
     <>
@@ -111,7 +101,7 @@ export function PatientAppointmentsList({
         <SectionHeaderTitle
           title='Atendimentos'
           icon={<ClipboardCheckIcon />}
-          total={stableTotal}
+          total={total}
         />
         <SectionHeaderActions>
           <FilterSelect
@@ -121,7 +111,9 @@ export function PatientAppointmentsList({
             resetLabel='Limpar ordem'
             className='w-52'
           />
-          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
+          <ShowFilterButton
+            onClick={() => setManualShowFilters(!manualShowFilters)}
+          />
 
           <NewAppointmentButton patientId={patientId} size='sm' />
         </SectionHeaderActions>
@@ -158,7 +150,7 @@ export function PatientAppointmentsList({
         />
       </Card>
 
-      <Pagination totalItems={stableTotal} />
+      <Pagination totalItems={total} />
     </>
   )
 }
diff --git a/src/modules/patients/form/index.tsx b/src/modules/patients/form/index.tsx
index 44d1b1f6..2734e107 100644
--- a/src/modules/patients/form/index.tsx
+++ b/src/modules/patients/form/index.tsx
@@ -11,8 +11,7 @@ import {
 } from 'lucide-react'
 import { useRouter } from 'next/navigation'
 import { useMemo, useState } from 'react'
-import React from 'react'
-import { FormProvider, useFieldArray, useForm } from 'react-hook-form'
+import { FormProvider, useFieldArray, useForm, useWatch } from 'react-hook-form'
 import { toast } from 'sonner'
 import type { z } from 'zod'
 
@@ -64,14 +63,15 @@ export function PatientForm({
   const [action, setAction] = useState<Mode>(mode)
   const router = useRouter()
 
+  const isCreateForm = action === 'create'
+  const isViewMode = action === 'view'
+
   const patientFormSchema = useMemo(
     () => getPatientFormSchema(action),
     [action],
   )
   type PatientFormSchema = z.infer<typeof patientFormSchema>
 
-  const isCreateForm = action === 'create'
-
   const formMethods = useForm<PatientFormSchema>({
     resolver: zodResolver(patientFormSchema),
     defaultValues: {
@@ -102,9 +102,11 @@ export function PatientForm({
     name: 'supports',
   })
 
-  const selectedUF = formMethods.watch('state') as UF
+  const [selectedUF, hasDisability, takeMedication] = useWatch({
+    control: formMethods.control,
+    name: ['state', 'has_disability', 'take_medication'],
+  })
   const cityOptions = useCities(selectedUF)
-  const isViewMode = action === 'view'
 
   const submitButtons = {
     create: { icon: <UserPlus2Icon />, label: 'Cadastrar' },
@@ -288,7 +290,7 @@ export function PatientForm({
             maxLength={500}
             wrapperClassName='lg:col-span-2'
             readOnly={isViewMode}
-            disabled={formMethods.watch('has_disability') === 'no'}
+            disabled={hasDisability === 'no'}
           />
 
           <SelectInput
@@ -305,7 +307,7 @@ export function PatientForm({
             maxLength={500}
             wrapperClassName='lg:col-span-2'
             readOnly={isViewMode}
-            disabled={formMethods.watch('take_medication') === 'no'}
+            disabled={takeMedication === 'no'}
           />
 
           <SelectInput
diff --git a/src/modules/patients/patients-list.tsx b/src/modules/patients/patients-list.tsx
index c623a390..260d7def 100644
--- a/src/modules/patients/patients-list.tsx
+++ b/src/modules/patients/patients-list.tsx
@@ -2,7 +2,7 @@
 
 import { useQuery } from '@tanstack/react-query'
 import { PlusIcon, Users2Icon } from 'lucide-react'
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 
 import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
 import { FilterContainer } from '@/components/filters/container'
@@ -34,8 +34,7 @@ import type { Patient } from '@/types/patients.d.ts'
 import { PatientsTable } from './table'
 
 export function PatientsList() {
-  const [showFilters, setShowFilters] = useState(false)
-  const [stableTotal, setStableTotal] = useState(0)
+  const [manualShowFilters, setManualShowFilters] = useState(false)
   const { getParams, paramsQueryKey } = useParams()
 
   const [page, search, status, orderBy, startDate, endDate] = getParams([
@@ -72,19 +71,10 @@ export function PatientsList() {
   })
 
   const patients = response?.data?.patients ?? []
+  const total = response?.data?.total ?? 0
 
-  // Update stable total only when we have actual data to prevent pagination flickering
-  useEffect(() => {
-    if (response?.data?.total !== undefined) {
-      setStableTotal(response.data.total)
-    }
-  }, [response?.data?.total])
-
-  useEffect(() => {
-    if (status || startDate || endDate) {
-      setShowFilters(true)
-    }
-  }, [status, startDate, endDate])
+  const hasActiveFilters = Boolean(status || startDate || endDate)
+  const showFilters = manualShowFilters || hasActiveFilters
 
   return (
     <>
@@ -92,7 +82,7 @@ export function PatientsList() {
         <SectionHeaderTitle
           title='Pacientes'
           icon={<Users2Icon />}
-          total={stableTotal}
+          total={total}
         />
         <SectionHeaderActions>
           <SearchInput placeholder='Pesquisar' className='w-40' />
@@ -103,7 +93,9 @@ export function PatientsList() {
             resetLabel='Limpar ordem'
             className='w-40'
           />
-          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
+          <ShowFilterButton
+            onClick={() => setManualShowFilters(!manualShowFilters)}
+          />
 
           <NavButton size='sm' href={ROUTES.dashboard.patients.new}>
             <PlusIcon />
@@ -131,7 +123,7 @@ export function PatientsList() {
         <PatientsTable patients={patients} loading={isLoading} />
       </Card>
 
-      <Pagination totalItems={stableTotal} />
+      <Pagination totalItems={total} />
     </>
   )
 }
diff --git a/src/modules/patients/referrals-list.tsx b/src/modules/patients/referrals-list.tsx
index 3f02b9a3..6e47959c 100644
--- a/src/modules/patients/referrals-list.tsx
+++ b/src/modules/patients/referrals-list.tsx
@@ -2,7 +2,7 @@
 
 import { useQuery } from '@tanstack/react-query'
 import { ClipboardPasteIcon } from 'lucide-react'
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 
 import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
 import { FilterContainer } from '@/components/filters/container'
@@ -38,8 +38,7 @@ interface PatientReferralsListProps {
 export function PatientReferralsList({
   patientId,
 }: Readonly<PatientReferralsListProps>) {
-  const [showFilters, setShowFilters] = useState(false)
-  const [stableTotal, setStableTotal] = useState(0)
+  const [manualShowFilters, setManualShowFilters] = useState(false)
   const { getParams, paramsQueryKey } = useParams()
 
   const [page, category, status, orderBy, startDate, endDate] = getParams([
@@ -87,19 +86,10 @@ export function PatientReferralsList({
   })
 
   const referrals = response?.data?.referrals ?? []
+  const total = response?.data?.total ?? 0
 
-  // Update stable total only when we have actual data to prevent pagination flickering
-  useEffect(() => {
-    if (response?.data?.total !== undefined) {
-      setStableTotal(response.data.total)
-    }
-  }, [response?.data?.total])
-
-  useEffect(() => {
-    if (category || startDate || endDate) {
-      setShowFilters(true)
-    }
-  }, [category, startDate, endDate])
+  const hasActiveFilters = Boolean(category || status || startDate || endDate)
+  const showFilters = manualShowFilters || hasActiveFilters
 
   return (
     <>
@@ -107,7 +97,7 @@ export function PatientReferralsList({
         <SectionHeaderTitle
           title='Encaminhamentos'
           icon={<ClipboardPasteIcon />}
-          total={stableTotal}
+          total={total}
         />
         <SectionHeaderActions>
           <FilterSelect
@@ -117,7 +107,9 @@ export function PatientReferralsList({
             resetLabel='Limpar ordem'
             className='w-52'
           />
-          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
+          <ShowFilterButton
+            onClick={() => setManualShowFilters(!manualShowFilters)}
+          />
 
           <NewReferralButton patientId={patientId} size='sm' />
         </SectionHeaderActions>
@@ -154,7 +146,7 @@ export function PatientReferralsList({
         />
       </Card>
 
-      <Pagination totalItems={stableTotal} />
+      <Pagination totalItems={total} />
     </>
   )
 }
diff --git a/src/modules/referrals/list.tsx b/src/modules/referrals/list.tsx
index a880b679..dc43ab41 100644
--- a/src/modules/referrals/list.tsx
+++ b/src/modules/referrals/list.tsx
@@ -2,7 +2,7 @@
 
 import { useQuery } from '@tanstack/react-query'
 import { ClipboardPasteIcon } from 'lucide-react'
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 
 import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
 import { FilterContainer } from '@/components/filters/container'
@@ -34,8 +34,7 @@ import { NewReferralButton } from './new-referral-button'
 import { ReferralsTable } from './table'
 
 export function ReferralsList() {
-  const [showFilters, setShowFilters] = useState(false)
-  const [stableTotal, setStableTotal] = useState(0)
+  const [manualShowFilters, setManualShowFilters] = useState(false)
   const { getParams, paramsQueryKey } = useParams()
 
   const [page, search, category, status, orderBy, startDate, endDate] =
@@ -84,19 +83,10 @@ export function ReferralsList() {
   })
 
   const referrals = response?.data?.referrals ?? []
+  const total = response?.data?.total ?? 0
 
-  // Update stable total only when we have actual data to prevent pagination flickering
-  useEffect(() => {
-    if (response?.data?.total !== undefined) {
-      setStableTotal(response.data.total)
-    }
-  }, [response?.data?.total])
-
-  useEffect(() => {
-    if (category || startDate || endDate) {
-      setShowFilters(true)
-    }
-  }, [category, startDate, endDate])
+  const hasActiveFilters = Boolean(category || status || startDate || endDate)
+  const showFilters = manualShowFilters || hasActiveFilters
 
   return (
     <>
@@ -104,7 +94,7 @@ export function ReferralsList() {
         <SectionHeaderTitle
           title='Encaminhamentos'
           icon={<ClipboardPasteIcon />}
-          total={stableTotal}
+          total={total}
         />
         <SectionHeaderActions>
           <SearchInput placeholder='Pesquisar' className='w-48' />
@@ -115,7 +105,9 @@ export function ReferralsList() {
             resetLabel='Limpar ordem'
             className='w-52'
           />
-          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
+          <ShowFilterButton
+            onClick={() => setManualShowFilters(!manualShowFilters)}
+          />
 
           <NewReferralButton size='sm' />
         </SectionHeaderActions>
@@ -148,7 +140,7 @@ export function ReferralsList() {
         <ReferralsTable referrals={referrals} loading={isLoading} />
       </Card>
 
-      <Pagination totalItems={stableTotal} />
+      <Pagination totalItems={total} />
     </>
   )
 }
diff --git a/src/modules/users/invites/list.tsx b/src/modules/users/invites/list.tsx
index 55e1667b..6085d5e8 100644
--- a/src/modules/users/invites/list.tsx
+++ b/src/modules/users/invites/list.tsx
@@ -2,7 +2,6 @@
 
 import { useQuery } from '@tanstack/react-query'
 import { MailPlusIcon } from 'lucide-react'
-import { useEffect, useState } from 'react'
 
 import { FilterSelect } from '@/components/filters/filter-select'
 import { SearchInput } from '@/components/filters/search-input'
@@ -25,7 +24,6 @@ import { NewInviteButton } from './new-invite-button'
 import { UserInvitesTable } from './table'
 
 export function UserInvitesList() {
-  const [stableTotal, setStableTotal] = useState(0)
   const { getParams, paramsQueryKey } = useParams()
 
   const [page, search, orderBy, startDate, endDate] = getParams([
@@ -55,13 +53,7 @@ export function UserInvitesList() {
   })
 
   const invites = response?.data?.invites ?? []
-
-  // Update stable total only when we have actual data to prevent pagination flickering
-  useEffect(() => {
-    if (response?.data?.total !== undefined) {
-      setStableTotal(response.data.total)
-    }
-  }, [response?.data?.total])
+  const total = response?.data?.total ?? 0
 
   return (
     <>
@@ -69,7 +61,7 @@ export function UserInvitesList() {
         <SectionHeaderTitle
           title='Convites'
           icon={<MailPlusIcon />}
-          total={stableTotal}
+          total={total}
         />
 
         <SectionHeaderActions>
@@ -89,7 +81,7 @@ export function UserInvitesList() {
         <UserInvitesTable invites={invites} loading={isLoading} />
       </Card>
 
-      <Pagination totalItems={stableTotal} />
+      <Pagination totalItems={total} />
     </>
   )
 }
diff --git a/src/modules/users/list.tsx b/src/modules/users/list.tsx
index 85e6b4de..2b0c30b4 100644
--- a/src/modules/users/list.tsx
+++ b/src/modules/users/list.tsx
@@ -2,7 +2,7 @@
 
 import { useQuery } from '@tanstack/react-query'
 import { HeartHandshakeIcon } from 'lucide-react'
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 
 import { ClearFiltersButton } from '@/components/filters/clear-filters-button'
 import { FilterContainer } from '@/components/filters/container'
@@ -34,8 +34,7 @@ import { NewInviteButton } from './invites/new-invite-button'
 import { UsersTable } from './table'
 
 export function UsersList() {
-  const [showFilters, setShowFilters] = useState(false)
-  const [stableTotal, setStableTotal] = useState(0)
+  const [manualShowFilters, setManualShowFilters] = useState(false)
   const { getParams, paramsQueryKey } = useParams()
 
   const [page, search, role, status, orderBy, startDate, endDate] = getParams([
@@ -79,19 +78,10 @@ export function UsersList() {
   })
 
   const users = response?.data?.users ?? []
+  const total = response?.data?.total ?? 0
 
-  // Update stable total only when we have actual data to prevent pagination flickering
-  useEffect(() => {
-    if (response?.data?.total !== undefined) {
-      setStableTotal(response.data.total)
-    }
-  }, [response?.data?.total])
-
-  useEffect(() => {
-    if (status || role || startDate || endDate) {
-      setShowFilters(true)
-    }
-  }, [status, role, startDate, endDate])
+  const hasActiveFilters = Boolean(role || status || startDate || endDate)
+  const showFilters = manualShowFilters || hasActiveFilters
 
   return (
     <>
@@ -99,7 +89,7 @@ export function UsersList() {
         <SectionHeaderTitle
           title='Membros'
           icon={<HeartHandshakeIcon />}
-          total={stableTotal}
+          total={total}
         />
 
         <SectionHeaderActions>
@@ -111,7 +101,10 @@ export function UsersList() {
             resetLabel='Limpar ordem'
             className='w-44'
           />
-          <ShowFilterButton onClick={() => setShowFilters(!showFilters)} />
+          <ShowFilterButton
+            onClick={() => setManualShowFilters(!manualShowFilters)}
+          />
+
           <NewInviteButton size='sm' />
         </SectionHeaderActions>
       </SectionHeader>
@@ -143,7 +136,7 @@ export function UsersList() {
         <UsersTable users={users} loading={isLoading} />
       </Card>
 
-      <Pagination totalItems={stableTotal} />
+      <Pagination totalItems={total} />
     </>
   )
 }

From 6e13ca9dc5bde442309837b4362fe9a9140ed126 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Tue, 17 Feb 2026 21:30:11 -0300
Subject: [PATCH 76/77] chore: add `placeholderData` to list tables using
 `useQuery`

---
 src/modules/patient-requirements/approved-list-table.tsx       | 1 +
 src/modules/patient-requirements/pending-requirements.tsx      | 1 +
 src/modules/patient-requirements/under-review-requirements.tsx | 1 +
 src/modules/patients/appointments-list.tsx                     | 1 +
 src/modules/patients/patients-list.tsx                         | 1 +
 src/modules/patients/referrals-list.tsx                        | 1 +
 src/modules/referrals/list.tsx                                 | 1 +
 src/modules/users/invites/list.tsx                             | 1 +
 src/modules/users/list.tsx                                     | 1 +
 9 files changed, 9 insertions(+)

diff --git a/src/modules/patient-requirements/approved-list-table.tsx b/src/modules/patient-requirements/approved-list-table.tsx
index 839153ef..986a4382 100644
--- a/src/modules/patient-requirements/approved-list-table.tsx
+++ b/src/modules/patient-requirements/approved-list-table.tsx
@@ -67,6 +67,7 @@ export function ApprovedPatientRequirementsListTable() {
     ORDER_MAPPING['name_asc']
 
   const { data: response, isLoading } = useQuery({
+    placeholderData: (previousData) => previousData,
     queryKey: [QUERY_CACHE_KEYS.approvals.approved, search, page, orderByQuery],
     queryFn: () =>
       api<{ requirements: PatientRequirement[]; total: number }>(
diff --git a/src/modules/patient-requirements/pending-requirements.tsx b/src/modules/patient-requirements/pending-requirements.tsx
index b0b38b22..b54e06a5 100644
--- a/src/modules/patient-requirements/pending-requirements.tsx
+++ b/src/modules/patient-requirements/pending-requirements.tsx
@@ -64,6 +64,7 @@ export function PendingPatientRequirements() {
     ORDER_MAPPING['date_asc']
 
   const { data: response, isLoading } = useQuery({
+    placeholderData: (previousData) => previousData,
     queryKey: [QUERY_CACHE_KEYS.approvals.pending, search, page, orderByQuery],
     queryFn: () =>
       api<{ requirements: PatientRequirement[]; total: number }>(
diff --git a/src/modules/patient-requirements/under-review-requirements.tsx b/src/modules/patient-requirements/under-review-requirements.tsx
index b25d8f77..88843d82 100644
--- a/src/modules/patient-requirements/under-review-requirements.tsx
+++ b/src/modules/patient-requirements/under-review-requirements.tsx
@@ -61,6 +61,7 @@ export function UnderReviewPatientRequirements() {
     ORDER_MAPPING['date_asc']
 
   const { data: response, isLoading } = useQuery({
+    placeholderData: (previousData) => previousData,
     queryKey: [QUERY_CACHE_KEYS.approvals.pending, search, page, orderByQuery],
     queryFn: () =>
       api<{ requirements: PatientRequirement[]; total: number }>(
diff --git a/src/modules/patients/appointments-list.tsx b/src/modules/patients/appointments-list.tsx
index 2a7b357c..8be2da0a 100644
--- a/src/modules/patients/appointments-list.tsx
+++ b/src/modules/patients/appointments-list.tsx
@@ -74,6 +74,7 @@ export function PatientAppointmentsList({
     ORDER_MAPPING['date_asc']
 
   const { data: response, isLoading } = useQuery({
+    placeholderData: (previousData) => previousData,
     queryKey: [QUERY_CACHE_KEYS.appointments.main, patientId, paramsQueryKey],
     queryFn: () =>
       api<{ appointments: Appointment[]; total: number }>(`/appointments`, {
diff --git a/src/modules/patients/patients-list.tsx b/src/modules/patients/patients-list.tsx
index 260d7def..f7a59772 100644
--- a/src/modules/patients/patients-list.tsx
+++ b/src/modules/patients/patients-list.tsx
@@ -56,6 +56,7 @@ export function PatientsList() {
   }
 
   const { data: response, isLoading } = useQuery({
+    placeholderData: (previousData) => previousData,
     queryKey: [QUERY_CACHE_KEYS.patients.main, paramsQueryKey],
     queryFn: () =>
       api<{ patients: Patient[]; total: number }>('/patients', {
diff --git a/src/modules/patients/referrals-list.tsx b/src/modules/patients/referrals-list.tsx
index 6e47959c..0e34d894 100644
--- a/src/modules/patients/referrals-list.tsx
+++ b/src/modules/patients/referrals-list.tsx
@@ -70,6 +70,7 @@ export function PatientReferralsList({
     ORDER_MAPPING[orderBy as PatientReferralsOrder] ?? ORDER_MAPPING['date_asc']
 
   const { data: response, isLoading } = useQuery({
+    placeholderData: (previousData) => previousData,
     queryKey: [QUERY_CACHE_KEYS.referrals.main, patientId, paramsQueryKey],
     queryFn: () =>
       api<{ referrals: Referral[]; total: number }>(`/referrals`, {
diff --git a/src/modules/referrals/list.tsx b/src/modules/referrals/list.tsx
index dc43ab41..9aad8620 100644
--- a/src/modules/referrals/list.tsx
+++ b/src/modules/referrals/list.tsx
@@ -67,6 +67,7 @@ export function ReferralsList() {
     ORDER_MAPPING[orderBy as ReferralsOrder] ?? ORDER_MAPPING['name_asc']
 
   const { data: response, isLoading } = useQuery({
+    placeholderData: (previousData) => previousData,
     queryKey: [QUERY_CACHE_KEYS.referrals.main, paramsQueryKey],
     queryFn: () =>
       api<{ referrals: Referral[]; total: number }>('/referrals', {
diff --git a/src/modules/users/invites/list.tsx b/src/modules/users/invites/list.tsx
index 6085d5e8..5c629709 100644
--- a/src/modules/users/invites/list.tsx
+++ b/src/modules/users/invites/list.tsx
@@ -45,6 +45,7 @@ export function UserInvitesList() {
     ORDER_MAPPING[orderBy as InvitesOrder] ?? ORDER_MAPPING['email_asc']
 
   const { data: response, isLoading } = useQuery({
+    placeholderData: (previousData) => previousData,
     queryKey: [QUERY_CACHE_KEYS.users.invites, paramsQueryKey],
     queryFn: () =>
       api<{ invites: UserInvite[]; total: number }>('/users/invites', {
diff --git a/src/modules/users/list.tsx b/src/modules/users/list.tsx
index 2b0c30b4..9f07d022 100644
--- a/src/modules/users/list.tsx
+++ b/src/modules/users/list.tsx
@@ -62,6 +62,7 @@ export function UsersList() {
     ORDER_MAPPING[orderBy as UsersOrder] ?? ORDER_MAPPING['name_asc']
 
   const { data: response, isLoading } = useQuery({
+    placeholderData: (previousData) => previousData,
     queryKey: [QUERY_CACHE_KEYS.users.main, paramsQueryKey],
     queryFn: () =>
       api<{ users: User[]; total: number }>('/users', {

From 16daeb4162d5645f7b9fca07dca5084f88e689b3 Mon Sep 17 00:00:00 2001
From: Juliano Sill <sill.juliano@gmail.com>
Date: Tue, 17 Feb 2026 21:40:22 -0300
Subject: [PATCH 77/77] fix(images): remove `@images/` alias and update
 `AuthCard` props

---
 src/app/_paciente/_header/index.tsx    |  4 ++--
 src/app/conta/cadastrar/page.tsx       |  7 +------
 src/app/conta/entrar/page.tsx          |  2 --
 src/app/conta/nova-senha/page.tsx      |  3 +--
 src/app/conta/recuperar-senha/page.tsx |  2 --
 src/components/auth/auth-card.tsx      | 15 ++++++++++++---
 src/components/sidebar/header.tsx      | 10 ++++++++--
 src/constants/images.ts                |  3 +++
 tsconfig.json                          |  3 +--
 9 files changed, 28 insertions(+), 21 deletions(-)
 create mode 100644 src/constants/images.ts

diff --git a/src/app/_paciente/_header/index.tsx b/src/app/_paciente/_header/index.tsx
index f8182060..fc270247 100644
--- a/src/app/_paciente/_header/index.tsx
+++ b/src/app/_paciente/_header/index.tsx
@@ -1,4 +1,3 @@
-import logo from '@images/brand/icon.svg'
 import { SettingsIcon } from 'lucide-react'
 import Image from 'next/image'
 import Link from 'next/link'
@@ -8,6 +7,7 @@ import { PatientHeaderAccessibilityDropdown } from '@/app/_paciente/_header/acce
 import { PatientHeaderUserDropdown } from '@/app/_paciente/_header/user-dropdown'
 import { Breadcrumbs } from '@/components/breadcrumbs'
 import { Button } from '@/components/ui/button'
+import { IMAGES } from '@/constants/images'
 import { ROUTES } from '@/constants/routes'
 
 import { PatientDocumentsTab } from '../_components/documents-tab'
@@ -24,7 +24,7 @@ export async function PatientHeader() {
           href={ROUTES.patient.main}
           className='focus-visible:ring-ring rounded-full focus-visible:ring-2 focus-visible:ring-offset-4 focus-visible:outline-none'
         >
-          <Image src={logo} alt='SVM' className='size-8' />
+          <Image src={IMAGES.icon} alt='SVM' className='size-8' />
         </Link>
 
         <Breadcrumbs />
diff --git a/src/app/conta/cadastrar/page.tsx b/src/app/conta/cadastrar/page.tsx
index df0829fe..14fe072a 100644
--- a/src/app/conta/cadastrar/page.tsx
+++ b/src/app/conta/cadastrar/page.tsx
@@ -1,4 +1,3 @@
-import image from '@images/brand/icon.svg'
 import type { Metadata } from 'next'
 import { redirect } from 'next/navigation'
 
@@ -45,11 +44,7 @@ export default async function Page({ searchParams }: Readonly<PageProps>) {
   const content = isTokenValid ? CARD_CONTENT['valid'] : CARD_CONTENT['invalid']
 
   return (
-    <AuthCard
-      image={image}
-      title={content.title}
-      description={content.description}
-    >
+    <AuthCard title={content.title} description={content.description}>
       {isTokenValid ? (
         <SignUpForm token={token} role={tokenValue.role} />
       ) : (
diff --git a/src/app/conta/entrar/page.tsx b/src/app/conta/entrar/page.tsx
index 9d03248a..a0668892 100644
--- a/src/app/conta/entrar/page.tsx
+++ b/src/app/conta/entrar/page.tsx
@@ -1,4 +1,3 @@
-import image from '@images/brand/icon.svg'
 import type { Metadata } from 'next'
 
 import { AuthCard } from '@/components/auth/auth-card'
@@ -12,7 +11,6 @@ export const metadata: Metadata = {
 export default function Page() {
   return (
     <AuthCard
-      image={image}
       title='Bem vindo(a)'
       description='Insira seus dados para entrar na sua conta'
     >
diff --git a/src/app/conta/nova-senha/page.tsx b/src/app/conta/nova-senha/page.tsx
index f9f9c749..75e6d2a6 100644
--- a/src/app/conta/nova-senha/page.tsx
+++ b/src/app/conta/nova-senha/page.tsx
@@ -1,4 +1,3 @@
-import image from '@images/brand/icon.svg'
 import type { Metadata } from 'next'
 import { redirect } from 'next/navigation'
 
@@ -24,7 +23,7 @@ export default async function Page({ searchParams }: Readonly<PageProps>) {
   }
 
   return (
-    <AuthCard image={image} title='Redefinir senha'>
+    <AuthCard title='Redefinir senha'>
       <ResetPasswordForm token={token} />
 
       <Divider />
diff --git a/src/app/conta/recuperar-senha/page.tsx b/src/app/conta/recuperar-senha/page.tsx
index 0d1f32c7..d6275666 100644
--- a/src/app/conta/recuperar-senha/page.tsx
+++ b/src/app/conta/recuperar-senha/page.tsx
@@ -1,4 +1,3 @@
-import image from '@images/brand/icon.svg'
 import type { Metadata } from 'next'
 
 import { AuthCard } from '@/components/auth/auth-card'
@@ -14,7 +13,6 @@ export const metadata: Metadata = {
 export default function Page() {
   return (
     <AuthCard
-      image={image}
       title='Recuperar senha'
       description='Insira seu e-mail para recuperar sua senha'
     >
diff --git a/src/components/auth/auth-card.tsx b/src/components/auth/auth-card.tsx
index 9de5074f..1a4cb3eb 100644
--- a/src/components/auth/auth-card.tsx
+++ b/src/components/auth/auth-card.tsx
@@ -3,16 +3,17 @@ import Image from 'next/image'
 import type { ReactNode } from 'react'
 
 import { Divider } from '@/components/ui/divider'
+import { IMAGES } from '@/constants/images'
 
 interface AuthCardProps {
-  image: string | StaticImport
+  image?: string | StaticImport
   title: string
   description?: string
   children: ReactNode
 }
 
 export function AuthCard({
-  image,
+  image = IMAGES.icon,
   title,
   description,
   children,
@@ -20,7 +21,15 @@ export function AuthCard({
   return (
     <div className='bg-background flex w-full max-w-md flex-col items-center gap-6 rounded-3xl p-8 shadow-xl/5'>
       <header className='flex flex-col items-center gap-1 text-center'>
-        {image && <Image src={image} alt='' className='mb-4 size-16' />}
+        {image && (
+          <Image
+            alt=''
+            src={image}
+            height={128}
+            width={128}
+            className='mb-4 size-16'
+          />
+        )}
         <h1 className='text-2xl font-medium'>{title}</h1>
         {description && <p className='text-foreground-soft'>{description}</p>}
       </header>
diff --git a/src/components/sidebar/header.tsx b/src/components/sidebar/header.tsx
index f78f0060..9339c9fa 100644
--- a/src/components/sidebar/header.tsx
+++ b/src/components/sidebar/header.tsx
@@ -1,9 +1,9 @@
 'use client'
 
-import icon from '@images/brand/icon.svg'
 import Image from 'next/image'
 import Link from 'next/link'
 
+import { IMAGES } from '@/constants/images'
 import { ROUTES } from '@/constants/routes'
 import { useSidebar } from '@/store/sidebar'
 
@@ -14,7 +14,13 @@ export function SidebarHeader() {
     <header className='relative flex items-center'>
       <Link href={ROUTES.dashboard.main}>
         <div className='flex items-center'>
-          <Image src={icon} alt='Símbolo do SVM' className='size-10 shrink-0' />
+          <Image
+            src={IMAGES.icon}
+            alt='Símbolo do SVM'
+            className='size-10 shrink-0'
+            height={80}
+            width={80}
+          />
           <span
             data-visible={expanded}
             className='text-primary absolute left-13 text-lg leading-none font-bold whitespace-nowrap opacity-0 transition-opacity duration-200 data-[visible=true]:opacity-100 data-[visible=true]:delay-150'
diff --git a/src/constants/images.ts b/src/constants/images.ts
new file mode 100644
index 00000000..df45f44f
--- /dev/null
+++ b/src/constants/images.ts
@@ -0,0 +1,3 @@
+export const IMAGES = {
+  icon: '/images/brand/icon.svg',
+}
diff --git a/tsconfig.json b/tsconfig.json
index 984ebe5e..19c51c83 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -19,8 +19,7 @@
       }
     ],
     "paths": {
-      "@/*": ["./src/*"],
-      "@images/*": ["./public/images/*"]
+      "@/*": ["./src/*"]
     }
   },
   "include": [