import React, { useEffect } from "react";
import { Link, useNavigate } from "react-router-dom";
import { useAuth } from "@/contexts/auth";
import LoginForm from "@/components/auth/LoginForm";
import { useLogin } from "@/hooks/useLogin";
const Login = () => {
  const {
    email,
    setEmail,
    password,
    setPassword,
    showPassword,
    setShowPassword,
    isLoading,
    isSettingUpTables,
    loginError,
    setLoginError,
    handleLogin
  } = useLogin();
  const navigate = useNavigate();
  const {
    user
  } = useAuth();

  // 이미 로그인된 경우 메인 페이지로 리다이렉트
  useEffect(() => {
    if (user) {
      navigate("/");
    }
  }, [user, navigate]);
  return <div className="min-h-screen flex flex-col items-center justify-center p-6 bg-neuro-background">
      <div className="w-full max-w-md">
        <div className="text-center mb-8">
          <h1 className="text-3xl font-bold text-neuro-income mb-2">젤리의 적자탈출</h1>
          <p className="text-gray-500">계정에 로그인하여 예산 관리를 시작하세요</p>
        </div>
        
        <LoginForm email={email} setEmail={setEmail} password={password} setPassword={setPassword} showPassword={showPassword} setShowPassword={setShowPassword} isLoading={isLoading} isSettingUpTables={isSettingUpTables} loginError={loginError} handleLogin={handleLogin} />
        
        <div className="text-center mb-4">
          <p className="text-gray-500">
            계정이 없으신가요?{" "}
            <Link to="/register" className="text-neuro-income font-medium hover:underline">
              회원가입
            </Link>
          </p>
        </div>
      </div>
    </div>;
};
export default Login;