revert 2df76ca04dd80fcd65900a95ea64fbc100724196

revert Merge pull request 'API-Disponibilidade' (#6) from API-Disponibilidade into main

Reviewed-on: RiseUP/riseup-squad23#6

src/components/doctors/DoctorForm.jsx

@@ -1,35 +1,37 @@
-import React, { useState, useRef } from "react";
+import React, { useState, useRef } from 'react';
-import { Link, useNavigate, useLocation } from "react-router-dom";
+import { Link, useNavigate, useLocation } from 'react-router-dom';
 
 function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
   const navigate = useNavigate();
   const location = useLocation();
 
   const FormatTelefones = (valor) => {
-    const digits = String(valor).replace(/\D/g, "").slice(0, 11);
+    const digits = String(valor).replace(/\D/g, '').slice(0, 11);
     return digits
-      .replace(/(\d)/, "($1")
+      .replace(/(\d)/, '($1')
-      .replace(/(\d{2})(\d)/, "$1) $2")
+      .replace(/(\d{2})(\d)/, '$1) $2')
-      .replace(/(\d)(\d{4})/, "$1 $2")
+      .replace(/(\d)(\d{4})/, '$1 $2')
-      .replace(/(\d{4})(\d{4})/, "$1-$2");
+      .replace(/(\d{4})(\d{4})/, '$1-$2');
   };
 
   const FormatCPF = (valor) => {
-    const digits = String(valor).replace(/\D/g, "").slice(0, 11);
+    const digits = String(valor).replace(/\D/g, '').slice(0, 11);
     return digits
-      .replace(/(\d{3})(\d)/, "$1.$2")
+      .replace(/(\d{3})(\d)/, '$1.$2')
-      .replace(/(\d{3})(\d)/, "$1.$2")
+      .replace(/(\d{3})(\d)/, '$1.$2')
-      .replace(/(\d{3})(\d{1,2})$/, "$1-$2");
+      .replace(/(\d{3})(\d{1,2})$/, '$1-$2');
   };
 
+ 
   const validarCPF = (cpf) => {
-    const cpfLimpo = cpf.replace(/\D/g, "");
+    const cpfLimpo = cpf.replace(/\D/g, '');
  
     if (cpfLimpo.length !== 11) return false;
     
 
     if (/^(\d)\1+$/.test(cpfLimpo)) return false;
     
+    
     let soma = 0;
     for (let i = 0; i < 9; i++) {
       soma += parseInt(cpfLimpo.charAt(i)) * (10 - i);
@@ -45,16 +47,14 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
     resto = 11 - (soma % 11);
     let digito2 = resto === 10 || resto === 11 ? 0 : resto;
     
-    return (
+  
-      digito1 === parseInt(cpfLimpo.charAt(9)) &&
+    return digito1 === parseInt(cpfLimpo.charAt(9)) && digito2 === parseInt(cpfLimpo.charAt(10));
-      digito2 === parseInt(cpfLimpo.charAt(10))
-    );
   };
 
   const [avatarUrl, setAvatarUrl] = useState(null);
   const [showRequiredModal, setShowRequiredModal] = useState(false);
   const [emptyFields, setEmptyFields] = useState([]);
-  const [cpfError, setCpfError] = useState("");
+  const [cpfError, setCpfError] = useState('');
 
   const nomeRef = useRef(null);
   const cpfRef = useRef(null);
@@ -70,59 +70,63 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
   });
 
   const handleToggleCollapse = (section) => {
-    setCollapsedSections((prevState) => ({
+    setCollapsedSections(prevState => ({
       ...prevState,
-      [section]: !prevState[section],
+      [section]: !prevState[section]
     }));
   };
 
   const handleChange = (e) => {
     const { name, value, type, checked, files } = e.target;
 
+   
     if (value && emptyFields.includes(name)) {
-      setEmptyFields((prev) => prev.filter((field) => field !== name));
+      setEmptyFields(prev => prev.filter(field => field !== name));
     }
 
-    if (name === "cpf" && cpfError) {
+   
-      setCpfError("");
+    if (name === 'cpf' && cpfError) {
+      setCpfError('');
     }
 
-    if (type === "checkbox") {
+    if (type === 'checkbox') {
-      setFormData((prev) => ({ ...prev, [name]: checked }));
+      setFormData(prev => ({ ...prev, [name]: checked }));
-    } else if (type === "file") {
+    } else if (type === 'file') {
-      setFormData((prev) => ({ ...prev, [name]: files[0] }));
+      setFormData(prev => ({ ...prev, [name]: files[0] }));
 
-      if (name === "foto" && files[0]) {
+      if (name === 'foto' && files[0]) {
         const reader = new FileReader();
         reader.onloadend = () => {
           setAvatarUrl(reader.result);
         };
         reader.readAsDataURL(files[0]);
-      } else if (name === "foto" && !files[0]) {
+      } else if (name === 'foto' && !files[0]) {
         setAvatarUrl(null);
       }
-    } else if (name.includes("cpf")) {
-      let cpfFormatado = FormatCPF(value);
-      setFormData((prev) => ({ ...prev, [name]: cpfFormatado }));
 
-      const cpfLimpo = cpfFormatado.replace(/\D/g, "");
+    } else if (name.includes('cpf')) {
+      let cpfFormatado = FormatCPF(value);
+      setFormData(prev => ({ ...prev, [name]: cpfFormatado }));
+
+      
+      const cpfLimpo = cpfFormatado.replace(/\D/g, '');
       if (cpfLimpo.length === 11) {
         if (!validarCPF(cpfFormatado)) {
-          setCpfError("CPF inválido");
+          setCpfError('CPF inválido');
         } else {
-          setCpfError("");
+          setCpfError('');
         }
       }
-    } else if (name.includes("phone")) {
+    } else if (name.includes('phone')) {
       let telefoneFormatado = FormatTelefones(value);
-      setFormData((prev) => ({ ...prev, [name]: telefoneFormatado }));
+      setFormData(prev => ({ ...prev, [name]: telefoneFormatado }));
     } else {
-      setFormData((prev) => ({ ...prev, [name]: value }));
+      setFormData(prev => ({ ...prev, [name]: value }));
     }
   };
 
   const handleCepBlur = async () => {
-    const cep = formData.cep?.replace(/\D/g, "");
+    const cep = formData.cep?.replace(/\D/g, '');
     if (cep && cep.length === 8) {
       try {
         const response = await fetch(`https://viacep.com.br/ws/${cep}/json/`);
@@ -130,49 +134,50 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
         if (!data.erro) {
           setFormData((prev) => ({
             ...prev,
-            street: data.logradouro || "",
+            street: data.logradouro || '',
-            neighborhood: data.bairro || "",
+            neighborhood: data.bairro || '',
-            city: data.localidade || "",
+            city: data.localidade || '',
-            state: data.uf || "",
+            state: data.uf || ''
           }));
         } else {
           setShowRequiredModal(true);
-          setEmptyFields(["cep"]);
+          setEmptyFields(['cep']);
         }
       } catch (error) {
         setShowRequiredModal(true);
-        setEmptyFields(["cep"]);
+        setEmptyFields(['cep']);
       }
     }
   };
 
+ 
   const scrollToEmptyField = (fieldName) => {
     let fieldRef = null;
     
     switch (fieldName) {
-      case "full_name":
+      case 'full_name':
         fieldRef = nomeRef;
-        setCollapsedSections((prev) => ({ ...prev, dadosPessoais: true }));
+        setCollapsedSections(prev => ({ ...prev, dadosPessoais: true }));
         break;
-      case "cpf":
+      case 'cpf':
         fieldRef = cpfRef;
-        setCollapsedSections((prev) => ({ ...prev, dadosPessoais: true }));
+        setCollapsedSections(prev => ({ ...prev, dadosPessoais: true }));
         break;
-      case "email":
+      case 'email':
         fieldRef = emailRef;
-        setCollapsedSections((prev) => ({ ...prev, contato: true }));
+        setCollapsedSections(prev => ({ ...prev, contato: true }));
         break;
-      case "phone_mobile":
+      case 'phone_mobile':
         fieldRef = telefoneRef;
-        setCollapsedSections((prev) => ({ ...prev, contato: true }));
+        setCollapsedSections(prev => ({ ...prev, contato: true }));
         break;
-      case "crm_uf":
+      case 'crm_uf':
         fieldRef = crmUfRef;
-        setCollapsedSections((prev) => ({ ...prev, dadosPessoais: true }));
+        setCollapsedSections(prev => ({ ...prev, dadosPessoais: true }));
         break;
-      case "crm":
+      case 'crm':
         fieldRef = crmRef;
-        setCollapsedSections((prev) => ({ ...prev, dadosPessoais: true }));
+        setCollapsedSections(prev => ({ ...prev, dadosPessoais: true }));
         break;
       default:
         return;
@@ -182,19 +187,20 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
     setTimeout(() => {
       if (fieldRef.current) {
         fieldRef.current.scrollIntoView({ 
-          behavior: "smooth",
+          behavior: 'smooth', 
-          block: "center",
+          block: 'center' 
         });
         fieldRef.current.focus();
         
-        fieldRef.current.style.border = "2px solid #dc3545";
+  
-        fieldRef.current.style.boxShadow =
+        fieldRef.current.style.border = '2px solid #dc3545';
-          "0 0 0 0.2rem rgba(220, 53, 69, 0.25)";
+        fieldRef.current.style.boxShadow = '0 0 0 0.2rem rgba(220, 53, 69, 0.25)';
+        
    
         setTimeout(() => {
           if (fieldRef.current) {
-            fieldRef.current.style.border = "";
+            fieldRef.current.style.border = '';
-            fieldRef.current.style.boxShadow = "";
+            fieldRef.current.style.boxShadow = '';
           }
         }, 3000);
       }
@@ -204,17 +210,18 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
   const handleSubmit = async () => {
 
     const missingFields = [];
-    if (!formData.full_name) missingFields.push("full_name");
+    if (!formData.full_name) missingFields.push('full_name');
-    if (!formData.cpf) missingFields.push("cpf");
+    if (!formData.cpf) missingFields.push('cpf');
-    if (!formData.email) missingFields.push("email");
+    if (!formData.email) missingFields.push('email');
-    if (!formData.phone_mobile) missingFields.push("phone_mobile");
+    if (!formData.phone_mobile) missingFields.push('phone_mobile');
-    if (!formData.crm_uf) missingFields.push("crm_uf");
+    if (!formData.crm_uf) missingFields.push('crm_uf');
-    if (!formData.crm) missingFields.push("crm");
+    if (!formData.crm) missingFields.push('crm');
 
     if (missingFields.length > 0) {
       setEmptyFields(missingFields);
       setShowRequiredModal(true);
       
+  
       setTimeout(() => {
         if (missingFields.length > 0) {
           scrollToEmptyField(missingFields[0]);
@@ -223,23 +230,26 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
       return;
     }
 
-    const cpfLimpo = formData.cpf.replace(/\D/g, "");
+   
+    const cpfLimpo = formData.cpf.replace(/\D/g, '');
     if (cpfLimpo.length !== 11) {
       setShowRequiredModal(true);
-      setEmptyFields(["cpf"]);
+      setEmptyFields(['cpf']);
-      setCpfError("CPF deve ter 11 dígitos");
+      setCpfError('CPF deve ter 11 dígitos');
-      setTimeout(() => scrollToEmptyField("cpf"), 500);
+      setTimeout(() => scrollToEmptyField('cpf'), 500);
       return;
     }
 
+   
     if (!validarCPF(formData.cpf)) {
       setShowRequiredModal(true);
-      setEmptyFields(["cpf"]);
+      setEmptyFields(['cpf']);
-      setCpfError("CPF inválido");
+      setCpfError('CPF inválido');
-      setTimeout(() => scrollToEmptyField("cpf"), 500);
+      setTimeout(() => scrollToEmptyField('cpf'), 500);
       return;
     }
 
+  
     try {
       await onSave({ ...formData });
 
@@ -290,16 +300,7 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
                 alignItems: "center",
               }}
             >
-              <h5
+              <h5 style={{ color: "#fff", margin: 0, fontSize: "1.2rem", fontWeight: "bold" }}>Atenção</h5>
-                style={{
-                  color: "#fff",
-                  margin: 0,
-                  fontSize: "1.2rem",
-                  fontWeight: "bold",
-                }}
-              >
-                Atenção
-              </h5>
               <button
                 onClick={handleModalClose}
                 style={{
@@ -315,109 +316,20 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
             </div>
 
             <div style={{ padding: "25px 20px" }}>
-              <p
+              <p style={{ color: "#111", fontSize: "1.1rem", margin: "0 0 15px 0", fontWeight: "bold" }}>
-                style={{
+                {cpfError ? 'Problema com o CPF:' : 'Por favor, preencha:'}
-                  color: "#111",
-                  fontSize: "1.1rem",
-                  margin: "0 0 15px 0",
-                  fontWeight: "bold",
-                }}
-              >
-                {cpfError ? "Problema com o CPF:" : "Por favor, preencha:"}
               </p>
-              <div
+              <div style={{ display: 'flex', flexDirection: 'column', gap: '8px', marginLeft: '10px' }}>
-                style={{
-                  display: "flex",
-                  flexDirection: "column",
-                  gap: "8px",
-                  marginLeft: "10px",
-                }}
-              >
                 {cpfError ? (
-                  <p
+                  <p style={{ color: "#111", fontSize: "1.1rem", margin: 0, fontWeight: "600" }}>{cpfError}</p>
-                    style={{
-                      color: "#111",
-                      fontSize: "1.1rem",
-                      margin: 0,
-                      fontWeight: "600",
-                    }}
-                  >
-                    {cpfError}
-                  </p>
                 ) : (
                   <>
-                    {!formData.full_name && (
+                    {!formData.full_name && <p style={{ color: "#111", fontSize: "1.1rem", margin: 0, fontWeight: "600" }}>- Nome</p>}
-                      <p
+                    {!formData.cpf && <p style={{ color: "#111", fontSize: "1.1rem", margin: 0, fontWeight: "600" }}>- CPF</p>}
-                        style={{
+                    {!formData.email && <p style={{ color: "#111", fontSize: "1.1rem", margin: 0, fontWeight: "600" }}>- Email</p>}
-                          color: "#111",
+                    {!formData.phone_mobile && <p style={{ color: "#111", fontSize: "1.1rem", margin: 0, fontWeight: "600" }}>- Telefone</p>}
-                          fontSize: "1.1rem",
+                    {!formData.crm_uf && <p style={{ color: "#111", fontSize: "1.1rem", margin: 0, fontWeight: "600" }}>- Estado do CRM</p>}
-                          margin: 0,
+                    {!formData.crm && <p style={{ color: "#111", fontSize: "1.1rem", margin: 0, fontWeight: "600" }}>- CRM</p>}
-                          fontWeight: "600",
-                        }}
-                      >
-                        - Nome
-                      </p>
-                    )}
-                    {!formData.cpf && (
-                      <p
-                        style={{
-                          color: "#111",
-                          fontSize: "1.1rem",
-                          margin: 0,
-                          fontWeight: "600",
-                        }}
-                      >
-                        - CPF
-                      </p>
-                    )}
-                    {!formData.email && (
-                      <p
-                        style={{
-                          color: "#111",
-                          fontSize: "1.1rem",
-                          margin: 0,
-                          fontWeight: "600",
-                        }}
-                      >
-                        - Email
-                      </p>
-                    )}
-                    {!formData.phone_mobile && (
-                      <p
-                        style={{
-                          color: "#111",
-                          fontSize: "1.1rem",
-                          margin: 0,
-                          fontWeight: "600",
-                        }}
-                      >
-                        - Telefone
-                      </p>
-                    )}
-                    {!formData.crm_uf && (
-                      <p
-                        style={{
-                          color: "#111",
-                          fontSize: "1.1rem",
-                          margin: 0,
-                          fontWeight: "600",
-                        }}
-                      >
-                        - Estado do CRM
-                      </p>
-                    )}
-                    {!formData.crm && (
-                      <p
-                        style={{
-                          color: "#111",
-                          fontSize: "1.1rem",
-                          margin: 0,
-                          fontWeight: "600",
-                        }}
-                      >
-                        - CRM
-                      </p>
-                    )}
                   </>
                 )}
               </div>
@@ -452,26 +364,18 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
       )}
 
       <div className="card p-3 shadow-sm">
-        <h3 className="mb-4 text-center" style={{ fontSize: "2.5rem" }}>
+        <h3 className="mb-4 text-center" style={{ fontSize: '2.5rem' }}>MediConnect</h3>
-          MediConnect
-        </h3>
 
         <div className="mb-5 p-4 border rounded shadow-sm">
-          <h4
+          <h4 className="mb-4 cursor-pointer d-flex justify-content-between align-items-center"
-            className="mb-4 cursor-pointer d-flex justify-content-between align-items-center"
+            onClick={() => handleToggleCollapse('dadosPessoais')}
-            onClick={() => handleToggleCollapse("dadosPessoais")}
+            style={{ fontSize: '1.8rem' }}>
-            style={{ fontSize: "1.8rem" }}
-          >
             Dados Pessoais
             <span className="fs-5">
-              {collapsedSections.dadosPessoais ? "▲" : "▼"}
+              {collapsedSections.dadosPessoais ? '▲' : '▼'}
             </span>
           </h4>
-          <div
+          <div className={`collapse${collapsedSections.dadosPessoais ? ' show' : ''}`}>
-            className={`collapse${
-              collapsedSections.dadosPessoais ? " show" : ""
-            }`}
-          >
             <div className="row mt-3">
               <div className="col-md-6 mb-3 d-flex align-items-center">
                 <div className="me-3">
@@ -479,25 +383,20 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
                     <img
                       src={avatarUrl}
                       alt="Avatar do Médico"
-                      style={{
+                      style={{ width: '100px', height: '100px', borderRadius: '50%', objectFit: 'cover' }}
-                        width: "100px",
-                        height: "100px",
-                        borderRadius: "50%",
-                        objectFit: "cover",
-                      }}
                     />
                   ) : (
                     <div
                       style={{
-                        width: "100px",
+                        width: '100px',
-                        height: "100px",
+                        height: '100px',
-                        borderRadius: "50%",
+                        borderRadius: '50%',
-                        backgroundColor: "#e0e0e0",
+                        backgroundColor: '#e0e0e0',
-                        display: "flex",
+                        display: 'flex',
-                        alignItems: "center",
+                        alignItems: 'center',
-                        justifyContent: "center",
+                        justifyContent: 'center',
-                        fontSize: "3.5rem",
+                        fontSize: '3.5rem',
-                        color: "#9e9e9e",
+                        color: '#9e9e9e'
                       }}
                     >
                       &#x2624;
@@ -505,13 +404,7 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
                   )}
                 </div>
                 <div>
-                  <label
+                  <label htmlFor="foto-input" className="btn btn-primary" style={{ fontSize: '1rem' }}>Carregar Foto</label>
-                    htmlFor="foto-input"
-                    className="btn btn-primary"
-                    style={{ fontSize: "1rem" }}
-                  >
-                    Carregar Foto
-                  </label>
                   <input
                     type="file"
                     className="form-control d-none"
@@ -520,66 +413,49 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
                     onChange={handleChange}
                     accept="image/*"
                   />
-                  {formData.foto && (
+                  {formData.foto && <span className="ms-2" style={{ fontSize: '1rem' }}>{formData.foto.name}</span>}
-                    <span className="ms-2" style={{ fontSize: "1rem" }}>
-                      {formData.foto.name}
-                    </span>
-                  )}
                 </div>
               </div>
 
               <div className="col-md-6 mb-3">
-                <label style={{ fontSize: "1.1rem" }}>Nome: *</label>
+                <label style={{ fontSize: '1.1rem' }}>Nome: *</label>
                 <input 
                   ref={nomeRef}
                   type="text" 
                   className="form-control" 
                   name="full_name" 
-                  value={formData.full_name || ""}
+                  value={formData.full_name || ''} 
                   onChange={handleChange} 
                 />
               </div>
               <div className="col-md-6 mb-3">
-                <label style={{ fontSize: "1.1rem" }}>
+                <label style={{ fontSize: '1.1rem' }}>Data de nascimento:</label>
-                  Data de nascimento:
+                <input type="date" className="form-control" name="birth_date" value={formData.birth_date || ''} onChange={handleChange} min="1900-01-01" max="2025-09-24" />
-                </label>
-                <input
-                  type="date"
-                  className="form-control"
-                  name="birth_date"
-                  value={formData.birth_date || ""}
-                  onChange={handleChange}
-                  min="1900-01-01"
-                  max="2025-09-24"
-                />
               </div>
               <div className="col-md-6 mb-3">
-                <label style={{ fontSize: "1.1rem" }}>CPF: *</label>
+                <label style={{ fontSize: '1.1rem' }}>CPF: *</label>
                 <input 
                   ref={cpfRef}
                   type="text" 
-                  className={`form-control ${cpfError ? "is-invalid" : ""}`}
+                  className={`form-control ${cpfError ? 'is-invalid' : ''}`}
                   name="cpf" 
-                  value={formData.cpf || ""}
+                  value={formData.cpf || ''} 
                   onChange={handleChange} 
                 />
                 {cpfError && (
-                  <div
+                  <div className="invalid-feedback" style={{ display: 'block' }}>
-                    className="invalid-feedback"
-                    style={{ display: "block" }}
-                  >
                     {cpfError}
                   </div>
                 )}
               </div>
 
               <div className="col-md-6 mb-3">
-                <label style={{ fontSize: "1.1rem" }}>Estado do CRM: *</label>
+                <label style={{ fontSize: '1.1rem' }}>Estado do CRM: *</label>
                 <select 
                   ref={crmUfRef}
                   className="form-control" 
                   name="crm_uf" 
-                  value={formData.crm_uf || ""}
+                  value={formData.crm_uf || ''} 
                   onChange={handleChange}
                 >
                   <option value="">Selecione</option>
@@ -613,37 +489,28 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
               </div>
 
               <div className="col-md-6 mb-3">
-                <label style={{ fontSize: "1.1rem" }}>CRM: *</label>
+                <label style={{ fontSize: '1.1rem' }}>CRM: *</label>
                 <input 
                   ref={crmRef}
                   type="text" 
                   className="form-control" 
                   name="crm" 
-                  value={formData.crm || ""}
+                  value={formData.crm || ''} 
                   onChange={handleChange} 
                 />
               </div>
 
               <div className="col-md-6 mb-3">
-                <label style={{ fontSize: "1.1rem" }}>Especialização:</label>
+                <label style={{ fontSize: '1.1rem' }}>Especialização:</label>
-                <select
+                <select className="form-control" name="specialty" value={formData.specialty || ''} onChange={handleChange}>
-                  className="form-control"
-                  name="specialty"
-                  value={formData.specialty || ""}
-                  onChange={handleChange}
-                >
                   <option value="">Selecione</option>
-                  <option value="Clínica Geral">
+                  <option value="Clínica Geral">Clínica médica (clínico geral)</option>
-                    Clínica médica (clínico geral)
-                  </option>
                   <option value="Pediatria">Pediatria</option>
                   <option value="Ginecologia">Ginecologia e obstetrícia</option>
                   <option value="Cardiologia">Cardiologia</option>
                   <option value="Ortopedia">Ortopedia e traumatologia</option>
                   <option value="Oftalmologia">Oftalmologia</option>
-                  <option value="Otorrinolaringologia">
+                  <option value="Otorrinolaringologia">Otorrinolaringologia</option>
-                    Otorrinolaringologia
-                  </option>
                   <option value="Dermatologia">Dermatologia</option>
                   <option value="Neurologia">Neurologia</option>
                   <option value="Psiquiatria">Psiquiatria</option>
@@ -657,187 +524,103 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
         </div>
 
         <div className="mb-5 p-4 border rounded shadow-sm">
-          <h4
+          <h4 className="mb-4 cursor-pointer d-flex justify-content-between align-items-center"
-            className="mb-4 cursor-pointer d-flex justify-content-between align-items-center"
+            onClick={() => handleToggleCollapse('contato')}
-            onClick={() => handleToggleCollapse("contato")}
+            style={{ fontSize: '1.8rem' }}>
-            style={{ fontSize: "1.8rem" }}
-          >
             Contato
             <span className="fs-5">
-              {collapsedSections.contato ? "▲" : "▼"}
+              {collapsedSections.contato ? '▲' : '▼'}
             </span>
           </h4>
-          <div
+          <div className={`collapse${collapsedSections.contato ? ' show' : ''}`}>
-            className={`collapse${collapsedSections.contato ? " show" : ""}`}
-          >
             <div className="row mt-3">
               <div className="col-md-6 mb-3">
-                <label style={{ fontSize: "1.1rem" }}>Email: *</label>
+                <label style={{ fontSize: '1.1rem' }}>Email: *</label>
                 <input 
                   ref={emailRef}
                   type="email" 
                   className="form-control" 
                   name="email" 
-                  value={formData.email || ""}
+                  value={formData.email || ''} 
                   onChange={handleChange} 
                 />
               </div>
               <div className="col-md-6 mb-3">
-                <label style={{ fontSize: "1.1rem" }}>Telefone: *</label>
+                <label style={{ fontSize: '1.1rem' }}>Telefone: *</label>
                 <input 
                   ref={telefoneRef}
                   type="text" 
                   className="form-control" 
                   name="phone_mobile" 
-                  value={formData.phone_mobile || ""}
+                  value={formData.phone_mobile || ''} 
                   onChange={handleChange} 
                 />
               </div>
               <div className="col-md-6 mb-3">
-                <label style={{ fontSize: "1.1rem" }}>Telefone 2:</label>
+                <label style={{ fontSize: '1.1rem' }}>Telefone 2:</label>
-                <input
+                <input type="text" className="form-control" name="phone2" value={formData.phone2 || ''} onChange={handleChange} />
-                  type="text"
-                  className="form-control"
-                  name="phone2"
-                  value={formData.phone2 || ""}
-                  onChange={handleChange}
-                />
               </div>
             </div>
           </div>
         </div>
 
         <div className="mb-5 p-4 border rounded shadow-sm">
-          <h4
+          <h4 className="mb-4 cursor-pointer d-flex justify-content-between align-items-center"
-            className="mb-4 cursor-pointer d-flex justify-content-between align-items-center"
+            onClick={() => handleToggleCollapse('endereco')}
-            onClick={() => handleToggleCollapse("endereco")}
+            style={{ fontSize: '1.8rem' }}>
-            style={{ fontSize: "1.8rem" }}
-          >
             Endereço
             <span className="fs-5">
-              {collapsedSections.endereco ? "▲" : "▼"}
+              {collapsedSections.endereco ? '▲' : '▼'}
             </span>
           </h4>
-          <div
+          <div className={`collapse${collapsedSections.endereco ? ' show' : ''}`}>
-            className={`collapse${collapsedSections.endereco ? " show" : ""}`}
-          >
             <div className="row mt-3">
               <div className="col-md-4 mb-3">
                 <label>CEP:</label>
-                <input
+                <input type="text" className="form-control" name="cep" value={formData.cep || ''} onChange={handleChange} onBlur={handleCepBlur} />
-                  type="text"
-                  className="form-control"
-                  name="cep"
-                  value={formData.cep || ""}
-                  onChange={handleChange}
-                  onBlur={handleCepBlur}
-                />
               </div>
               <div className="col-md-8 mb-3">
                 <label>Rua:</label>
-                <input
+                <input type="text" className="form-control" name="street" value={formData.street || ''} onChange={handleChange} />
-                  type="text"
-                  className="form-control"
-                  name="street"
-                  value={formData.street || ""}
-                  onChange={handleChange}
-                />
               </div>
               <div className="col-md-6 mb-3">
                 <label>Bairro:</label>
-                <input
+                <input type="text" className="form-control" name="neighborhood" value={formData.neighborhood || ''} onChange={handleChange} />
-                  type="text"
-                  className="form-control"
-                  name="neighborhood"
-                  value={formData.neighborhood || ""}
-                  onChange={handleChange}
-                />
               </div>
               <div className="col-md-4 mb-3">
                 <label>Cidade:</label>
-                <input
+                <input type="text" className="form-control" name="city" value={formData.city || ''} onChange={handleChange} />
-                  type="text"
-                  className="form-control"
-                  name="city"
-                  value={formData.city || ""}
-                  onChange={handleChange}
-                />
               </div>
               <div className="col-md-2 mb-3">
                 <label>Estado:</label>
-                <input
+                <input type="text" className="form-control" name="state" value={formData.state || ''} onChange={handleChange} />
-                  type="text"
-                  className="form-control"
-                  name="state"
-                  value={formData.state || ""}
-                  onChange={handleChange}
-                />
               </div>
               <div className="col-md-4 mb-3">
                 <label>Número:</label>
-                <input
+                <input type="text" className="form-control" name="number" value={formData.number || ''} onChange={handleChange} />
-                  type="text"
-                  className="form-control"
-                  name="number"
-                  value={formData.number || ""}
-                  onChange={handleChange}
-                />
               </div>
               <div className="col-md-8 mb-3">
                 <label>Complemento:</label>
-                <input
+                <input type="text" className="form-control" name="complement" value={formData.complement || ''} onChange={handleChange} />
-                  type="text"
-                  className="form-control"
-                  name="complement"
-                  value={formData.complement || ""}
-                  onChange={handleChange}
-                />
               </div>
             </div>
           </div>
         </div>
-        <div className="mb-5 p-4 border rounded shadow-sm">
-          <h4
-            className="mb-4 cursor-pointer d-flex justify-content-between align-items-center"
-            onClick={() => handleToggleCollapse("disponibilidade")}
-            style={{ fontSize: "1.8rem" }}
-          >
-            Disponibilidade Semanal
-            <span className="fs-5">
-              {collapsedSections.disponibilidade ? "▲" : "▼"}
-            </span>
-          </h4>
-          <div
-            className={`collapse${
-              collapsedSections.disponibilidade ? " show" : ""
-            }`}
-          >
-            <WeeklyAvailabilityPicker
-              initialAvailability={formData.availability || {}}
-              onChange={(newAvailability) => {
-                setFormData((prev) => ({
-                  ...prev,
-                  availability: newAvailability,
-                }));
-              }}
-            />
-          </div>
-        </div>
 
         <div className="mt-3 text-center">
           <button
             className="btn btn-success me-3"
             onClick={handleSubmit}
             disabled={isLoading}
-            style={{ fontSize: "1.2rem", padding: "0.75rem 1.5rem" }}
+            style={{ fontSize: '1.2rem', padding: '0.75rem 1.5rem' }}
           >
-            {isLoading ? "Salvando..." : "Salvar Médico"}
+            {isLoading ? 'Salvando...' : 'Salvar Médico'}
           </button>
           
           <Link to={`/${location.pathname.split("/")[1]}/medicos`}>
             <button 
               className="btn btn-light" 
-              style={{ fontSize: "1.2rem", padding: "0.75rem 1.5rem" }}
+              style={{ fontSize: '1.2rem', padding: '0.75rem 1.5rem' }}
             >
               Cancelar
             </button>
@@ -848,79 +631,4 @@ function DoctorForm({ onSave, onCancel, formData, setFormData, isLoading }) {
   );
 }
 
-function WeeklyAvailabilityPicker() {
-  const days = ["Seg", "Ter", "Qua", "Qui", "Sex", "Sáb", "Dom"];
-  const [availability, setAvailability] = useState(
-    days.reduce((acc, day) => ({ ...acc, [day]: [] }), {})
-  );
-
-  const handleAddInterval = (day) => {
-    const newIntervals = [...availability[day], { start: "", end: "" }];
-    const newAvailability = { ...availability, [day]: newIntervals };
-    setAvailability(newAvailability);
-  };
-
-  const handleRemoveInterval = (day, index) => {
-    const newIntervals = availability[day].filter((_, i) => i !== index);
-    setAvailability({ ...availability, [day]: newIntervals });
-  };
-
-  const handleTimeChange = (day, index, field, value) => {
-    const newIntervals = availability[day].map((interval, i) =>
-      i === index ? { ...interval, [field]: value } : interval
-    );
-    setAvailability({ ...availability, [day]: newIntervals });
-  };
-
-  const handleSave = () => {
-    const data = [];
-    for (const [day, intervals] of Object.entries(availability)) {
-      intervals.forEach(({ start, end }) => {
-        const dayIndex = days.indexOf(day);
-        data.push({ day: dayIndex, start, end });
-      });
-    }
-
-    fetch("https://mock.apidog.com/m1/1053378-0-default/rest/v1/doctor_availability", {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify(data),
-    })
-      .then((res) => res.json())
-      .then((res) => console.log("Salvo:", res))
-      .catch((err) => console.error("Erro:", err));
-  };
-
-  return (
-    <div>
-      {days.map((day) => (
-        <div key={day} style={{ marginBottom: "20px" }}>
-          <h5>{day}</h5>
-          {availability[day].map((interval, index) => (
-            <div
-              key={index}
-              style={{ display: "flex", alignItems: "center", gap: "10px", marginBottom: "5px" }}
-            >
-              <input
-                type="time"
-                value={interval.start}
-                onChange={(e) => handleTimeChange(day, index, "start", e.target.value)}
-              />
-              <span>até</span>
-              <input
-                type="time"
-                value={interval.end}
-                onChange={(e) => handleTimeChange(day, index, "end", e.target.value)}
-              />
-              <button onClick={() => handleRemoveInterval(day, index)}>Remover</button>
-            </div>
-          ))}
-          <button onClick={() => handleAddInterval(day)}>Adicionar intervalo</button>
-        </div>
-      ))}
-      <button onClick={handleSave}>Salvar Disponibilidade</button>
-    </div>
-  );
-}
-
 export default DoctorForm;

src/pages/DoctorCadastroManager.jsx

@@ -44,7 +44,6 @@ function DoctorCadastroManager() {
         number: doctorData.number || null,
         complement: doctorData.complement || null,
         phone2: doctorData.phone2 ? doctorData.phone2.replace(/\D/g, '') : null,
-        availability: doctorData.availability || {},
       };
 
       console.log('Dados limpos para envio:', cleanedData);

src/pages/DoctorEditPage.jsx

@@ -1,115 +1,77 @@
-import React, { useEffect, useState } from "react";
+import React from 'react'
-import { GetDoctorByID } from "../components/utils/Functions-Endpoints/Doctor";
+import { GetDoctorByID } from '../components/utils/Functions-Endpoints/Doctor'
-import DoctorForm from "../components/doctors/DoctorForm";
+import DoctorForm from '../components/doctors/DoctorForm'
-import { useAuth } from "../components/utils/AuthProvider";
+import { useAuth } from '../components/utils/AuthProvider'
-import { useParams } from "react-router-dom";
+import {useEffect, useState} from 'react'
-import API_KEY from "../components/utils/apiKeys";
+import { useParams } from 'react-router-dom'
-
+import API_KEY from '../components/utils/apiKeys'
 const DoctorEditPage = () => {
-  const { getAuthorizationHeader } = useAuth();
+  const {getAuthorizationHeader, isAuthenticated} = useAuth();
-  const [DoctorToPUT, setDoctorPUT] = useState({});
+  const [DoctorToPUT, setDoctorPUT] = useState({})
-  const [availability, setAvailability] = useState([]);
-  const { id: DoctorID } = useParams();
   
-  useEffect(() => {
+  const Parametros = useParams()
-    const authHeader = getAuthorizationHeader();
 
-    // Buscar médico
+  const DoctorID = Parametros.id
-    GetDoctorByID(DoctorID, authHeader)
-      .then((data) => setDoctorPUT(data[0]))
-      .catch((err) => console.error(err));
 
-    // Buscar disponibilidades
+useEffect(() => {
-    const fetchAvailability = async () => {
-      try {
-        const res = await fetch(
-          `https://mock.apidog.com/m1/1053378-0-default/rest/v1/doctor_availability/${DoctorID}`,
-          { headers: { apikey: API_KEY, Authorization: authHeader } }
-        );
-        const data = await res.json();
-        setAvailability(data.data || []);
-      } catch (err) {
-        console.error(err);
-      }
-    };
     
-    fetchAvailability();
+  const authHeader = getAuthorizationHeader()
-  }, []);
 
-  // Atualizar uma disponibilidade
+ GetDoctorByID(DoctorID, authHeader)
-  const updateAvailability = async (id, updatedData) => {
+      .then((data) => {
-    const authHeader = getAuthorizationHeader();
+        console.log(data, "médico vindo da API");
-    try {
+        setDoctorPUT(data[0])
-      await fetch(
+        ; // supabase retorna array
-        `https://mock.apidog.com/m1/1053378-0-default/rest/v1/doctor_availability/${id}`,
+      })
-        {
+      .catch((err) => console.error("Erro ao buscar paciente:", err));
-          method: "PUT",
-          headers: {
-            apikey: API_KEY,
-            Authorization: authHeader,
-            "Content-Type": "application/json",
-          },
-          body: JSON.stringify(updatedData),
-        }
-      );
-      // atualizar localmente
-      setAvailability((prev) =>
-        prev.map((a) => (a.id === id ? { ...a, ...updatedData } : a))
-      );
-    } catch (err) {
-      console.error(err);
-    }
-  };
 
-  // Deletar uma disponibilidade
-  const deleteAvailability = async (id) => {
-    const authHeader = getAuthorizationHeader();
-    try {
-      await fetch(
-        `https://mock.apidog.com/m1/1053378-0-default/rest/v1/doctor_availability/${id}`,
-        {
-          method: "DELETE",
-          headers: { apikey: API_KEY, Authorization: authHeader },
-        }
-      );
-      setAvailability((prev) => prev.filter((a) => a.id !== id));
-    } catch (err) {
-      console.error(err);
-    }
-  };
     
+}, [])
   const HandlePutDoctor = async () => {
-    const authHeader = getAuthorizationHeader();
+const authHeader = getAuthorizationHeader()
-    try {
+  
-      await fetch(
+
-        `https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors?id=eq.${DoctorID}`,
+  var myHeaders = new Headers();
-        {
+  myHeaders.append('apikey', API_KEY)
-          method: "PUT",
+  myHeaders.append("Authorization", authHeader);
-          headers: {
+  myHeaders.append("Content-Type", "application/json");
-            apikey: API_KEY,
+
-            Authorization: authHeader,
+  var raw = JSON.stringify(DoctorToPUT);
-            "Content-Type": "application/json",
+
-          },
+  console.log("Enviando médico para atualização:", DoctorToPUT);
-          body: JSON.stringify(DoctorToPUT),
+
-        }
+  var requestOptions = {
-      );
+    method: 'PUT',
-    } catch (err) {
+    headers: myHeaders,
-      console.error(err);
+    body: raw,
-    }
+    redirect: 'follow'
   };
 
+  try {
+    const response = await fetch(`https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors?id=eq.${DoctorID}`,requestOptions);    
+    console.log(response)
+     
+  } catch (error) {
+    console.error("Erro ao atualizar paciente:", error);
+    throw error;
+  }
+
+  }
+
+
   return (
     <div>
-      <DoctorForm
-        onSave={HandlePutDoctor}
-        formData={DoctorToPUT}
-        setFormData={setDoctorPUT}
-        availability={availability}
-        updateAvailability={updateAvailability}
-        deleteAvailability={deleteAvailability}
-      />
-    </div>
-  );
-};
 
-export default DoctorEditPage;
+    <DoctorForm
+    onSave={HandlePutDoctor}
+    
+    formData={DoctorToPUT}
+    setFormData={setDoctorPUT}
+    
+    />
+    
+    </div>
+  )
+}
+
+export default DoctorEditPage