'use client'

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 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 RegisterPage