"use client";

import {useTransition} from "react";
import {useRouter} from "next/navigation";
import {Button} from "@/components/ui/button";
import {toggleCouponActive} from "@/features/coupons/server/actions";

export function CouponToggle({couponId, tenantSlug, isActive}: {couponId: string; tenantSlug: string; isActive: boolean}) {
  const router = useRouter();
  const [isPending, startTransition] = useTransition();

  async function handleToggle() {
    await toggleCouponActive(couponId, tenantSlug, !isActive);
    startTransition(() => router.refresh());
  }

  return (
    <Button
      size="sm"
      variant="outline"
      disabled={isPending}
      onClick={handleToggle}
      className={isActive ? "border-slate-300 text-slate-600" : "border-green-300 text-green-700"}
    >
      {isActive ? "Deactivate" : "Activate"}
    </Button>
  );
}