fix(logs): use formatDuration utility and align file cards styling

[waleedlatif1]

Summary

• Use formatDuration utility for duration display in log details (e.g., 18706ms → 18.71s)
• Fix FileCards container styling to match other log detail sections (border, padding, dark mode)
• Remove unnecessary wrapper div and fix file name truncation

Type of Change

• Bug fix

Testing

Tested manually

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
docs	Skipped		Feb 3, 2026 9:25pm

[greptile-apps]

Greptile Overview

Greptile Summary

Standardized duration formatting and aligned file card styling across log details UI.

Key Changes:

• Applied formatDuration utility with 2-decimal precision in log-details.tsx:457 to display durations more readably (e.g., 18706ms → 18.71s)
• Fixed file name truncation in FileCard by adding min-w-0 and flex-1 to enable proper text overflow behavior
• Aligned FileCards container styling to match other log detail sections with consistent border, padding, and dark mode support
• Removed unnecessary wrapper div for cleaner DOM structure
• Adjusted spacing values for better visual consistency (gap-[8px] → gap-[4px], padding adjustments)

Confidence Score: 5/5

• This PR is safe to merge - it contains straightforward UI improvements with no logic changes
• Score reflects simple, isolated styling and formatting changes with no functional modifications, security concerns, or breaking changes
• No files require special attention

Important Files Changed

Filename	Overview
apps/sim/app/workspace/[workspaceId]/logs/components/log-details/log-details.tsx	Applied formatDuration utility for better duration formatting (18706ms → 18.71s)
apps/sim/app/workspace/[workspaceId]/logs/components/log-details/components/file-download/file-download.tsx	Fixed FileCard truncation and aligned FileCards styling with other log sections (border, padding, dark mode)

Sequence Diagram

sequenceDiagram
    participant User
    participant LogDetails
    participant formatDuration
    participant FileCards
    participant FileCard

    User->>LogDetails: View log details
    LogDetails->>formatDuration: Format duration (18706ms, precision: 2)
    formatDuration-->>LogDetails: Return "18.71s"
    LogDetails->>LogDetails: Render duration in details section
    
    alt Files exist
        LogDetails->>FileCards: Render files list
        FileCards->>FileCards: Apply border, padding, dark mode styles
        loop For each file
            FileCards->>FileCard: Render individual file
            FileCard->>FileCard: Apply truncation (min-w-0, flex-1)
            FileCard->>FileCard: Fix file size alignment (flex-shrink-0)
            FileCard-->>FileCards: Rendered card
        end
        FileCards-->>LogDetails: Rendered file cards
    end
    
    LogDetails-->>User: Display formatted log details

Loading

[greptile-apps]

_{2 files reviewed, no comments}

_{Edit Code Review Agent Settings | Greptile}