mulmoclaude 0.1.0

package/src/utils/api.ts

@@ -0,0 +1,218 @@
+// Single source of truth for Vue → MulmoClaude server HTTP calls.
+//
+// Before this module existed there were 56 scattered `fetch("/api/...")`
+// calls across 29 files, each doing its own JSON serialization, its own
+// `!res.ok` check, and its own ad-hoc error extraction. This made any
+// cross-cutting concern — auth headers, error formatting, retry policy,
+// logging — impossible to add without touching every call site.
+//
+// All HTTP traffic from the Vue app should now go through one of:
+//
+//   apiGet<T>(path, query?)
+//   apiPost<T>(path, body?)
+//   apiPut<T>(path, body?)
+//   apiDelete<T>(path, body?)
+//   apiCall<T>(path, opts)        ← generic, for methods not above
+//   apiFetchRaw(path, opts)       ← when you need the raw Response
+//                                   (binary, streaming, etc.)
+//
+// Return type is a discriminated union `ApiResult<T>`:
+//
+//   { ok: true, data: T }
+//   { ok: false, error: string, status: number }
+//
+// Callers pattern-match on `result.ok` — no more mixing try/catch with
+// `!res.ok` branches. Network errors and HTTP errors surface through the
+// same `{ ok: false }` shape.
+//
+// Future extension hooks (see #272 for auth token):
+//   - setAuthToken() populates a module-level token used by every call
+//   - interceptors could go here for logging, retry, metrics
+
+import { errorMessage } from "./errors";
+import { hasStringProp } from "./types";
+
+// ── Auth token (populated by bootstrap; consumed by every call) ─────
+
+let authToken: string | null = null;
+
+/**
+ * Set the bearer token used on every API call. Call once during app
+ * bootstrap, typically after reading a `<meta>` tag or window global
+ * populated by the server.
+ */
+export function setAuthToken(token: string | null): void {
+  authToken = token;
+}
+
+// ── Types ────────────────────────────────────────────────────────────
+
+export type ApiResult<T> = { ok: true; data: T } | { ok: false; error: string; status: number };
+
+export type ApiQuery = Record<string, string | number | boolean | undefined>;
+
+export interface ApiOptions {
+  method?: "GET" | "POST" | "PUT" | "PATCH" | "DELETE";
+  /** JSON-serialized into the request body. Omit for GET/DELETE. */
+  body?: unknown;
+  /** Appended as a query string. `undefined` values are dropped. */
+  query?: ApiQuery;
+  /** AbortSignal — pass through to fetch. */
+  signal?: AbortSignal;
+  /**
+   * Extra headers. Content-Type is set automatically for JSON bodies;
+   * Authorization is injected from `authToken`.
+   */
+  headers?: Record<string, string>;
+}
+
+// Use Parameters<typeof fetch> rather than global DOM lib types so
+// this module doesn't depend on DOM lib being in the ESLint globals.
+type FetchInit = Parameters<typeof fetch>[1];
+type FetchBody = NonNullable<FetchInit>["body"];
+
+// ── Internals ────────────────────────────────────────────────────────
+
+function buildQueryString(query: ApiQuery | undefined): string {
+  if (!query) return "";
+  const parts: string[] = [];
+  for (const [key, value] of Object.entries(query)) {
+    if (value === undefined) continue;
+    parts.push(`${encodeURIComponent(key)}=${encodeURIComponent(String(value))}`);
+  }
+  return parts.length === 0 ? "" : `?${parts.join("&")}`;
+}
+
+function buildHeaders(opts: { headers?: Record<string, string> }, hasBody: boolean): Record<string, string> {
+  const headers: Record<string, string> = { ...(opts.headers ?? {}) };
+  if (hasBody && headers["Content-Type"] === undefined) {
+    headers["Content-Type"] = "application/json";
+  }
+  if (authToken && headers["Authorization"] === undefined) {
+    headers["Authorization"] = `Bearer ${authToken}`;
+  }
+  return headers;
+}
+
+async function extractError(res: Response): Promise<{ error: string; status: number }> {
+  const status = res.status;
+  // Try to parse a `{ error: string }` body first — that's the server's
+  // standard error shape. `in` narrowing lets us read `body.error`
+  // without any type assertion.
+  try {
+    const body: unknown = await res.clone().json();
+    if (hasStringProp(body, "error")) {
+      return { error: body.error, status };
+    }
+  } catch {
+    // Body wasn't JSON — fall through.
+  }
+  return {
+    error: res.statusText || `Request failed (${status})`,
+    status,
+  };
+}
+
+// ── Core call ───────────────────────────────────────────────────────
+
+/**
+ * Generic HTTP call. Returns a discriminated union on success vs
+ * failure. Network errors are caught and surfaced as
+ * `{ ok: false, status: 0 }`. Assumes JSON response bodies (all
+ * MulmoClaude `/api/*` endpoints return JSON on success); use
+ * `apiFetchRaw` for binary / streaming / non-JSON responses.
+ */
+export async function apiCall<T = unknown>(path: string, opts: ApiOptions = {}): Promise<ApiResult<T>> {
+  const method = opts.method ?? "GET";
+  const hasBody = opts.body !== undefined;
+  const url = `${path}${buildQueryString(opts.query)}`;
+
+  const init: FetchInit = {
+    method,
+    headers: buildHeaders(opts, hasBody),
+    signal: opts.signal,
+  };
+  if (hasBody) {
+    init.body = JSON.stringify(opts.body);
+  }
+
+  let res: Response;
+  try {
+    res = await fetch(url, init);
+  } catch (err) {
+    return {
+      ok: false,
+      error: errorMessage(err),
+      status: 0,
+    };
+  }
+
+  if (!res.ok) {
+    const { error, status } = await extractError(res);
+    return { ok: false, error, status };
+  }
+
+  // `res.json()` returns `Promise<any>`, which is assignable to T
+  // without a cast.
+  try {
+    const data: T = await res.json();
+    return { ok: true, data };
+  } catch (err) {
+    return {
+      ok: false,
+      error: `Invalid JSON response: ${errorMessage(err)}`,
+      status: res.status,
+    };
+  }
+}
+
+// ── Convenience verbs ───────────────────────────────────────────────
+
+export function apiGet<T = unknown>(path: string, query?: ApiQuery, extra: Omit<ApiOptions, "method" | "body" | "query"> = {}): Promise<ApiResult<T>> {
+  return apiCall<T>(path, { ...extra, method: "GET", query });
+}
+
+export function apiPost<T = unknown>(path: string, body?: unknown, extra: Omit<ApiOptions, "method" | "body"> = {}): Promise<ApiResult<T>> {
+  return apiCall<T>(path, { ...extra, method: "POST", body });
+}
+
+export function apiPut<T = unknown>(path: string, body?: unknown, extra: Omit<ApiOptions, "method" | "body"> = {}): Promise<ApiResult<T>> {
+  return apiCall<T>(path, { ...extra, method: "PUT", body });
+}
+
+export function apiPatch<T = unknown>(path: string, body?: unknown, extra: Omit<ApiOptions, "method" | "body"> = {}): Promise<ApiResult<T>> {
+  return apiCall<T>(path, { ...extra, method: "PATCH", body });
+}
+
+export function apiDelete<T = unknown>(path: string, body?: unknown, extra: Omit<ApiOptions, "method" | "body"> = {}): Promise<ApiResult<T>> {
+  return apiCall<T>(path, { ...extra, method: "DELETE", body });
+}
+
+// ── Raw Response escape hatch ───────────────────────────────────────
+
+export interface RawOptions {
+  method?: string;
+  /** Accepts any value fetch accepts (string / Blob / FormData / …). */
+  body?: FetchBody;
+  headers?: Record<string, string>;
+  signal?: AbortSignal;
+  query?: ApiQuery;
+}
+
+/**
+ * Escape hatch for endpoints returning binary / streaming / non-JSON
+ * bodies (PDF download, audio blob, SSE, etc.). Auth header is still
+ * applied; other handling is the caller's responsibility.
+ *
+ * Throws on network errors. Does NOT check `res.ok`.
+ */
+export async function apiFetchRaw(path: string, opts: RawOptions = {}): Promise<Response> {
+  const url = `${path}${buildQueryString(opts.query)}`;
+  const init: FetchInit = {
+    method: opts.method ?? "GET",
+    headers: buildHeaders(opts, false),
+    body: opts.body,
+    signal: opts.signal,
+  };
+  return fetch(url, init);
+}

package/src/utils/canvas/viewMode.ts

@@ -0,0 +1,46 @@
+// Pure helpers for the canvas view mode.
+// The type also lives here, so test files and composables can
+// import it without pulling in a .vue file.
+//
+// To add a new view mode, add it to CANVAS_VIEW below in shortcut order.
+// Everything else (type, set, parser, shortcut) derives automatically.
+
+export const CANVAS_VIEW = {
+  single: "single",
+  stack: "stack",
+  files: "files",
+  todos: "todos",
+  scheduler: "scheduler",
+  wiki: "wiki",
+  skills: "skills",
+  roles: "roles",
+} as const;
+
+const VIEW_MODES = Object.values(CANVAS_VIEW);
+
+export type CanvasViewMode = (typeof CANVAS_VIEW)[keyof typeof CANVAS_VIEW];
+
+export function isCanvasViewMode(value: string): value is CanvasViewMode {
+  return (VIEW_MODES as readonly string[]).includes(value);
+}
+
+/** All valid view mode values — single source of truth for guards and parsers. */
+export const VALID_VIEW_MODES: ReadonlySet<string> = new Set(VIEW_MODES);
+
+export const VIEW_MODE_STORAGE_KEY = "canvas_view_mode";
+
+// Parse a value pulled out of localStorage. Anything other than the
+// known modes — including null — falls back to "single".
+export function parseStoredViewMode(stored: string | null): CanvasViewMode {
+  if (typeof stored === "string" && isCanvasViewMode(stored)) {
+    return stored;
+  }
+  return CANVAS_VIEW.single;
+}
+
+// Map a Cmd/Ctrl + N keyboard shortcut digit to its view mode.
+// Shortcut keys are 1-indexed into the VIEW_MODES array.
+export function viewModeForShortcutKey(key: string): CanvasViewMode | null {
+  const index = Number(key) - 1;
+  return VIEW_MODES[index] ?? null;
+}

package/src/utils/dom/authTokenMeta.ts

@@ -0,0 +1,20 @@
+// Read the bearer auth token that the server embeds into the
+// `<meta name="mulmoclaude-auth" content="…">` tag of index.html (#272).
+// Isolated in this tiny DOM-scoped module so it lives under
+// `src/utils/dom/` where ESLint already configures browser globals —
+// avoids promoting `src/main.ts` into the browser-globals override.
+//
+// Returns `null` when:
+//   - the meta tag is missing (placeholder never injected — shouldn't
+//     happen in production but guards against it)
+//   - the content attribute is empty (server embedded empty = no token
+//     available; every subsequent API call will 401, which is the
+//     correct dev-time signal)
+
+export function readAuthTokenFromMeta(): string | null {
+  const meta = document.querySelector('meta[name="mulmoclaude-auth"]');
+  if (meta === null) return null;
+  const content = meta.getAttribute("content");
+  if (content === null || content === "") return null;
+  return content;
+}

package/src/utils/dom/clickOutside.ts

@@ -0,0 +1,11 @@
+// Pure helper for "did this click happen outside both the trigger
+// button and the popup body?" — used by every dismiss-on-outside
+// popup. Lifted out so the boolean rule can be unit-tested without
+// a real DOM.
+
+export function isClickOutside(target: Node | null, buttonEl: HTMLElement | null, popupEl: HTMLElement | null): boolean {
+  if (!target) return false;
+  const insideButton = buttonEl?.contains(target) ?? false;
+  const insidePopup = popupEl?.contains(target) ?? false;
+  return !insideButton && !insidePopup;
+}

package/src/utils/dom/externalLink.ts

@@ -0,0 +1,57 @@
+// Click handler for rendered markdown / HTML bodies that opens
+// external (cross-origin) http(s) links in a new tab instead of
+// navigating the SPA away from itself.
+//
+// Split into a pure predicate (`isCrossOriginHttpUrl`) that's
+// exhaustively unit-tested, and a thin DOM wrapper
+// (`handleExternalLinkClick`) that reads the click event. Callers
+// invoke the wrapper from their own `@click` handler and check the
+// return value to decide whether to fall through to plugin-specific
+// navigation.
+
+// Pure predicate: is `href` an absolute http(s) URL pointing at an
+// origin different from `currentOrigin`? Used by
+// `handleExternalLinkClick` below, and directly by tests.
+//
+// Returns `false` for:
+//   - non-http schemes (mailto:, tel:, javascript:, file: …) — the
+//     browser's default behaviour is appropriate for those
+//   - same-origin URLs (including hash anchors resolved against the
+//     current page, which `anchor.href` normalises to a full URL)
+//   - malformed input that `URL` can't parse
+export function isCrossOriginHttpUrl(href: string, currentOrigin: string): boolean {
+  if (!href.startsWith("http://") && !href.startsWith("https://")) {
+    return false;
+  }
+  try {
+    return new URL(href).origin !== currentOrigin;
+  } catch {
+    return false;
+  }
+}
+
+// DOM click handler. Invoke from a view's `@click` listener on a
+// rendered-markdown container. If the event targets an external
+// http(s) link, the default navigation is cancelled and the link
+// opens in a new tab with `noopener,noreferrer`; returns `true` so
+// the caller knows the click was consumed. Returns `false` for
+// every other case (not an anchor, internal link, modifier-key
+// click, non-left-button, …) so the caller can continue with its
+// own plugin-specific click handling (e.g. wiki internal links).
+export function handleExternalLinkClick(event: MouseEvent): boolean {
+  if (event.button !== 0) return false;
+  if (event.ctrlKey || event.metaKey || event.shiftKey) return false;
+  const target = event.target as HTMLElement | null;
+  if (!target) return false;
+  const anchor = target.closest("a");
+  if (!anchor) return false;
+  // `.href` (DOM property) is always a fully-resolved URL; contrast
+  // `getAttribute("href")` which returns the raw attribute string.
+  // Using the resolved form gives us reliable origin checks and
+  // normalises relative paths away.
+  const url = anchor.href;
+  if (!isCrossOriginHttpUrl(url, window.location.origin)) return false;
+  event.preventDefault();
+  window.open(url, "_blank", "noopener,noreferrer");
+  return true;
+}

package/src/utils/dom/scrollable.ts

@@ -0,0 +1,24 @@
+// Small DOM helpers shared across components.
+
+// Walk a container's descendants and return the first one that
+// has both more vertical content than its visible height AND a
+// CSS overflow that allows scrolling. Used so canvas-level arrow
+// keys can scroll whichever inner element actually owns the
+// scrollbar (e.g. a plugin's view component).
+//
+// Pure in the "no Vue / no module state" sense — it does touch the
+// DOM, so its tests use a synthetic element graph rather than the
+// real DOM.
+export function findScrollableChild(container: HTMLElement): HTMLElement | null {
+  const children = container.querySelectorAll("*");
+  for (const el of children) {
+    const html = el as HTMLElement;
+    if (html.scrollHeight > html.clientHeight) {
+      const style = getComputedStyle(html);
+      if (style.overflowY === "auto" || style.overflowY === "scroll" || style.overflow === "auto" || style.overflow === "scroll") {
+        return html;
+      }
+    }
+  }
+  return null;
+}

package/src/utils/errors.ts

@@ -0,0 +1,11 @@
+// Shared error helpers for the Vue side. Mirrors the server-side
+// `server/utils/errors.ts` so the same helper is available wherever
+// we handle caught exceptions.
+//
+// Use `errorMessage(err)` instead of inlining
+// `err instanceof Error ? err.message : String(err)` — searching for
+// one canonical helper is easier than grepping for the inline form.
+
+export function errorMessage(err: unknown): string {
+  return err instanceof Error ? err.message : String(err);
+}

package/src/utils/files/expandedDirs.ts

@@ -0,0 +1,25 @@
+// Pure helpers for persisting the FileTree expand/collapse state.
+// Kept Vue-free so the parsing rules are unit-testable in isolation.
+
+export const EXPANDED_DIRS_STORAGE_KEY = "files_expanded_dirs";
+
+// Default: only the workspace root ("") is expanded — matches the
+// pre-persistence behavior of FileTree.vue, where nested dirs start
+// collapsed so opening Files mode doesn't render the whole tree.
+const DEFAULT_EXPANDED: ReadonlyArray<string> = [""];
+
+export function parseStoredExpandedDirs(raw: string | null): Set<string> {
+  if (raw === null) return new Set(DEFAULT_EXPANDED);
+  try {
+    const parsed: unknown = JSON.parse(raw);
+    if (!Array.isArray(parsed)) return new Set(DEFAULT_EXPANDED);
+    const strings = parsed.filter((v): v is string => typeof v === "string");
+    return new Set(strings);
+  } catch {
+    return new Set(DEFAULT_EXPANDED);
+  }
+}
+
+export function serializeExpandedDirs(set: Set<string>): string {
+  return JSON.stringify([...set]);
+}

package/src/utils/files/filename.ts

@@ -0,0 +1,12 @@
+// Strip filesystem-hostile chars from a string so it can safely be used
+// as a browser download filename across Windows / macOS / Linux. Not a
+// full slugifier — server-side slugification lives in
+// `server/utils/slug.ts` and is applied before data hits the client.
+// This helper is the last-line defensive escape for plugin views that
+// build a download filename from arbitrary title text.
+const UNSAFE_FILENAME_CHARS = /[/\\:*?"<>|]/g;
+
+export function toSafeFilename(name: string, fallback = "download"): string {
+  const cleaned = name.replace(UNSAFE_FILENAME_CHARS, "_").trim();
+  return cleaned || fallback;
+}

package/src/utils/files/sortChildren.ts

@@ -0,0 +1,20 @@
+import type { TreeNode } from "../../types/fileTree";
+import type { FileSortMode } from "../../composables/useFileSortMode";
+
+// Sort tree children: directories always come before files; within
+// each group, "name" is locale-aware alphabetical and "recent" is
+// newest-first by modifiedMs (missing mtimes sort last, then tie-break
+// on name so the order is deterministic).
+export function sortChildren(children: readonly TreeNode[], mode: FileSortMode): TreeNode[] {
+  const copy = children.slice();
+  copy.sort((a, b) => {
+    if (a.type !== b.type) return a.type === "dir" ? -1 : 1;
+    if (mode === "recent") {
+      const am = a.modifiedMs ?? -Infinity;
+      const bm = b.modifiedMs ?? -Infinity;
+      if (am !== bm) return bm - am;
+    }
+    return a.name.localeCompare(b.name);
+  });
+  return copy;
+}

package/src/utils/filesPreview/schedulerPreview.ts

@@ -0,0 +1,38 @@
+// Synthesize a ToolResultComplete<SchedulerData> from raw scheduler
+// items.json content so FilesView can render it with the scheduler
+// plugin's calendar view. Extracted from FilesView.vue (#507 step 8).
+
+import type { ToolResultComplete } from "gui-chat-protocol/vue";
+import type { SchedulerData, ScheduledItem } from "../../plugins/scheduler/index";
+import { WORKSPACE_FILES } from "../../config/workspacePaths";
+import { isRecord } from "../types";
+
+function isScheduledItem(value: unknown): value is ScheduledItem {
+  if (!isRecord(value)) return false;
+  if (typeof value.id !== "string") return false;
+  if (typeof value.title !== "string") return false;
+  return true;
+}
+
+function isScheduledItemArray(value: unknown): value is ScheduledItem[] {
+  return Array.isArray(value) && value.every(isScheduledItem);
+}
+
+export function toSchedulerResult(selectedPath: string | null, rawText: string | null): ToolResultComplete<SchedulerData> | null {
+  if (selectedPath !== WORKSPACE_FILES.schedulerItems) return null;
+  if (rawText === null) return null;
+  let parsed: unknown;
+  try {
+    parsed = JSON.parse(rawText);
+  } catch {
+    return null;
+  }
+  if (!isScheduledItemArray(parsed)) return null;
+  return {
+    uuid: "files-scheduler-preview",
+    toolName: "manageScheduler",
+    message: WORKSPACE_FILES.schedulerItems,
+    title: "Scheduler",
+    data: { items: parsed },
+  };
+}

package/src/utils/filesPreview/todoPreview.ts

@@ -0,0 +1,40 @@
+// Synthesize a ToolResultComplete<TodoData> from raw todos.json
+// content so FilesView can render it with the TodoExplorer.
+// Extracted from FilesView.vue (#507 step 8).
+
+import type { ToolResultComplete } from "gui-chat-protocol/vue";
+import type { StatusColumn, TodoData, TodoItem } from "../../plugins/todo/index";
+import { WORKSPACE_FILES } from "../../config/workspacePaths";
+import { isRecord } from "../types";
+
+function isTodoItem(value: unknown): value is TodoItem {
+  if (!isRecord(value)) return false;
+  if (typeof value["id"] !== "string" || typeof value["text"] !== "string") return false;
+  if (typeof value["completed"] !== "boolean") return false;
+  if (typeof value["createdAt"] !== "number") return false;
+  return true;
+}
+
+function isTodoItemArray(value: unknown): value is TodoItem[] {
+  return Array.isArray(value) && value.every(isTodoItem);
+}
+
+export function toTodoExplorerResult(selectedPath: string | null, rawText: string | null): ToolResultComplete<TodoData> | null {
+  if (selectedPath !== WORKSPACE_FILES.todosItems) return null;
+  if (rawText === null) return null;
+  let parsed: unknown;
+  try {
+    parsed = JSON.parse(rawText);
+  } catch {
+    return null;
+  }
+  const items: TodoItem[] = isTodoItemArray(parsed) ? parsed : [];
+  const columns: StatusColumn[] = [];
+  return {
+    uuid: "files-todo-preview",
+    toolName: "manageTodoList",
+    message: WORKSPACE_FILES.todosItems,
+    title: "Todo",
+    data: { items, columns },
+  };
+}

package/src/utils/format/date.ts

@@ -0,0 +1,85 @@
+// Pure date/time formatting helpers for the Vue frontend.
+// All functions are locale-aware on purpose; tests assert
+// structural properties only, not exact strings.
+
+/** "Apr 11 06:32" — short month + day + 24h time. */
+export function formatDate(iso: string): string {
+  const date = new Date(iso);
+  return (
+    date.toLocaleDateString(undefined, { month: "short", day: "numeric" }) + " " + date.toLocaleTimeString(undefined, { hour: "2-digit", minute: "2-digit" })
+  );
+}
+
+/** "Apr 11 06:32" — same format as formatDate but from epoch ms. */
+export function formatDateTime(epochMs: number): string {
+  return new Date(epochMs).toLocaleString(undefined, {
+    month: "short",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit",
+  });
+}
+
+/** "06:32:15" — locale time string from epoch ms. */
+export function formatTime(epochMs: number): string {
+  return new Date(epochMs).toLocaleTimeString();
+}
+
+/** "06:32" — short HH:MM. Accepts Date, epoch ms, or ISO string. */
+export function formatShortTime(value: Date | number | string): string {
+  try {
+    const date = value instanceof Date ? value : new Date(value);
+    return date.toLocaleTimeString([], {
+      hour: "2-digit",
+      minute: "2-digit",
+    });
+  } catch {
+    return String(value);
+  }
+}
+
+/** "Apr 11" — short month + day. Accepts Date, epoch ms, or ISO string. */
+export function formatShortDate(value: Date | number | string): string {
+  const date = value instanceof Date ? value : new Date(value);
+  return date.toLocaleDateString(undefined, {
+    month: "short",
+    day: "numeric",
+  });
+}
+
+/** True when two Dates fall on the same calendar day. */
+export function isSameDay(left: Date, right: Date): boolean {
+  return left.getFullYear() === right.getFullYear() && left.getMonth() === right.getMonth() && left.getDate() === right.getDate();
+}
+
+/** True when the given Date is today. */
+export function isToday(date: Date): boolean {
+  return isSameDay(date, new Date());
+}
+
+/** "14:32" for today, "Apr 16 14:32" for past dates. Works with
+ *  both epoch ms (number) and ISO strings. */
+export function formatSmartTime(value: number | string): string {
+  const date = new Date(value);
+  const time = formatShortTime(date);
+  if (isToday(date)) return time;
+  return `${formatShortDate(date)} ${time}`;
+}
+
+const ONE_MINUTE = 60_000;
+const ONE_HOUR = 3_600_000;
+const ONE_DAY = 86_400_000;
+
+/** "just now", "5m ago", "2h ago", "Apr 11" — relative time from ISO string. */
+export function formatRelativeTime(iso: string): string {
+  try {
+    const date = new Date(iso);
+    const diffMs = Date.now() - date.getTime();
+    if (diffMs < ONE_MINUTE) return "just now";
+    if (diffMs < ONE_HOUR) return `${Math.floor(diffMs / ONE_MINUTE)}m ago`;
+    if (diffMs < ONE_DAY) return `${Math.floor(diffMs / ONE_HOUR)}h ago`;
+    return formatShortDate(date);
+  } catch {
+    return iso;
+  }
+}