route handler + client register ui

frontend/app/(urls)/register/admin/page.tsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const page = () => {
+  return <div>page</div>
+}
+
+export default page

frontend/app/(urls)/register/components/ClientRegistrationForm.tsx

@@ -0,0 +1,150 @@
+import React from 'react'
+import Link from 'next/link'
+import { useForm } from '@/app/hooks/useForm'
+import Button from '@/components/ui/Button'
+// import LoginButton from '@/app/components/ui/LoginButton'
+import showToast from '@/components/ui/Toast'
+import { useRouter } from 'next/navigation'
+import { signIn } from 'next-auth/react'
+import TextInput from '@/components/ui/TextInput'
+import PhoneInput from '@/components/ui/PhoneInput'
+
+const validationRules = {
+  name: { required: true },
+  surname: { required: true },
+  phone_number: {
+    required: true,
+    minLength: 11,
+  },
+  password: { required: true, minLength: 8 },
+  privacy_accepted: { required: true },
+}
+
+export default function ClientRegistrationForm() {
+  const router = useRouter()
+  const {
+    values,
+    isVisible,
+    handleChange,
+    handleSubmit,
+    togglePasswordVisibility,
+  } = useForm(
+    {
+      name: '',
+      surname: '',
+      email: '',
+      phone_number: '',
+      password: '',
+      privacy_accepted: false,
+    },
+    validationRules,
+    async (values) => {
+      try {
+        const result = await signIn('register-credentials', {
+          email: values.email,
+          password: values.password,
+          username: values.name,
+          phone_number: values.phone_number,
+          privacy_accepted: values.privacy_accepted.toString(),
+          redirect: false,
+        })
+
+        if (result?.error) {
+          showToast({ type: 'error', message: result.error })
+          return
+        }
+
+        showToast({ type: 'success', message: 'Регистрация успешна!' })
+        router.push('/account')
+      } catch {
+        showToast({ type: 'error', message: 'Ошибка при регистрации' })
+      }
+    }
+  )
+
+  return (
+    <>
+      <form className="flex flex-col gap-1" onSubmit={handleSubmit}>
+        <div className="mb-2 space-y-4">
+          <TextInput
+            value={values.name}
+            name="name"
+            handleChange={handleChange}
+            placeholder="Иван"
+            style="register"
+            label="Ваше имя"
+          />
+
+          <TextInput
+            value={values.surname}
+            name="surname"
+            handleChange={handleChange}
+            placeholder="Иванов"
+            style="register"
+            label="Ваша фамилия"
+          />
+
+          <TextInput
+            value={values.email}
+            name="email"
+            handleChange={handleChange}
+            placeholder="my_email@gmail.com"
+            style="register"
+            label="Ваш еmail"
+          />
+          <PhoneInput
+            value={values.phone_number}
+            handleChange={handleChange}
+            operatorsInfo={false}
+          />
+
+          <TextInput
+            value={values.password}
+            name="password"
+            handleChange={handleChange}
+            placeholder="Не менее 8 символов"
+            style="register"
+            label="Ваш пароль"
+            isPassword={true}
+            isVisible={isVisible}
+            togglePasswordVisibility={togglePasswordVisibility}
+          />
+        </div>
+
+        <div className="pb-2 flex items-start">
+          <input
+            type="checkbox"
+            id="privacy_accepted"
+            name="privacy_accepted"
+            onChange={handleChange}
+            checked={values.privacy_accepted}
+            className="mt-1 cursor-pointer"
+          />
+          <label
+            htmlFor="privacy_accepted"
+            className="px-2 cursor-pointer select-none text-gray-700"
+          >
+            Даю согласие на обработку моих{' '}
+            <Link
+              href="/privacy-policy"
+              className="text-orange/60 hover:underline"
+            >
+              персональных данных.
+            </Link>
+          </label>
+        </div>
+        <Button
+          text="Зарегистрироваться"
+          className="flex items-center justify-center bg-black text-white rounded-2xl py-3"
+          type="submit"
+        />
+      </form>
+      <div className="flex items-center gap-4">
+        <div className="flex-1 border-t border-gray-300" />
+        <p className="shrink-0 px-2 text-gray-500">Или</p>
+        <div className="flex-1 border-t border-gray-300" />
+      </div>
+      {/* <LoginButton /> */}
+    </>
+  )
+}

frontend/app/(urls)/register/page.tsx

@@ -1,7 +1,47 @@
-import React from 'react'
+'use client'
 
-const page = () => {
-  return <div>page</div>
+import React, { useState, useEffect } from 'react'
+import Link from 'next/link'
+import { useRouter } from 'next/navigation'
+import useUserStore from '@/app/store/userStore'
+import ClientRegistrationForm from './components/ClientRegistrationForm'
+
+const RegisterPage = () => {
+  const router = useRouter()
+  const { isAuthenticated } = useUserStore()
+  const [isClient, setIsClient] = useState(true)
+
+  useEffect(() => {
+    // проверяем логин
+    if (isAuthenticated) {
+      // распределяем
+      if (!isClient) {
+        router.replace('/admin')
+      } else {
+        router.replace('/account')
+      }
+      return
+    }
+  }, [isAuthenticated, router, isClient])
+
+  return (
+    <div className="flex items-center justify-center p-12">
+      <div className="flex w-full max-w-xl md:max-w-3xl lg:max-w-3xl flex-col gap-4 bg-white rounded-2xl shadow-lg p-6">
+        <h1 className="text-2xl text-center py-1">
+          Давайте познакомимся поближе!
+        </h1>
+
+        <ClientRegistrationForm />
+
+        <p className="text-center">
+          Уже есть аккаунт?{' '}
+          <span className="text-orange/60 hover:underline">
+            <Link href="/login">Войти</Link>
+          </span>
+        </p>
+      </div>
+    </div>
+  )
 }
 
-export default page
+export default RegisterPage