fix(logs): right-size and reorganize log-detail action chips (#5352)

Two concrete regressions from the earlier Chip conversion (#5341):
- Both chips used variant='primary' (the solid inverse-fill treatment),
  the heaviest chrome in the design system, reserved for a single standout
  action per context (Save, Upgrade, Add key) — never a peer among several
  row actions. Two solid pills stacked in a narrow side panel read as
  oversized. Switched both to the bare (default) chip, matching every
  analogous row action in Settings.
- The Version badge was size='md' while its siblings (Level, Trigger) are
  size='sm' — an inconsistency. Aligned to 'sm'.

Also folded the floating 'Troubleshoot in Chat' chip into the Details card
as its own row (matching 'Snapshot' exactly) instead of leaving it orphaned
below Workflow Output — every row in the card now shares one shape (label
left, trailing content right), consistent top to bottom.
This commit is contained in:
Waleed
2026-07-01 19:46:22 -07:00
committed by GitHub
parent e01123f715
commit b34608856d
@@ -529,7 +529,7 @@ export function LogDetailsContent({ log, onActiveTabChange }: LogDetailsContentP
Version
</span>
<div className='flex w-0 flex-1 justify-end'>
<Badge variant='green' size='md' className='max-w-full truncate'>
<Badge variant='green' size='sm' className='max-w-full truncate'>
{log.deploymentVersionName || `v${log.deploymentVersion}`}
</Badge>
</div>
@@ -542,16 +542,23 @@ export function LogDetailsContent({ log, onActiveTabChange }: LogDetailsContentP
<span className='font-medium text-[var(--text-tertiary)] text-caption'>
Snapshot
</span>
<Chip
variant='primary'
leftIcon={Eye}
flush
onClick={() => setIsExecutionSnapshotOpen(true)}
>
<Chip leftIcon={Eye} flush onClick={() => setIsExecutionSnapshotOpen(true)}>
View Snapshot
</Chip>
</div>
)}
{/* Troubleshoot */}
{canTroubleshoot && (
<div className='flex h-10 items-center justify-between px-3'>
<span className='font-medium text-[var(--text-tertiary)] text-caption'>
Troubleshoot
</span>
<Chip leftIcon={Wrench} flush onClick={handleTroubleshoot}>
Troubleshoot in Chat
</Chip>
</div>
)}
</div>
{/* Workflow Input */}
@@ -581,19 +588,6 @@ export function LogDetailsContent({ log, onActiveTabChange }: LogDetailsContentP
</div>
)}
{/* Troubleshoot */}
{canTroubleshoot && (
<Chip
variant='primary'
leftIcon={Wrench}
flush
className='self-start'
onClick={handleTroubleshoot}
>
Troubleshoot in Chat
</Chip>
)}
{/* Files */}
{log.files && log.files.length > 0 && <FileCards files={log.files} isExecutionFile />}