"use client";

import { useTransition } from "react";
import { markOrderCompletedAction } from "@/lib/actions/admin";

export function MarkOrderCompletedButton({ orderId, tag }: { orderId: string; tag: string }) {
  const [pending, startTransition] = useTransition();

  if (tag.startsWith("done_")) {
    return (
      <span className="inline-flex items-center gap-1.5 text-xs text-emerald-400">
        ✓ Auftrag abgeschlossen
      </span>
    );
  }

  return (
    <button
      disabled={pending}
      onClick={() => {
        if (confirm("Auftrag als abgeschlossen markieren? Der Kunde sieht das sofort und bekommt eine Feedback-Anfrage per E-Mail.")) {
          startTransition(() => markOrderCompletedAction(orderId));
        }
      }}
      className="text-xs border border-emerald-400/40 text-emerald-400 rounded-full px-3 py-1.5 hover:border-emerald-400 hover:bg-emerald-400/5 transition-colors disabled:opacity-50"
    >
      ✓ Auftrag abschließen
    </button>
  );
}