Add registration and data caching

src/app/@auth/(.)registration/page.tsx

@@ -0,0 +1,88 @@
+"use client";
+
+import {
+  RegistrationFormType,
+  registrationFormFieldNames,
+  RegistrationFormFields,
+  registrationFormSchema,
+} from "@/entities/user";
+import { UserService } from "@/entities/user/user";
+import { Modal } from "@/shared/ui";
+import { zodResolver } from "@hookform/resolvers/zod";
+import Link from "next/link";
+import { useRouter } from "next/navigation";
+import { SubmitHandler, useForm } from "react-hook-form";
+import { mutate } from "swr";
+
+export default function Registration() {
+  const {
+    register,
+    handleSubmit,
+    setError,
+    formState: { errors },
+  } = useForm<RegistrationFormType>({
+    resolver: zodResolver(registrationFormSchema),
+  });
+
+  const router = useRouter();
+
+  const onSubmit: SubmitHandler<RegistrationFormType> = async (data) => {
+    const userInfo = await UserService.Registration(data);
+    mutate("user", userInfo);
+    if (userInfo) router.back();
+    else setError("root", { message: "Некорректные данные" });
+  };
+
+  return (
+    <Modal>
+      <div className="">
+        <form
+          onSubmit={handleSubmit(onSubmit)}
+          className="flex flex-col items-center justify-evenly"
+        >
+          <h2 className="pb-4 text-4xl">.Torrent</h2>
+          {(
+            Object.keys(registrationFormFieldNames) as RegistrationFormFields[]
+          ).map((field) => (
+            <label
+              className="flex flex-col items-start relative w-64 py-1"
+              key={field}
+            >
+              <input
+                {...register(field)}
+                className="peer/search w-full rounded-lg bg-bg4 px-2 h-10"
+                placeholder=" "
+                autoComplete="off"
+              />
+              <span
+                className="peer-focus/search:opacity-0 
+                  				peer-[:not(:placeholder-shown)]/search:opacity-0 
+                  				transition-opacity h-0 flex items-center relative bottom-5 left-4
+								text-lg"
+              >
+                {registrationFormFieldNames[field]}
+              </span>
+              <p className="text-sm text-err w-full text-center">
+                {errors[field]?.message}
+              </p>
+            </label>
+          ))}
+          {errors.root && (
+            <p className="text-sm text-err w-full text-center">
+              {errors.root.message}
+            </p>
+          )}
+
+          <input
+            type="submit"
+            value="Зарегестрироваться"
+            className="bg-ac0 mt-2 p-1 px-4 rounded-lg"
+          />
+          <Link href="/login" replace={true} className="text-xs pt-2">
+            Или <span className="hover:underline">войти</span>
+          </Link>
+        </form>
+      </div>
+    </Modal>
+  );
+}