admin343/browser
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix terminal system lines to use server time

Browse Source
This commit is contained in:
npc0-hue
2026-08-24 14:07:33 +08:00
parent 504387c657
commit 3e00737267
4 changed files with 52 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
platform_web/components/ServerManagementTerminalDrawer.test.tsx
+13 -2
View File
@@ -5,6 +5,7 @@ import { createRoot, type Root } from "react-dom/client";
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
import type { JobResponse, LogEntryBody, LogStreamResponse, SourceRCONCommandResponse } from "../api/types";
import { formatTerminalServerTime } from "../utils/logTime";
import { ServerManagementTerminalDrawer } from "./ServerManagementTerminalDrawer";
const apiMocks = vi.hoisted(() => ({
@@ -88,6 +89,16 @@ describe("ServerManagementTerminalDrawer", () => {
expect(apiMocks.dispatchSourceRCONCommand).not.toHaveBeenCalled();
});
it("uses the server-provided clock for terminal system lines", async () => {
const serverTime = "2001-02-03T04:05:06Z";
await renderDrawer();
expect(container?.textContent).toContain("时间同步中");
await emitSession("session-server-clock", serverTime);
const systemLine = Array.from(container?.querySelectorAll<HTMLDivElement>(".terminal-line") ?? []).find((line) => line.textContent?.includes("已跟随当前受管进程输出会话"));
expect(systemLine?.querySelector("time")?.textContent).toBe(formatTerminalServerTime(serverTime));
});
it("renders an empty current session without accepting unrelated or sessionless logs", async () => {
await renderDrawer();
@@ -203,8 +214,8 @@ async function renderDrawer() {
expect(apiMocks.openServerLogEvents).toHaveBeenCalledWith("server-1", { historyLimit: 500 });
}
async function emitSession(logSessionId?: string) {
await act(async () => eventStream.emit("session", { serverInstanceId: "server-1", logSessionId, streamCount: logSessionId ? 1 : 0, serverTime: "2026-08-14T00:00:00Z" }));
async function emitSession(logSessionId?: string, serverTime = "2026-08-14T00:00:00Z") {
await act(async () => eventStream.emit("session", { serverInstanceId: "server-1", logSessionId, streamCount: logSessionId ? 1 : 0, serverTime }));
}
async function emitStream(stream: LogStreamResponse) {
platform_web/components/ServerManagementTerminalDrawer.tsx
+29 -25
View File
@@ -6,7 +6,7 @@ import type { JobResponse, LogEntryBody, LogStreamResponse } from "../api/types"
import { scumSourceRCONCommandRequest } from "../schemas/scumManagementRcon";
import { cx } from "../utils/classes";
import { mergeLogStreams, parseLogSessionEvent, parseLogStreamEvent, parseServerLogEvent, streamFromServerLogEvent } from "../utils/logEvents";
import { formatTerminalLogTime } from "../utils/logTime";
import { formatTerminalLogTime, formatTerminalServerTime } from "../utils/logTime";
import { EmptyState, ResultBadge } from "./StateViews";
type LoadState<T> = { status: "loading" } | { status: "error"; reason: string } | { status: "ready"; data: T };
@@ -98,6 +98,7 @@ export function ServerManagementTerminalDrawer({ open, serverId, serverName, plu
const [selectedHistoryStreamId, setSelectedHistoryStreamId] = useState("");
const outputRef = useRef<HTMLDivElement>(null);
const followLatestRef = useRef(true);
const serverTimeRef = useRef<string | undefined>(undefined);
const initialHistoryPendingRef = useRef(false);
const liveSessionRef = useRef<string | null | undefined>(undefined);
const historyRequestRef = useRef(0);
@@ -136,11 +137,12 @@ export function ServerManagementTerminalDrawer({ open, serverId, serverName, plu
setHistoryLines({ status: "idle" });
setSelectedHistoryStreamId("");
liveSessionRef.current = undefined;
serverTimeRef.current = undefined;
historyRequestRef.current += 1;
initialHistoryPendingRef.current = true;
followLatestRef.current = true;
setFollowLatest(true);
setLines([terminalSystemLine("info", supportsCommands ? "正在连接当前受管进程输出。" : "该插件暂未声明可用的终端命令通道。", "SYSTEM")]);
setLines([terminalSystemLine("info", supportsCommands ? "正在连接当前受管进程输出。" : "该插件暂未声明可用的终端命令通道。", "SYSTEM", undefined, serverTimeRef.current)]);
}, [open, supportsCommands]);
useEffect(() => {
@@ -160,6 +162,7 @@ export function ServerManagementTerminalDrawer({ open, serverId, serverName, plu
const session = parseLogSessionEvent(event);
if (!session) return;
ready = true;
serverTimeRef.current = session.serverTime;
const nextSessionId = normalizeLogSessionId(session.logSessionId);
const previousSessionId = liveSessionRef.current;
liveSessionRef.current = nextSessionId;
@@ -167,8 +170,8 @@ export function ServerManagementTerminalDrawer({ open, serverId, serverName, plu
if (previousSessionId === nextSessionId) return;
setStreams({ status: "ready", data: [] });
setLines(nextSessionId
? [terminalSystemLine("info", previousSessionId === undefined ? "已跟随当前受管进程输出会话。" : "Run 已切换到新的受管进程输出会话。", "SYSTEM", `session-${nextSessionId}`)]
: [terminalSystemLine("warn", "当前没有可跟随的受管进程输出；旧日志可从历史查看。", "SYSTEM", "session-empty")]);
? [terminalSystemLine("info", previousSessionId === undefined ? "已跟随当前受管进程输出会话。" : "Run 已切换到新的受管进程输出会话。", "SYSTEM", `session-${nextSessionId}`, serverTimeRef.current)]
: [terminalSystemLine("warn", "当前没有可跟随的受管进程输出；旧日志可从历史查看。", "SYSTEM", "session-empty", serverTimeRef.current)]);
lockTerminalFollow();
});
events.addEventListener("stream", (event) => {
@@ -284,26 +287,26 @@ export function ServerManagementTerminalDrawer({ open, serverId, serverName, plu
setCommandHistory((current) => [...current.filter((item) => item !== submitted), submitted].slice(-50));
setPending(true);
setResult({ status: "pending", label: "正在提交命令" });
appendLines([terminalSystemLine("input", `> ${submitted}`, "COMMAND")]);
appendLines([terminalSystemLine("input", `> ${submitted}`, "COMMAND", undefined, serverTimeRef.current)]);
try {
const response = await platformApiClient.dispatchSourceRCONCommand(serverId, scumSourceRCONCommandRequest(serverId, submitted));
const label = rconJobDispatchLabel(response.status, response.jobId);
setResult({ status: "pending", label: `${label} · 等待 Run 返回结果` });
appendLines([terminalSystemLine("success", `${label} · Source RCON`, "PLATFORM", `ok-${response.jobId}`)]);
appendLines([terminalSystemLine("success", `${label} · Source RCON`, "PLATFORM", `ok-${response.jobId}`, serverTimeRef.current)]);
const finalJob = await waitForRCONJobTerminal(response.jobId);
if (finalJob) {
const outcome = terminalLineFromJob(finalJob);
setResult({ status: outcome.tone === "success" ? "succeeded" : "failed", label: outcome.text });
appendLines([outcome]);
} else {
const timeoutLine = terminalSystemLine("warn", `RCON 任务 ${response.jobId} 已排队，但尚未返回终态；继续观察实时日志。`, "PLATFORM", `pending-${response.jobId}`);
const timeoutLine = terminalSystemLine("warn", `RCON 任务 ${response.jobId} 已排队，但尚未返回终态；继续观察实时日志。`, "PLATFORM", `pending-${response.jobId}`, serverTimeRef.current);
setResult({ status: "pending", label: "等待 Run 返回结果" });
appendLines([timeoutLine]);
}
} catch (error) {
const label = error instanceof Error ? error.message : "命令提交失败";
setResult({ status: "failed", label });
appendLines([terminalSystemLine("error", label, "ERROR")]);
appendLines([terminalSystemLine("error", label, "ERROR", undefined, serverTimeRef.current)]);
} finally {
setPending(false);
}
@@ -333,9 +336,9 @@ export function ServerManagementTerminalDrawer({ open, serverId, serverName, plu
</div>
</div>
<div ref={outputRef} className="terminal-output" role="log" aria-live="polite" onScroll={handleTerminalScroll}>
{!historyOpen && streams.status === "error" && <div className="terminal-line terminal-line-error terminal-source-system"><time>{new Date().toLocaleTimeString()}</time><span className="terminal-text">{streams.reason}</span></div>}
{historyOpen && <HistoryLogView streams={historyStreams} lines={historyLines} selectedStreamId={selectedHistoryStreamId} onSelect={selectHistoryStream} />}
{!historyOpen && streams.status === "ready" && lines.length === 0 && <div className="terminal-line terminal-line-warn terminal-source-system"><time>{new Date().toLocaleTimeString()}</time><span className="terminal-text">{liveSessionId ? "当前受管进程会话暂无输出，后续输出会自动追加。" : "当前没有可跟随的受管进程输出；旧日志可从历史查看。"}</span></div>}
{!historyOpen && streams.status === "error" && <div className="terminal-line terminal-line-error terminal-source-system"><time>{formatTerminalServerTime(serverTimeRef.current)}</time><span className="terminal-text">{streams.reason}</span></div>}
{historyOpen && <HistoryLogView streams={historyStreams} lines={historyLines} selectedStreamId={selectedHistoryStreamId} onSelect={selectHistoryStream} serverTime={serverTimeRef.current} />}
{!historyOpen && streams.status === "ready" && lines.length === 0 && <div className="terminal-line terminal-line-warn terminal-source-system"><time>{formatTerminalServerTime(serverTimeRef.current)}</time><span className="terminal-text">{liveSessionId ? "当前受管进程会话暂无输出，后续输出会自动追加。" : "当前没有可跟随的受管进程输出；旧日志可从历史查看。"}</span></div>}
{!historyOpen && lines.map((line) => <div key={line.id} className={terminalLineClassName(line)}><time>{line.at}</time><span className="terminal-text">{line.text}</span></div>)}
</div>
</section>
@@ -368,12 +371,13 @@ interface HistoryLogViewProps {
lines: HistoryLineState;
selectedStreamId: string;
onSelect: (streamId: string) => Promise<void>;
serverTime?: string;
}
function HistoryLogView({ streams, lines, selectedStreamId, onSelect }: HistoryLogViewProps) {
if (streams.status === "loading") return <TerminalStatusLine tone="info" label="正在加载历史日志列表。" />;
if (streams.status === "error") return <TerminalStatusLine tone="error" label={streams.reason} />;
if (streams.data.length === 0) return <TerminalStatusLine tone="warn" label="暂无可查看的历史日志流。" />;
function HistoryLogView({ streams, lines, selectedStreamId, onSelect, serverTime }: HistoryLogViewProps) {
if (streams.status === "loading") return <TerminalStatusLine tone="info" label="正在加载历史日志列表。" serverTime={serverTime} />;
if (streams.status === "error") return <TerminalStatusLine tone="error" label={streams.reason} serverTime={serverTime} />;
if (streams.data.length === 0) return <TerminalStatusLine tone="warn" label="暂无可查看的历史日志流。" serverTime={serverTime} />;
return (
<>
<div className="terminal-line terminal-line-info terminal-source-system">
@@ -385,17 +389,17 @@ function HistoryLogView({ streams, lines, selectedStreamId, onSelect }: HistoryL
</select>
</span>
</div>
{lines.status === "idle" && <TerminalStatusLine tone="info" label="请选择一个历史日志流。" />}
{lines.status === "loading" && <TerminalStatusLine tone="info" label="正在读取所选历史日志。" />}
{lines.status === "error" && <TerminalStatusLine tone="error" label={lines.reason} />}
{lines.status === "ready" && lines.data.length === 0 && <TerminalStatusLine tone="warn" label="所选历史日志流暂无保留内容。" />}
{lines.status === "idle" && <TerminalStatusLine tone="info" label="请选择一个历史日志流。" serverTime={serverTime} />}
{lines.status === "loading" && <TerminalStatusLine tone="info" label="正在读取所选历史日志。" serverTime={serverTime} />}
{lines.status === "error" && <TerminalStatusLine tone="error" label={lines.reason} serverTime={serverTime} />}
{lines.status === "ready" && lines.data.length === 0 && <TerminalStatusLine tone="warn" label="所选历史日志流暂无保留内容。" serverTime={serverTime} />}
{lines.status === "ready" && lines.data.map((line) => <div key={line.id} className={terminalLineClassName(line)}><time>{line.at}</time><span className="terminal-text">{line.text}</span></div>)}
</>
);
}
function TerminalStatusLine({ tone, label }: { tone: "info" | "warn" | "error"; label: string }) {
return <div className={`terminal-line terminal-line-${tone} terminal-source-system`}><time>{new Date().toLocaleTimeString()}</time><span className="terminal-text">{label}</span></div>;
function TerminalStatusLine({ tone, label, serverTime }: { tone: "info" | "warn" | "error"; label: string; serverTime?: string }) {
return <div className={`terminal-line terminal-line-${tone} terminal-source-system`}><time>{formatTerminalServerTime(serverTime)}</time><span className="terminal-text">{label}</span></div>;
}
function terminalQuickCommandsForPlugin(pluginId: string): TerminalQuickCommand[] {
@@ -419,9 +423,9 @@ function terminalLineFromLog(stream: LogStreamResponse, entry: LogEntryBody): Te
};
}
function terminalSystemLine(tone: TerminalLine["tone"], text: string, streamKey: string, id = `${streamKey.toLowerCase()}-${Date.now()}-${Math.random().toString(36).slice(2, 7)}`): TerminalLine {
const now = Date.now();
return { id, tone, text, at: new Date(now).toLocaleTimeString(), sortKey: now, streamKey };
function terminalSystemLine(tone: TerminalLine["tone"], text: string, streamKey: string, id = `${streamKey.toLowerCase()}-${Date.now()}-${Math.random().toString(36).slice(2, 7)}`, serverTime?: string): TerminalLine {
const sortKey = serverTime ? Date.parse(serverTime) : 0;
return { id, tone, text, at: formatTerminalServerTime(serverTime), sortKey, streamKey };
}
function terminalLineClassName(line: TerminalLine): string {
@@ -457,7 +461,7 @@ function terminalLineFromJob(job: JobResponse): TerminalLine {
const completed = job.updatedAt;
const sortKey = Date.parse(completed) || Date.now();
const tone: TerminalLine["tone"] = job.state === "succeeded" ? "success" : job.state === "failed" ? "error" : "warn";
return { id: `rcon-job-${job.id}-${job.state}`, tone, text: `RCON 任务 ${job.id} · ${jobStateLabel(job.state)} · ${summary}`, at: new Date(sortKey).toLocaleTimeString(), sortKey, streamKey: "PLATFORM" };
return { id: `rcon-job-${job.id}-${job.state}`, tone, text: `RCON 任务 ${job.id} · ${jobStateLabel(job.state)} · ${summary}`, at: formatTerminalServerTime(job.updatedAt), sortKey, streamKey: "PLATFORM" };
}
function jobStateLabel(state: JobResponse["state"]): string {
platform_web/utils/logTime.test.ts
+6 -1
View File
@@ -1,6 +1,6 @@
import { describe, expect, it } from "vitest";
import { formatTerminalLogTime } from "./logTime";
import { formatTerminalLogTime, formatTerminalServerTime } from "./logTime";
describe("formatTerminalLogTime", () => {
it("uses the SCUM log clock instead of the browser timezone", () => {
@@ -11,4 +11,9 @@ describe("formatTerminalLogTime", () => {
it("falls back to the event timestamp for generic logs", () => {
expect(formatTerminalLogTime("not-a-timestamp")).toBe("时间未知");
});
it("does not use the browser clock before the server clock is synchronized", () => {
expect(formatTerminalServerTime()).toBe("时间同步中");
expect(formatTerminalServerTime("2026-08-14T00:00:00Z")).toBe(formatTerminalLogTime("2026-08-14T00:00:00Z"));
});
});
platform_web/utils/logTime.ts
+4
View File
@@ -9,3 +9,7 @@ export function formatTerminalLogTime(timestamp: string, line?: string): string
const date = new Date(timestamp);
return Number.isNaN(date.getTime()) ? "时间未知" : date.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit", second: "2-digit" });
}
export function formatTerminalServerTime(timestamp?: string): string {
return timestamp ? formatTerminalLogTime(timestamp) : "时间同步中";
}