show stream age as last update offset
This commit is contained in:
+7
-20
@@ -310,17 +310,16 @@ function durationSeconds(value?: number | null) {
|
|||||||
return typeof value === "number" && Number.isFinite(value) ? `${(value / 1000).toFixed(2)} s` : "-";
|
return typeof value === "number" && Number.isFinite(value) ? `${(value / 1000).toFixed(2)} s` : "-";
|
||||||
}
|
}
|
||||||
|
|
||||||
function secondsSince(value: string | null | undefined, nowMs: number, freezeAt?: string | null) {
|
function secondsSince(startedAt: string | null | undefined, updatedAt: string | null | undefined) {
|
||||||
if (!value) {
|
if (!startedAt || !updatedAt) {
|
||||||
return "-";
|
return "-";
|
||||||
}
|
}
|
||||||
const atMs = new Date(value).getTime();
|
const startedMs = new Date(startedAt).getTime();
|
||||||
if (Number.isNaN(atMs)) {
|
const updatedMs = new Date(updatedAt).getTime();
|
||||||
|
if (Number.isNaN(startedMs) || Number.isNaN(updatedMs)) {
|
||||||
return "-";
|
return "-";
|
||||||
}
|
}
|
||||||
const freezeMs = freezeAt ? new Date(freezeAt).getTime() : Number.NaN;
|
return `${Math.max(0, (updatedMs - startedMs) / 1000).toFixed(1)} s`;
|
||||||
const endMs = Number.isNaN(freezeMs) ? nowMs : freezeMs;
|
|
||||||
return `${Math.max(0, (endMs - atMs) / 1000).toFixed(1)} s`;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function bytesFormat(value?: number | null) {
|
function bytesFormat(value?: number | null) {
|
||||||
@@ -491,7 +490,6 @@ export default function App() {
|
|||||||
const [latestLogSeq, setLatestLogSeq] = useState(0);
|
const [latestLogSeq, setLatestLogSeq] = useState(0);
|
||||||
const [requestQuery, setRequestQuery] = useState("");
|
const [requestQuery, setRequestQuery] = useState("");
|
||||||
const [requestFilter, setRequestFilter] = useState("all");
|
const [requestFilter, setRequestFilter] = useState("all");
|
||||||
const [nowMs, setNowMs] = useState(() => Date.now());
|
|
||||||
const [ruleForm, setRuleForm] = useState<RuleFormState>(ruleFormFromStatus(null));
|
const [ruleForm, setRuleForm] = useState<RuleFormState>(ruleFormFromStatus(null));
|
||||||
const [profileForm, setProfileForm] = useState<ProfileFormState>(defaultProfileForm);
|
const [profileForm, setProfileForm] = useState<ProfileFormState>(defaultProfileForm);
|
||||||
const [ruleMessage, setRuleMessage] = useState<MessageState>({ text: "", tone: "" });
|
const [ruleMessage, setRuleMessage] = useState<MessageState>({ text: "", tone: "" });
|
||||||
@@ -682,7 +680,6 @@ export default function App() {
|
|||||||
if (page !== "requests") {
|
if (page !== "requests") {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
setNowMs(Date.now());
|
|
||||||
const timer = window.setTimeout(() => {
|
const timer = window.setTimeout(() => {
|
||||||
loadRequests().catch((error) => {
|
loadRequests().catch((error) => {
|
||||||
setRuleMessage({ text: error?.message || String(error), tone: "error" });
|
setRuleMessage({ text: error?.message || String(error), tone: "error" });
|
||||||
@@ -691,16 +688,6 @@ export default function App() {
|
|||||||
return () => window.clearTimeout(timer);
|
return () => window.clearTimeout(timer);
|
||||||
}, [page, requestQuery, requestFilter]);
|
}, [page, requestQuery, requestFilter]);
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (page !== "requests") {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const timer = window.setInterval(() => {
|
|
||||||
setNowMs(Date.now());
|
|
||||||
}, 1000);
|
|
||||||
return () => window.clearInterval(timer);
|
|
||||||
}, [page]);
|
|
||||||
|
|
||||||
async function saveProfile(event: FormEvent) {
|
async function saveProfile(event: FormEvent) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
setProfileMessage({ text: "正在保存 profile...", tone: "" });
|
setProfileMessage({ text: "正在保存 profile...", tone: "" });
|
||||||
@@ -1044,7 +1031,7 @@ export default function App() {
|
|||||||
<span className="meta-pill meta-stream">
|
<span className="meta-pill meta-stream">
|
||||||
<span className="meta-key">流</span>
|
<span className="meta-key">流</span>
|
||||||
{entry.response_stream
|
{entry.response_stream
|
||||||
? `${numberFormat(entry.stream_chunk_count)} chunk / ${bytesFormat(entry.response_bytes_received)} / ${secondsSince(entry.last_activity_at || entry.usage_last_updated_at, nowMs, entry.finished_at)}`
|
? `${numberFormat(entry.stream_chunk_count)} chunk / ${bytesFormat(entry.response_bytes_received)} / ${secondsSince(entry.started_at, entry.last_activity_at || entry.usage_last_updated_at || entry.finished_at)}`
|
||||||
: "-"}
|
: "-"}
|
||||||
</span>
|
</span>
|
||||||
<span className="meta-pill meta-received">
|
<span className="meta-pill meta-received">
|
||||||
|
|||||||
Reference in New Issue
Block a user