diff --git a/ui/litellm-dashboard/src/components/view_logs/LogDetailsDrawer/InputCard.tsx b/ui/litellm-dashboard/src/components/view_logs/LogDetailsDrawer/InputCard.tsx index 1d00e52a816..0451470f42c 100644 --- a/ui/litellm-dashboard/src/components/view_logs/LogDetailsDrawer/InputCard.tsx +++ b/ui/litellm-dashboard/src/components/view_logs/LogDetailsDrawer/InputCard.tsx @@ -3,6 +3,7 @@ * Datadog-style: header with icon/metrics, content below */ +import { useState } from 'react'; import { message } from 'antd'; import { ParsedMessage } from './prettyMessagesTypes'; import { SectionHeader } from './SectionHeader'; @@ -17,6 +18,8 @@ interface InputCardProps { } export function InputCard({ messages, promptTokens, inputCost }: InputCardProps) { + const [isCollapsed, setIsCollapsed] = useState(false); + if (messages.length === 0) { return null; } @@ -48,30 +51,41 @@ export function InputCard({ messages, promptTokens, inputCost }: InputCardProps) tokens={promptTokens} cost={inputCost} onCopy={handleCopy} + isCollapsed={isCollapsed} + onToggleCollapse={() => setIsCollapsed(!isCollapsed)} /> {/* Content */} -