guild_front/src/hooks/useFormValidation.js

116 lines
3.5 KiB
JavaScript
Raw Normal View History

import { useState } from "react";
import { apiRequest } from "@api/request";
export const useFormValidation = (
apiEndpoint,
fields,
showNotificationError,
showNotificationTrue
) => {
// Состояние формы, содержащее значения полей
const [formData, setFormData] = useState(fields);
// Состояние ошибок валидации
const [validationErrors, setValidationErrors] = useState({});
// Функция для обработки изменений в полях ввода
const handleChange = (e) => {
const { id, value } = e.target;
setFormData((prevData) => ({ ...prevData, [id]: value }));
};
// Функция для валидации формы
const validateForm = () => {
const errors = {};
if (formData.username != undefined) {
if (formData.username.trim() === "") {
errors.username = "Имя обязательно к заполнению";
}
}
if (formData.email != undefined) {
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (formData.email.trim() === "") {
errors.email = "E-mail обязателен к заполнению";
} else if (!emailRegex.test(formData.email)) {
errors.email = "Неверный адрес электронной почты";
}
}
if (formData.tg != undefined) {
if (formData.tg.trim() === "") {
errors.tg = "Telegram обязателен к заполнению";
}
}
if (formData.password != undefined) {
if (formData.password.trim() === "") {
errors.password = "Пароль обязателен к заполнению";
} else if (formData.password.length < 8) {
errors.password = "Пароль должен содержать более 8 символов";
}
}
if (formData.secondPassword != undefined) {
if (formData.secondPassword.trim() === "") {
errors.secondPassword = "Повторите пароль";
} else if (formData.secondPassword !== formData.password) {
errors.secondPassword = "Пароли должны совпадать";
}
}
setValidationErrors(errors);
// Возвращаем true, если ошибок нет, иначе - false
return Object.keys(errors).length === 0;
};
// Функция отчистки формы
const handleClearForm = () => {
const clearedFormData = Object.fromEntries(
Object.keys(formData).map((key) => [key, ""])
);
setFormData(clearedFormData);
const clearedValidationErrors = Object.fromEntries(
Object.keys(validationErrors).map((key) => [key, ""])
);
setValidationErrors(clearedValidationErrors);
};
// Функция для обработки отправки формы
const handleSubmit = async (e) => {
e.preventDefault();
// Проверка валидации формы
if (validateForm()) {
let newformData = { ...formData };
delete newformData.secondPassword;
try {
apiRequest(apiEndpoint, {
method: "POST",
data: newformData
}).then((data) => {
if ("errors" in data) {
showNotificationError();
} else {
handleClearForm();
showNotificationTrue();
}
});
} catch (error) {
console.error("Error submitting form:", error);
}
}
};
return {
formData,
validationErrors,
handleChange,
handleSubmit,
handleClearForm
};
};