"use client";

import { signIn, useSession } from "next-auth/react";
import { useRouter } from "next/navigation";
import { useEffect } from "react";

export default function LoginPage() {
  const { data: session, status } = useSession();
  const router = useRouter();

  useEffect(() => {
    if (session?.user) router.replace("/settings");
  }, [session, router]);

  if (status === "loading") return null;

  return (
    <div style={{ display: "flex", justifyContent: "center", alignItems: "center", minHeight: "100vh" }}>
      <div className="card" style={{ textAlign: "center", maxWidth: 400 }}>
        <h1 className="mb-4">Gemmbot</h1>
        <p className="text-muted mb-6">Sign in with your Gemma Analytics Google account to manage your bot settings.</p>
        <button className="btn btn-primary" onClick={() => signIn("google", { callbackUrl: "/settings" })}>
          Sign in with Google
        </button>
      </div>
    </div>
  );
}