@anchrd/intel-ui 0.18.0 → 0.20.0

package/src/agent/agent-cron/agent-cron.ts

@@ -1,68 +0,0 @@
-import { Cron } from "croner";
-
-/**
- * When a five-field cron expression fires next, read in the schedule's own timezone.
- *
- * ⚠️ This is still a second copy of `packages/agent/src/schedule/cron/cron.ts` — the runtime imports
- * nothing from the contract and this package cannot import a Worker package, so there remains no
- * third place for it. What changed with #228 is WHAT is duplicated: both files are now a thin
- * wrapper over croner, and the part that could actually disagree — the matching, DST, the day-field
- * OR rule — is one implementation in the library.
- *
- * That was the real risk. The old comment put it plainly: "a calendar that promises 08:00 while the
- * alarm fires at 09:00 is worse than a calendar that says nothing" — and two independent
- * reimplementations of timezone arithmetic is exactly how that happens.
- */
-
-// One year is the search bound. An expression that matches nothing within a year — "31st of
-// February" — has no next fire time, and saying so beats stepping forever.
-const MaxYearsAhead = 1;
-
-function schedule(expression: string, timezone: string): Cron | null {
-  try {
-    const job = new Cron(expression.trim(), { timezone, paused: true });
-    // croner also accepts six fields (with seconds). Intel's contract is five, and so is the hint
-    // shown next to the input — a six-field expression must not quietly mean something else.
-    return expression.trim().split(/\s+/).length === 5 ? job : null;
-  } catch {
-    return null;
-  }
-}
-
-// ⚠️ The croner call is inside the try, not only the construction. An unknown timezone can surface
-// either place depending on when croner first converts a date — and an exception escaping here ends
-// up inside a Durable Object alarm, which is the one place nobody is watching.
-function runs(expression: string, after: Date, count: number, timezone: string): Date[] {
-  const job = schedule(expression, timezone);
-  if (!job) return [];
-  try {
-    return job.nextRuns(count, after);
-  } catch {
-    return [];
-  }
-}
-
-export function nextCronFire(expression: string, after: Date, timezone: string): Date | null {
-  // Strictly after: a schedule that just fired must not match the same minute again. croner's
-  // `nextRuns(…, from)` is already exclusive of `from`.
-  const next = runs(expression, after, 1, timezone)[0];
-  if (!next) return null;
-  const limit = new Date(after.getTime());
-  limit.setUTCFullYear(limit.getUTCFullYear() + MaxYearsAhead);
-  return next > limit ? null : next;
-}
-
-/**
- * The next `count` fire times of one expression.
- *
- * An unparseable or never-matching expression yields an empty list — the caller says "nothing"
- * rather than guessing.
- */
-export function nextCronFires(
-  expression: string,
-  after: Date,
-  count: number,
-  timezone: string,
-): Date[] {
-  return runs(expression, after, count, timezone);
-}

package/src/agent/agent-definition/agent-definition.ts

@@ -1,96 +0,0 @@
-import type { AgentDefinition, AgentDefinitionInput, NodeAgent } from "@anchrd/intel-contract";
-import {
-  type UseMutationResult,
-  type UseQueryResult,
-  useMutation,
-  useQuery,
-  useQueryClient,
-} from "@tanstack/react-query";
-import { nextCronFires } from "@/agent/agent-cron/agent-cron.ts";
-import { useIntelRouterContext } from "@/router/router-context.ts";
-
-export const agentKey = (nodeId: string) => ["agent", nodeId] as const;
-
-export interface AgentDefinitionHandle {
-  query: UseQueryResult<NodeAgent>;
-  definition: AgentDefinition | null;
-  save: UseMutationResult<NodeAgent, Error, AgentDefinitionInput>;
-}
-
-/**
- * The definition as it was read, turned back into something this screen may ASK for (D30).
- *
- * ⚠️ It exists to drop exactly one field: `tools.delegatedBy`. Whose portal connection an agent
- * acts on is Intel's to write, out of the session, and the input shape has no place for it — so a
- * section that edits schedules must not carry it along just because it was in what it read. Every
- * section spreads this rather than the definition itself, which is why none of them has to invent a
- * user id for an agent that has no tools yet.
- */
-export function asDraft(definition: AgentDefinition): AgentDefinitionInput {
-  return {
-    references: definition.references,
-    schedules: definition.schedules,
-    model: definition.model,
-    tools: definition.tools === null ? null : { servers: definition.tools.servers },
-  };
-}
-
-/**
- * One agent's definition, and the one way to change it.
- *
- * ⚠️ Every edit writes a whole new definition version — there is no field-level update, by design
- * (ADR-0005): a definition is one immutable document, and what a run read is meant to stay
- * readable afterwards. So each section on the profile hands over the definition it wants next,
- * whole, and the version it was read from travels as `baseVersionId`. Somebody else's parallel
- * change is then a refusal instead of a silent overwrite.
- */
-export function useAgentDefinition(nodeId: string): AgentDefinitionHandle {
-  const { data } = useIntelRouterContext();
-  const queryClient = useQueryClient();
-  const query = useQuery({ queryKey: agentKey(nodeId), queryFn: () => data.getAgent(nodeId) });
-  const save = useMutation({
-    mutationFn: async (definition: AgentDefinitionInput) =>
-      await data.saveAgentDefinition({
-        nodeId,
-        baseVersionId: query.data?.version?.id ?? null,
-        definition,
-        idempotencyKey: crypto.randomUUID(),
-      }),
-    // The answer carries the new version, so the cache is set from it rather than refetched: the
-    // next save needs that id as its `baseVersionId`, and a round trip would leave a window in
-    // which it is still the old one.
-    onSuccess: (saved) => queryClient.setQueryData(agentKey(nodeId), saved),
-    // ⚠️ A failed save may still have MOVED the version (#214): `agent_schedules_not_armed` means
-    // the definition was written and only the runtime's alarm was not set, and the repair it names
-    // is saving again. With the old `baseVersionId` still cached that second save would answer 409
-    // instead — so the version this screen writes against is refetched whenever a save fails.
-    onError: () => queryClient.invalidateQueries({ queryKey: agentKey(nodeId) }),
-  });
-  return { query, definition: query.data?.definition ?? null, save };
-}
-
-/**
- * When this agent next does something on its own, across all of its schedules — and in which zone
- * that time is meant.
- *
- * ⚠️ Derived from the cron expressions, never asked. The runtime arms one alarm at a time and does
- * not publish it, so this is a reading of the same expressions by the same rules — since #228 both
- * sides read them through croner, so the reading and the alarm cannot drift apart.
- *
- * ⚠️ The zone travels WITH the time. Two schedules of one agent may sit in different zones, so a
- * single "all times are X" line above the screen would be a lie for one of them; the caller formats
- * each instant in the zone it came back with.
- */
-export function nextRunAt(
-  definition: AgentDefinition | null,
-  now: Date,
-): { at: Date; timezone: string } | null {
-  const fires = (definition?.schedules ?? []).flatMap((schedule) => {
-    const at = nextCronFires(schedule.cron, now, 1, schedule.timezone)[0];
-    return at ? [{ at, timezone: schedule.timezone }] : [];
-  });
-  return fires.reduce<{ at: Date; timezone: string } | null>(
-    (earliest, fire) => (earliest === null || fire.at < earliest.at ? fire : earliest),
-    null,
-  );
-}

package/src/agent/agent-delegation-notice/agent-delegation-notice.ts

@@ -1,48 +0,0 @@
-import type { I18n } from "@/i18n/i18n.types.ts";
-
-export interface DelegationReading {
-  /** Whose portal connection the agent's tools run on — `null` while nothing is delegated. */
-  delegatedBy: string | null;
-  /** The signed-in person, or `null` while the session has not been read yet. */
-  viewerId: string | null;
-  /** The delegator's display name, or `null` where this browser cannot resolve it (#261). */
-  delegatorName: string | null;
-}
-
-/**
- * Whose connection the tools run on, said so that it stays true for whoever is reading (#258).
- *
- * ⚠️ "Anyone who may run this agent acts on YOUR connection" was the whole sentence until #258, and
- * it is wrong for everybody except the delegator — on the one line in the product where somebody
- * learns whose access is being spent. It survives only where it is the strongest true form:
- *
- *   nothing delegated   nobody has given anything away yet, and whoever saves the tool selection
- *                       next becomes the delegator. For the reader, that is them.
- *   the reader's own    they ARE the delegator, so "your connection" says it harder than their name
- *                       would. Two readings rather than one are worth it for exactly this: the
- *                       sentence is about a consequence for the reader, and "your" is the word that
- *                       carries a consequence.
- *   somebody else's     the name. And where the name cannot be resolved — which is most ids today,
- *                       because Intel has no user directory (#261) — a sentence that names nobody,
- *                       never an invented name and never silence. WHOSE access is spent may be
- *                       unknown; THAT somebody else's is spent must not be.
- *
- * ⚠️ One catalog key per reading, each a whole sentence with the name as a parameter. A sentence
- * glued together from "acts on" + name + "'s connection" bakes an English possessive into the code,
- * and no other language would get to put it anywhere else.
- *
- * ⚠️ An empty `delegatedBy` reads as "somebody else's", not as "yours". The runtime has that case
- * for an archived agent and a definition it could not read (`packages/api/src/tools/tools.ts:39`),
- * and it is the one case where being wrong in the reader's favour is worst.
- */
-export function delegationNotice(i18n: I18n, reading: DelegationReading): string {
-  const { delegatedBy, viewerId, delegatorName } = reading;
-  if (delegatedBy === null) return i18n.t("agent.toolsDelegationNotice");
-  if (delegatedBy.length > 0 && delegatedBy === viewerId) {
-    return i18n.t("agent.toolsDelegationNotice");
-  }
-  if (delegatorName !== null) {
-    return i18n.t("agent.toolsDelegationNoticeBy", { name: delegatorName });
-  }
-  return i18n.t("agent.toolsDelegationNoticeSomebody");
-}

package/src/agent/agent-entry-title/agent-entry-title.ts

@@ -1,72 +0,0 @@
-import type { NodeKind } from "@anchrd/intel-contract";
-import { useQuery } from "@tanstack/react-query";
-import { useI18n } from "@/i18n/i18n-context.tsx";
-import { useIntelRouterContext } from "@/router/router-context.ts";
-
-export interface EntryTitle {
-  title: string;
-  known: boolean;
-  /** The kind of node this is, or `null` for a flow and for anything not available to the reader. */
-  kind: NodeKind | null;
-  /**
-   * The folders it is filed in, outermost first — empty at the top of the tree (#255).
-   *
-   * ⚠️ Only the ancestors the reader may see. The walk stops at the first one that is missing from
-   * the graph, so a partial path is possible and is the honest answer: the graph holds exactly what
-   * this reader may know about, and inventing a step would name a folder to somebody who may not
-   * know it exists (#41).
-   */
-  path: string[];
-}
-
-/**
- * The name behind an id, read from the lists the tree already loads.
- *
- * ⚠️ An entry the reader may not see is absent from both lists, and this then answers "not
- * available to you" rather than a raw id or an invented title. Deliberately the same answer a
- * reference to something deleted gets: the two must not be distinguishable, or the row would
- * confirm that a document exists to somebody who may not know it (#41).
- *
- * Its own module because two screens need it — the profile's references and schedules, and the
- * "run now" menu in the page head, which has to name the targets it offers.
- */
-export function useEntryTitle(entryId: string, flow = false): EntryTitle {
-  const { data } = useIntelRouterContext();
-  const i18n = useI18n();
-  const graph = useQuery({
-    queryKey: ["node-graph"],
-    queryFn: () => data.getNodeGraph(),
-    enabled: !flow,
-  });
-  const flows = useQuery({ queryKey: ["flows"], queryFn: () => data.listFlows(), enabled: flow });
-  if (flow) {
-    const found = flows.data?.items.find((item) => item.id === entryId);
-    if (found) return { title: found.title, known: true, kind: null, path: [] };
-    return { ...unknown(i18n, flows.isPending), kind: null };
-  }
-
-  const nodes = graph.data?.nodes ?? [];
-  const found = nodes.find((node) => node.id === entryId);
-  if (!found) return { ...unknown(i18n, graph.isPending), kind: null };
-
-  // Upwards from the node, then reversed: outermost folder first, which is how a path reads.
-  const path: string[] = [];
-  const seen = new Set<string>([found.id]);
-  let parentId = found.parentId;
-  while (parentId !== null && !seen.has(parentId)) {
-    seen.add(parentId);
-    const parent = nodes.find((node) => node.id === parentId);
-    if (!parent) break;
-    path.unshift(parent.title);
-    parentId = parent.parentId;
-  }
-  return { title: found.title, known: true, kind: found.kind, path };
-}
-
-function unknown(i18n: ReturnType<typeof useI18n>, pending: boolean) {
-  return {
-    title: i18n.t(pending ? "common.loading" : "agent.unknownEntry"),
-    known: false,
-    path: [] as string[],
-  };
-}

package/src/agent/agent-log/agent-log.tsx

@@ -1,308 +0,0 @@
-import type { AgentCosts } from "@anchrd/intel-contract";
-import { useQuery } from "@tanstack/react-query";
-import { ChevronDown, ChevronRight } from "lucide-react";
-import { useState } from "react";
-import {
-  formatCost,
-  formatTokens,
-  type RunCost,
-  runCost,
-  runUsage,
-  useAgentCosts,
-} from "@/agent/agent-costs/agent-costs.ts";
-import type { AgentRun } from "@/data/agent-runtime/agent-runtime.ts";
-import type { I18n } from "@/i18n/i18n.types.ts";
-import { useI18n } from "@/i18n/i18n-context.tsx";
-import { useIntelRouterContext } from "@/router/router-context.ts";
-
-/**
- * What this agent has done, newest first.
- *
- * ⚠️ Read from the RUNTIME, not from intel: runs live in the agent's own Durable Object and are
- * trimmed there. So this list is short by design and has no paging — the runtime answers at most a
- * hundred runs and keeps no more.
- *
- * ⚠️ A run says what it did, when it failed what stopped it, and since #268 what it answered — but
- * only for the runs nobody was watching (`schedule`, `manual`, `task`). A chat answer belongs to the
- * person it was streamed to and a mail answer to the correspondent, and the runtime deliberately
- * stores neither where this list could reach it.
- *
- * ⚠️ Since #251 it also says what each run consumed and what it cost — and the two come from
- * DIFFERENT places on purpose. The tokens are the runtime's own record; the money is Cloudflare's
- * gateway log, read by intel. Either can be missing without the other, and each says so on its own
- * rather than being folded into one number that would be half a guess.
- */
-export function AgentLog({ agentId }: { agentId: string }) {
-  const { data } = useIntelRouterContext();
-  const i18n = useI18n();
-  const [openRunId, setOpenRunId] = useState<string | null>(null);
-  const runs = useQuery({
-    queryKey: ["agent-runs", agentId],
-    queryFn: () => data.listAgentRuns(agentId),
-  });
-  const costs = useAgentCosts(agentId);
-
-  return (
-    <section aria-label={i18n.t("agent.log")} className="min-h-0 flex-1 overflow-y-auto px-6 py-5">
-      {runs.isPending ? (
-        <p className="text-sm text-muted-foreground">{i18n.t("common.loading")}</p>
-      ) : null}
-      {runs.isError ? (
-        <div role="alert" className="space-y-3 text-sm">
-          <p className="text-destructive">{i18n.t("agent.logFailed")}</p>
-          <button
-            type="button"
-            onClick={() => void runs.refetch()}
-            className="rounded-md border px-3 py-2 outline-none hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring"
-          >
-            {i18n.t("common.retry")}
-          </button>
-        </div>
-      ) : null}
-      {runs.data && runs.data.items.length === 0 ? (
-        <p className="text-sm text-muted-foreground">{i18n.t("agent.logEmpty")}</p>
-      ) : null}
-      {runs.data && runs.data.items.length > 0 ? (
-        <>
-          <CostSummary costs={costs.data} />
-          <ul className="space-y-2">
-            {runs.data.items.map((run) => (
-              <RunRow
-                key={run.id}
-                agentId={agentId}
-                run={run}
-                cost={runCost(costs.data, run.id)}
-                open={openRunId === run.id}
-                toggle={() => setOpenRunId(openRunId === run.id ? null : run.id)}
-              />
-            ))}
-          </ul>
-        </>
-      ) : null}
-    </section>
-  );
-}
-
-/**
- * What the agent has cost over the two windows, above the list it belongs to.
- *
- * ⚠️ Where the figures are missing this says WHY, in a sentence, instead of showing nothing. A cost
- * view that stayed blank when the gateway was unreachable looks exactly like an agent that has cost
- * nothing — which is the reading this whole feature exists to prevent.
- *
- * ⚠️ `partial` is spelled out rather than hidden behind a symbol. A total that stopped counting is
- * not a total, and a reader comparing this month with last needs to know the number is a floor.
- */
-function CostSummary({ costs }: { costs: AgentCosts | undefined }) {
-  const i18n = useI18n();
-  if (!costs) return null;
-  if (costs.status !== "read") {
-    return (
-      <p className="mb-3 text-sm text-muted-foreground">
-        {i18n.t(
-          costs.status === "not_configured" ? "agent.costNotConfigured" : "agent.costUnreadable",
-        )}
-      </p>
-    );
-  }
-
-  return (
-    <div className="mb-3 space-y-1">
-      <dl className="flex flex-wrap items-baseline gap-x-6 gap-y-1 text-sm">
-        {costs.windows.map((window) => (
-          <div key={window.days} className="flex items-baseline gap-2">
-            <dt className="text-muted-foreground">
-              {i18n.t("agent.costWindow", { days: String(window.days) })}
-            </dt>
-            <dd className="font-medium">{formatCost(window.cost, i18n.locale)}</dd>
-            <dd className="text-xs text-muted-foreground">
-              {i18n.t("agent.costWindowCalls", { count: String(window.calls) })}
-            </dd>
-          </div>
-        ))}
-      </dl>
-      {costs.partial ? (
-        <p className="text-xs text-muted-foreground">{i18n.t("agent.costPartial")}</p>
-      ) : null}
-    </div>
-  );
-}
-
-/**
- * What one run consumed, in the four counters that are priced differently.
- *
- * ⚠️ Cache reads stand APART from fresh input and are never added into one number. They are the
- * figure #250 is visible in — a read costs about a tenth of an ordinary input token — and in a
- * total they disappear completely.
- */
-function RunUsage({ run, i18n }: { run: AgentRun; i18n: I18n }) {
-  const usage = runUsage(run);
-  if (!usage) {
-    // ⚠️ Two different sentences, and the difference is worth the extra key. "Nothing recorded" is a
-    // run from before #250; "the provider reports nothing" is every Workers AI run, for good.
-    return (
-      <span className="text-muted-foreground">
-        {i18n.t(run.usage ? "agent.usageNotReported" : "agent.usageUnknown")}
-      </span>
-    );
-  }
-  return (
-    <span className="text-muted-foreground">
-      {i18n.t("agent.usage", {
-        input: formatTokens(usage.inputTokens, i18n.locale),
-        output: formatTokens(usage.outputTokens, i18n.locale),
-        cacheRead: formatTokens(usage.cacheReadInputTokens, i18n.locale),
-        cacheWrite: formatTokens(usage.cacheCreationInputTokens, i18n.locale),
-      })}
-    </span>
-  );
-}
-
-/**
- * ⚠️ Four outcomes, one of which is a number. A run the gateway has no line for says so; it does
- * NOT show a zero, and it does not silently disappear from a column its neighbours fill.
- */
-function RunCostLabel({ cost, i18n }: { cost: RunCost; i18n: I18n }) {
-  if (cost.kind === "known") {
-    return <span className="font-medium">{formatCost(cost.cost, i18n.locale)}</span>;
-  }
-  // The two deployment-wide reasons are already stated once above the list, so a row under them
-  // stays quiet rather than repeating the same sentence for every run on the screen.
-  if (cost.kind !== "missing") return null;
-  return <span className="text-muted-foreground">{i18n.t("agent.costMissing")}</span>;
-}
-
-function RunRow({
-  agentId,
-  run,
-  cost,
-  open,
-  toggle,
-}: {
-  agentId: string;
-  run: AgentRun;
-  cost: RunCost;
-  open: boolean;
-  toggle(): void;
-}) {
-  const i18n = useI18n();
-  const failed = run.status === "failed";
-  const Chevron = open ? ChevronDown : ChevronRight;
-  return (
-    <li className="rounded-lg border bg-card">
-      <button
-        type="button"
-        onClick={toggle}
-        aria-expanded={open}
-        className="flex w-full items-start gap-3 rounded-lg px-4 py-3 text-left outline-none hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring"
-      >
-        <Chevron aria-hidden="true" className="mt-0.5 size-4 shrink-0 text-muted-foreground" />
-        <span className="min-w-0 flex-1">
-          <span className="flex flex-wrap items-center gap-x-3 gap-y-1 text-sm">
-            <span
-              className={`rounded-full border px-2 py-0.5 text-xs ${failed ? "border-destructive/40 text-destructive" : "text-muted-foreground"}`}
-            >
-              {i18n.t(`runs.status.${run.status}`)}
-            </span>
-            <time dateTime={run.startedAt}>
-              {new Date(run.startedAt).toLocaleString(i18n.locale)}
-            </time>
-            <span className="text-muted-foreground">{i18n.t(`agent.trigger.${run.trigger}`)}</span>
-            <span className="text-muted-foreground">
-              {i18n.t("agent.steps", { count: run.steps })}
-            </span>
-            <RunCostLabel cost={cost} i18n={i18n} />
-          </span>
-          <span className="mt-1 block text-xs">
-            <RunUsage run={run} i18n={i18n} />
-          </span>
-          {/* The failure in the words the failure itself used. Summarising it into "failed" is what
-              the status pill already says, and it is never the sentence that helps. */}
-          {run.error ? (
-            <span className="mt-1.5 block text-sm text-destructive">{run.error}</span>
-          ) : null}
-        </span>
-      </button>
-      {open ? <RunDetail agentId={agentId} run={run} /> : null}
-    </li>
-  );
-}
-
-/**
- * What an unattended run produced, which is the only place a person can read it (#272).
- *
- * ⚠️ Rendered for `schedule`, `manual` and `task`, and for nothing else. A `chat` or `mail` run
- * carries no answer by construction (#268), so an empty state under one of those would invent a
- * loss: the answer was streamed into a window or posted to a correspondent and was never meant to
- * come back here.
- *
- * ⚠️ Read from the run the row already holds, not from the detail fetch. `GET /runs` carries the
- * whole record, and hanging the answer off the second request would hide it whenever the
- * operational log — the smaller half of what this row is for — happens to be unreadable.
- */
-function RunAnswer({ run, i18n }: { run: AgentRun; i18n: I18n }) {
-  if (run.trigger === "chat" || run.trigger === "mail") return null;
-  return (
-    <section aria-label={i18n.t("agent.runAnswer")} className="mb-3">
-      <h3 className="text-sm font-semibold">{i18n.t("agent.runAnswer")}</h3>
-      {run.answer ? (
-        // Whitespace preserved: a model answers in paragraphs and lists, and collapsing them turns
-        // a readable report into one block of prose.
-        <p className="mt-1 whitespace-pre-wrap text-sm">{run.answer}</p>
-      ) : (
-        <p className="mt-1 text-sm text-muted-foreground">{i18n.t("agent.runAnswerEmpty")}</p>
-      )}
-    </section>
-  );
-}
-
-// The operational log of one run: what it tried, in order. Fetched only when a row is opened —
-// every run carries its own entries and loading all of them would be the whole log for one screen.
-function RunDetail({ agentId, run }: { agentId: string; run: AgentRun }) {
-  const { data } = useIntelRouterContext();
-  const i18n = useI18n();
-  const runId = run.id;
-  const detail = useQuery({
-    queryKey: ["agent-run", agentId, runId],
-    queryFn: () => data.getAgentRun(agentId, runId),
-  });
-  return (
-    <div className="border-t px-4 py-3">
-      <RunAnswer run={run} i18n={i18n} />
-      {detail.isPending ? (
-        <p className="text-sm text-muted-foreground">{i18n.t("common.loading")}</p>
-      ) : null}
-      {detail.isError ? (
-        <p role="alert" className="text-sm text-destructive">
-          {i18n.t("agent.runFailed")}
-        </p>
-      ) : null}
-      {detail.data && detail.data.log.length === 0 ? (
-        <p className="text-sm text-muted-foreground">{i18n.t("agent.runLogEmpty")}</p>
-      ) : null}
-      {detail.data && detail.data.log.length > 0 ? (
-        <ol aria-label={i18n.t("agent.runLog")} className="space-y-2">
-          {detail.data.log.map((entry) => (
-            <li key={entry.id} className="text-sm">
-              <span
-                className={entry.level === "error" ? "font-medium text-destructive" : "font-medium"}
-              >
-                {entry.event}
-              </span>
-              <time dateTime={entry.at} className="ml-2 text-xs text-muted-foreground">
-                {new Date(entry.at).toLocaleTimeString(i18n.locale)}
-              </time>
-              {entry.detail ? (
-                <span
-                  className={`mt-0.5 block text-xs ${entry.level === "error" ? "text-destructive" : "text-muted-foreground"}`}
-                >
-                  {entry.detail}
-                </span>
-              ) : null}
-            </li>
-          ))}
-        </ol>
-      ) : null}
-    </div>
-  );
-}