fix(ui): move correlation duration to far right
This commit is contained in:
@@ -120,7 +120,7 @@
|
|||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: var(--text-secondary);
|
color: var(--text-secondary);
|
||||||
margin-right: 0.5rem;
|
margin-left: auto;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -93,12 +93,6 @@ export function ExchangeHeader({ detail, onCorrelatedSelect }: ExchangeHeaderPro
|
|||||||
{/* Correlation chain */}
|
{/* Correlation chain */}
|
||||||
<div className={styles.chain}>
|
<div className={styles.chain}>
|
||||||
<span className={styles.chainLabel}>Correlated</span>
|
<span className={styles.chainLabel}>Correlated</span>
|
||||||
{showChain && (() => {
|
|
||||||
const starts = chain.map((ce: any) => new Date(ce.startTime).getTime()).filter((t: number) => !isNaN(t));
|
|
||||||
const ends = chain.map((ce: any) => new Date(ce.endTime ?? ce.startTime).getTime() + (ce.durationMs ?? 0)).filter((t: number) => !isNaN(t));
|
|
||||||
const totalMs = starts.length > 0 && ends.length > 0 ? Math.max(...ends) - Math.min(...starts) : 0;
|
|
||||||
return totalMs > 0 ? <span className={styles.chainTotal}>Duration: {formatDuration(totalMs)}</span> : null;
|
|
||||||
})()}
|
|
||||||
{showChain ? chain.map((ce: any, i: number) => {
|
{showChain ? chain.map((ce: any, i: number) => {
|
||||||
const isCurrent = ce.executionId === detail.executionId;
|
const isCurrent = ce.executionId === detail.executionId;
|
||||||
const variant = statusVariant(ce.status);
|
const variant = statusVariant(ce.status);
|
||||||
@@ -128,6 +122,12 @@ export function ExchangeHeader({ detail, onCorrelatedSelect }: ExchangeHeaderPro
|
|||||||
}) : (
|
}) : (
|
||||||
<span className={styles.chainNone}>no correlated exchanges found</span>
|
<span className={styles.chainNone}>no correlated exchanges found</span>
|
||||||
)}
|
)}
|
||||||
|
{showChain && (() => {
|
||||||
|
const starts = chain.map((ce: any) => new Date(ce.startTime).getTime()).filter((t: number) => !isNaN(t));
|
||||||
|
const ends = chain.map((ce: any) => new Date(ce.endTime ?? ce.startTime).getTime() + (ce.durationMs ?? 0)).filter((t: number) => !isNaN(t));
|
||||||
|
const totalMs = starts.length > 0 && ends.length > 0 ? Math.max(...ends) - Math.min(...starts) : 0;
|
||||||
|
return totalMs > 0 ? <span className={styles.chainTotal}>Duration: {formatDuration(totalMs)}</span> : null;
|
||||||
|
})()}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user