import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { RefreshCw, AlertTriangle, ChevronDown } from "lucide-react";
import { cn } from "../../../lib/utils";
/**
 * Displays queue errors with retry functionality
 */
export function QueueErrorsDisplay({ queueStatus, showQueueErrors, onToggleErrors, onRetryFailed, isRetryingFailed, retryFailedMessage, }) {
    return (_jsxs("div", { className: "rounded-lg border border-red-200 bg-red-50 p-3", children: [_jsxs("button", { className: "flex w-full cursor-pointer items-center justify-between text-sm", onClick: onToggleErrors, children: [_jsxs("div", { className: "flex items-center gap-2 font-medium text-red-700", children: [_jsx(AlertTriangle, { className: "h-4 w-4", strokeWidth: 1 }), queueStatus.errorCount, " error", queueStatus.errorCount !== 1 ? "s" : "", " during embedding generation"] }), _jsx(ChevronDown, { className: cn("h-4 w-4 text-red-600 transition-transform duration-200", showQueueErrors ? "rotate-180" : ""), strokeWidth: 1 })] }), _jsxs("div", { className: "mt-2 flex flex-wrap items-center gap-2 border-t border-red-200 pt-2", children: [_jsxs("button", { onClick: onRetryFailed, disabled: isRetryingFailed, className: "flex items-center gap-2 rounded bg-red-600 px-3 py-1.5 text-sm font-medium text-white hover:bg-red-700", children: [_jsx(RefreshCw, { className: cn("h-4 w-4", isRetryingFailed ? "animate-spin" : ""), strokeWidth: 1 }), _jsxs("div", { className: "flex flex-col items-start", children: [isRetryingFailed ? "Retrying..." : "Retry", " ", _jsx("div", { className: "text-xs text-white", children: "Re-queues failed items so they can be processed again." })] })] }), retryFailedMessage && (_jsx("div", { className: "text-xs text-red-700", children: retryFailedMessage }))] }), showQueueErrors && (_jsx("ul", { className: "mt-2 space-y-1", children: queueStatus.recentErrors.map((error, idx) => (_jsx("li", { className: "truncate text-xs text-red-600", title: error, children: error }, idx))) }))] }));
}
//# sourceMappingURL=QueueErrorsDisplay.js.map