import { Save } from "lucide-react";

interface SaveButtonProps {
  onClick: () => void;
  disabled: boolean;
  saving: boolean;
  /** Button label when not saving. Default: "Save order" */
  label?: string;
}

export function SaveButton({ onClick, disabled, saving, label = "Save order" }: SaveButtonProps) {
  return (
    <button
      type="button"
      onClick={onClick}
      className="inline-flex items-center gap-2 rounded-lg border border-[#428B4D]/40 bg-white px-3 py-1.5 text-xs font-semibold text-slate-700 hover:bg-[#428B4D] hover:text-white transition-all duration-200 disabled:opacity-60"
      disabled={disabled}
    >
      <Save className="h-4 w-4" />
      {saving ? "Saving…" : label}
    </button>
  );
}