45 lines
1.1 KiB
TypeScript
45 lines
1.1 KiB
TypeScript
import * as React from 'react';
|
|
import { useState } from 'react';
|
|
import { getSlowOperations } from '../bootstrap/state.js';
|
|
import { Text, useInterval } from '@anthropic/ink';
|
|
|
|
// Show DevBar for dev builds or all ants
|
|
function shouldShowDevBar(): boolean {
|
|
return process.env.NODE_ENV === 'development' || process.env.USER_TYPE === 'ant';
|
|
}
|
|
|
|
export function DevBar(): React.ReactNode {
|
|
const [slowOps, setSlowOps] =
|
|
useState<
|
|
ReadonlyArray<{
|
|
operation: string;
|
|
durationMs: number;
|
|
timestamp: number;
|
|
}>
|
|
>(getSlowOperations);
|
|
|
|
useInterval(
|
|
() => {
|
|
setSlowOps(getSlowOperations());
|
|
},
|
|
shouldShowDevBar() ? 500 : null,
|
|
);
|
|
|
|
// Only show when there's something to display
|
|
if (!shouldShowDevBar() || slowOps.length === 0) {
|
|
return null;
|
|
}
|
|
|
|
// Single-line format so short terminals don't lose rows to dev noise.
|
|
const recentOps = slowOps
|
|
.slice(-3)
|
|
.map(op => `${op.operation} (${Math.round(op.durationMs)}ms)`)
|
|
.join(' · ');
|
|
|
|
return (
|
|
<Text wrap="truncate-end" color="warning">
|
|
[ANT-ONLY] slow sync: {recentOps}
|
|
</Text>
|
|
);
|
|
}
|