fix auth errors and add tracker-registration

This commit is contained in:
Mikola 2024-03-11 18:24:03 +03:00
parent 012ef7d4b6
commit 2ed0be6664
6 changed files with 64 additions and 42 deletions

View File

@ -32,10 +32,10 @@ export const ModalRegistration = ({ active, setActive }) => {
const apiEndpoint = "/register/sign-up"; const apiEndpoint = "/register/sign-up";
const { showNotification } = useNotification(); const { showNotification } = useNotification();
const showNotificationError = () => { const showNotificationError = (error) => {
showNotification({ showNotification({
show: true, show: true,
text: "Аккаунт с таким логином или email уже существует", text: error,
type: "error" type: "error"
}); });
}; };
@ -58,7 +58,9 @@ export const ModalRegistration = ({ active, setActive }) => {
fields, fields,
showNotificationError, showNotificationError,
showNotificationTrue, showNotificationTrue,
isPartner isPartner,
setLoader,
closeModal
); );
return ( return (
@ -142,12 +144,7 @@ export const ModalRegistration = ({ active, setActive }) => {
<BaseButton <BaseButton
onClick={async (e) => { onClick={async (e) => {
e.preventDefault(); e.preventDefault();
setLoader(true); await handleSubmit(e);
const result = await handleSubmit(e);
if (result === true) {
closeModal();
}
setLoader(false);
}} }}
styles="button-box__submit" styles="button-box__submit"
> >

View File

@ -249,6 +249,5 @@
.loader { .loader {
justify-content: start; justify-content: start;
left: 80px;
} }
} }

View File

@ -7,7 +7,9 @@ export const useFormValidation = (
fields, fields,
showNotificationError, showNotificationError,
showNotificationTrue, showNotificationTrue,
isPartner isPartner,
setLoader,
closeModal
) => { ) => {
// Состояние формы, содержащее значения полей // Состояние формы, содержащее значения полей
const [formData, setFormData] = useState(fields); const [formData, setFormData] = useState(fields);
@ -85,20 +87,26 @@ export const useFormValidation = (
e.preventDefault(); e.preventDefault();
// Проверка валидации формы // Проверка валидации формы
if (validateForm()) { if (validateForm()) {
setLoader(true)
let newformData = { ...formData, is_partner: isPartner ? 1 : 0 }; let newformData = { ...formData, is_partner: isPartner ? 1 : 0 };
delete newformData.secondPassword; delete newformData.secondPassword;
try { try {
apiRequest(apiEndpoint, { apiRequest(apiEndpoint, {
method: "POST", method: "POST",
data: newformData data: newformData
}).then((data) => { }).then((data) => {
setLoader(false)
if ("errors" in data) { if ("errors" in data) {
showNotificationError(); return showNotificationError('Аккаунт с таким логином или email уже существуе');
} else { }
if (!data.id) {
return showNotificationError('Ошибка');
}
handleClearForm(); handleClearForm();
showNotificationTrue(); showNotificationTrue();
} closeModal();
}); });
} catch (error) { } catch (error) {
console.error("Error submitting form:", error); console.error("Error submitting form:", error);

View File

@ -5,6 +5,7 @@ import { AuthHeader } from "@components/Common/AuthHeader/AuthHeader";
import { Footer } from "@components/Common/Footer/Footer"; import { Footer } from "@components/Common/Footer/Footer";
import ModalLayout from "@components/Common/ModalLayout/ModalLayout"; import ModalLayout from "@components/Common/ModalLayout/ModalLayout";
import { ModalReset } from "@components/Modal/ModalReset/ModalReset"; import { ModalReset } from "@components/Modal/ModalReset/ModalReset";
import ModalResetPassword from "@components/Modal/ModalResetPassword/ModalResetPassword";
import SideBar from "@components/SideBar/SideBar"; import SideBar from "@components/SideBar/SideBar";
import arrowInfo from "assets/icons/trackerIntroInfo.svg"; import arrowInfo from "assets/icons/trackerIntroInfo.svg";
@ -33,11 +34,12 @@ export const TrackerAuth = () => {
resetModal={setModalReset} resetModal={setModalReset}
/> />
</div> </div>
{modalResetOpen && ( <ModalResetPassword active={modalResetOpen} setActive={setModalReset} />
<ModalLayout active={modalResetOpen} setActive={setModalReset}> {/*{modalResetOpen && (*/}
<ModalReset setModalReset={setModalReset} /> {/* <ModalLayout active={modalResetOpen} setActive={setModalReset}>*/}
</ModalLayout> {/* <ModalReset setModalReset={setModalReset} />*/}
)} {/* </ModalLayout>*/}
{/*)}*/}
</div> </div>
<Footer /> <Footer />
</div> </div>

View File

@ -15,9 +15,13 @@ import authImg from "assets/images/partnerProfile/authCandidateFormImg.png";
import registrationImg from "assets/images/trackerRegistrationImg.png"; import registrationImg from "assets/images/trackerRegistrationImg.png";
import "./trackerRegistration.scss"; import "./trackerRegistration.scss";
import { Loader } from "@components/Common/Loader/Loader";
import BaseButton from "@components/Common/BaseButton/BaseButton";
export const TrackerRegistration = () => { export const TrackerRegistration = () => {
const [modalConfirmOpen, setModalConfirm] = useState(false); const [modalConfirmOpen, setModalConfirm] = useState(false);
const [loader, setLoader] = useState(false);
const [isPartner, setIsPartner] = useState(false);
const fields = { const fields = {
username: "", username: "",
email: "", email: "",
@ -28,10 +32,10 @@ export const TrackerRegistration = () => {
const apiEndpoint = "/register/sign-up"; const apiEndpoint = "/register/sign-up";
const { showNotification } = useNotification(); const { showNotification } = useNotification();
const showNotificationError = () => { const showNotificationError = (error) => {
showNotification({ showNotification({
show: true, show: true,
text: "Аккаунт с таким логином или email уже существует", text: error,
type: "error" type: "error"
}); });
}; };
@ -43,14 +47,19 @@ export const TrackerRegistration = () => {
}); });
}; };
const { formData, validationErrors, handleChange, handleSubmit } = const {
useFormValidation( formData,
validationErrors,
handleChange,
handleSubmit,
} = useFormValidation(
apiEndpoint, apiEndpoint,
fields, fields,
showNotificationError, showNotificationError,
showNotificationTrue showNotificationTrue,
isPartner,
setLoader,
); );
return ( return (
<div className="tracker-registration"> <div className="tracker-registration">
<AuthHeader /> <AuthHeader />
@ -115,17 +124,19 @@ export const TrackerRegistration = () => {
</div> </div>
</div> </div>
<div className="tracker-registration__form__submit"> <div className="tracker-registration__form__submit">
<button {loader ? (
<Loader />
) : (
<BaseButton
onClick={async (e) => { onClick={async (e) => {
e.preventDefault(); e.preventDefault();
const result = await handleSubmit(e); await handleSubmit(e);
if (result === true) {
setModalConfirm(true);
}
}} }}
styles="button-box__submit"
> >
Отправить Отправить
</button> </BaseButton>
)}
<div className="tracker-registration__form__info"> <div className="tracker-registration__form__info">
<img src={authImg} alt="img" /> <img src={authImg} alt="img" />
<p> <p>

View File

@ -56,7 +56,7 @@
font-size: 18px; font-size: 18px;
color: #fff; color: #fff;
border: none; border: none;
margin-right: 165px; max-width: 170px;
} }
@media (max-width: 1000px) { @media (max-width: 1000px) {
@ -68,10 +68,15 @@
align-items: start; align-items: start;
row-gap: 35px; row-gap: 35px;
} }
.loader {
max-width: 170px;
}
} }
&__info { &__info {
display: flex; display: flex;
margin-left: 165px;
align-items: center; align-items: center;
img { img {
margin-right: 31px; margin-right: 31px;