add: incorporacion botones formularios

src/pages/users/publicar.jsx

@@ -63,6 +63,8 @@ const serviceSubCategories = [
     { label: 'Oficios', value: 'oficios', 
         desc: 'Con Servicio de Oficio, podrás ofrecer tus habilidades y experiencia en una variedad de áreas profesionales. Si eres plomero, electricista, carpintero o tienes cualquier otro talento útil, esta categoría te permite conectar con clientes que buscan soluciones para sus necesidades domésticas o empresariales. Destaca tus conocimientos y garantiza un servicio de calidad para ganar la confianza de nuevos clientes.' }
   ];
+
+
 
 
 function Publicar() {
@@ -77,6 +79,49 @@ function Publicar() {
     });
     const [files, setFiles] = useState([]);
     const [error, setError] = useState('');
+    const [errors, setErrors] = useState({});
+    const [formData, setFormData] = useState({
+        subcategoria: '', titulo: '', descripcion: '', ubicacion: '',
+        dormitorios: '', camasSimples: '', camasDobles: '', cantidadMinima: '', cantidadMaxima: '',
+        celularContacto: '', mailContacto: '', precioPorNoche: '',
+    });
+
+    const validateForm = () => {
+        const newErrors = {};
+
+        if (!formData.subcategoria) newErrors.subcategoria = 'Selecciona un tipo de acomodación.';
+        if (!formData.titulo) newErrors.titulo = 'Escribe un título.';
+        if (!formData.descripcion) newErrors.descripcion = 'Escribe una descripción.';
+        if (!formData.ubicacion) newErrors.ubicacion = 'Escribe una ubicación (Ej: Calle 123, Comuna, Ciudad).';
+        if (!formData.dormitorios) newErrors.dormitorios = 'Ingresa cantidad de dormitorios.';
+        if (!formData.camasSimples) newErrors.camasSimples = 'Ingresa cantidad de camas simples.';
+        if (!formData.camasDobles) newErrors.camasDobles = 'Ingresa cantidad de camas dobles.';
+        if (!formData.cantidadMaxima) newErrors.cantidadMaxima = 'Ingresa cantidad máxima de personas para la acomodación.';
+        if (!formData.cantidadMinima) newErrors.cantidadMinima = 'Ingresa cantidad mínima de personas para la acomodación.';
+
+        if (!formData.celularContacto && !formData.mailContacto) {
+            newErrors.contacto = 'Debes incluir al menos el número de celular o el mail de contacto.';
+        } else {
+            if (formData.celularContacto && !/^\d+$/.test(formData.celularContacto)) {
+                newErrors.celularContacto = 'El número de celular debe contener solo números. Ej: 9 8765 4321.';
+            }
+            if (formData.mailContacto && !/^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/.test(formData.mailContacto)) {
+                newErrors.mailContacto = 'Escribir el email en su debido formato. Ej: [email protected]';
+            }
+        }
+
+        if (!formData.precioPorNoche) newErrors.precioPorNoche = 'Se debe escribir un precio por noche.';
+
+        setErrors(newErrors);
+        return Object.keys(newErrors).length === 0;
+    };
+
+    const handleInputChange = (field, value) => {
+        setFormData((prev) => ({ ...prev, [field]: value }));
+        if (errors[field]) {
+            setErrors((prevErrors) => ({ ...prevErrors, [field]: undefined }));
+        }
+    };
 
     const handleTypeChange = (event, newValue) => {
         setSelectedType(newValue);
@@ -87,13 +132,21 @@ function Publicar() {
         setSelectedSubCategory(newValue);
       };
 
-    const handleNext = () => {
-        if (activeStep === 0 && !selectedType) {
-            setError('Por favor selecciona tu tipo de publicación');
+      const handleNext = () => {
+        if (activeStep === 1 && !validateForm()) {
+            return; // Evita avanzar si hay errores de validación en el paso "Información"
         }
-        else {
-            setActiveStep((prevActiveStep) => prevActiveStep + 1);
+
+        if (activeStep === 2 && files.length === 0) { // Verifica si hay imágenes en el paso "Imágenes"
+            setErrors((prevErrors) => ({
+                ...prevErrors,
+                files: 'Debes subir al menos una imagen.',
+            }));
+            return; // Evita avanzar si no hay imágenes
         }
+
+        setErrors({}); // Limpia errores si todo está correcto
+        setActiveStep((prevActiveStep) => prevActiveStep + 1);
     };
 
     const handleBack = () => {
@@ -186,7 +239,7 @@ function Publicar() {
                 );
             case 1:
                 if(selectedType === 'propiedad') {
-                    return <HospedajeForm onNext={handleNext}/>;
+                    return <HospedajeForm formData={formData} errors={errors} onInputChange={handleInputChange} />
                 } else if (selectedType === 'camping') {
                     return <CampingForm onNext={handleNext}/>;
                 } else if (selectedType === 'servicios') {