'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export function BodySection({ body }) {
    if (!body.body || body.contentType === null) {
        return null;
    }
    const isFormData = Array.isArray(body.body);
    const isFormUrlEncoded = body.contentType === 'application/x-www-form-urlencoded';
    let bodyContent;
    let formItems = [];
    if (isFormData) {
        formItems = body.body;
        bodyContent = JSON.stringify(formItems.map((item)=>({
                key: item.key,
                value: item.value,
                isFile: item.isFile
            })), null, 2);
    } else if (typeof body.body === 'string') {
        bodyContent = body.body;
    } else {
        bodyContent = JSON.stringify(body.body, null, 2);
    }
    return /*#__PURE__*/ _jsxs("section", {
        children: [
            /*#__PURE__*/ _jsx("h2", {
                className: "text-2xl font-semibold mb-4",
                children: "Request Body"
            }),
            /*#__PURE__*/ _jsxs("div", {
                className: "border rounded-sm overflow-hidden",
                children: [
                    /*#__PURE__*/ _jsxs("div", {
                        className: "bg-muted/50 px-4 py-2 border-b",
                        children: [
                            /*#__PURE__*/ _jsx("span", {
                                className: "text-sm font-medium",
                                children: "Content-Type: "
                            }),
                            /*#__PURE__*/ _jsx("code", {
                                className: "text-sm",
                                children: body.contentType
                            })
                        ]
                    }),
                    /*#__PURE__*/ _jsx("div", {
                        className: "p-4",
                        children: isFormData && formItems.length > 0 ? /*#__PURE__*/ _jsx("div", {
                            className: "space-y-2",
                            children: formItems.map((item, index)=>/*#__PURE__*/ _jsxs("div", {
                                    className: "flex items-center gap-2",
                                    children: [
                                        /*#__PURE__*/ _jsx("code", {
                                            className: "bg-background px-2 py-1 rounded text-sm",
                                            children: item.key
                                        }),
                                        /*#__PURE__*/ _jsx("span", {
                                            className: "text-sm text-muted-foreground",
                                            children: item.isFile ? '(file)' : '(text)'
                                        })
                                    ]
                                }, index))
                        }) : isFormUrlEncoded ? /*#__PURE__*/ _jsx("pre", {
                            className: "bg-muted p-4 rounded overflow-x-auto",
                            children: /*#__PURE__*/ _jsx("code", {
                                className: "text-sm",
                                children: bodyContent
                            })
                        }) : /*#__PURE__*/ _jsx("pre", {
                            className: "bg-muted p-4 rounded overflow-x-auto",
                            children: /*#__PURE__*/ _jsx("code", {
                                className: "text-sm",
                                children: bodyContent
                            })
                        })
                    })
                ]
            })
        ]
    });
}
