From bcd5ce9bac74382046ba31c63de6091ee585f706 Mon Sep 17 00:00:00 2001
From: M-Gabrielly <maria.gabrielly221106@gmail.com>
Date: Wed, 5 Nov 2025 21:31:00 -0300
Subject: [PATCH] fix(resultados/profissional): type callbacks and mute
 warnings from dynamic images

---
 .../app/(main-routes)/calendar/page.tsx       |  4 +--
 .../app/(main-routes)/dashboard/page.tsx      |  2 +-
 .../dashboard/relatorios/page.tsx             |  4 +--
 .../app/(main-routes)/doutores/page.tsx       |  2 +-
 susconecta/app/paciente/page.tsx              | 30 ++++++++---------
 .../paciente/resultados/ResultadosClient.tsx  | 17 ++++------
 susconecta/app/profissional/page.tsx          | 33 +++++++++++++------
 7 files changed, 50 insertions(+), 42 deletions(-)

diff --git a/susconecta/app/(main-routes)/calendar/page.tsx b/susconecta/app/(main-routes)/calendar/page.tsx
index 062a035..c4afdea 100644
--- a/susconecta/app/(main-routes)/calendar/page.tsx
+++ b/susconecta/app/(main-routes)/calendar/page.tsx
@@ -193,7 +193,7 @@ export default function AgendamentoPage() {
               <div className="flex flex-row">
                 <Button
                   variant={"outline"}
-                  className="bg-muted hover:bg-primary! hover:text-white! transition-colors rounded-l-[100px] rounded-r-[0px]"
+                  className="bg-muted hover:bg-primary! hover:text-white! transition-colors rounded-l-[100px] rounded-r-none"
                   onClick={() => setActiveTab("calendar")}
                 >
                   Calendário
@@ -209,7 +209,7 @@ export default function AgendamentoPage() {
 
                 <Button
                   variant={"outline"}
-                  className="bg-muted hover:bg-primary! hover:text-white! transition-colors rounded-r-[100px] rounded-l-[0px]"
+                  className="bg-muted hover:bg-primary! hover:text-white! transition-colors rounded-r-[100px] rounded-l-none"
                   onClick={() => setActiveTab("espera")}
                 >
                   Lista de espera
diff --git a/susconecta/app/(main-routes)/dashboard/page.tsx b/susconecta/app/(main-routes)/dashboard/page.tsx
index efeb795..8f90e09 100644
--- a/susconecta/app/(main-routes)/dashboard/page.tsx
+++ b/susconecta/app/(main-routes)/dashboard/page.tsx
@@ -388,7 +388,7 @@ export default function DashboardPage() {
       )}
 
       {/* 11. LINK PARA RELATÓRIOS */}
-      <div className="bg-gradient-to-r from-blue-500/10 to-purple-500/10 p-6 rounded-lg border border-blue-500/20">
+      <div className="bg-linear-to-r from-blue-500/10 to-purple-500/10 p-6 rounded-lg border border-blue-500/20">
         <h2 className="text-lg font-semibold text-foreground mb-2">Seção de Relatórios</h2>
         <p className="text-muted-foreground text-sm mb-4">
           Acesse a seção de relatórios médicos para gerenciar, visualizar e exportar documentos.
diff --git a/susconecta/app/(main-routes)/dashboard/relatorios/page.tsx b/susconecta/app/(main-routes)/dashboard/relatorios/page.tsx
index e406b1b..c70081a 100644
--- a/susconecta/app/(main-routes)/dashboard/relatorios/page.tsx
+++ b/susconecta/app/(main-routes)/dashboard/relatorios/page.tsx
@@ -303,8 +303,8 @@ export default function RelatoriosPage() {
           { label: "Atendimentos", value: appointmentsToday ?? 0, icon: <CalendarCheck className="w-6 h-6 text-blue-500" /> },
           { label: "Absenteísmo", value: '—', icon: <UserCheck className="w-6 h-6 text-red-500" /> },
           { label: "Satisfação", value: 'Dados não foram disponibilizados', icon: <ThumbsUp className="w-6 h-6 text-green-500" /> },
-          { label: "Faturamento (Mês)", value: `R$ ${faturamentoArr[faturamentoArr.length - 1]?.valor ?? 0}`, icon: <DollarSign className="w-6 h-6 text-emerald-500" /> },
-          { label: "No-show", value: `${taxaArr[taxaArr.length - 1]?.noShow ?? 0}%`, icon: <User className="w-6 h-6 text-yellow-500" /> },
+          { label: "Faturamento (Mês)", value: `R$ ${faturamentoArr.at(-1)?.valor ?? 0}`, icon: <DollarSign className="w-6 h-6 text-emerald-500" /> },
+          { label: "No-show", value: `${taxaArr.at(-1)?.noShow ?? 0}%`, icon: <User className="w-6 h-6 text-yellow-500" /> },
         ] as any);
 
       } catch (err: any) {
diff --git a/susconecta/app/(main-routes)/doutores/page.tsx b/susconecta/app/(main-routes)/doutores/page.tsx
index a9bdfac..5761f68 100644
--- a/susconecta/app/(main-routes)/doutores/page.tsx
+++ b/susconecta/app/(main-routes)/doutores/page.tsx
@@ -20,7 +20,7 @@ import { listAssignmentsForUser } from '@/lib/assignment';
 
 function normalizeMedico(m: any): Medico {
   const normalizeSex = (v: any) => {
-    if (v === null || typeof v === 'undefined') return null;
+    if (v === undefined) return null;
     const s = String(v || '').trim().toLowerCase();
     if (!s) return null;
     const male = new Set(['m','masc','male','masculino','homem','h','1','mas']);
diff --git a/susconecta/app/paciente/page.tsx b/susconecta/app/paciente/page.tsx
index da64595..697c02f 100644
--- a/susconecta/app/paciente/page.tsx
+++ b/susconecta/app/paciente/page.tsx
@@ -172,7 +172,6 @@ export default function PacientePage() {
 
     loadProfile()
     return () => { mounted = false }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [user?.id, user?.email])
 
   // Load authoritative patient row for the logged-in user (prefer user_id lookup)
@@ -414,7 +413,7 @@ export default function PacientePage() {
       }
       load()
       return () => { mounted = false }
-    }, [patientId])
+    }, [])
 
     return (
       <div className="grid grid-cols-1 gap-4 mb-6 md:grid-cols-2">
@@ -622,7 +621,7 @@ export default function PacientePage() {
 
       loadAppointments()
       return () => { mounted = false }
-    }, [patientId])
+    }, [])
 
     // Monta a URL de resultados com os filtros atuais
     const buildResultadosHref = () => {
@@ -642,14 +641,14 @@ export default function PacientePage() {
     return (
       <div className="space-y-6">
         {/* Hero Section */}
-        <section className="bg-gradient-to-br from-card to-card/95 shadow-lg rounded-2xl border border-primary/10 p-8">
+        <section className="bg-linear-to-br from-card to-card/95 shadow-lg rounded-2xl border border-primary/10 p-8">
           <div className="max-w-3xl mx-auto space-y-8">
             <header className="text-center space-y-4">
               <h2 className="text-4xl font-bold text-foreground">Agende sua próxima consulta</h2>
               <p className="text-lg text-muted-foreground leading-relaxed">Escolha o formato ideal, selecione a especialidade e encontre o profissional perfeito para você.</p>
             </header>
 
-            <div className="space-y-6 rounded-2xl border border-primary/15 bg-gradient-to-r from-primary/5 to-primary/10 p-8 shadow-sm">
+            <div className="space-y-6 rounded-2xl border border-primary/15 bg-linear-to-r from-primary/5 to-primary/10 p-8 shadow-sm">
               <div className="flex justify-center">
                 <Button asChild className="w-full md:w-auto px-10 py-3 bg-primary text-white hover:bg-primary/90! hover:text-white! transition-all duration-200 font-semibold text-base rounded-lg shadow-md hover:shadow-lg active:scale-95">
                   <Link href={buildResultadosHref()} prefetch={false}>
@@ -670,7 +669,7 @@ export default function PacientePage() {
             </header>
 
             {/* Date Navigation */}
-            <div className="flex flex-col gap-4 rounded-2xl border border-primary/20 bg-gradient-to-r from-primary/5 to-primary/10 p-6 sm:flex-row sm:items-center sm:justify-between shadow-sm">
+            <div className="flex flex-col gap-4 rounded-2xl border border-primary/20 bg-linear-to-r from-primary/5 to-primary/10 p-6 sm:flex-row sm:items-center sm:justify-between shadow-sm">
               <div className="flex items-center gap-2 sm:gap-3">
                 <Button
                   type="button"
@@ -740,16 +739,16 @@ export default function PacientePage() {
                         {/* Doctor Info */}
                         <div className="flex items-start gap-4 min-w-0">
                           <span
-                            className="mt-2 h-4 w-4 flex-shrink-0 rounded-full shadow-sm"
+                            className="mt-2 h-4 w-4 shrink-0 rounded-full shadow-sm"
                             style={{ backgroundColor: consulta.status === 'Confirmada' ? '#10b981' : consulta.status === 'Pendente' ? '#f59e0b' : '#ef4444' }}
                             aria-hidden
                           />
                           <div className="space-y-3 min-w-0">
                             <div className="font-bold flex items-center gap-2.5 text-foreground text-lg leading-tight">
-                              <Stethoscope className="h-5 w-5 text-primary flex-shrink-0" />
+                              <Stethoscope className="h-5 w-5 text-primary shrink-0" />
                               <span className="truncate">{consulta.medico}</span>
                             </div>
-                            <p className="text-sm text-muted-foreground break-words leading-relaxed">
+                            <p className="text-sm text-muted-foreground wrap-break-word leading-relaxed">
                               <span className="font-medium text-foreground/70">{consulta.especialidade}</span>
                               <span className="mx-1.5">•</span>
                               <span>{consulta.local}</span>
@@ -759,7 +758,7 @@ export default function PacientePage() {
 
                         {/* Time */}
                         <div className="flex items-center justify-start gap-2.5 text-foreground">
-                          <Clock className="h-5 w-5 text-primary flex-shrink-0" />
+                          <Clock className="h-5 w-5 text-primary shrink-0" />
                           <span className="font-bold text-lg">{consulta.hora}</span>
                         </div>
 
@@ -767,10 +766,10 @@ export default function PacientePage() {
                         <div className="flex items-center justify-start">
                           <span className={`px-4 py-2.5 rounded-full text-xs font-bold text-white shadow-md transition-all ${
                             consulta.status === 'Confirmada' 
-                              ? 'bg-gradient-to-r from-emerald-500 to-emerald-600 shadow-emerald-500/20' 
+                              ? 'bg-linear-to-r from-emerald-500 to-emerald-600 shadow-emerald-500/20' 
                               : consulta.status === 'Pendente' 
-                              ? 'bg-gradient-to-r from-amber-500 to-amber-600 shadow-amber-500/20' 
-                              : 'bg-gradient-to-r from-red-500 to-red-600 shadow-red-500/20'
+                              ? 'bg-linear-to-r from-amber-500 to-amber-600 shadow-amber-500/20' 
+                              : 'bg-linear-to-r from-red-500 to-red-600 shadow-red-500/20'
                           }`}>
                             {consulta.status}
                           </span>
@@ -884,6 +883,7 @@ export default function PacientePage() {
         return false
       }
     })
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [reports, searchTerm, doctorsMap, remoteMatch])
 
   // When the search term looks like an id, attempt a direct fetch using the reports API
@@ -1198,7 +1198,7 @@ export default function PacientePage() {
       })()
 
       return () => { mounted = false }
-    }, [patientId])
+    }, [])
 
     // When a report is selected, try to fetch doctor name if we have an id
     useEffect(() => {
@@ -1255,7 +1255,7 @@ export default function PacientePage() {
         }
       })()
       return () => { mounted = false }
-    }, [selectedReport])
+    }, [])
 
     // reset pagination when reports change
     useEffect(() => {
diff --git a/susconecta/app/paciente/resultados/ResultadosClient.tsx b/susconecta/app/paciente/resultados/ResultadosClient.tsx
index e179122..1fa8519 100644
--- a/susconecta/app/paciente/resultados/ResultadosClient.tsx
+++ b/susconecta/app/paciente/resultados/ResultadosClient.tsx
@@ -243,7 +243,7 @@ export default function ResultadosClient() {
         days.push({ label, data: fmtDay(d), dateKey, horarios: [] })
       }
 
-      const onlyAvail = (res?.slots || []).filter(s => s.available)
+      const onlyAvail = (res?.slots || []).filter((s: any) => s.available)
       for (const s of onlyAvail) {
         const dt = new Date(s.datetime)
         const key = dt.toISOString().split('T')[0]
@@ -639,7 +639,7 @@ export default function ResultadosClient() {
         )}
 
         {/* Confirmation dialog shown when a user selects a slot */}
-        <Dialog open={confirmOpen} onOpenChange={(open) => { if (!open) { setConfirmOpen(false); setPendingAppointment(null); } }}>
+        <Dialog open={confirmOpen} onOpenChange={(open: boolean) => { if (!open) { setConfirmOpen(false); setPendingAppointment(null); } }}>
           <DialogContent>
             <DialogHeader>
               <DialogTitle>Confirmar agendamento</DialogTitle>
@@ -672,7 +672,7 @@ export default function ResultadosClient() {
         </Dialog>
 
           {/* Booking success modal shown when origin=paciente */}
-          <Dialog open={bookingSuccessOpen} onOpenChange={(open) => setBookingSuccessOpen(open)}>
+          <Dialog open={bookingSuccessOpen} onOpenChange={(open: boolean) => setBookingSuccessOpen(open)}>
             <DialogContent>
               <DialogHeader>
                 <DialogTitle>Consulta agendada</DialogTitle>
@@ -769,7 +769,7 @@ export default function ResultadosClient() {
             <Input
               placeholder="Buscar médico por nome"
               value={searchQuery}
-              onChange={(e) => setSearchQuery(e.target.value)}
+              onChange={(e: React.ChangeEvent<HTMLInputElement>) => setSearchQuery(e.target.value)}
               className="min-w-[220px] rounded-full"
             />
             {searchQuery ? (
@@ -818,11 +818,6 @@ export default function ResultadosClient() {
 
         {/* Lista de profissionais */}
         <section className="space-y-4">
-          {/* Debug card */}
-          <div className="text-xs text-muted-foreground p-2 bg-muted/30 rounded">
-            Status: loading={loadingMedicos} | medicos={medicos.length} | profissionais={profissionais.length} | especialidade={especialidadeHero} | paramsSync={paramsSync}
-          </div>
-
           {loadingMedicos && (
             <Card className="flex items-center justify-center border border-dashed border-border bg-card/60 p-12 text-muted-foreground">
               Buscando profissionais...
@@ -1003,7 +998,7 @@ export default function ResultadosClient() {
         </section>
 
         {/* Dialog de perfil completo (mantido e adaptado) */}
-        <Dialog open={!!medicoSelecionado} onOpenChange={open => !open && setMedicoSelecionado(null)}>
+        <Dialog open={!!medicoSelecionado} onOpenChange={(open: boolean) => !open && setMedicoSelecionado(null)}>
           <DialogContent className="max-h[90vh] max-h-[90vh] w-full max-w-5xl overflow-y-auto border border-border bg-card p-0">
             {medicoSelecionado && (
               <>
@@ -1119,7 +1114,7 @@ export default function ResultadosClient() {
           </DialogContent>
         </Dialog>
         {/* Dialog: Mostrar mais horários (escolher data arbitrária) */}
-        <Dialog open={!!moreTimesForDoctor} onOpenChange={(open) => { if (!open) { setMoreTimesForDoctor(null); setMoreTimesSlots([]); setMoreTimesException(null); } }}>
+        <Dialog open={!!moreTimesForDoctor} onOpenChange={(open: boolean) => { if (!open) { setMoreTimesForDoctor(null); setMoreTimesSlots([]); setMoreTimesException(null); } }}>
           <DialogContent className="w-full max-w-2xl border border-border bg-card p-6">
             <DialogHeader className="mb-4">
               <DialogTitle>Mais horários</DialogTitle>
diff --git a/susconecta/app/profissional/page.tsx b/susconecta/app/profissional/page.tsx
index 9fe63fd..485fc90 100644
--- a/susconecta/app/profissional/page.tsx
+++ b/susconecta/app/profissional/page.tsx
@@ -1,9 +1,11 @@
 "use client";
 import React, { useState, useRef, useEffect } from "react";
+import Image from "next/image";
 import SignatureCanvas from "react-signature-canvas";
 import Link from "next/link";
 import ProtectedRoute from "@/components/shared/ProtectedRoute";
 import { useAuth } from "@/hooks/useAuth";
+import { useToast } from "@/hooks/use-toast";
 import { buscarPacientes, listarPacientes, buscarPacientePorId, buscarPacientesPorIds, buscarMedicoPorId, buscarMedicosPorIds, buscarMedicos, listarAgendamentos, type Paciente, buscarRelatorioPorId, atualizarMedico } from "@/lib/api";
 import { useReports } from "@/hooks/useReports";
 import { CreateReportData } from "@/types/report-types";
@@ -174,7 +176,8 @@ const ProfissionalPage = () => {
       }
     })();
     return () => { mounted = false; };
-  }, [user?.id, doctorId]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
 
   // Carregar perfil do médico correspondente ao usuário logado
   useEffect(() => {
@@ -226,7 +229,8 @@ const ProfissionalPage = () => {
       }
     })();
     return () => { mounted = false; };
-  }, [user?.id, user?.email]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
 
 
 
@@ -338,7 +342,7 @@ const ProfissionalPage = () => {
         // Helper: parse 'YYYY-MM-DD' into a local Date to avoid UTC parsing which can shift day
         const parseYMDToLocal = (ymd?: string) => {
           if (!ymd || typeof ymd !== 'string') return new Date();
-          const parts = ymd.split('-').map((p) => Number(p));
+          const parts = ymd.split('-').map(Number);
           if (parts.length < 3 || parts.some((n) => Number.isNaN(n))) return new Date(ymd);
           const [y, m, d] = parts;
           return new Date(y, (m || 1) - 1, d || 1);
@@ -369,7 +373,8 @@ const ProfissionalPage = () => {
       }
     })();
     return () => { mounted = false; };
-  }, [doctorId, user?.id, user?.email]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [doctorId]);
   const [editingEvent, setEditingEvent] = useState<any>(null);
   const [showPopup, setShowPopup] = useState(false);
   const [showActionModal, setShowActionModal] = useState(false);
@@ -1200,12 +1205,14 @@ const ProfissionalPage = () => {
         await loadAssignedLaudos();
       })();
       return () => { mounted = false; };
-    }, [user?.id]);
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
 
     // sincroniza quando reports mudarem no hook (fallback)
     useEffect(() => {
       if (!laudos || laudos.length === 0) setLaudos(reports || []);
-    }, [reports]);
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
 
       // Sort reports newest-first (more recent dates at the top)
       const sortedLaudos = React.useMemo(() => {
@@ -1668,8 +1675,7 @@ const ProfissionalPage = () => {
 
   // Editor de Laudo Avançado (para novos laudos)
   function LaudoEditor({ pacientes, laudo, onClose, isNewLaudo, preSelectedPatient, createNewReport, updateExistingReport, reloadReports, onSaved }: { pacientes?: any[]; laudo?: any; onClose: () => void; isNewLaudo?: boolean; preSelectedPatient?: any; createNewReport?: (data: any) => Promise<any>; updateExistingReport?: (id: string, data: any) => Promise<any>; reloadReports?: () => Promise<void>; onSaved?: (r:any) => void }) {
-  // Import useToast at the top level of the component
-  const { toast } = require('@/hooks/use-toast').useToast();
+  const { toast } = useToast();
     const [activeTab, setActiveTab] = useState("editor");
     const [content, setContent] = useState(laudo?.conteudo || "");
     const [showPreview, setShowPreview] = useState(false);
@@ -1818,7 +1824,7 @@ const ProfissionalPage = () => {
         const sig = laudo.assinaturaImg ?? laudo.signature_image ?? laudo.signature ?? laudo.sign_image ?? null;
         if (sig) setAssinaturaImg(sig);
       }
-    }, [laudo, isNewLaudo, pacienteSelecionado, listaPacientes, user]);
+    }, [laudo, isNewLaudo, pacienteSelecionado, listaPacientes]);
 
     // Histórico para desfazer/refazer
     const [history, setHistory] = useState<string[]>([]);
@@ -2250,6 +2256,7 @@ const ProfissionalPage = () => {
                     {imagens.map((img) => (
                       <div key={img.id} className="border border-border rounded-lg p-2">
                         {img.type.startsWith('image/') ? (
+                          // eslint-disable-next-line @next/next/no-img-element
                           <img 
                             src={img.url} 
                             alt={img.name}
@@ -2417,6 +2424,7 @@ const ProfissionalPage = () => {
                         <h3 className="font-semibold mb-2">Imagens:</h3>
                         <div className="grid grid-cols-2 gap-2">
                           {imagens.map((img) => (
+                            // eslint-disable-next-line @next/next/no-img-element
                             <img 
                               key={img.id}
                               src={img.url} 
@@ -2432,6 +2440,7 @@ const ProfissionalPage = () => {
                     {campos.mostrarAssinatura && (
                       <div className="mt-8 text-center">
                           {assinaturaImg && assinaturaImg.length > 30 ? (
+                            // eslint-disable-next-line @next/next/no-img-element
                             <img src={assinaturaImg} alt="Assinatura Digital" className="mx-auto h-16 object-contain mb-2" />
                           ) : (
                             <div className="h-16 mb-2 text-xs text-muted-foreground">Assine no campo ao lado para visualizar aqui.</div>
@@ -2528,7 +2537,11 @@ const ProfissionalPage = () => {
                             } else if (typeof val === 'boolean') {
                               if (origVal !== val) diff[k] = val;
                             } else if (val !== undefined && val !== null) {
-                              if (JSON.stringify(origVal) !== JSON.stringify(val)) diff[k] = val;
+                              if (JSON.stringify(origVal) !== JSON.stringify(val)) {
+                                diff[k] = val;
+                              } else {
+                                // no change
+                              }
                             }
                           }