From b1ac9ea3ffec6f05dec82db25e3c6eafc34cb68b Mon Sep 17 00:00:00 2001
From: pedrofedericoo <pedro.federico@souunit.com.br>
Date: Thu, 27 Nov 2025 12:23:06 -0300
Subject: [PATCH] Um pequeno detalhe

---
 src/pages/FinanceiroDashboard.jsx |   2 +-
 src/pages/inicioPaciente.jsx      | 188 +++++++++++++++++++-----------
 2 files changed, 122 insertions(+), 68 deletions(-)

diff --git a/src/pages/FinanceiroDashboard.jsx b/src/pages/FinanceiroDashboard.jsx
index e41b321..a2c868d 100644
--- a/src/pages/FinanceiroDashboard.jsx
+++ b/src/pages/FinanceiroDashboard.jsx
@@ -334,7 +334,7 @@ export default function FinanceiroDashboard() {
                             setNovoPagamento(false);
                           }}
                         >
-                          <i className="bi bi-eye me-1"></i> Ver / Editar
+                          <i className="bi bi-eye me-1"></i> Ver Detalhes
                         </button>
                         <button
                           className="btn-delete"
diff --git a/src/pages/inicioPaciente.jsx b/src/pages/inicioPaciente.jsx
index 9e95061..bf9e7c9 100644
--- a/src/pages/inicioPaciente.jsx
+++ b/src/pages/inicioPaciente.jsx
@@ -1,9 +1,15 @@
-import React, { useState, useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
-import { FaCalendarAlt, FaCalendarCheck, FaFileAlt, FaUserMd, FaClock } from 'react-icons/fa';
-import { useAuth } from '../components/utils/AuthProvider';
-import API_KEY from '../components/utils/apiKeys';
-import './style/inicioPaciente.css';
+import React, { useState, useEffect } from "react";
+import { useNavigate } from "react-router-dom";
+import {
+  FaCalendarAlt,
+  FaCalendarCheck,
+  FaFileAlt,
+  FaUserMd,
+  FaClock,
+} from "react-icons/fa";
+import { useAuth } from "../components/utils/AuthProvider";
+import API_KEY from "../components/utils/apiKeys";
+import "./style/inicioPaciente.css";
 
 function InicioPaciente() {
   const navigate = useNavigate();
@@ -15,7 +21,8 @@ function InicioPaciente() {
   const [pacienteId, setPacienteId] = useState(null);
 
   useEffect(() => {
-    const userId = localStorage.getItem('user_id') || localStorage.getItem('patient_id');
+    const userId =
+      localStorage.getItem("user_id") || localStorage.getItem("patient_id");
     setPacienteId(userId);
   }, []);
 
@@ -23,57 +30,63 @@ function InicioPaciente() {
     const fetchMedicos = async () => {
       try {
         const authHeader = getAuthorizationHeader();
-        
+
         const myHeaders = new Headers();
         myHeaders.append("apikey", API_KEY);
         myHeaders.append("Authorization", authHeader);
 
         const requestOptions = {
-          method: 'GET',
+          method: "GET",
           headers: myHeaders,
-          redirect: 'follow'
+          redirect: "follow",
         };
 
-        const response = await fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors", requestOptions);
-        
+        const response = await fetch(
+          "https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors",
+          requestOptions
+        );
+
         if (response.ok) {
           const data = await response.json();
           setMedicos(data);
-          console.log(' Médicos carregados:', data.length);
+          console.log(" Médicos carregados:", data.length);
         } else {
-          console.error(' Erro ao buscar médicos:', response.status);
+          console.error(" Erro ao buscar médicos:", response.status);
         }
       } catch (error) {
-        console.error(' Erro ao buscar médicos:', error);
+        console.error(" Erro ao buscar médicos:", error);
       }
     };
 
     const fetchAgendamentos = async () => {
       try {
         const authHeader = getAuthorizationHeader();
-        
+
         const myHeaders = new Headers();
         myHeaders.append("apikey", API_KEY);
         myHeaders.append("Authorization", authHeader);
 
         const requestOptions = {
-          method: 'GET',
+          method: "GET",
           headers: myHeaders,
-          redirect: 'follow'
+          redirect: "follow",
         };
 
         // Buscar todos os agendamentos (depois filtraremos pelo paciente)
-        const response = await fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/appointments", requestOptions);
-        
+        const response = await fetch(
+          "https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/appointments",
+          requestOptions
+        );
+
         if (response.ok) {
           const data = await response.json();
           setAgendamentos(data);
-          console.log(' Agendamentos carregados:', data.length);
+          console.log(" Agendamentos carregados:", data.length);
         } else {
-          console.error(' Erro ao buscar agendamentos:', response.status);
+          console.error(" Erro ao buscar agendamentos:", response.status);
         }
       } catch (error) {
-        console.error(' Erro ao buscar agendamentos:', error);
+        console.error(" Erro ao buscar agendamentos:", error);
       } finally {
         setLoading(false);
       }
@@ -87,44 +100,50 @@ function InicioPaciente() {
 
   useEffect(() => {
     if (agendamentos.length > 0 && medicos.length > 0) {
-      const agendamentosComNomes = agendamentos.map(agendamento => {
-        const medico = medicos.find(m => m.id === agendamento.doctor_id);
+      const agendamentosComNomes = agendamentos.map((agendamento) => {
+        const medico = medicos.find((m) => m.id === agendamento.doctor_id);
         return {
           ...agendamento,
-          nomeMedico: medico?.full_name || 'Médico não encontrado',
-          especialidadeMedico: medico?.specialty || ''
+          nomeMedico: medico?.full_name || "Médico não encontrado",
+          especialidadeMedico: medico?.specialty || "",
         };
       });
       setAgendamentosComMedicos(agendamentosComNomes);
     }
   }, [agendamentos, medicos]);
 
-  const meusAgendamentos = agendamentosComMedicos.filter(a => 
+  const meusAgendamentos = agendamentosComMedicos.filter((a) =>
     pacienteId ? a.patient_id === pacienteId : true
   );
 
   const hoje = new Date();
   hoje.setHours(0, 0, 0, 0);
-  
-  const agendamentosFuturos = meusAgendamentos.filter(a => {
-    if (!a.scheduled_at) return false;
-    const dataAgendamento = new Date(a.scheduled_at);
-    return dataAgendamento >= hoje && a.status !== 'cancelled' && a.status !== 'completed';
-  }).sort((a, b) => new Date(a.scheduled_at) - new Date(b.scheduled_at));
+
+  const agendamentosFuturos = meusAgendamentos
+    .filter((a) => {
+      if (!a.scheduled_at) return false;
+      const dataAgendamento = new Date(a.scheduled_at);
+      return (
+        dataAgendamento >= hoje &&
+        a.status !== "cancelled" &&
+        a.status !== "completed"
+      );
+    })
+    .sort((a, b) => new Date(a.scheduled_at) - new Date(b.scheduled_at));
 
   const proximasConsultas = agendamentosFuturos.length;
-  const consultasHoje = agendamentosFuturos.filter(a => {
+  const consultasHoje = agendamentosFuturos.filter((a) => {
     const dataAgendamento = new Date(a.scheduled_at);
     dataAgendamento.setHours(0, 0, 0, 0);
     return dataAgendamento.getTime() === hoje.getTime();
   }).length;
 
-  const consultasPendentes = meusAgendamentos.filter(a => 
-    a.status === 'pending' || a.status === 'requested'
+  const consultasPendentes = meusAgendamentos.filter(
+    (a) => a.status === "pending" || a.status === "requested"
   ).length;
 
-  const historicoConsultas = meusAgendamentos.filter(a => 
-    a.status === 'completed'
+  const historicoConsultas = meusAgendamentos.filter(
+    (a) => a.status === "completed"
   ).length;
 
   return (
@@ -154,17 +173,19 @@ function InicioPaciente() {
             <FaCalendarCheck className="stat-paciente-icon" />
           </div>
         </div>
-        
+
         <div className="stat-paciente-card">
           <div className="stat-paciente-info">
             <span className="stat-paciente-label">Aguardando</span>
-            <span className="stat-paciente-value">{loading ? '...' : consultasPendentes}</span>
+            <span className="stat-paciente-value">
+              {loading ? "..." : consultasPendentes}
+            </span>
           </div>
           <div className="stat-paciente-icon-wrapper purple">
             <FaClock className="stat-paciente-icon" />
           </div>
         </div>
-        
+
         <div className="stat-paciente-card">
           <div className="stat-paciente-info">
             <span className="stat-paciente-label">Realizadas</span>
@@ -179,27 +200,42 @@ function InicioPaciente() {
       <div className="quick-actions-paciente">
         <h2>Acesso Rápido</h2>
         <div className="actions-paciente-grid">
-          <div className="action-paciente-button" onClick={() => navigate('/paciente/agendamento')}>
+          <div
+            className="action-paciente-button"
+            onClick={() => navigate("/paciente/agendamento")}
+          >
             <FaCalendarCheck className="action-paciente-icon" />
             <div className="action-paciente-info">
               <span className="action-paciente-title">Minhas Consultas</span>
-              <span className="action-paciente-desc">Ver todos os agendamentos</span>
+              <span className="action-paciente-desc">
+                Ver todos os agendamentos
+              </span>
             </div>
           </div>
-          
-          <div className="action-paciente-button" onClick={() => navigate('/paciente/laudo')}>
+
+          <div
+            className="action-paciente-button"
+            onClick={() => navigate("/paciente/laudo")}
+          >
             <FaFileAlt className="action-paciente-icon" />
             <div className="action-paciente-info">
               <span className="action-paciente-title">Meus Laudos</span>
-              <span className="action-paciente-desc">Acessar documentos médicos</span>
+              <span className="action-paciente-desc">
+                Acessar documentos médicos
+              </span>
             </div>
           </div>
-          
-          <div className="action-paciente-button" onClick={() => navigate('/paciente/agendamento')}>
+
+          <div
+            className="action-paciente-button"
+            onClick={() => navigate("/paciente/agendamento")}
+          >
             <FaUserMd className="action-paciente-icon" />
             <div className="action-paciente-info">
               <span className="action-paciente-title">Meus Médicos</span>
-              <span className="action-paciente-desc">Ver histórico de atendimentos</span>
+              <span className="action-paciente-desc">
+                Ver histórico de atendimentos
+              </span>
             </div>
           </div>
         </div>
@@ -213,22 +249,28 @@ function InicioPaciente() {
           </div>
         ) : agendamentosFuturos.length > 0 ? (
           <div className="consultas-paciente-list">
-            {agendamentosFuturos.slice(0, 3).map(agendamento => (
+            {agendamentosFuturos.slice(0, 3).map((agendamento) => (
               <div key={agendamento.id} className="consulta-paciente-item">
                 <div className="consulta-paciente-info">
                   <div className="consulta-paciente-time-date">
                     <p className="consulta-paciente-hora">
-                      {new Date(agendamento.scheduled_at).toLocaleTimeString('pt-BR', { 
-                        hour: '2-digit', 
-                        minute: '2-digit' 
-                      })}
+                      {new Date(agendamento.scheduled_at).toLocaleTimeString(
+                        "pt-BR",
+                        {
+                          hour: "2-digit",
+                          minute: "2-digit",
+                        }
+                      )}
                     </p>
                     <p className="consulta-paciente-data">
-                      {new Date(agendamento.scheduled_at).toLocaleDateString('pt-BR', {
-                        day: '2-digit',
-                        month: 'short',
-                        year: 'numeric'
-                      })}
+                      {new Date(agendamento.scheduled_at).toLocaleDateString(
+                        "pt-BR",
+                        {
+                          day: "2-digit",
+                          month: "short",
+                          year: "numeric",
+                        }
+                      )}
                     </p>
                   </div>
                   <div className="consulta-paciente-detalhes">
@@ -242,16 +284,25 @@ function InicioPaciente() {
                       </p>
                     )}
                   </div>
-                  <span className={`consulta-paciente-status status-${agendamento.status}`}>
-                    {agendamento.status === 'scheduled' ? 'Confirmado' : 
-                     agendamento.status === 'pending' ? 'Aguardando' : 
-                     agendamento.status === 'requested' ? 'Solicitado' : agendamento.status}
+                  <span
+                    className={`consulta-paciente-status status-${agendamento.status}`}
+                  >
+                    {agendamento.status === "scheduled"
+                      ? "Confirmado"
+                      : agendamento.status === "pending"
+                      ? "Aguardando"
+                      : agendamento.status === "requested"
+                      ? "Solicitado"
+                      : agendamento.status}
                   </span>
                 </div>
               </div>
             ))}
             {agendamentosFuturos.length > 3 && (
-              <button className="view-all-paciente-button" onClick={() => navigate('/paciente/agendamento')}>
+              <button
+                className="view-all-paciente-button"
+                onClick={() => navigate("/paciente/agendamento")}
+              >
                 Ver todas as consultas
               </button>
             )}
@@ -260,7 +311,10 @@ function InicioPaciente() {
           <div className="no-consultas-content">
             <FaCalendarCheck className="no-consultas-icon" />
             <p>Você não tem consultas agendadas</p>
-            <button className="agendar-paciente-button" onClick={() => navigate('/paciente/agendamento/criar')}>
+            <button
+              className="agendar-paciente-button"
+              onClick={() => navigate("/paciente/agendamento/criar")}
+            >
               Agendar Consulta
             </button>
           </div>
@@ -270,4 +324,4 @@ function InicioPaciente() {
   );
 }
 
-export default InicioPaciente;
\ No newline at end of file
+export default InicioPaciente;