import { Loader2, CheckCircle, XCircle } from "lucide-react";
export const SeleniumTaskBanner = ({ status, message, show, onClear, }) => {
    if (!show)
        return null;
    const getIcon = () => {
        switch (status) {
            case "pending":
                return <Loader2 className="w-5 h-5 animate-spin text-blue-500"/>;
            case "success":
                return <CheckCircle className="w-5 h-5 text-green-500"/>;
            case "error":
                return <XCircle className="w-5 h-5 text-red-500"/>;
            default:
                return null;
        }
    };
    return (<div className="bg-white border border-gray-200 shadow-md rounded-lg p-3 m-4 flex items-start justify-between">
      <div className="flex items-start gap-3">
        {getIcon()}
        <div>
          <div className="font-medium text-gray-800">
            {status === "pending"
            ? "Task In Progress"
            : status === "success"
                ? "Task Completed"
                : "Task Error"}
          </div>
          <p className="text-gray-600 text-sm">{message}</p>
        </div>
      </div>
      <button onClick={onClear} className="text-sm text-gray-500 hover:text-gray-800">
        ✕
      </button>
    </div>);
};