"use client";

import { useRouter } from "next/navigation";
import { LogOutIcon } from "lucide-react";
import { DropdownMenuItem } from "@/components/ui/dropdown-menu";
import { Button } from "@/components/ui/button";
import { authClient } from "@/lib/auth/client";
import { unsubscribeCommissionPush } from "@/components/commission/push-client";

export function SignOutButton({
  admin = false,
  menuItem = false,
}: {
  admin?: boolean;
  menuItem?: boolean;
}) {
  const router = useRouter();
  const { data } = authClient.useSession();
  if (!admin && !data?.user) return null;

  async function signOut() {
    await unsubscribeCommissionPush().catch(() => undefined);
    await authClient.signOut();
    router.push(admin ? "/auth/login?next=%2Fadmin" : "/");
    router.refresh();
  }

  if (menuItem)
    return (
      <DropdownMenuItem onClick={() => void signOut()}>
        <LogOutIcon/>
       <span className="text-red-400">ออกจากระบบ</span>
      </DropdownMenuItem>
    );

  return (
    <Button
      type="button"
      variant="ghost"
      size="icon-sm"
      aria-label="ออกจากระบบ"
      onClick={() => void signOut()}
    >
      <LogOutIcon />
    </Button>
  );
}