embedSandbox?: ControlUiEmbedSandboxMode;

allowExternalEmbedUrls?: boolean;

chatMessageMaxWidth?: string;

/** Resolved `agents.defaults.timeFormat`; "auto" keeps the browser locale default. */

timeFormat?: "auto" | "12" | "24";

};

assistantAgentId: string;

localMediaPreviewRoots?: string[];

chatMessageMaxWidth?: string;

timeFormat?: "auto" | "12" | "24";

};

}

{

root: { kind: "resolved", path: tmp },

config: {

agents: { defaults: { workspace: tmp } },

agents: { defaults: { workspace: tmp, timeFormat: "24" } },

gateway: { controlUi: { chatMessageMaxWidth: "min(1280px, 82%)" } },

ui: { assistant: { name: "</script><script>alert(1)//", avatar: "</script>.png" } },

},

expect(parsed.assistantAvatar).toBe("/avatar/main");

expect(parsed.assistantAgentId).toBe("main");

expect(parsed.chatMessageMaxWidth).toBe("min(1280px, 82%)");

expect(parsed.timeFormat).toBe("24");

expect(Array.isArray(parsed.localMediaPreviewRoots)).toBe(true);

},

});

: "scripts",

allowExternalEmbedUrls: config?.gateway?.controlUi?.allowExternalEmbedUrls === true,

chatMessageMaxWidth: config?.gateway?.controlUi?.chatMessageMaxWidth,

timeFormat: config?.agents?.defaults?.timeFormat,

} satisfies ControlUiBootstrapConfig);

return true;

}

import { html, render } from "lit";

import { afterEach, describe, expect, it, vi } from "vitest";

import { setUiTimeFormatPreference } from "../format.ts";

import type { MessageGroup } from "../types/chat-types.ts";

import {

formatChatTimestampForDisplay,

expect(sidebar.fullMessageRequest).toBeUndefined();

});

});

describe("formatChatTimestampForDisplay time format", () => {

const timestamp = Date.UTC(2026, 0, 15, 19, 30);

afterEach(() => {

setUiTimeFormatPreference("auto");

});

it("renders an AM/PM clock when preference is 12", () => {

setUiTimeFormatPreference("12");

const display = formatChatTimestampForDisplay(timestamp);

expect(display.label).toMatch(/AM|PM/i);

});

it("renders a 24-hour clock with no AM/PM when preference is 24", () => {

setUiTimeFormatPreference("24");

const display = formatChatTimestampForDisplay(timestamp);

expect(display.label).not.toMatch(/AM|PM/i);

});

});

import { getSafeLocalStorage } from "../../local-storage.ts";

import type { AssistantIdentity } from "../assistant-identity.ts";

import type { EmbedSandboxMode } from "../embed-sandbox.ts";

import { resolveUiHourCycleOptions } from "../format.ts";

import { icons } from "../icons.ts";

import { toSanitizedMarkdownHtml, toStreamingMarkdownHtml } from "../markdown.ts";

import { openExternalUrlSafe } from "../open-external-url.ts";

};

}

const hourCycle = resolveUiHourCycleOptions();

return {

label: date.toLocaleString([], {

...hourCycle,

month: "short",

day: "numeric",

year: "numeric",

hour: "numeric",

minute: "2-digit",

}),

title: date.toLocaleString([], {

...hourCycle,

weekday: "long",

month: "long",

day: "numeric",

/* @vitest-environment jsdom */

import { describe, expect, it, vi } from "vitest";

import { afterEach, describe, expect, it, vi } from "vitest";

import { CONTROL_UI_BOOTSTRAP_CONFIG_PATH } from "../../../../src/gateway/control-ui-contract.js";

import { resolveUiHourCycleOptions, setUiTimeFormatPreference } from "../format.ts";

import { loadControlUiBootstrapConfig } from "./control-ui-bootstrap.ts";

function requireFetchCall(fetchMock: ReturnType<typeof vi.fn>, index = 0) {

}

describe("loadControlUiBootstrapConfig", () => {

afterEach(() => {

setUiTimeFormatPreference("auto");

});

it("threads agents.defaults.timeFormat into the UI hour-cycle preference", async () => {

const fetchMock = vi.fn().mockResolvedValue({

ok: true,

json: async () => ({

basePath: "",

assistantName: "Main",

assistantAvatar: "M",

assistantAgentId: "main",

timeFormat: "24",

}),

});

vi.stubGlobal("fetch", fetchMock as unknown as typeof fetch);

const state = {

basePath: "",

assistantName: "Assistant",

assistantAvatar: null,

assistantAvatarSource: null,

assistantAvatarStatus: null,

assistantAvatarReason: null,

assistantAgentId: null,

localMediaPreviewRoots: [],

embedSandboxMode: "scripts" as const,

allowExternalEmbedUrls: false,

chatMessageMaxWidth: null,

serverVersion: null,

};

await loadControlUiBootstrapConfig(state);

expect(resolveUiHourCycleOptions()).toEqual({ hour12: false });

vi.unstubAllGlobals();

});

it("loads assistant identity from the bootstrap endpoint", async () => {

const fetchMock = vi.fn().mockResolvedValue({

ok: true,

} from "../../../../src/gateway/control-ui-contract.js";

import { normalizeAssistantIdentity } from "../assistant-identity.ts";

import { resolveControlUiAuthCandidates } from "../control-ui-auth.ts";

import { setUiTimeFormatPreference } from "../format.ts";

import { normalizeBasePath } from "../navigation.ts";

import { normalizeAgentId, parseAgentSessionKey } from "../session-key.ts";

import { loadLocalAssistantIdentity } from "../storage.ts";

typeof parsed.chatMessageMaxWidth === "string" && parsed.chatMessageMaxWidth.trim()

? parsed.chatMessageMaxWidth

: null;

setUiTimeFormatPreference(parsed.timeFormat);

} catch {

// Ignore bootstrap failures; UI will update identity after connecting.

}

// Control UI tests cover format behavior.

import { describe, expect, it } from "vitest";

import { afterEach, describe, expect, it } from "vitest";

import {

formatDateTimeMs,

formatDateMs,

formatTimeMs,

formatUnknownText,

parseSessionKeyParts,

setUiTimeFormatPreference,

stripThinkingTags,

} from "./format.ts";

});

});

describe("agents.defaults.timeFormat preference", () => {

// 19:30 UTC: 24-hour renders "19:30", 12-hour renders "7:30 PM".

const ts = Date.UTC(2026, 0, 15, 19, 30);

const opts: Intl.DateTimeFormatOptions = {

hour: "2-digit",

minute: "2-digit",

timeZone: "UTC",

};

afterEach(() => {

setUiTimeFormatPreference("auto");

});

it("forces a 24-hour clock when preference is 24", () => {

setUiTimeFormatPreference("24");

expect(formatTimeMs(ts, opts, "")).toBe("19:30");

});

it("forces a 12-hour clock when preference is 12", () => {

setUiTimeFormatPreference("12");

const formatted = formatTimeMs(ts, opts, "");

expect(formatted).toContain("7:30");

expect(formatted).toMatch(/PM/i);

});

it("lets the caller override the resolved hour cycle", () => {

setUiTimeFormatPreference("24");

expect(formatTimeMs(ts, { ...opts, hour12: true }, "")).toMatch(/PM/i);

});

it("leaves rendering to the browser locale default for auto", () => {

setUiTimeFormatPreference("auto");

const auto = formatDateTimeMs(ts, opts, "");

const native = new Date(ts).toLocaleString([], opts);

expect(auto).toBe(native);

});

});

describe("stripThinkingTags", () => {

it("strips <think>…</think> segments", () => {

const input = ["<think>", "secret", "</think>", "", "Hello"].join("\n");

return Object.prototype.toString.call(value);

}

export type UiTimeFormatPreference = "auto" | "12" | "24";

// Resolved `agents.defaults.timeFormat`, threaded in once at bootstrap. "auto"

// (or unset) keeps the browser locale default so existing deployments render

// unchanged; only "12"/"24" force an hour cycle across Control UI timestamps.

let uiTimeFormatPreference: UiTimeFormatPreference = "auto";

export function setUiTimeFormatPreference(value: UiTimeFormatPreference | null | undefined): void {

uiTimeFormatPreference = value === "12" || value === "24" ? value : "auto";

}

export function resolveUiHourCycleOptions(): Intl.DateTimeFormatOptions {

if (uiTimeFormatPreference === "12") {

return { hour12: true };

}

if (uiTimeFormatPreference === "24") {

return { hour12: false };

}

return {};

}

export function formatMs(ms?: number | null): string {

const timestampMs = asDateTimestampMs(ms);

if (timestampMs === undefined) {

return t("common.na");

}

return new Date(timestampMs).toLocaleString();

return new Date(timestampMs).toLocaleString([], resolveUiHourCycleOptions());

}

export function formatDateMs(

const timestampMs = asDateTimestampMs(ms);

return timestampMs === undefined

? fallback

: new Date(timestampMs).toLocaleTimeString([], options);

: new Date(timestampMs).toLocaleTimeString([], { ...resolveUiHourCycleOptions(), ...options });

}

export function formatDateTimeMs(

fallback = t("common.na"),

): string {

const timestampMs = asDateTimestampMs(ms);

return timestampMs === undefined ? fallback : new Date(timestampMs).toLocaleString([], options);

return timestampMs === undefined

? fallback

: new Date(timestampMs).toLocaleString([], { ...resolveUiHourCycleOptions(), ...options });

}

export function formatList(values?: Array<string | null | undefined>): string {