// components/LogoutButton.js
"use client";

import { Button } from "@nextui-org/react";
import { useRouter } from "next/navigation";
import { useState } from "react";

export default function LogoutButton() {
	const [isLoadingLogout, setIsLoadingLogout] = useState(false);
	const router = useRouter();

	const handleLogout = async () => {
		setIsLoadingLogout(true);
		try {
			const response = await fetch("/api/auth/logout", {
				method: "GET",
			});
			if (response.ok) {
				router.push("/logout");
			}
		} finally {
			setIsLoadingLogout(false);
		}
	};

	return (
		<Button
			color="primary"
			variant="faded"
			isLoading={isLoadingLogout}
			onPress={handleLogout}
			size="sm"
			className="text-black hover:bg-orange-300 hover:text-orange-800"
			radius="full"
		>
			{isLoadingLogout ? "Wird abgemeldet..." : "Logout"}
		</Button>
	);
}