@brainfish-ai/devdoc 0.1.42 → 0.1.44

package/renderer/components/docs-viewer/sidebar/endpoint-options.js

@@ -0,0 +1,512 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from 'react';
+import { CaretDown, CaretRight } from '@phosphor-icons/react';
+import { Badge } from '@/components/ui/badge';
+import { MethodBadge } from '../shared/method-badge';
+import { MarkdownRenderer } from '../shared/markdown-renderer';
+import { CodeViewer } from '../playground/code-editor';
+import { ResponseSchema } from '../shared/schema-viewer';
+import { CodeSnippetCompact } from '../playground/code-snippet';
+function CollapsibleSection({ title, children, defaultOpen = true }) {
+    const [isOpen, setIsOpen] = useState(defaultOpen);
+    return /*#__PURE__*/ _jsxs("div", {
+        className: "border-b border-border",
+        children: [
+            /*#__PURE__*/ _jsxs("button", {
+                onClick: ()=>setIsOpen(!isOpen),
+                className: "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: "px-4 pb-4",
+                children: children
+            })
+        ]
+    });
+}
+export function EndpointOptionsSidebar({ request }) {
+    return /*#__PURE__*/ _jsxs("div", {
+        className: "w-96 h-full border-l bg-muted/30 flex flex-col overflow-hidden",
+        children: [
+            /*#__PURE__*/ _jsxs("div", {
+                className: "p-4 border-b border-border bg-background",
+                children: [
+                    /*#__PURE__*/ _jsxs("div", {
+                        className: "flex items-center gap-2 mb-2",
+                        children: [
+                            /*#__PURE__*/ _jsx(MethodBadge, {
+                                method: request.method
+                            }),
+                            /*#__PURE__*/ _jsx("h2", {
+                                className: "font-semibold text-lg truncate",
+                                children: request.name
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsx("code", {
+                        className: "text-xs text-muted-foreground font-mono break-all",
+                        children: request.endpoint
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                className: "flex-1 overflow-y-auto bg-background",
+                children: [
+                    /*#__PURE__*/ _jsx(CodeSnippetCompact, {
+                        request: request
+                    }),
+                    request.description && /*#__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-hidden",
+                            children: /*#__PURE__*/ _jsxs("table", {
+                                className: "w-full text-sm",
+                                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",
+                                                    children: "Name"
+                                                }),
+                                                /*#__PURE__*/ _jsx("th", {
+                                                    className: "px-3 py-2 text-left text-xs font-semibold",
+                                                    children: "Description"
+                                                }),
+                                                /*#__PURE__*/ _jsx("th", {
+                                                    className: "px-3 py-2 text-left text-xs font-semibold",
+                                                    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",
+                                                        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",
+                                                        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-hidden",
+                            children: /*#__PURE__*/ _jsxs("table", {
+                                className: "w-full text-sm",
+                                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",
+                                                    children: "Name"
+                                                }),
+                                                /*#__PURE__*/ _jsx("th", {
+                                                    className: "px-3 py-2 text-left text-xs font-semibold",
+                                                    children: "Description"
+                                                }),
+                                                /*#__PURE__*/ _jsx("th", {
+                                                    className: "px-3 py-2 text-left text-xs font-semibold",
+                                                    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",
+                                                        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",
+                                                        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))
+                        })
+                    })
+                ]
+            })
+        ]
+    });
+}