Add sigh up layout

src/widgets/forms/SignUpForm.tsx

@@ -0,0 +1,153 @@
+"use client";
+
+import { useState } from "react";
+import { AxiosError } from "axios";
+import AuthInput from "@/features/AuthInput";
+import Loader from "@/shared/ui/Loader/Loader";
+import { apiInstance } from "@/shared/config/apiConfig";
+import { Link, useRouter } from "@/shared/config/navigation";
+
+const SignUpForm = () => {
+  const [checkbox, setCheckbox] = useState<boolean>(false);
+  const [emailWarning, setEmailWarning] = useState<string>("");
+  const [passwordWarning, setPasswordWarning] = useState<string>("");
+  const [passwordConfirmWarning, setPasswordConfirmWarning] =
+    useState<string>("");
+  const [error, setError] = useState<string>("");
+  const [loader, setLoader] = useState<boolean>(false);
+
+  const router = useRouter();
+
+  const handleSubmit: React.MouseEventHandler<HTMLFormElement> = async (e) => {
+    e.preventDefault();
+    const formData = new FormData(e.currentTarget);
+    const regex = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])/;
+
+    if (!formData.get("email")?.toString()) {
+      setError("");
+      setPasswordWarning("");
+      setPasswordConfirmWarning("");
+      setEmailWarning("Заполните поле Email");
+      return;
+    }
+
+    if (!formData.get("password")?.toString()) {
+      setError("");
+      setEmailWarning("");
+      setPasswordConfirmWarning("");
+      setPasswordWarning("Заполните поле Пароль");
+      return;
+    }
+
+    if ((formData.get("password")?.toString().length as number) < 8) {
+      setError("");
+      setEmailWarning("");
+      setPasswordConfirmWarning("");
+      setPasswordWarning("Пароль должен содержать минимум 8 символов");
+      return;
+    }
+
+    if (!regex.test(formData.get("password")?.toString() as string)) {
+      setError("");
+      setEmailWarning("");
+      setPasswordConfirmWarning("");
+      setPasswordWarning(
+        "Пароль должен содержать по меньшей мере 1 прописную букву, одну заглавную букву и одну цифру"
+      );
+      return;
+    }
+
+    if (!formData.get("password2")?.toString()) {
+      setError("");
+      setEmailWarning("");
+      setPasswordWarning("");
+      setPasswordConfirmWarning("Заполните поле потверждения");
+      return;
+    }
+
+    if (
+      formData.get("password")?.toString() !==
+      formData.get("password2")?.toString()
+    ) {
+      setError("");
+      setEmailWarning("");
+      setPasswordWarning("");
+      setPasswordConfirmWarning("Пароли не совпадают");
+      return;
+    }
+
+    if (!checkbox) {
+      setEmailWarning("");
+      setPasswordWarning("");
+      setPasswordConfirmWarning("");
+      setError("Необходимо принять политику конфиденциальности");
+      return;
+    }
+
+    try {
+      setError("");
+      setEmailWarning("");
+      setPasswordWarning("");
+      setPasswordConfirmWarning("");
+      setLoader(true);
+
+      const res = await apiInstance.post("/users/register/", formData);
+
+      if ([200, 201].includes(res.status)) {
+        router.push(`/sign-up/confirm-email/?email=${formData.get("email")}`);
+      }
+    } catch (error: unknown) {
+      if (error instanceof AxiosError) {
+        if ([401, 400].includes(error.response?.status as number)) {
+          setError("Такой пользователь уже существует");
+        } else if (error.response?.status.toString().slice(0, 1) === "5") {
+          setError("Ошибка на стороне сервера");
+        }
+      } else {
+        setError("Непредвиденная ошибка");
+      }
+    } finally {
+      setLoader(false);
+    }
+  };
+
+  return (
+    <form className="mb-2 w-[360px] flex flex-col" onSubmit={handleSubmit}>
+      <div className="flex flex-col gap-5">
+        <AuthInput
+          type="email"
+          label="Email"
+          placeholder="Введите email"
+          error={emailWarning}
+          name="email"
+        />
+        <AuthInput
+          isPassword
+          label="Пароль"
+          placeholder="Введите пароль"
+          error={passwordWarning}
+          name="password"
+        />
+        <AuthInput
+          isPassword
+          label="Пароль потверждения"
+          placeholder="Повторите пароль"
+          error={passwordConfirmWarning}
+          name="password2"
+        />
+      </div>
+      {error ? <p className="text-sm leading-5 text-red-500">{error}</p> : null}
+
+      <div className="flex flex-col mt-[36px] gap-4">
+        <button
+          className="p-4 h-[50px] w-full font-bold leading-6 text-white bg-light-blue rounded-md"
+          type="submit"
+        >
+          {loader ? <Loader /> : "Зарегистрироваться"}
+        </button>
+      </div>
+    </form>
+  );
+};
+
+export default SignUpForm;

src/widgets/forms/icons/check.svg

@@ -0,0 +1,7 @@
+<svg width="15.007812" height="10.834961" viewBox="0 0 15.0078 10.835" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+	<desc>
+			Created with Pixso.
+	</desc>
+	<defs/>
+	<path id="Icon" d="M14.1699 0.835938L5.00391 10.0029L0.836914 5.83594" stroke="#3695D8" stroke-opacity="1.000000" stroke-width="1.666667" stroke-linejoin="round" stroke-linecap="round"/>
+</svg>