'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { ShieldCheck, CaretRight, Sliders, Code, ListBullets } from '@phosphor-icons/react';
import { cn } from '@/lib/utils';
export function ResponseOptionsCard({ errorType, actions }) {
    // Build list of actions based on error type
    const actionButtons = [];
    // Auth errors
    if (errorType === 'auth') {
        if (actions?.onOpenGlobalAuth) {
            actionButtons.push({
                id: 'global-auth',
                icon: ShieldCheck,
                iconColor: 'text-green-600',
                bgColor: 'bg-green-500/10',
                hoverBorder: 'hover:border-green-500/30',
                title: 'Set Global Auth',
                description: 'Configure API credentials for all requests',
                onClick: actions.onOpenGlobalAuth
            });
        }
        if (actions?.onNavigateToAuthTab) {
            actionButtons.push({
                id: 'auth-tab',
                icon: ShieldCheck,
                iconColor: 'text-blue-600',
                bgColor: 'bg-blue-500/10',
                hoverBorder: 'hover:border-blue-500/30',
                title: 'Go to Authorization Tab',
                description: 'Set auth for this specific request',
                onClick: actions.onNavigateToAuthTab
            });
        }
    }
    // Missing params errors
    if (errorType === 'missing_params' || errorType === 'validation') {
        if (actions?.onNavigateToParamsTab) {
            actionButtons.push({
                id: 'params-tab',
                icon: Sliders,
                iconColor: 'text-purple-600',
                bgColor: 'bg-purple-500/10',
                hoverBorder: 'hover:border-purple-500/30',
                title: 'Go to Parameters Tab',
                description: 'Check and fill in required parameters',
                onClick: actions.onNavigateToParamsTab
            });
        }
    }
    // Invalid body errors
    if (errorType === 'invalid_body' || errorType === 'validation') {
        if (actions?.onNavigateToBodyTab) {
            actionButtons.push({
                id: 'body-tab',
                icon: Code,
                iconColor: 'text-amber-600',
                bgColor: 'bg-amber-500/10',
                hoverBorder: 'hover:border-amber-500/30',
                title: 'Go to Body Tab',
                description: 'Review and fix the request body',
                onClick: actions.onNavigateToBodyTab
            });
        }
    }
    // Missing headers errors
    if (errorType === 'missing_headers') {
        if (actions?.onNavigateToHeadersTab) {
            actionButtons.push({
                id: 'headers-tab',
                icon: ListBullets,
                iconColor: 'text-cyan-600',
                bgColor: 'bg-cyan-500/10',
                hoverBorder: 'hover:border-cyan-500/30',
                title: 'Go to Headers Tab',
                description: 'Add required request headers',
                onClick: actions.onNavigateToHeadersTab
            });
        }
    }
    // Don't render if no actions
    if (actionButtons.length === 0) {
        return null;
    }
    return /*#__PURE__*/ _jsx("div", {
        className: cn("fade-in slide-in-from-bottom-1 animate-in duration-150", "mx-auto w-full max-w-[var(--thread-max-width)] px-2 py-2"),
        children: /*#__PURE__*/ _jsxs("div", {
            className: "space-y-2",
            children: [
                /*#__PURE__*/ _jsx("p", {
                    className: "text-xs font-medium text-muted-foreground px-1 mb-3",
                    children: "Suggested Actions"
                }),
                actionButtons.map((action)=>/*#__PURE__*/ _jsxs("button", {
                        onClick: action.onClick,
                        className: cn("w-full flex items-center gap-3 p-3 rounded-lg border border-border", "bg-muted/30 hover:bg-muted/60 transition-all group text-left", action.hoverBorder),
                        children: [
                            /*#__PURE__*/ _jsx("div", {
                                className: cn("shrink-0 w-8 h-8 rounded-md flex items-center justify-center", action.bgColor),
                                children: /*#__PURE__*/ _jsx(action.icon, {
                                    className: cn("h-4 w-4", action.iconColor),
                                    weight: "bold"
                                })
                            }),
                            /*#__PURE__*/ _jsxs("div", {
                                className: "flex-1 min-w-0",
                                children: [
                                    /*#__PURE__*/ _jsx("p", {
                                        className: "text-sm font-medium text-foreground",
                                        children: action.title
                                    }),
                                    /*#__PURE__*/ _jsx("p", {
                                        className: "text-xs text-muted-foreground truncate",
                                        children: action.description
                                    })
                                ]
                            }),
                            /*#__PURE__*/ _jsx(CaretRight, {
                                className: "shrink-0 h-4 w-4 text-muted-foreground group-hover:text-foreground transition-colors",
                                weight: "bold"
                            })
                        ]
                    }, action.id))
            ]
        })
    });
}
// Helper to determine error type from status and response body
export function detectErrorType(status, responseBody) {
    const lowerBody = responseBody.toLowerCase();
    // Auth errors (401, 403)
    if (status === 401 || status === 403) return 'auth';
    if (lowerBody.includes('unauthorized') || lowerBody.includes('authentication') || lowerBody.includes('api key') || lowerBody.includes('api_key') || lowerBody.includes('token') || lowerBody.includes('credentials') || lowerBody.includes('forbidden')) {
        return 'auth';
    }
    // Missing parameters
    if (lowerBody.includes('missing') && (lowerBody.includes('param') || lowerBody.includes('query')) || lowerBody.includes('required parameter') || lowerBody.includes('required field') || lowerBody.includes('parameter is required')) {
        return 'missing_params';
    }
    // Invalid body
    if (lowerBody.includes('invalid json') || lowerBody.includes('parse error') || lowerBody.includes('body') && (lowerBody.includes('invalid') || lowerBody.includes('malformed')) || lowerBody.includes('request body') || lowerBody.includes('payload')) {
        return 'invalid_body';
    }
    // Missing headers
    if (lowerBody.includes('missing header') || lowerBody.includes('required header') || lowerBody.includes('header') && lowerBody.includes('required') || lowerBody.includes('content-type')) {
        return 'missing_headers';
    }
    // Generic validation errors (400, 422)
    if (status === 400 || status === 422) return 'validation';
    // Not found
    if (status === 404) return 'not_found';
    // Server errors
    if (status >= 500) return 'server';
    return 'generic';
}
