more

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/workflow-details.tsx

@@ -79,6 +79,7 @@ export function WorkflowDetails({
   selectedSegmentIndex,
   selectedSegment,
   selectedSegmentTimeRange,
+  selectedWorkflowNames,
   segmentDurationMs,
   clearSegmentSelection,
   formatCost,
@@ -94,6 +95,7 @@ export function WorkflowDetails({
   selectedSegmentIndex: number[] | null
   selectedSegment: { timestamp: string; totalExecutions: number } | null
   selectedSegmentTimeRange?: { start: Date; end: Date } | null
+  selectedWorkflowNames?: string[]
   segmentDurationMs?: number
   clearSegmentSelection: () => void
   formatCost: (n: number) => string
@@ -186,7 +188,7 @@ export function WorkflowDetails({
             )}
             {Array.isArray(selectedSegmentIndex) &&
               selectedSegmentIndex.length > 0 &&
-              selectedSegment &&
+              (selectedSegment || selectedSegmentTimeRange || expandedWorkflowId === '__multi__') &&
               (() => {
                 let tsLabel = 'Selected segment'
                 if (selectedSegmentTimeRange) {
@@ -217,11 +219,27 @@ export function WorkflowDetails({
                     })
                   }
                 }
+
+                const isMultiWorkflow =
+                  expandedWorkflowId === '__multi__' &&
+                  selectedWorkflowNames &&
+                  selectedWorkflowNames.length > 0
+                const workflowLabel = isMultiWorkflow
+                  ? selectedWorkflowNames.length <= 2
+                    ? selectedWorkflowNames.join(', ')
+                    : `${selectedWorkflowNames.slice(0, 2).join(', ')} +${selectedWorkflowNames.length - 2}`
+                  : null
+
                 return (
                   <div className='inline-flex h-7 items-center gap-1.5 rounded-md border bg-muted/50 px-2.5'>
+                    {isMultiWorkflow && workflowLabel && (
+                      <span className='font-medium text-[11px] text-muted-foreground'>
+                        {workflowLabel}
+                      </span>
+                    )}
                     <span className='font-medium text-[11px] text-foreground'>
                       {tsLabel}
-                      {selectedSegmentIndex.length > 1
+                      {selectedSegmentIndex.length > 1 && !isMultiWorkflow
                         ? ` (+${selectedSegmentIndex.length - 1})`
                         : ''}
                     </span>

apps/sim/app/workspace/[workspaceId]/logs/dashboard.tsx

@@ -1002,6 +1002,51 @@ export default function Dashboard() {
                     const totalRate =
                       totalExecutions > 0 ? (totalSuccess / totalExecutions) * 100 : 100
 
+                    // Calculate overall time range across all selected workflows
+                    let multiWorkflowTimeRange: { start: Date; end: Date } | null = null
+                    if (sortedIndices.length > 0) {
+                      const firstIdx = sortedIndices[0]
+                      const lastIdx = sortedIndices[sortedIndices.length - 1]
+
+                      // Find earliest start time
+                      let earliestStart: Date | null = null
+                      for (const wfId of selectedWorkflowIds) {
+                        const wf = executions.find((w) => w.workflowId === wfId)
+                        const segment = wf?.segments[firstIdx]
+                        if (segment) {
+                          const start = new Date(segment.timestamp)
+                          if (!earliestStart || start < earliestStart) {
+                            earliestStart = start
+                          }
+                        }
+                      }
+
+                      // Find latest end time
+                      let latestEnd: Date | null = null
+                      for (const wfId of selectedWorkflowIds) {
+                        const wf = executions.find((w) => w.workflowId === wfId)
+                        const segment = wf?.segments[lastIdx]
+                        if (segment) {
+                          const end = new Date(new Date(segment.timestamp).getTime() + segMs)
+                          if (!latestEnd || end > latestEnd) {
+                            latestEnd = end
+                          }
+                        }
+                      }
+
+                      if (earliestStart && latestEnd) {
+                        multiWorkflowTimeRange = {
+                          start: earliestStart,
+                          end: latestEnd,
+                        }
+                      }
+                    }
+
+                    // Get workflow names
+                    const workflowNames = selectedWorkflowIds
+                      .map((id) => executions.find((w) => w.workflowId === id)?.workflowName)
+                      .filter(Boolean) as string[]
+
                     return (
                       <WorkflowDetails
                         workspaceId={workspaceId}
@@ -1022,10 +1067,11 @@ export default function Dashboard() {
                             allLogs: allLogs,
                           } as any
                         }
-                        selectedSegmentIndex={[]}
+                        selectedSegmentIndex={sortedIndices}
                         selectedSegment={null}
-                        selectedSegmentTimeRange={null}
-                        segmentDurationMs={undefined}
+                        selectedSegmentTimeRange={multiWorkflowTimeRange}
+                        selectedWorkflowNames={workflowNames}
+                        segmentDurationMs={segMs}
                         clearSegmentSelection={() => {
                           setSelectedSegments({})
                           setLastAnchorIndices({})
@@ -1207,6 +1253,7 @@ export default function Dashboard() {
                             : null
                         }
                         selectedSegmentTimeRange={timeRange}
+                        selectedWorkflowNames={undefined}
                         segmentDurationMs={segMs}
                         clearSegmentSelection={() => {
                           setSelectedSegments({})
@@ -1242,6 +1289,7 @@ export default function Dashboard() {
                       selectedSegmentIndex={[]}
                       selectedSegment={null}
                       selectedSegmentTimeRange={null}
+                      selectedWorkflowNames={undefined}
                       segmentDurationMs={undefined}
                       clearSegmentSelection={() => {
                         setSelectedSegments({})