import { jsxs, jsx } from 'react/jsx-runtime';
import { ExclamationCircleIcon } from '@heroicons/react/24/outline';
import { cn } from '../../../utils/cn.js';
import { streamingResponseTheme } from './StreamingResponse.theme.js';

/**
 * Get user-friendly title for error type
 */
const getErrorTitle = (type) => {
    switch (type) {
        case 'network':
            return 'Connection Error';
        case 'timeout':
            return 'Request Timeout';
        case 'parse':
            return 'Invalid Response';
        case 'server':
            return 'Server Error';
        case 'abort':
            return 'Cancelled';
        default:
            return 'Error';
    }
};
/**
 * ErrorDisplay component for showing streaming errors
 * Displays error icon, title, message, and retry button (if retryable)
 */
const ErrorDisplay = ({ error, onRetry, retryAttempt, maxAttempts, className, }) => {
    const canRetry = error.retryable && retryAttempt < maxAttempts;
    return (jsxs("div", { className: cn(streamingResponseTheme.errorContainerStyle, className), role: "alert", "aria-live": "assertive", children: [jsx(ExclamationCircleIcon, { className: "size-5 text-[var(--color-danger)] flex-shrink-0" }), jsxs("div", { className: "flex-1", children: [jsx("p", { className: cn(streamingResponseTheme.errorTitleStyle), children: getErrorTitle(error.type) }), jsx("p", { className: cn(streamingResponseTheme.errorMessageStyle), children: error.message }), canRetry && (jsxs("button", { onClick: onRetry, className: cn(streamingResponseTheme.errorRetryButtonStyle), type: "button", children: ["Retry (", retryAttempt + 1, "/", maxAttempts, ")"] }))] })] }));
};
ErrorDisplay.displayName = 'ErrorDisplay';

export { ErrorDisplay };
