melhorias na organização de pastas

src/App.js

@@ -1,10 +1,10 @@
 import React, { useState } from 'react';
 import Sidebar from './components/Sidebar';
-import Header from './components/Header';
+//import Header from './components/Header';
 import Table from "./pages/Table"; 
 
 import Inicio from './pages/Inicio';
-import FormLayout from './pages/FormLayout';
+import PatientCadastroManager from './pages/PatientCadastroManager';
 import EditPage from './pages/EditPage';
 import DoctorEditPage from './pages/DoctorEditPage';
 
@@ -12,10 +12,9 @@ import Details from './pages/Details';
 import DoctorDetails from './pages/DoctorDetails';
 
 import DoctorTable from './pages/DoctorTable';
-import DoctorFormLayout from './pages/DoctorFormLayout';
+import DoctorCadastroManager from './pages/DoctorCadastroManager';
 import Agendamento from './pages/Agendamento'
 
-
 import LaudoManager from "./pages/LaudoManager";
 
 function App() {
@@ -31,9 +30,9 @@ function App() {
       case 'agendamento':
         return <Agendamento/>;
       case 'form-layout':
-        return <FormLayout />;
+        return <PatientCadastroManager setCurrentPage={setCurrentPage}/>;
       case 'doctor-form-layout':
-        return <DoctorFormLayout />;
+        return <DoctorCadastroManager />;
       case 'table':
         return <Table setCurrentPage={setCurrentPage} setPatientID={setPatientID} />;
       case 'doctor-table':

src/components/AgendarConsulta/FormNovaConsulta.jsx

@@ -1,6 +1,6 @@
 import React from "react";
 import InputMask from "react-input-mask";
-import "../Estilo/styleagendamentos.css";
+import "./style/styleagendamentos.css";
 
 const FormNovaConsulta = ({ onCancel }) => {
   const handleSubmit = (e) => {
@@ -15,19 +15,21 @@ const FormNovaConsulta = ({ onCancel }) => {
       <form className="form-agendamento" onSubmit={handleSubmit}>
         <h2 className="section-title">Informações do paciente</h2>
 
-        <label>Nome *</label>
+      <div id="informacoes-paciente-primeiralinha">
-        <input type="text" name="nome" placeholder="Insira o nome do paciente" required />
+          <label>Nome *</label>
+          <input type="text" name="nome" placeholder="Insira o nome do paciente" required />
 
-        <label>CPF do paciente</label>
+          <label>CPF do paciente</label>
-        <InputMask mask="999.999.999-99" placeholder="000.000.000-00">
+          <InputMask mask="999.999.999-99" placeholder="000.000.000-00">
-          {(inputProps) => <input {...inputProps} type="text" name="cpf" />}
+            {(inputProps) => <input {...inputProps} type="text" name="cpf" />}
-        </InputMask>
+          </InputMask>
 
-        <label>RG</label>
+          <label>RG</label>
-        <input type="text" name="rg" placeholder="Insira o nº do RG" maxLength={9} />
+          <input type="text" name="rg" placeholder="Insira o nº do RG" maxLength={9} />
+      </div>
 
         <label>Data de nascimento *</label>
-        <input type="date" name="dataNascimento" required />
+        <input type="date" name="data_nascimento" required />
 
         <label>Telefone</label>
         <InputMask mask="(99) 99999-9999" placeholder="(99) 99999-9999">

src/components/AgendarConsulta/TabelaAgendamentoDia.jsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import CardConsulta from './CardConsulta'
 import AgendamentosMes from './DadosConsultasMock'
-import "./styleTabelas/tabeladia.css";
+import "./style/styleTabelas/tabeladia.css";
 
 const TabelaAgendamentoDia = ({handleClickAgendamento}) => {
 

src/components/AgendarConsulta/TabelaAgendamentoMes.jsx

@@ -2,11 +2,10 @@ import React from 'react'
 import AgendamentosMes from './DadosConsultasMock'
 import dayjs from "dayjs"
 import CardConsulta from './CardConsulta'
-import "./styleTabelas/tabelames.css";
+import "./style/styleTabelas/tabelames.css";
 
 const TabelaAgendamentoMes = ({ListarDiasdoMes}) => {
 
-  const agendamentosMes = [0,1,2,3,4,5]
 
   const dataHoje = dayjs()
   const AnoAtual = dataHoje.year()

src/components/AgendarConsulta/TabelaAgendamentoSemana.jsx

@@ -1,8 +1,8 @@
 import React from 'react'
-import Agendamento from '../../pages/Agendamento'
+
 import AgendamentosMes from './DadosConsultasMock'
 import CardConsulta from './CardConsulta'
-import "./styleTabelas/tabelasemana.css";
+import "./style/styleTabelas/tabelasemana.css";
 
 const TabelaAgendamentoSemana = () => {
 

src/components/Header.js

@@ -1,14 +0,0 @@
-import React from 'react';
-
-// O componente agora recebe a função `toggleSidebar` como uma prop.
-function Header({ toggleSidebar }) {
-  return (
-    <header className="mb-3">
-      <a href="#" className="burger-btn d-block d-xl-none" onClick={toggleSidebar}>
-        <i className="bi bi-justify fs-3"></i>
-      </a>
-    </header>
-  );
-}
-
-export default Header;

src/pages/ChatApp.jsx

@@ -1,110 +0,0 @@
-import React, { useState } from "react";
-
-function ChatApp() {
-  const [selectedUser, setSelectedUser] = useState(1);
-
-  const users = [
-    { id: 1, name: "Alice", avatar: "https://i.pravatar.cc/40?img=1" },
-    { id: 2, name: "Bob", avatar: "https://i.pravatar.cc/40?img=2" },
-    { id: 3, name: "Charlie", avatar: "https://i.pravatar.cc/40?img=3" }
-  ];
-
-  const messages = {
-    1: [
-      { from: "Alice", text: "Oi Rafael 👋", time: "10:15" },
-      { from: "Você", text: "E aí Alice, tudo bem?", time: "10:16" },
-      { from: "Alice", text: "Tudo ótimo! 😄", time: "10:17" }
-    ],
-    2: [
-      { from: "Bob", text: "Fala mano!", time: "09:30" },
-      { from: "Você", text: "Tranquilo Bob?", time: "09:32" },
-      { from: "Bob", text: "Sempre ✌️", time: "09:33" }
-    ],
-    3: [
-      { from: "Charlie", text: "Já viu a novidade?", time: "Ontem" },
-      { from: "Você", text: "Qual novidade?", time: "Ontem" },
-      { from: "Charlie", text: "Te conto depois kkk 🤐", time: "Ontem" }
-    ]
-  };
-
-  const currentMessages = messages[selectedUser] || [];
-
-  return (
-    <>
-      <div className="page-heading">
-        <h3>Chat Application</h3>
-        <p className="text-muted">Converse em tempo real com seus contatos</p>
-      </div>
-
-      <div className="page-content">
-        <div className="row">
-          {/* Sidebar - Contatos */}
-          <div className="col-3 border-end">
-            <h6 className="mb-3">Contatos</h6>
-            <ul className="list-group">
-              {users.map((user) => (
-                <li
-                  key={user.id}
-                  className={`list-group-item d-flex align-items-center ${
-                    selectedUser === user.id ? "active" : ""
-                  }`}
-                  style={{ cursor: "pointer" }}
-                  onClick={() => setSelectedUser(user.id)}
-                >
-                  <img
-                    src={user.avatar}
-                    alt={user.name}
-                    className="rounded-circle me-2"
-                    width={40}
-                    height={40}
-                  />
-                  <span>{user.name}</span>
-                </li>
-              ))}
-            </ul>
-          </div>
-
-          {/* Chat */}
-          <div className="col-9 d-flex flex-column" style={{ height: "70vh" }}>
-            <div
-              className="flex-grow-1 border rounded p-3 mb-2 overflow-auto"
-              style={{ background: "#f9f9f9" }}
-            >
-              {currentMessages.map((msg, index) => (
-                <div
-                  key={index}
-                  className={`mb-2 ${
-                    msg.from === "Você" ? "text-end" : "text-start"
-                  }`}
-                >
-                  <div
-                    className={`d-inline-block p-2 rounded ${
-                      msg.from === "Você"
-                        ? "bg-primary text-white"
-                        : "bg-light"
-                    }`}
-                  >
-                    <strong>{msg.from}:</strong> {msg.text}
-                  </div>
-                  <div className="small text-muted">{msg.time}</div>
-                </div>
-              ))}
-            </div>
-
-            {/* Caixa de mensagem */}
-            <div className="d-flex">
-              <input
-                type="text"
-                className="form-control me-2"
-                placeholder="Digite sua mensagem..."
-              />
-              <button className="btn btn-primary">Enviar</button>
-            </div>
-          </div>
-        </div>
-      </div>
-    </>
-  );
-}
-
-export default ChatApp;

src/pages/DataTable.jsx

@@ -1,27 +0,0 @@
-import React from "react";
-
-function DataTable() {
-  return (
-    <>
-      <div className="page-heading">
-        <h3>Data Table</h3>
-      </div>
-      <div className="page-content">
-        <section className="row">
-          <div className="col-12">
-            <div className="card">
-              <div className="card-header">
-                <h4 className="card-title">Minha Data Table</h4>
-              </div>
-              <div className="card-body">
-                <p>Aqui você vai construir sua DataTable futuramente 🚀</p>
-              </div>
-            </div>
-          </div>
-        </section>
-      </div>
-    </>
-  );
-}
-
-export default DataTable;

src/pages/DoctorCadastroManager.jsx

@@ -4,7 +4,7 @@ import React, { useState } from 'react';
 import DoctorList from '../components/doctors/DoctorList';
 import DoctorForm from '../components/doctors/DoctorForm';
 
-function FormLayout( ) {
+function DoctorCadastroManager( ) {
   // Este estado vai controlar qual "tela" mostrar: 'list' (lista) ou 'form' (formulário)
   const [view, setView] = useState('form');
 
@@ -66,4 +66,4 @@ function FormLayout( ) {
   );
 }
 
-export default FormLayout;
+export default DoctorCadastroManager;

src/pages/EmailApp.jsx

@@ -1,113 +0,0 @@
-import React from "react";
-
-function EmailApp() {
-  // Lista fake de emails para exibir
-  const emails = [
-    {
-      id: 1,
-      from: "Open source project public release",
-      preview: "Hey John, bah kivu decrete epanorthotic unnotched...",
-      time: "4:14 AM",
-      starred: true,
-      avatar: "https://i.pravatar.cc/40?img=1"
-    },
-    {
-      id: 2,
-      from: "Ecommerce website Paypal integration",
-      preview: "We will start the new application development soon...",
-      time: "2:15 AM",
-      starred: false,
-      avatar: "https://i.pravatar.cc/40?img=2"
-    },
-    {
-      id: 3,
-      from: "How To Set Intentions That Energize You",
-      preview: "I will provide you more details after this Saturday...",
-      time: "Yesterday",
-      starred: false,
-      avatar: "https://i.pravatar.cc/40?img=3"
-    }
-  ];
-
-  return (
-    <>
-      <div className="page-heading">
-        <h3>Email Application</h3>
-        <p className="text-muted">An application for user to check email inbox</p>
-      </div>
-
-      <div className="page-content">
-        <div className="row">
-          {/* Sidebar */}
-          <div className="col-3">
-            <button className="btn btn-primary w-100 mb-3">Compose</button>
-            <ul className="list-group">
-              <li className="list-group-item">📥 Inbox</li>
-              <li className="list-group-item">📤 Sent</li>
-              <li className="list-group-item">📝 Draft</li>
-              <li className="list-group-item">⭐ Starred</li>
-              <li className="list-group-item">🚫 Spam</li>
-              <li className="list-group-item">🗑 Trash</li>
-            </ul>
-
-            <h6 className="mt-4">Labels</h6>
-            <ul className="list-group">
-              <li className="list-group-item">🏷 Product</li>
-              <li className="list-group-item">💼 Work</li>
-              <li className="list-group-item">📌 Misc</li>
-              <li className="list-group-item">👨‍👩‍👧 Family</li>
-              <li className="list-group-item">🎨 Design</li>
-            </ul>
-          </div>
-
-          {/* Emails */}
-          <div className="col-9">
-            <div className="d-flex justify-content-between mb-2">
-              <div>
-                <button className="btn btn-light me-2">🗑</button>
-                <button className="btn btn-light me-2">✉</button>
-                <button className="btn btn-light me-2">📌</button>
-                <button className="btn btn-light me-2">🏷</button>
-              </div>
-              <input
-                type="text"
-                className="form-control w-50"
-                placeholder="Search email.."
-              />
-            </div>
-
-            <div className="list-group">
-              {emails.map((mail) => (
-                <div
-                  key={mail.id}
-                  className="list-group-item d-flex align-items-center justify-content-between"
-                >
-                  <div className="d-flex align-items-center">
-                    <input type="checkbox" className="me-2" />
-                    <img
-                      src={mail.avatar}
-                      alt="avatar"
-                      className="rounded-circle me-2"
-                      width={40}
-                      height={40}
-                    />
-                    <div>
-                      <strong>{mail.from}</strong>
-                      <p className="mb-0 text-muted small">{mail.preview}</p>
-                    </div>
-                  </div>
-                  <div>
-                    {mail.starred ? "⭐" : "☆"} <br />
-                    <small className="text-muted">{mail.time}</small>
-                  </div>
-                </div>
-              ))}
-            </div>
-          </div>
-        </div>
-      </div>
-    </>
-  );
-}
-
-export default EmailApp;

src/pages/GalleryApp.jsx

@@ -1,82 +0,0 @@
-import React, { useState } from "react";
-
-function GalleryApp() {
-  const [photos, setPhotos] = useState([
-   { id: 1, url: "https://picsum.photos/400/300?random=7", title: "Paisagem 1" },
-    /*{url da fotos },*/
-    /*{url da fotos },*/
-    /*{url da fotos },*/
-    /*{url da fotos },*/
-    /*{url da fotos },*/
-  ]);
-
-  const [selectedPhoto, setSelectedPhoto] = useState(null);
-
-  return (
-    <div className="page-content">
-      <div className="page-heading">
-        <h3>Galeria de Fotos</h3>
-      </div>
-
-      {/* Grade de fotos */}
-      <div className="row">
-        {photos.map((photo) => (
-          <div key={photo.id} className="col-12 col-md-4 mb-4">
-            <div className="card shadow-sm" onClick={() => setSelectedPhoto(photo)}>
-              <img
-                src={photo.url}
-                alt={photo.title}
-                className="card-img-top"
-                style={{ borderRadius: "10px", cursor: "pointer" }}
-              />
-              <div className="card-body text-center">
-                <h6>{photo.title}</h6>
-              </div>
-            </div>
-          </div>
-        ))}
-      </div>
-
-      {/* Modal de visualização */}
-      {selectedPhoto && (
-        <div
-          className="modal d-block"
-          style={{
-            background: "rgba(0,0,0,0.7)",
-            position: "fixed",
-            top: 0,
-            left: 0,
-            width: "100%",
-            height: "100%",
-            display: "flex",
-            justifyContent: "center",
-            alignItems: "center",
-          }}
-          onClick={() => setSelectedPhoto(null)}
-        >
-          <div
-            className="modal-content p-3 bg-white"
-            style={{ maxWidth: "800px", borderRadius: "12px" }}
-            onClick={(e) => e.stopPropagation()}
-          >
-            <img
-              src={selectedPhoto.url}
-              alt={selectedPhoto.title}
-              className="img-fluid"
-              style={{ borderRadius: "12px" }}
-            />
-            <h5 className="mt-2">{selectedPhoto.title}</h5>
-            <button
-              className="btn btn-danger mt-2"
-              onClick={() => setSelectedPhoto(null)}
-            >
-              Fechar
-            </button>
-          </div>
-        </div>
-      )}
-    </div>
-  );
-}
-
-export default GalleryApp;

src/pages/Inicio.jsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { FaUser, FaUserPlus, FaCalendarAlt, FaCalendarCheck } from 'react-icons/fa';
-import './Inicio.css';
+import './style/Inicio.css';
 
 function Inicio({ setCurrentPage }) {
   const [pacientes, setPacientes] = useState([]);

src/pages/PatientCadastroManager.jsx

@@ -1,12 +1,12 @@
 import React, { useState } from 'react';
 
 // Importamos os dois novos componentes que criamos
-import PatientList from '../components/patients/PatientList';
+
 import PatientForm from '../components/patients/PatientForm';
 
-function FormLayout( ) {
+function PatientCadastroManager( {setCurrentPage} ) {
   // Este estado vai controlar qual "tela" mostrar: 'list' (lista) ou 'form' (formulário)
-  const [view, setView] = useState('form');
+ 
 
   const [formData, setFormData] = useState({})
   var myHeaders = new Headers();
@@ -33,7 +33,7 @@ function FormLayout( ) {
       
     alert(`Paciente "${patientData.nome}" salvo com sucesso!`); //altere isso para integração com backend
     // Após salvar, voltamos para a tela de lista
-    setView('list');
+   
   };
 
   return (
@@ -48,16 +48,13 @@ function FormLayout( ) {
             {/* Se a view for 'list', mostramos a lista com o botão. */}
             {/* Se for 'form', mostramos o formulário de cadastro. */}
 
-            {view === 'list' ? (
-              <PatientList onAddPatient={() => setView('form')} />
-            ) : (
               <PatientForm
                 onSave={handleSavePatient}
-                onCancel={() => setView('list')}
+                onCancel={() => {setCurrentPage('table')}}
                 formData={formData}
                 setFormData={setFormData}
               />
-            )}
+            
           </div>
         </section>
       </div>
@@ -65,4 +62,4 @@ function FormLayout( ) {
   );
 }
 
-export default FormLayout;
+export default PatientCadastroManager;

src/pages/files.jsx

@@ -1,84 +0,0 @@
-import React, { useState } from "react";
-
-function Files() {
-  // 1. Criamos um estado para armazenar o arquivo selecionado pelo usuário
-  const [selectedFile, setSelectedFile] = useState(null);
-
-  // 2. Esta função é chamada quando o usuário seleciona um arquivo no input
-  const handleFileChange = (event) => {
-    // Pegamos o primeiro arquivo da lista (mesmo que só possa selecionar um)
-    const file = event.target.files[0];
-    if (file) {
-      setSelectedFile(file);
-    }
-  };
-
-  // 3. Esta função é chamada quando o botão "Enviar Arquivo" é clicado
-  const handleUpload = () => {
-    if (!selectedFile) {
-      alert("Por favor, selecione um arquivo antes de enviar.");
-      return;
-    }
-
-    // --- Lógica de Envio (Simulação) ---
-    // Em um projeto real, aqui você enviaria o 'selectedFile' para um servidor.
-    // Por enquanto, vamos apenas mostrar um alerta de sucesso.
-    console.log("Enviando o arquivo:", selectedFile.name);
-    alert(`Arquivo "${selectedFile.name}" enviado com sucesso! (Isso é uma simulação)`);
-
-    // Limpa o estado após o envio
-    setSelectedFile(null);
-  };
-
-  return (
-    <>
-      <div className="page-heading">
-        <h3>Files</h3>
-      </div>
-      <div className="page-content">
-        <section className="row">
-          <div className="col-12">
-            <div className="card">
-              <div className="card-header">
-                <h4 className="card-title">Gerenciamento de Arquivos</h4>
-              </div>
-              <div className="card-body">
-                {/* 4. Adicionamos o input de arquivo e o botão */}
-                <div className="mb-3">
-                  <label htmlFor="formFile" className="form-label">
-                    Selecione um arquivo para enviar
-                  </label>
-                  {/* O 'key' ajuda o React a resetar o input quando o arquivo é "enviado" */}
-                  <input
-                    className="form-control"
-                    type="file"
-                    id="formFile"
-                    onChange={handleFileChange}
-                    key={selectedFile ? selectedFile.name : 'no-file'}
-                  />
-                </div>
-
-                {/* Mostra o nome do arquivo selecionado */}
-                {selectedFile && (
-                  <p className="text-muted">
-                    Arquivo selecionado: <strong>{selectedFile.name}</strong>
-                  </p>
-                )}
-
-                <button
-                  className="btn btn-primary"
-                  onClick={handleUpload}
-                  disabled={!selectedFile} // O botão fica desabilitado se nenhum arquivo for selecionado
-                >
-                  <i className="bi bi-upload"></i> Enviar Arquivo
-                </button>
-              </div>
-            </div>
-          </div>
-        </section>
-      </div>
-    </>
-  );
-}
-
-export default Files;