This commit is contained in:
Vikhyath Mondreti
2025-07-09 19:20:07 -07:00
parent e102b6cf17
commit f27cb18883
6 changed files with 19 additions and 48 deletions

View File

@@ -41,7 +41,7 @@ function ExpandableDataSection({ title, data }: { title: string; data: any }) {
<button
onClick={() => setIsModalOpen(true)}
className='rounded p-1 text-muted-foreground hover:bg-muted hover:text-foreground'
title="Expand in modal"
title='Expand in modal'
>
<Maximize2 className='h-3 w-3' />
</button>
@@ -78,7 +78,9 @@ function ExpandableDataSection({ title, data }: { title: string; data: any }) {
</button>
</div>
<div className='h-[calc(80vh-4rem)] overflow-auto p-4'>
<pre className='whitespace-pre-wrap break-words font-mono text-foreground text-sm'>{jsonString}</pre>
<pre className='whitespace-pre-wrap break-words font-mono text-foreground text-sm'>
{jsonString}
</pre>
</div>
</div>
</div>
@@ -241,15 +243,9 @@ function PinnedLogs({ executionData, onClose }: { executionData: any; onClose: (
)}
</div>
<ExpandableDataSection
title="Input"
data={formatted.input}
/>
<ExpandableDataSection title='Input' data={formatted.input} />
<ExpandableDataSection
title="Output"
data={formatted.output}
/>
<ExpandableDataSection title='Output' data={formatted.output} />
{formatted.cost && formatted.cost.total > 0 && (
<div>

View File

@@ -494,8 +494,6 @@ export function Sidebar({
</div>
)}
{/* Enhanced Cost - only show for enhanced logs with actual cost data */}
{log.metadata?.enhanced && hasCostInfo && (
<div>

View File

@@ -1,13 +1,7 @@
'use client'
import { useState } from 'react'
import {
ChevronDown,
ChevronRight,
Code,
Cpu,
ExternalLink,
} from 'lucide-react'
import { ChevronDown, ChevronRight, Code, Cpu, ExternalLink } from 'lucide-react'
import {
AgentIcon,
ApiIcon,
@@ -201,17 +195,11 @@ export function TraceSpansDisplay({
// Keep track of expanded spans
const [expandedSpans, setExpandedSpans] = useState<Set<string>>(new Set())
// Early return after all hooks
if (!traceSpans || traceSpans.length === 0) {
return <div className='text-muted-foreground text-sm'>No trace data available</div>
}
// Find the earliest start time among all spans to be the workflow start time
const workflowStartTime = traceSpans.reduce((earliest, span) => {
const startTime = new Date(span.startTime).getTime()
@@ -244,8 +232,6 @@ export function TraceSpansDisplay({
}
}
return (
<div className='w-full'>
<div className='mb-2 flex items-center justify-between'>
@@ -329,8 +315,6 @@ function TraceSpanItem({
const safeStartPercent = Math.min(100, Math.max(0, relativeStartPercent))
const safeWidthPercent = Math.max(2, Math.min(100 - safeStartPercent, actualDurationPercent))
// Handle click to expand/collapse this span
const handleSpanClick = () => {
if (hasNestedItems) {
@@ -549,12 +533,12 @@ function TraceSpanItem({
<div>
{/* Block Input/Output Data */}
{(span.input || span.output) && (
<div className='mt-2 ml-8 mr-4 mb-4 space-y-3 overflow-hidden'>
<div className='mt-2 mr-4 mb-4 ml-8 space-y-3 overflow-hidden'>
{/* Input Data */}
{span.input && (
<div>
<h4 className='mb-2 font-medium text-muted-foreground text-xs'>Input</h4>
<div className='overflow-hidden rounded-md bg-secondary/30 p-3 mb-2'>
<div className='mb-2 overflow-hidden rounded-md bg-secondary/30 p-3'>
<BlockDataDisplay data={span.input} blockType={span.type} isInput={true} />
</div>
</div>
@@ -566,7 +550,7 @@ function TraceSpanItem({
<h4 className='mb-2 font-medium text-muted-foreground text-xs'>
{span.status === 'error' ? 'Error Details' : 'Output'}
</h4>
<div className='overflow-hidden rounded-md bg-secondary/30 p-3 mb-2'>
<div className='mb-2 overflow-hidden rounded-md bg-secondary/30 p-3'>
<BlockDataDisplay
data={span.output}
blockType={span.type}

View File

@@ -314,8 +314,12 @@ export default function Logs() {
<div className='font-medium text-muted-foreground text-xs'>Time</div>
<div className='font-medium text-muted-foreground text-xs'>Status</div>
<div className='font-medium text-muted-foreground text-xs'>Workflow</div>
<div className='hidden lg:block font-medium text-muted-foreground text-xs'>Trigger</div>
<div className='hidden xl:block font-medium text-muted-foreground text-xs'>Cost</div>
<div className='hidden font-medium text-muted-foreground text-xs lg:block'>
Trigger
</div>
<div className='hidden font-medium text-muted-foreground text-xs xl:block'>
Cost
</div>
<div className='font-medium text-muted-foreground text-xs'>Duration</div>
</div>
</div>
@@ -405,11 +409,9 @@ export default function Logs() {
{/* Cost */}
<div className='hidden xl:block'>
<div className='text-xs text-muted-foreground'>
<div className='text-muted-foreground text-xs'>
{log.metadata?.enhanced && log.metadata?.cost?.total ? (
<span>
${log.metadata.cost.total.toFixed(4)}
</span>
<span>${log.metadata.cost.total.toFixed(4)}</span>
) : (
<span className='pl-0.5'></span>
)}

View File

@@ -214,14 +214,7 @@ export class EnhancedExecutionLogger implements IExecutionLoggerService {
finalOutput: BlockOutputData
traceSpans?: TraceSpan[]
}): Promise<WorkflowExecutionLog> {
const {
executionId,
endedAt,
totalDurationMs,
costSummary,
finalOutput,
traceSpans,
} = params
const { executionId, endedAt, totalDurationMs, costSummary, finalOutput, traceSpans } = params
logger.debug(`Completing workflow execution ${executionId}`)

View File

@@ -46,8 +46,6 @@ export async function loadWorkflowStateForExecution(workflowId: string): Promise
}
}
export function calculateCostSummary(traceSpans: any[]): {
totalCost: number
totalInputCost: number