"use client";

import { useEffect } from "react";
import { useRouter } from "next/navigation";

export default function LogoutPage() {
  const router = useRouter();

  useEffect(() => {
    // Sign out by calling the sign-out API endpoint
    fetch("/api/auth/sign-out", { method: "POST" })
      .then(() => {
        // Redirect to login after sign-out
        router.push("/login");
      })
      .catch(() => {
        // Even if sign-out fails, redirect to login
        router.push("/login");
      });
  }, [router]);

  return (
    <div className="min-h-screen flex items-center justify-center bg-stone-50">
      <div className="text-center">
        <div className="w-12 h-12 rounded-full border-4 border-stone-300 border-t-stone-600 animate-spin mx-auto mb-4" />
        <p className="text-stone-600">Signing out...</p>
      </div>
    </div>
  );
}