'use client';
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useState } from 'react';
import { CaretDown, CaretRight, Play } from '@phosphor-icons/react';
import { MethodBadge } from '../shared/method-badge';
import { MarkdownRenderer } from '../shared/markdown-renderer';
import { Badge } from '@/components/ui/badge';
import { Button } from '@/components/ui/button';
import { CodeViewer } from '../playground/code-editor';
import { ResponseSchema } from '../shared/schema-viewer';
import { CodeSnippetCompact } from '../playground/code-snippet';
import { useModeContext } from '@/lib/api-docs/code-editor';
// Collapsible section component
function CollapsibleSection({ title, children, defaultOpen = true }) {
    const [isOpen, setIsOpen] = useState(defaultOpen);
    return /*#__PURE__*/ _jsxs("div", {
        className: "docs-api-section border-b border-border",
        children: [
            /*#__PURE__*/ _jsxs("button", {
                onClick: ()=>setIsOpen(!isOpen),
                className: "docs-api-section-header w-full flex items-center justify-between p-4 hover:bg-muted/50 transition-colors",
                children: [
                    /*#__PURE__*/ _jsx("span", {
                        className: "font-semibold text-sm",
                        children: title
                    }),
                    isOpen ? /*#__PURE__*/ _jsx(CaretDown, {
                        className: "h-4 w-4 text-muted-foreground",
                        weight: "bold"
                    }) : /*#__PURE__*/ _jsx(CaretRight, {
                        className: "h-4 w-4 text-muted-foreground",
                        weight: "bold"
                    })
                ]
            }),
            isOpen && /*#__PURE__*/ _jsx("div", {
                className: "docs-api-section-content px-4 pb-4",
                children: children
            })
        ]
    });
}
export function RequestDetails({ request }) {
    const { switchToApiClient } = useModeContext();
    return /*#__PURE__*/ _jsxs("div", {
        className: "docs-api-endpoint h-full overflow-y-auto bg-background",
        children: [
            /*#__PURE__*/ _jsxs("div", {
                className: "docs-api-endpoint-header p-4 border-b border-border",
                children: [
                    /*#__PURE__*/ _jsxs("div", {
                        className: "flex items-center justify-between gap-2 mb-2",
                        children: [
                            /*#__PURE__*/ _jsxs("div", {
                                className: "flex items-center gap-2 min-w-0",
                                children: [
                                    /*#__PURE__*/ _jsx(MethodBadge, {
                                        method: request.method
                                    }),
                                    /*#__PURE__*/ _jsx("h2", {
                                        className: "docs-api-endpoint-name font-semibold text-lg truncate",
                                        children: request.name
                                    })
                                ]
                            }),
                            /*#__PURE__*/ _jsxs(Button, {
                                size: "sm",
                                onClick: ()=>switchToApiClient(),
                                className: "docs-button docs-button-try-it shrink-0",
                                children: [
                                    /*#__PURE__*/ _jsx(Play, {
                                        className: "h-3.5 w-3.5 mr-1.5",
                                        weight: "fill"
                                    }),
                                    "Try it out"
                                ]
                            })
                        ]
                    }),
                    /*#__PURE__*/ _jsx("code", {
                        className: "docs-api-path text-xs text-muted-foreground font-mono break-all",
                        children: request.endpoint
                    })
                ]
            }),
            /*#__PURE__*/ _jsx(CodeSnippetCompact, {
                request: request
            }),
            request.description?.trim() && /*#__PURE__*/ _jsx(CollapsibleSection, {
                title: "Description",
                defaultOpen: true,
                children: /*#__PURE__*/ _jsx("div", {
                    className: "text-sm text-muted-foreground",
                    children: /*#__PURE__*/ _jsx(MarkdownRenderer, {
                        content: request.description
                    })
                })
            }),
            request.params.length > 0 && /*#__PURE__*/ _jsx(CollapsibleSection, {
                title: "Parameters",
                defaultOpen: false,
                children: /*#__PURE__*/ _jsx("div", {
                    className: "border rounded-sm overflow-x-auto",
                    children: /*#__PURE__*/ _jsxs("table", {
                        className: "w-full text-sm min-w-[400px]",
                        children: [
                            /*#__PURE__*/ _jsx("thead", {
                                className: "bg-muted/50",
                                children: /*#__PURE__*/ _jsxs("tr", {
                                    children: [
                                        /*#__PURE__*/ _jsx("th", {
                                            className: "px-3 py-2 text-left text-xs font-semibold whitespace-nowrap",
                                            children: "Name"
                                        }),
                                        /*#__PURE__*/ _jsx("th", {
                                            className: "px-3 py-2 text-left text-xs font-semibold whitespace-nowrap",
                                            children: "Description"
                                        }),
                                        /*#__PURE__*/ _jsx("th", {
                                            className: "px-3 py-2 text-left text-xs font-semibold whitespace-nowrap",
                                            children: "Required"
                                        })
                                    ]
                                })
                            }),
                            /*#__PURE__*/ _jsx("tbody", {
                                children: request.params.map((param)=>/*#__PURE__*/ _jsxs("tr", {
                                        className: "border-t",
                                        children: [
                                            /*#__PURE__*/ _jsx("td", {
                                                className: "px-3 py-2 font-mono text-xs whitespace-nowrap",
                                                children: param.key
                                            }),
                                            /*#__PURE__*/ _jsx("td", {
                                                className: "px-3 py-2 text-xs text-muted-foreground",
                                                children: param.description || '-'
                                            }),
                                            /*#__PURE__*/ _jsx("td", {
                                                className: "px-3 py-2 text-xs whitespace-nowrap",
                                                children: param.active ? /*#__PURE__*/ _jsx(Badge, {
                                                    variant: "default",
                                                    className: "text-xs",
                                                    children: "Required"
                                                }) : /*#__PURE__*/ _jsx("span", {
                                                    className: "text-muted-foreground",
                                                    children: "Optional"
                                                })
                                            })
                                        ]
                                    }, param.key))
                            })
                        ]
                    })
                })
            }),
            request.headers.length > 0 && /*#__PURE__*/ _jsx(CollapsibleSection, {
                title: "Headers",
                defaultOpen: false,
                children: /*#__PURE__*/ _jsx("div", {
                    className: "border rounded-sm overflow-x-auto",
                    children: /*#__PURE__*/ _jsxs("table", {
                        className: "w-full text-sm min-w-[400px]",
                        children: [
                            /*#__PURE__*/ _jsx("thead", {
                                className: "bg-muted/50",
                                children: /*#__PURE__*/ _jsxs("tr", {
                                    children: [
                                        /*#__PURE__*/ _jsx("th", {
                                            className: "px-3 py-2 text-left text-xs font-semibold whitespace-nowrap",
                                            children: "Name"
                                        }),
                                        /*#__PURE__*/ _jsx("th", {
                                            className: "px-3 py-2 text-left text-xs font-semibold whitespace-nowrap",
                                            children: "Description"
                                        }),
                                        /*#__PURE__*/ _jsx("th", {
                                            className: "px-3 py-2 text-left text-xs font-semibold whitespace-nowrap",
                                            children: "Required"
                                        })
                                    ]
                                })
                            }),
                            /*#__PURE__*/ _jsx("tbody", {
                                children: request.headers.map((header)=>/*#__PURE__*/ _jsxs("tr", {
                                        className: "border-t",
                                        children: [
                                            /*#__PURE__*/ _jsx("td", {
                                                className: "px-3 py-2 font-mono text-xs whitespace-nowrap",
                                                children: header.key
                                            }),
                                            /*#__PURE__*/ _jsx("td", {
                                                className: "px-3 py-2 text-xs text-muted-foreground",
                                                children: header.description || '-'
                                            }),
                                            /*#__PURE__*/ _jsx("td", {
                                                className: "px-3 py-2 text-xs whitespace-nowrap",
                                                children: header.active ? /*#__PURE__*/ _jsx(Badge, {
                                                    variant: "default",
                                                    className: "text-xs",
                                                    children: "Required"
                                                }) : /*#__PURE__*/ _jsx("span", {
                                                    className: "text-muted-foreground",
                                                    children: "Optional"
                                                })
                                            })
                                        ]
                                    }, header.key))
                            })
                        ]
                    })
                })
            }),
            request.auth.authType !== 'none' && /*#__PURE__*/ _jsx(CollapsibleSection, {
                title: "Authentication",
                defaultOpen: false,
                children: /*#__PURE__*/ _jsxs("div", {
                    className: "border rounded-sm overflow-hidden",
                    children: [
                        request.auth.authType === 'basic' && /*#__PURE__*/ _jsxs(_Fragment, {
                            children: [
                                /*#__PURE__*/ _jsx("div", {
                                    className: "px-3 py-2 border-b bg-muted/30",
                                    children: /*#__PURE__*/ _jsxs("div", {
                                        className: "flex items-center gap-2",
                                        children: [
                                            /*#__PURE__*/ _jsx("span", {
                                                className: "font-semibold text-sm",
                                                children: "Basic Auth"
                                            }),
                                            /*#__PURE__*/ _jsx("span", {
                                                className: "text-xs text-orange-500 font-medium",
                                                children: "required"
                                            })
                                        ]
                                    })
                                }),
                                /*#__PURE__*/ _jsxs("div", {
                                    className: "p-3 space-y-2",
                                    children: [
                                        /*#__PURE__*/ _jsxs("div", {
                                            className: "flex items-center justify-between py-2 border-b border-border/50",
                                            children: [
                                                /*#__PURE__*/ _jsx("span", {
                                                    className: "text-sm font-medium",
                                                    children: "username"
                                                }),
                                                /*#__PURE__*/ _jsx("span", {
                                                    className: "text-xs text-muted-foreground",
                                                    children: "string"
                                                })
                                            ]
                                        }),
                                        /*#__PURE__*/ _jsxs("div", {
                                            className: "flex items-center justify-between py-2",
                                            children: [
                                                /*#__PURE__*/ _jsx("span", {
                                                    className: "text-sm font-medium",
                                                    children: "password"
                                                }),
                                                /*#__PURE__*/ _jsx("span", {
                                                    className: "text-xs text-muted-foreground",
                                                    children: "string"
                                                })
                                            ]
                                        })
                                    ]
                                })
                            ]
                        }),
                        request.auth.authType === 'bearer' && /*#__PURE__*/ _jsxs(_Fragment, {
                            children: [
                                /*#__PURE__*/ _jsx("div", {
                                    className: "px-3 py-2 border-b bg-muted/30",
                                    children: /*#__PURE__*/ _jsxs("div", {
                                        className: "flex items-center gap-2",
                                        children: [
                                            /*#__PURE__*/ _jsx("span", {
                                                className: "font-semibold text-sm",
                                                children: "Bearer Token"
                                            }),
                                            /*#__PURE__*/ _jsx("span", {
                                                className: "text-xs text-orange-500 font-medium",
                                                children: "required"
                                            })
                                        ]
                                    })
                                }),
                                /*#__PURE__*/ _jsxs("div", {
                                    className: "p-3",
                                    children: [
                                        /*#__PURE__*/ _jsxs("div", {
                                            className: "flex items-center justify-between py-2",
                                            children: [
                                                /*#__PURE__*/ _jsx("span", {
                                                    className: "text-sm font-medium",
                                                    children: "Authorization"
                                                }),
                                                /*#__PURE__*/ _jsx("span", {
                                                    className: "text-xs text-muted-foreground font-mono",
                                                    children: "Bearer <token>"
                                                })
                                            ]
                                        }),
                                        /*#__PURE__*/ _jsx("p", {
                                            className: "text-xs text-muted-foreground mt-1",
                                            children: "Pass the token in the Authorization header"
                                        })
                                    ]
                                })
                            ]
                        }),
                        request.auth.authType === 'api-key' && /*#__PURE__*/ _jsxs(_Fragment, {
                            children: [
                                /*#__PURE__*/ _jsx("div", {
                                    className: "px-3 py-2 border-b bg-muted/30",
                                    children: /*#__PURE__*/ _jsxs("div", {
                                        className: "flex items-center gap-2",
                                        children: [
                                            /*#__PURE__*/ _jsx("span", {
                                                className: "font-semibold text-sm",
                                                children: "API Key"
                                            }),
                                            /*#__PURE__*/ _jsx("span", {
                                                className: "text-xs text-orange-500 font-medium",
                                                children: "required"
                                            })
                                        ]
                                    })
                                }),
                                /*#__PURE__*/ _jsxs("div", {
                                    className: "p-3 space-y-3",
                                    children: [
                                        /*#__PURE__*/ _jsxs("div", {
                                            className: "border-b border-border/50 pb-3",
                                            children: [
                                                /*#__PURE__*/ _jsxs("div", {
                                                    className: "flex items-start gap-2 flex-wrap",
                                                    children: [
                                                        /*#__PURE__*/ _jsx("span", {
                                                            className: "font-semibold text-sm",
                                                            children: request.auth.key
                                                        }),
                                                        /*#__PURE__*/ _jsx("span", {
                                                            className: "text-xs text-muted-foreground",
                                                            children: "string"
                                                        }),
                                                        /*#__PURE__*/ _jsx("span", {
                                                            className: "text-xs text-orange-500 font-medium",
                                                            children: "required"
                                                        })
                                                    ]
                                                }),
                                                /*#__PURE__*/ _jsx("p", {
                                                    className: "text-xs text-muted-foreground mt-1",
                                                    children: "Your API key for authentication"
                                                })
                                            ]
                                        }),
                                        /*#__PURE__*/ _jsxs("div", {
                                            className: "flex items-center gap-2 text-xs",
                                            children: [
                                                /*#__PURE__*/ _jsx("span", {
                                                    className: "text-muted-foreground",
                                                    children: "Location:"
                                                }),
                                                /*#__PURE__*/ _jsx("code", {
                                                    className: "bg-muted px-2 py-0.5 rounded font-mono",
                                                    children: request.auth.addTo === 'HEADERS' ? 'Header' : 'Query'
                                                })
                                            ]
                                        })
                                    ]
                                })
                            ]
                        }),
                        request.auth.authType === 'oauth-2' && /*#__PURE__*/ _jsxs(_Fragment, {
                            children: [
                                /*#__PURE__*/ _jsx("div", {
                                    className: "px-3 py-2 border-b bg-muted/30",
                                    children: /*#__PURE__*/ _jsxs("div", {
                                        className: "flex items-center gap-2",
                                        children: [
                                            /*#__PURE__*/ _jsx("span", {
                                                className: "font-semibold text-sm",
                                                children: "OAuth 2.0"
                                            }),
                                            /*#__PURE__*/ _jsx("span", {
                                                className: "text-xs text-orange-500 font-medium",
                                                children: "required"
                                            })
                                        ]
                                    })
                                }),
                                /*#__PURE__*/ _jsxs("div", {
                                    className: "p-3 space-y-3",
                                    children: [
                                        /*#__PURE__*/ _jsx("div", {
                                            className: "border-b border-border/50 pb-3",
                                            children: /*#__PURE__*/ _jsxs("div", {
                                                className: "flex items-start gap-2 flex-wrap",
                                                children: [
                                                    /*#__PURE__*/ _jsx("span", {
                                                        className: "font-semibold text-sm",
                                                        children: "Grant Type"
                                                    }),
                                                    /*#__PURE__*/ _jsx("span", {
                                                        className: "text-xs text-muted-foreground",
                                                        children: request.auth.grantTypeInfo.grantType.replace('_', ' ')
                                                    })
                                                ]
                                            })
                                        }),
                                        request.auth.grantTypeInfo.authEndpoint && /*#__PURE__*/ _jsxs("div", {
                                            className: "border-b border-border/50 pb-3",
                                            children: [
                                                /*#__PURE__*/ _jsxs("div", {
                                                    className: "flex items-start gap-2 flex-wrap",
                                                    children: [
                                                        /*#__PURE__*/ _jsx("span", {
                                                            className: "font-semibold text-sm",
                                                            children: "authEndpoint"
                                                        }),
                                                        /*#__PURE__*/ _jsx("span", {
                                                            className: "text-xs text-muted-foreground",
                                                            children: "string"
                                                        })
                                                    ]
                                                }),
                                                /*#__PURE__*/ _jsx("code", {
                                                    className: "text-xs text-muted-foreground mt-1 block break-all",
                                                    children: request.auth.grantTypeInfo.authEndpoint
                                                })
                                            ]
                                        }),
                                        request.auth.grantTypeInfo.tokenEndpoint && /*#__PURE__*/ _jsxs("div", {
                                            className: "pb-1",
                                            children: [
                                                /*#__PURE__*/ _jsxs("div", {
                                                    className: "flex items-start gap-2 flex-wrap",
                                                    children: [
                                                        /*#__PURE__*/ _jsx("span", {
                                                            className: "font-semibold text-sm",
                                                            children: "tokenEndpoint"
                                                        }),
                                                        /*#__PURE__*/ _jsx("span", {
                                                            className: "text-xs text-muted-foreground",
                                                            children: "string"
                                                        })
                                                    ]
                                                }),
                                                /*#__PURE__*/ _jsx("code", {
                                                    className: "text-xs text-muted-foreground mt-1 block break-all",
                                                    children: request.auth.grantTypeInfo.tokenEndpoint
                                                })
                                            ]
                                        })
                                    ]
                                })
                            ]
                        })
                    ]
                })
            }),
            request.body.body !== null && /*#__PURE__*/ _jsx(CollapsibleSection, {
                title: "Request Body",
                defaultOpen: false,
                children: /*#__PURE__*/ _jsxs("div", {
                    className: "border rounded-sm overflow-hidden",
                    children: [
                        /*#__PURE__*/ _jsxs("div", {
                            className: "bg-muted/50 px-3 py-2 border-b",
                            children: [
                                /*#__PURE__*/ _jsx("span", {
                                    className: "text-xs font-medium",
                                    children: "Content-Type: "
                                }),
                                /*#__PURE__*/ _jsx("code", {
                                    className: "text-xs",
                                    children: request.body.contentType
                                })
                            ]
                        }),
                        Array.isArray(request.body.body) ? /*#__PURE__*/ _jsx("div", {
                            className: "p-3 space-y-1",
                            children: request.body.body.map((item, index)=>/*#__PURE__*/ _jsxs("div", {
                                    className: "flex items-center gap-2 text-xs",
                                    children: [
                                        /*#__PURE__*/ _jsx("code", {
                                            className: "bg-background px-2 py-1 rounded",
                                            children: item.key
                                        }),
                                        /*#__PURE__*/ _jsx("span", {
                                            className: "text-muted-foreground",
                                            children: item.isFile ? '(file)' : '(text)'
                                        })
                                    ]
                                }, index))
                        }) : /*#__PURE__*/ _jsx("div", {
                            className: "dark-editor",
                            children: /*#__PURE__*/ _jsx(CodeViewer, {
                                value: typeof request.body.body === 'string' ? request.body.body : JSON.stringify(request.body.body),
                                language: request.body.contentType?.includes('json') ? 'json' : request.body.contentType?.includes('xml') ? 'xml' : 'plaintext',
                                theme: "dark",
                                height: "auto",
                                minHeight: 80,
                                maxHeight: 250,
                                showBorder: false,
                                rounded: false
                            })
                        })
                    ]
                })
            }),
            Object.keys(request.responses).length > 0 && /*#__PURE__*/ _jsx(CollapsibleSection, {
                title: "Responses",
                defaultOpen: true,
                children: /*#__PURE__*/ _jsx("div", {
                    children: Object.entries(request.responses).map(([name, response])=>/*#__PURE__*/ _jsx(ResponseSchema, {
                            code: response.code,
                            status: response.status,
                            description: name !== response.status ? name : undefined,
                            schema: response.body
                        }, name))
                })
            })
        ]
    });
}
