add adaptive registationForCandidate,

modalRegistration,
create hook useFormValidation,
add Validation in registationForCandidate

src/pages/RegistrationForCandidate/RegistrationForCandidate.js

@@ -1,5 +1,7 @@
 import React from "react";
 
+import { useFormValidation } from "@hooks/useFormValidation";
+
 import AuthHeader from "@components/Common/AuthHeader/AuthHeader";
 import { Footer } from "@components/Common/Footer/Footer";
 import SideBar from "@components/SideBar/SideBar";
@@ -11,6 +13,7 @@ import BackEndImg from "assets/images/partnerProfile/personalBackEnd.svg";
 import "./registationForCandidate.scss";
 
 export const RegistrationForCandidate = () => {
+  const form = useFormValidation();
   return (
     <div className="registrationCandidate">
       <AuthHeader />
@@ -23,7 +26,7 @@ export const RegistrationForCandidate = () => {
             <img src={arrowBtn}></img>
           </div>
           <p className="auth-candidate__start__description">
-            Для нас не имеет значение Ваша локация.
+            Для нас не имеет значения Ваша локация.
           </p>
           <StepsForCandidate step="шаг 2 - заполните данные" />
           <div className="registrationCandidate__formWrapper">
@@ -39,33 +42,87 @@ export const RegistrationForCandidate = () => {
                 <img src={arrowBtn} alt="img" />
               </div>
             </div>
-            <form className="registrationCandidate__form">
+            {/* форма регистрации */}
+            <form
+              className="registrationCandidate__form"
+              onSubmit={form.handleSubmit}
+            >
               <div className="registrationCandidate__form__input">
                 <label htmlFor="name">Ваше имя</label>
-                <input id="name" type="text" placeholder="Имя" />
+                <input
+                  className={form.validationErrors.name ? "error" : ""}
+                  value={form.formData.name}
+                  onChange={form.handleChange}
+                  id="name"
+                  type="text"
+                  placeholder="Имя"
+                />
+                <span>{form.validationErrors.name}</span>
               </div>
               <div className="registrationCandidate__form__input">
                 <label htmlFor="summary">Если есть ссылка на резюме</label>
-                <input id="summary" type="text" placeholder="Резюме" />
+                <input
+                  className={form.validationErrors.summary ? "error" : ""}
+                  value={form.formData.summary}
+                  onChange={form.handleChange}
+                  id="summary"
+                  type="url"
+                  placeholder="Резюме"
+                />
+                <span>{form.validationErrors.summary}</span>
               </div>
               <div className="registrationCandidate__form__input">
                 <label htmlFor="email">Ваш e-mail</label>
-                <input id="email" type="text" placeholder="E-mail" />
+                <input
+                  className={form.validationErrors.email ? "error" : ""}
+                  value={form.formData.email}
+                  onChange={form.handleChange}
+                  id="email"
+                  type="email"
+                  placeholder="E-mail"
+                />
+                <span>{form.validationErrors.email}</span>
               </div>
               <div className="registrationCandidate__form__input">
                 <label htmlFor="tg">Ваш telegram</label>
-                <input id="tg" type="text" placeholder="Telegram" />
+                <input
+                  className={form.validationErrors.tg ? "error" : ""}
+                  value={form.formData.tg}
+                  onChange={form.handleChange}
+                  id="tg"
+                  type="text"
+                  placeholder="Telegram"
+                />
+                <span>{form.validationErrors.tg}</span>
               </div>
               <div className="registrationCandidate__form__input">
                 <label htmlFor="password">Придумайте пароль</label>
-                <input id="password" type="text" placeholder="Пароль" />
+                <input
+                  className={form.validationErrors.password ? "error" : ""}
+                  value={form.formData.password}
+                  onChange={form.handleChange}
+                  id="password"
+                  type="password"
+                  placeholder="Пароль"
+                />
+                <span>{form.validationErrors.password}</span>
               </div>
               <div className="registrationCandidate__form__input">
                 <label htmlFor="secondPassword">Повторите пароль</label>
-                <input id="secondPassword" type="text" placeholder="Пароль" />
+                <input
+                  className={
+                    form.validationErrors.secondPassword ? "error" : ""
+                  }
+                  value={form.formData.secondPassword}
+                  onChange={form.handleChange}
+                  id="secondPassword"
+                  type="password"
+                  placeholder="Пароль"
+                />
+                <span>{form.validationErrors.secondPassword}</span>
               </div>
               <div className="registrationCandidate__form__submit">
-                <button>Отправить</button>
+                <button type="submit">Отправить</button>
               </div>
             </form>
           </div>

src/pages/RegistrationForCandidate/registationForCandidate.scss

@@ -142,6 +142,15 @@
         font-size: 15px;
         line-height: 18px;
       }
+
+      .error {
+        border: 1px solid red;
+      }
+
+      span {
+        color: red;
+        font-size: 12px;
+      }
     }
 
     &__submit {