scriptoriumadmin/litellm
1
0
Fork 0
mirror of https://github.com/BerriAI/litellm.git synced 2026-09-05 08:07:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 137

complete v2 viewer

Browse source
This commit is contained in:
Ishaan Jaffer 2026-01-30 15:46:30 -08:00
parent 2014bcf9d8
commit 61bb51dc3d
1 changed files with 47 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

89
ui/litellm-dashboard/src/components/view_logs/LogDetailsDrawer/LogDetailsDrawer.tsx
View file

@ -143,7 +143,7 @@ export function LogDetailsDrawer({
environment={environment} environment={environment}
/> />
<div style={{ height: "calc(100vh - 100px)", overflowY: "auto", padding: DRAWER_CONTENT_PADDING }}> <div style={{ height: "calc(100vh - 100px)", overflowY: "auto", padding: `${DRAWER_CONTENT_PADDING} ${DRAWER_CONTENT_PADDING} 0` }}>
{/* Error Alert - Show prominently at top for failures */} {/* Error Alert - Show prominently at top for failures */}
{hasError && errorInfo && ( {hasError && errorInfo && (
<Alert <Alert
@ -216,6 +216,9 @@ export function LogDetailsDrawer({
{logEntry.metadata && Object.keys(logEntry.metadata).length > 0 && ( {logEntry.metadata && Object.keys(logEntry.metadata).length > 0 && (
<MetadataSection metadata={logEntry.metadata} onCopy={(data) => copyToClipboard(data, "Metadata")} /> <MetadataSection metadata={logEntry.metadata} onCopy={(data) => copyToClipboard(data, "Metadata")} />
)} )}
{/* Bottom spacing for scroll area */}
<div style={{ height: DRAWER_CONTENT_PADDING }} />
</div> </div>
</Drawer> </Drawer>
); );
@ -357,47 +360,49 @@ function RequestResponseSection({
<h3 className="text-lg font-medium text-gray-900">Request & Response</h3> <h3 className="text-lg font-medium text-gray-900">Request & Response</h3>
</AccordionHeader> </AccordionHeader>
<AccordionBody className="px-0"> <AccordionBody className="px-0">
<Tabs <div style={{ padding: "0 24px" }}>
activeKey={activeTab} <Tabs
onChange={(key) => setActiveTab(key as typeof TAB_REQUEST | typeof TAB_RESPONSE)} activeKey={activeTab}
tabBarExtraContent={ onChange={(key) => setActiveTab(key as typeof TAB_REQUEST | typeof TAB_RESPONSE)}
<Button tabBarExtraContent={
type="text" <Button
size="small" type="text"
icon={<CopyOutlined />} size="small"
onClick={handleCopy} icon={<CopyOutlined />}
disabled={activeTab === TAB_RESPONSE && !hasResponse} onClick={handleCopy}
> disabled={activeTab === TAB_RESPONSE && !hasResponse}
Copy >
</Button> Copy
} </Button>
items={[ }
{ items={[
key: TAB_REQUEST, {
label: "Request", key: TAB_REQUEST,
children: ( label: "Request",
<div style={{ padding: SPACING_XLARGE }}> children: (
<JsonViewer data={getRawRequest()} mode="formatted" /> <div style={{ paddingTop: SPACING_XLARGE, paddingBottom: SPACING_XLARGE }}>
</div> <JsonViewer data={getRawRequest()} mode="formatted" />
), </div>
}, ),
{ },
key: TAB_RESPONSE, {
label: "Response", key: TAB_RESPONSE,
children: ( label: "Response",
<div style={{ padding: SPACING_XLARGE }}> children: (
{hasResponse ? ( <div style={{ paddingTop: SPACING_XLARGE, paddingBottom: SPACING_XLARGE }}>
<JsonViewer data={getFormattedResponse()} mode="formatted" /> {hasResponse ? (
) : ( <JsonViewer data={getFormattedResponse()} mode="formatted" />
<div style={{ textAlign: "center", padding: 20, color: "#999", fontStyle: "italic" }}> ) : (
Response data not available <div style={{ textAlign: "center", padding: 20, color: "#999", fontStyle: "italic" }}>
</div> Response data not available
)} </div>
</div> )}
), </div>
}, ),
]} },
/> ]}
/>
</div>
</AccordionBody> </AccordionBody>
</Accordion> </Accordion>
</div> </div>