@meshagent/meshagent-tailwind 0.39.8 → 0.40.0

package/dist/cjs/chat/dataset-chat-thread.js

@@ -0,0 +1,1840 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var dataset_chat_thread_exports = {};
+__export(dataset_chat_thread_exports, {
+  DatasetChatThread: () => DatasetChatThread
+});
+module.exports = __toCommonJS(dataset_chat_thread_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
+var import_meshagent = require("@meshagent/meshagent");
+var import_meshagent_react = require("@meshagent/meshagent-react");
+var import_lucide_react = require("lucide-react");
+var import_react_markdown = __toESM(require("react-markdown"));
+var import_rehype_highlight = __toESM(require("rehype-highlight"));
+var import_rehype_sanitize = __toESM(require("rehype-sanitize"));
+var import_remark_gfm = __toESM(require("remark-gfm"));
+var import_chat_input = require("./chat-input");
+var import_chat_typing_indicator = require("./chat-typing-indicator");
+var import_button = require("../components/ui/button");
+var import_spinner = require("../components/ui/spinner");
+var import_file_attachment = require("./file-attachment");
+var import_chat_hooks = require("./chat-hooks");
+var import_utils = require("../lib/utils");
+var import_chat_thread = require("./chat-thread");
+const agentRoomMessageType = "agent-message";
+const agentTurnStartType = "meshagent.agent.turn.start";
+const agentTurnSteerType = "meshagent.agent.turn.steer";
+const agentTurnInterruptType = "meshagent.agent.turn.interrupt";
+const agentThreadOpenType = "meshagent.agent.thread.open";
+const agentThreadCloseType = "meshagent.agent.thread.close";
+const agentTurnStartAcceptedType = "meshagent.agent.turn.start.accepted";
+const agentTurnStartRejectedType = "meshagent.agent.turn.start.rejected";
+const agentTurnSteerAcceptedType = "meshagent.agent.turn.steer.accepted";
+const agentTurnSteerRejectedType = "meshagent.agent.turn.steer.rejected";
+const agentTurnStartedType = "meshagent.agent.turn.started";
+const agentTurnSteeredType = "meshagent.agent.turn.steered";
+const agentTextContentDeltaType = "meshagent.agent.text_content.delta";
+const agentTextContentEndedType = "meshagent.agent.text_content.ended";
+const agentReasoningContentStartedType = "meshagent.agent.reasoning_content.started";
+const agentReasoningContentDeltaType = "meshagent.agent.reasoning_content.delta";
+const agentReasoningContentEndedType = "meshagent.agent.reasoning_content.ended";
+const agentFileContentStartedType = "meshagent.agent.file_content.started";
+const agentFileContentDeltaType = "meshagent.agent.file_content.delta";
+const agentFileContentEndedType = "meshagent.agent.file_content.ended";
+const agentToolCallPendingType = "meshagent.agent.tool_call.pending";
+const agentToolCallInProgressType = "meshagent.agent.tool_call.in_progress";
+const agentToolCallStartedType = "meshagent.agent.tool_call.started";
+const agentToolCallEndedType = "meshagent.agent.tool_call.ended";
+const agentImageGenerationStartedType = "meshagent.agent.image_generation.started";
+const agentImageGenerationPartialType = "meshagent.agent.image_generation.partial";
+const agentImageGenerationCompletedType = "meshagent.agent.image_generation.completed";
+const agentImageGenerationFailedType = "meshagent.agent.image_generation.failed";
+const stickyBottomThresholdPx = 24;
+const maxPreviewEdgePx = 312.5;
+function createDatasetThreadModel() {
+  return {
+    rowsByItemId: /* @__PURE__ */ new Map(),
+    initialRowsByItemId: /* @__PURE__ */ new Map(),
+    agentRowsByItemId: /* @__PURE__ */ new Map(),
+    nextAgentSequence: 0,
+    error: null,
+    fatalError: false,
+    ready: false
+  };
+}
+function isRecord(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function stringValue(value) {
+  return typeof value === "string" && value.trim() !== "" ? value.trim() : null;
+}
+function intValue(value) {
+  if (typeof value === "number" && Number.isFinite(value)) {
+    return Math.trunc(value);
+  }
+  if (typeof value === "bigint") {
+    return Number(value);
+  }
+  if (typeof value === "string" && value.trim() !== "") {
+    const parsed = Number.parseInt(value.trim(), 10);
+    return Number.isNaN(parsed) ? 0 : parsed;
+  }
+  return 0;
+}
+function doubleValue(value) {
+  if (typeof value === "number" && Number.isFinite(value) && value > 0) {
+    return value;
+  }
+  if (typeof value === "string") {
+    const parsed = Number.parseFloat(value.trim());
+    return Number.isFinite(parsed) && parsed > 0 ? parsed : null;
+  }
+  return null;
+}
+function stringList(value) {
+  if (!Array.isArray(value)) {
+    return [];
+  }
+  return value.map((item) => String(item).trim()).filter((item) => item !== "");
+}
+function mapValue(value) {
+  if (value instanceof import_meshagent.DatasetJson) {
+    const json = value.toJson();
+    return isRecord(json) ? json : null;
+  }
+  if (value instanceof import_meshagent.DatasetStruct) {
+    return value.toJson();
+  }
+  if (isRecord(value)) {
+    return value;
+  }
+  if (typeof value === "string" && value.trim() !== "") {
+    try {
+      const decoded = JSON.parse(value);
+      return isRecord(decoded) ? decoded : null;
+    } catch {
+      return null;
+    }
+  }
+  return null;
+}
+function rowData(row) {
+  return mapValue(row.data);
+}
+function dateTimeFromEpochValue(value) {
+  const absolute = Math.abs(value);
+  if (absolute >= 1e17) {
+    return new Date(Math.trunc(value / 1e6));
+  }
+  if (absolute >= 1e14) {
+    return new Date(Math.trunc(value / 1e3));
+  }
+  if (absolute >= 1e11) {
+    return new Date(value);
+  }
+  return new Date(value * 1e3);
+}
+function rowTimestamp(row) {
+  const value = row.timestamp;
+  if (value instanceof Date) {
+    return value;
+  }
+  if (typeof value === "number" && Number.isFinite(value)) {
+    return dateTimeFromEpochValue(Math.round(value));
+  }
+  if (typeof value === "bigint") {
+    return dateTimeFromEpochValue(Number(value));
+  }
+  if (typeof value === "string" && value.trim() !== "") {
+    const parsed = new Date(value);
+    return Number.isNaN(parsed.getTime()) ? /* @__PURE__ */ new Date() : parsed;
+  }
+  return /* @__PURE__ */ new Date();
+}
+function compareDatasetThreadRows(left, right) {
+  const sequenceOrder = intValue(left.sequence) - intValue(right.sequence);
+  if (sequenceOrder !== 0) {
+    return sequenceOrder;
+  }
+  const timestampOrder = rowTimestamp(left).getTime() - rowTimestamp(right).getTime();
+  if (timestampOrder !== 0) {
+    return timestampOrder;
+  }
+  return String(left.item_id ?? "").localeCompare(String(right.item_id ?? ""));
+}
+function tableToRows(table) {
+  const fieldNames = table.schema.fields.map((field) => field.name);
+  const rows = [];
+  for (let rowIndex = 0; rowIndex < table.numRows; rowIndex += 1) {
+    const row = {};
+    for (const fieldName of fieldNames) {
+      row[fieldName] = table.getChild(fieldName)?.get(rowIndex);
+    }
+    rows.push(row);
+  }
+  return rows;
+}
+function parseDatasetThreadRef(url) {
+  let path = url.trim();
+  if (!path.startsWith("dataset://")) {
+    throw new Error("dataset thread URL must start with dataset://");
+  }
+  path = path.slice("dataset://".length);
+  if (path.startsWith("/")) {
+    throw new Error("dataset thread URL must use dataset://path");
+  }
+  const parts = path.split("/").map((part) => part.trim()).filter((part) => part !== "");
+  if (parts.length === 0) {
+    throw new Error("dataset thread URL must include a table name");
+  }
+  return {
+    namespace: parts.length === 1 ? void 0 : parts.slice(0, -1),
+    table: parts[parts.length - 1]
+  };
+}
+function parseDatasetImageUri(uri) {
+  let parsed;
+  try {
+    parsed = new URL(uri.trim());
+  } catch {
+    return null;
+  }
+  if (parsed.protocol !== "dataset:") {
+    return null;
+  }
+  const imageId = parsed.searchParams.get("id")?.trim();
+  if (!imageId) {
+    return null;
+  }
+  const pathParts = [
+    parsed.hostname.trim(),
+    ...parsed.pathname.split("/").map((part) => part.trim())
+  ].filter((part) => part !== "");
+  if (pathParts.length === 0) {
+    return null;
+  }
+  return {
+    namespace: pathParts.length === 1 ? void 0 : pathParts.slice(0, -1),
+    table: pathParts[pathParts.length - 1],
+    imageId
+  };
+}
+function isTmpThreadPath(path) {
+  return path.trim().startsWith("tmp://");
+}
+function isDatasetTableNotFoundError(error) {
+  if (!(error instanceof import_meshagent.RoomServerException)) {
+    return false;
+  }
+  if (error.statusCode === 404) {
+    return true;
+  }
+  const message = error.message.toLowerCase();
+  return message.includes("table") && (message.includes("not found") || message.includes("does not exist") || message.includes("no such table"));
+}
+function itemIdsForDeletePredicate(predicate) {
+  const normalized = predicate.trim();
+  const equality = /^"?item_id"?\s*=\s*['"]([^'"]+)['"]$/iu.exec(normalized);
+  if (equality) {
+    return [equality[1]];
+  }
+  const inList = /^"?item_id"?\s+in\s*\((.*)\)$/iu.exec(normalized);
+  if (!inList) {
+    return [];
+  }
+  return Array.from(inList[1].matchAll(/['"]([^'"]+)['"]/gu)).map((match) => match[1]);
+}
+function applyDeletePredicate(predicate, target) {
+  let changed = false;
+  for (const itemId of itemIdsForDeletePredicate(predicate)) {
+    changed = target.delete(itemId) || changed;
+  }
+  return changed;
+}
+function maxDatasetSequence(model) {
+  let maxSequence = -1;
+  for (const row of [...model.rowsByItemId.values(), ...model.initialRowsByItemId.values()]) {
+    maxSequence = Math.max(maxSequence, intValue(row.sequence));
+  }
+  return maxSequence;
+}
+function advanceNextAgentSequencePastDatasetRows(model) {
+  const maxSequence = maxDatasetSequence(model);
+  if (maxSequence >= model.nextAgentSequence) {
+    model.nextAgentSequence = maxSequence + 1;
+  }
+}
+function imageGenerationCorrelationKeys(row) {
+  const keys = /* @__PURE__ */ new Set();
+  const itemId = stringValue(row.item_id);
+  if (itemId) {
+    keys.add(`item:${itemId}`);
+  }
+  const data = rowData(row);
+  const message = mapValue(data?.message);
+  for (const value of [data?.call_id, message?.call_id]) {
+    const callId = stringValue(value);
+    if (callId) {
+      keys.add(`call:${callId}`);
+    }
+  }
+  for (const value of [message?.item_id, message?.message_id]) {
+    const messageItemId = stringValue(value);
+    if (messageItemId) {
+      keys.add(`item:${messageItemId}`);
+    }
+  }
+  return keys;
+}
+function removeReconciledAgentRowsForDatasetRow(model, datasetRow) {
+  const datasetData = rowData(datasetRow);
+  if (datasetData?.kind !== "image_generation") {
+    return;
+  }
+  const datasetKeys = imageGenerationCorrelationKeys(datasetRow);
+  if (datasetKeys.size === 0) {
+    return;
+  }
+  for (const [liveItemId, liveRow] of model.agentRowsByItemId.entries()) {
+    const liveData = rowData(liveRow);
+    if (liveData?.kind !== "image_generation") {
+      continue;
+    }
+    if (Array.from(imageGenerationCorrelationKeys(liveRow)).some((key) => datasetKeys.has(key))) {
+      model.agentRowsByItemId.delete(liveItemId);
+    }
+  }
+}
+function isReconciledByDatasetRows(model, liveRow) {
+  const liveData = rowData(liveRow);
+  if (liveData?.kind !== "image_generation") {
+    return false;
+  }
+  const liveKeys = imageGenerationCorrelationKeys(liveRow);
+  if (liveKeys.size === 0) {
+    return false;
+  }
+  for (const datasetRow of [...model.rowsByItemId.values(), ...model.initialRowsByItemId.values()]) {
+    const datasetData = rowData(datasetRow);
+    if (datasetData?.kind !== "image_generation") {
+      continue;
+    }
+    if (Array.from(imageGenerationCorrelationKeys(datasetRow)).some((key) => liveKeys.has(key))) {
+      return true;
+    }
+  }
+  return false;
+}
+function rebaseAgentRowsAfterDatasetRows(model) {
+  const maxSequence = maxDatasetSequence(model);
+  if (maxSequence < 0 || model.agentRowsByItemId.size === 0) {
+    return false;
+  }
+  let changed = false;
+  let nextSequence = maxSequence + 1;
+  const liveRows = Array.from(model.agentRowsByItemId.values()).sort(compareDatasetThreadRows);
+  for (const row of liveRows) {
+    const itemId = stringValue(row.item_id);
+    if (!itemId || model.rowsByItemId.has(itemId) || model.initialRowsByItemId.has(itemId)) {
+      continue;
+    }
+    const sequence = intValue(row.sequence);
+    if (sequence <= maxSequence) {
+      model.agentRowsByItemId.set(itemId, { ...row, sequence: nextSequence });
+      changed = true;
+      nextSequence += 1;
+    } else if (sequence >= nextSequence) {
+      nextSequence = sequence + 1;
+    }
+  }
+  if (nextSequence > model.nextAgentSequence) {
+    model.nextAgentSequence = nextSequence;
+  }
+  return changed;
+}
+function applyRowsToMap(rows, target, model) {
+  let changed = false;
+  for (const row of rows) {
+    const itemId = stringValue(row.item_id);
+    if (!itemId) {
+      continue;
+    }
+    target.set(itemId, { ...row });
+    model.agentRowsByItemId.delete(itemId);
+    removeReconciledAgentRowsForDatasetRow(model, row);
+    changed = true;
+  }
+  if (changed) {
+    advanceNextAgentSequencePastDatasetRows(model);
+    changed = rebaseAgentRowsAfterDatasetRows(model) || changed;
+  }
+  return changed;
+}
+function watchEventKind(event) {
+  return event.watchEvent ?? event.kind;
+}
+function deletePredicateForWatchEvent(event) {
+  const eventRecord = event;
+  return stringValue(eventRecord.deletePredicate) ?? stringValue(eventRecord.predicate);
+}
+function handlePreReadyWatchEvent(model, event) {
+  let changed = false;
+  const kind = watchEventKind(event);
+  const deletePredicate = deletePredicateForWatchEvent(event);
+  if (kind === "delete" && deletePredicate) {
+    changed = applyDeletePredicate(deletePredicate, model.initialRowsByItemId) || changed;
+  }
+  const rows = event.table ? tableToRows(event.table) : [];
+  if (event.table) {
+    if (kind === "delete" || event.changeType === "delete") {
+      for (const row of rows) {
+        const predicate = stringValue(row.predicate);
+        if (predicate) {
+          changed = applyDeletePredicate(predicate, model.initialRowsByItemId) || changed;
+        } else {
+          const itemId = stringValue(row.item_id);
+          if (itemId) {
+            changed = model.initialRowsByItemId.delete(itemId) || changed;
+          }
+        }
+      }
+    } else if (kind !== "transactions" && event.changeType !== "transactions") {
+      changed = applyRowsToMap(rows, model.initialRowsByItemId, model) || changed;
+    }
+  }
+  if (kind !== "ready") {
+    return changed;
+  }
+  model.rowsByItemId.clear();
+  for (const [itemId, row] of model.initialRowsByItemId.entries()) {
+    model.rowsByItemId.set(itemId, row);
+  }
+  model.initialRowsByItemId.clear();
+  model.ready = true;
+  return true;
+}
+function handleWatchEvent(model, event) {
+  if (!model.ready) {
+    return handlePreReadyWatchEvent(model, event);
+  }
+  let changed = false;
+  const kind = watchEventKind(event);
+  const deletePredicate = deletePredicateForWatchEvent(event);
+  if (kind === "delete" && deletePredicate) {
+    changed = applyDeletePredicate(deletePredicate, model.rowsByItemId) || changed;
+  }
+  const rows = event.table ? tableToRows(event.table) : [];
+  if (event.table) {
+    if (kind === "delete" || event.changeType === "delete") {
+      for (const row of rows) {
+        const predicate = stringValue(row.predicate);
+        if (predicate) {
+          changed = applyDeletePredicate(predicate, model.rowsByItemId) || changed;
+        } else {
+          const itemId = stringValue(row.item_id);
+          if (itemId) {
+            changed = model.rowsByItemId.delete(itemId) || changed;
+          }
+        }
+      }
+      return changed;
+    }
+    if (kind === "transactions" || event.changeType === "transactions") {
+      return changed;
+    }
+    changed = applyRowsToMap(rows, model.rowsByItemId, model) || changed;
+  }
+  if (kind === "ready") {
+    model.ready = true;
+    return true;
+  }
+  return changed;
+}
+function payloadItemId(payload) {
+  return stringValue(payload.item_id) ?? stringValue(payload.message_id) ?? crypto.randomUUID();
+}
+function payloadTurnId(payload) {
+  return stringValue(payload.turn_id);
+}
+function timestampFromPayload(payload) {
+  const createdAt = payload.created_at;
+  if (createdAt instanceof Date) {
+    return createdAt;
+  }
+  if (typeof createdAt === "string" && createdAt.trim() !== "") {
+    const parsed = new Date(createdAt);
+    return Number.isNaN(parsed.getTime()) ? null : parsed;
+  }
+  return null;
+}
+function imageGenerationStatusFromType(type) {
+  switch (type) {
+    case agentImageGenerationCompletedType:
+      return "completed";
+    case agentImageGenerationFailedType:
+      return "failed";
+    case agentImageGenerationPartialType:
+      return "in_progress";
+    default:
+      return "pending";
+  }
+}
+function upsertAgentRow({
+  model,
+  itemId,
+  turnId,
+  data,
+  timestamp
+}) {
+  if (itemId.trim() === "" || model.rowsByItemId.has(itemId) || model.initialRowsByItemId.has(itemId)) {
+    return false;
+  }
+  const candidateRow = { turn_id: turnId, item_id: itemId, data };
+  if (isReconciledByDatasetRows(model, candidateRow)) {
+    return false;
+  }
+  const existing = model.agentRowsByItemId.get(itemId);
+  const row = {
+    turn_id: turnId ?? existing?.turn_id,
+    item_id: itemId,
+    sequence: existing?.sequence ?? model.nextAgentSequence,
+    timestamp: timestamp ?? existing?.timestamp ?? /* @__PURE__ */ new Date(),
+    data
+  };
+  if (!existing) {
+    model.nextAgentSequence += 1;
+  }
+  model.agentRowsByItemId.set(itemId, row);
+  return true;
+}
+function appendAgentRowText({
+  model,
+  itemId,
+  turnId,
+  kind,
+  role,
+  delta
+}) {
+  if (delta === "") {
+    return false;
+  }
+  const existingData = mapValue(model.agentRowsByItemId.get(itemId)?.data);
+  const nextText = `${existingData?.text ?? ""}${delta}`;
+  return upsertAgentRow({
+    model,
+    itemId,
+    turnId,
+    data: { kind, role, text: nextText }
+  });
+}
+function appendAgentRowUrl({
+  model,
+  itemId,
+  turnId,
+  url
+}) {
+  const normalizedUrl = stringValue(url);
+  if (!normalizedUrl) {
+    return false;
+  }
+  const existingData = mapValue(model.agentRowsByItemId.get(itemId)?.data);
+  const urls = stringList(existingData?.urls);
+  if (!urls.includes(normalizedUrl)) {
+    urls.push(normalizedUrl);
+  }
+  return upsertAgentRow({
+    model,
+    itemId,
+    turnId,
+    data: { kind: "file", role: "assistant", urls }
+  });
+}
+function agentRowText(model, itemId) {
+  return String(mapValue(model.agentRowsByItemId.get(itemId)?.data)?.text ?? "");
+}
+function normalizeAgentAttachmentUrl(path) {
+  const trimmedPath = path.trim();
+  if (trimmedPath === "") {
+    return null;
+  }
+  try {
+    const parsed = new URL(trimmedPath);
+    if (parsed.protocol !== "") {
+      return trimmedPath;
+    }
+  } catch {
+  }
+  const roomPath = trimmedPath.startsWith("/") ? trimmedPath.slice(1) : trimmedPath;
+  return roomPath === "" ? null : `room:///${roomPath}`;
+}
+function previewPath(path) {
+  const prefix = "room:///";
+  return path.startsWith(prefix) ? path.slice(prefix.length) : path;
+}
+function comparableThreadAttachmentPath(path) {
+  const normalized = previewPath(path.trim());
+  return normalized.startsWith("/") ? normalized.slice(1) : normalized;
+}
+function agentInputContent(text, attachments) {
+  const content = [];
+  if (text.trim() !== "") {
+    content.push({ type: "text", text });
+  }
+  for (const attachment of attachments) {
+    const url = normalizeAgentAttachmentUrl(attachment);
+    if (url !== null) {
+      content.push({ type: "file", url });
+    }
+  }
+  return content;
+}
+function materializeTurnInputPayload(model, payload) {
+  const messageId = stringValue(payload.source_message_id) ?? stringValue(payload.message_id);
+  if (!messageId || model.rowsByItemId.has(messageId) || model.initialRowsByItemId.has(messageId) || model.agentRowsByItemId.has(messageId)) {
+    return false;
+  }
+  const content = payload.content;
+  if (!Array.isArray(content)) {
+    return false;
+  }
+  const textParts = [];
+  const attachments = [];
+  for (const item of content) {
+    if (!isRecord(item)) {
+      continue;
+    }
+    if (item.type === "text") {
+      const text2 = typeof item.text === "string" ? item.text : null;
+      if (text2) {
+        textParts.push(text2);
+      }
+    } else if (item.type === "file") {
+      const url = stringValue(item.url);
+      if (url) {
+        attachments.push(url);
+      }
+    }
+  }
+  const text = textParts.join("\n");
+  if (text.trim() === "" && attachments.length === 0) {
+    return false;
+  }
+  return upsertAgentRow({
+    model,
+    itemId: messageId,
+    turnId: payloadTurnId(payload),
+    timestamp: timestampFromPayload(payload) ?? /* @__PURE__ */ new Date(),
+    data: {
+      kind: "message",
+      role: "user",
+      text,
+      sender_name: stringValue(payload.sender_name),
+      attachments
+    }
+  });
+}
+function applyAgentMessagePayload(model, payload, path) {
+  if (payload.thread_id !== path) {
+    return false;
+  }
+  const type = typeof payload.type === "string" ? payload.type : null;
+  if (!type) {
+    return false;
+  }
+  if (type === agentTurnStartRejectedType || type === agentTurnSteerRejectedType) {
+    const sourceMessageId = stringValue(payload.source_message_id);
+    return sourceMessageId ? model.agentRowsByItemId.delete(sourceMessageId) : false;
+  }
+  const itemId = payloadItemId(payload);
+  const turnId = payloadTurnId(payload);
+  let changed = false;
+  switch (type) {
+    case agentTurnStartAcceptedType:
+    case agentTurnSteerAcceptedType:
+      break;
+    case agentTurnStartedType:
+    case agentTurnSteeredType:
+      changed = materializeTurnInputPayload(model, payload) || changed;
+      break;
+    case agentTextContentDeltaType:
+      changed = appendAgentRowText({
+        model,
+        itemId,
+        turnId,
+        kind: "message",
+        role: "assistant",
+        delta: String(payload.text ?? "")
+      }) || changed;
+      break;
+    case agentTextContentEndedType:
+      changed = upsertAgentRow({
+        model,
+        itemId,
+        turnId,
+        data: {
+          kind: "message",
+          role: "assistant",
+          text: String(payload.text ?? agentRowText(model, itemId))
+        }
+      }) || changed;
+      break;
+    case agentReasoningContentStartedType:
+      changed = upsertAgentRow({
+        model,
+        itemId,
+        turnId,
+        data: { kind: "reasoning", role: "assistant", text: "" }
+      }) || changed;
+      break;
+    case agentReasoningContentDeltaType:
+      changed = appendAgentRowText({
+        model,
+        itemId,
+        turnId,
+        kind: "reasoning",
+        role: "assistant",
+        delta: String(payload.text ?? "")
+      }) || changed;
+      break;
+    case agentReasoningContentEndedType:
+      changed = upsertAgentRow({
+        model,
+        itemId,
+        turnId,
+        data: {
+          kind: "reasoning",
+          role: "assistant",
+          text: String(payload.text ?? agentRowText(model, itemId))
+        }
+      }) || changed;
+      break;
+    case agentFileContentStartedType:
+      changed = upsertAgentRow({
+        model,
+        itemId,
+        turnId,
+        data: { kind: "file", role: "assistant", urls: [] }
+      }) || changed;
+      break;
+    case agentFileContentDeltaType:
+    case agentFileContentEndedType:
+      changed = appendAgentRowUrl({ model, itemId, turnId, url: payload.url }) || changed;
+      break;
+    case agentToolCallPendingType:
+    case agentToolCallInProgressType:
+    case agentToolCallStartedType:
+    case agentToolCallEndedType: {
+      const tool = String(payload.tool ?? payload.tool_name ?? payload.name ?? "");
+      const isImageGeneration = tool.trim().toLowerCase() === "image_generation";
+      if (isImageGeneration && type === agentToolCallEndedType && payload.error == null) {
+        break;
+      }
+      changed = upsertAgentRow({
+        model,
+        itemId,
+        turnId,
+        data: isImageGeneration ? {
+          kind: "image_generation",
+          role: "assistant",
+          status: payload.error == null ? "in_progress" : "failed",
+          status_detail: payload.error == null ? "Generating image" : String(payload.error),
+          call_id: stringValue(payload.call_id),
+          arguments: mapValue(payload.arguments)
+        } : {
+          kind: "tool_call",
+          role: "assistant",
+          toolkit: String(payload.toolkit ?? payload.toolkit_name ?? ""),
+          tool,
+          status: type === agentToolCallEndedType ? "completed" : "running"
+        }
+      }) || changed;
+      break;
+    }
+    case agentImageGenerationStartedType:
+    case agentImageGenerationPartialType:
+    case agentImageGenerationCompletedType:
+    case agentImageGenerationFailedType:
+      changed = upsertAgentRow({
+        model,
+        itemId,
+        turnId,
+        timestamp: timestampFromPayload(payload) ?? /* @__PURE__ */ new Date(),
+        data: {
+          kind: "image_generation",
+          role: "assistant",
+          status: imageGenerationStatusFromType(type),
+          status_detail: stringValue(payload.status_detail),
+          call_id: stringValue(payload.call_id),
+          arguments: mapValue(payload.arguments),
+          message: payload
+        }
+      }) || changed;
+      break;
+    default:
+      break;
+  }
+  return changed;
+}
+function firstGeneratedImage(message) {
+  if (!message) {
+    return null;
+  }
+  if (Array.isArray(message.images) && message.images.length > 0) {
+    return mapValue(message.images[0]);
+  }
+  return mapValue(message.image);
+}
+function parseImageSize(value) {
+  if (typeof value !== "string") {
+    return [null, null];
+  }
+  const match = /^\s*(\d+)\s*[xX]\s*(\d+)\s*$/u.exec(value);
+  if (!match) {
+    return [null, null];
+  }
+  return [Number.parseFloat(match[1]), Number.parseFloat(match[2])];
+}
+function imageGenerationDimensions({
+  data,
+  message,
+  image
+}) {
+  let width = doubleValue(image?.width);
+  let height = doubleValue(image?.height);
+  for (const argumentsValue of [mapValue(data.arguments), mapValue(message?.arguments)]) {
+    if (!argumentsValue) {
+      continue;
+    }
+    width ??= doubleValue(argumentsValue.width);
+    height ??= doubleValue(argumentsValue.height);
+    if (width == null || height == null) {
+      const [parsedWidth, parsedHeight] = parseImageSize(argumentsValue.size);
+      width ??= parsedWidth;
+      height ??= parsedHeight;
+    }
+    if (width != null && height != null) {
+      break;
+    }
+  }
+  return [width ?? void 0, height ?? void 0];
+}
+function imageIdFromDatasetUri(uri) {
+  if (!uri?.trim()) {
+    return void 0;
+  }
+  const parsed = parseDatasetImageUri(uri);
+  return parsed?.imageId;
+}
+function messageForRow(row) {
+  const data = rowData(row);
+  if (!data) {
+    return null;
+  }
+  const itemId = String(row.item_id ?? crypto.randomUUID());
+  const kind = String(data.kind ?? "");
+  const role = typeof data.role === "string" ? data.role : void 0;
+  switch (kind) {
+    case "message": {
+      const text = String(data.text ?? "");
+      const attachments = stringList(data.attachments);
+      if (text.trim() === "" && attachments.length === 0) {
+        return null;
+      }
+      return {
+        id: itemId,
+        kind: "message",
+        role: role === "assistant" ? "agent" : role ?? "agent",
+        text,
+        authorName: stringValue(data.sender_name) ?? void 0,
+        attachments,
+        createdAt: rowTimestamp(row)
+      };
+    }
+    case "file": {
+      const urls = stringList(data.urls);
+      if (urls.length === 0) {
+        return null;
+      }
+      return {
+        id: itemId,
+        kind: "message",
+        role: role === "assistant" ? "agent" : role ?? "agent",
+        text: "",
+        authorName: stringValue(data.sender_name) ?? void 0,
+        attachments: urls,
+        createdAt: rowTimestamp(row)
+      };
+    }
+    case "image_generation": {
+      const message = mapValue(data.message);
+      const image = firstGeneratedImage(message);
+      const [width, height] = imageGenerationDimensions({ data, message, image });
+      const imageUri = stringValue(image?.uri) ?? void 0;
+      return {
+        id: itemId,
+        kind: "message",
+        role: "agent",
+        text: "",
+        authorName: stringValue(image?.created_by) ?? void 0,
+        attachments: [],
+        createdAt: rowTimestamp(row),
+        image: {
+          uri: imageUri,
+          imageId: imageIdFromDatasetUri(imageUri),
+          mimeType: stringValue(image?.mime_type) ?? void 0,
+          status: stringValue(data.status) ?? stringValue(image?.status) ?? imageGenerationStatusFromType(stringValue(message?.type)),
+          statusDetail: stringValue(data.status_detail) ?? stringValue(message?.status_detail) ?? stringValue(image?.status_detail) ?? void 0,
+          width,
+          height
+        }
+      };
+    }
+    case "reasoning": {
+      const text = String(data.text ?? "");
+      return text.trim() === "" ? null : {
+        id: itemId,
+        kind: "reasoning",
+        role: "agent",
+        text,
+        attachments: [],
+        createdAt: rowTimestamp(row)
+      };
+    }
+    case "tool_call": {
+      const toolkit = String(data.toolkit ?? "");
+      const tool = String(data.tool ?? "");
+      const summary = [toolkit, tool].filter((part) => part.trim() !== "").join(".");
+      return {
+        id: itemId,
+        kind: "tool_call",
+        role: "agent",
+        text: summary || "Tool call",
+        attachments: [],
+        createdAt: rowTimestamp(row)
+      };
+    }
+    default:
+      return null;
+  }
+}
+function isImageGenerationPendingStatus(status) {
+  const normalized = status?.trim().toLowerCase();
+  return normalized === "generating" || normalized === "in_progress" || normalized === "queued" || normalized === "running" || normalized === "pending";
+}
+function isImageGenerationFailedStatus(status) {
+  const normalized = status?.trim().toLowerCase();
+  return normalized === "failed" || normalized === "cancelled";
+}
+function shouldRenderDatasetThreadMessage(message, showCompletedToolCalls) {
+  if (message.kind === "tool_call") {
+    return showCompletedToolCalls;
+  }
+  if (message.image) {
+    const hasImageReference = Boolean(message.image.imageId?.trim() || message.image.uri?.trim());
+    if (!hasImageReference && !isImageGenerationPendingStatus(message.image.status) && !isImageGenerationFailedStatus(message.image.status)) {
+      return false;
+    }
+  }
+  return true;
+}
+function datasetThreadMessageContentMatchesPendingAgentMessage(message, pending) {
+  const pendingText = pending.text.trim();
+  if (pendingText !== "" && message.text.trim() !== pendingText) {
+    return false;
+  }
+  const pendingAttachments = pending.attachments.map(comparableThreadAttachmentPath).filter((path) => path !== "");
+  if (pendingAttachments.length === 0) {
+    return true;
+  }
+  const messageAttachments = message.attachments.map(comparableThreadAttachmentPath).filter((path) => path !== "");
+  return pendingAttachments.length === messageAttachments.length && pendingAttachments.every((path, index) => path === messageAttachments[index]);
+}
+function datasetThreadMessageMatchesPendingAgentMessage(message, pending) {
+  if (message.kind !== "message" || message.role === "agent") {
+    return false;
+  }
+  if (message.id === pending.messageId) {
+    return datasetThreadMessageContentMatchesPendingAgentMessage(message, pending);
+  }
+  if (!pending.matchByContentOnly) {
+    return false;
+  }
+  return datasetThreadMessageContentMatchesPendingAgentMessage(message, pending);
+}
+function distanceFromBottom(element) {
+  return Math.max(element.scrollHeight - element.clientHeight - element.scrollTop, 0);
+}
+function isNearBottom(element) {
+  return distanceFromBottom(element) <= stickyBottomThresholdPx;
+}
+function displayParticipantName(name) {
+  return name.split("@")[0]?.trim() || name.trim();
+}
+function getParticipantName(participant) {
+  const name = participant?.getAttribute("name");
+  return typeof name === "string" ? name.trim() : "";
+}
+function findAgentParticipant(room, agentName) {
+  const normalizedAgentName = agentName?.trim();
+  for (const participant of room.messaging.remoteParticipants) {
+    if (normalizedAgentName && getParticipantName(participant) !== normalizedAgentName) {
+      continue;
+    }
+    if (participant.getAttribute("supports_agent_messages") === true) {
+      return participant;
+    }
+  }
+  return null;
+}
+function describeError(error) {
+  if (error instanceof Error && error.message.trim() !== "") {
+    return error.message;
+  }
+  return String(error);
+}
+function MarkdownBlock({ text }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_react_markdown.default,
+    {
+      remarkPlugins: [import_remark_gfm.default],
+      rehypePlugins: [import_rehype_sanitize.default, import_rehype_highlight.default],
+      components: {
+        pre: ({ className, children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "pre",
+          {
+            ...props,
+            className: (0, import_utils.cn)("overflow-x-auto rounded-md border bg-background/80 p-3", className),
+            children
+          }
+        ),
+        p: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { ...props, className: "mb-2 last:mb-0", children }),
+        table: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "my-4 w-full overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("table", { ...props, className: "w-full border-collapse border-spacing-0", children }) }),
+        th: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { ...props, className: "border bg-muted/50 px-3 py-2 text-left text-sm font-semibold", children }),
+        td: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { ...props, className: "border bg-background px-3 py-2 align-top text-sm", children }),
+        ul: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { ...props, className: "mb-2 ml-6 list-disc last:mb-0", children }),
+        ol: ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ol", { ...props, className: "mb-2 ml-6 list-decimal last:mb-0", children })
+      },
+      children: text
+    }
+  );
+}
+function ChatBubble({ text, mine }) {
+  if (text.trim() === "") {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      className: (0, import_utils.cn)(
+        "w-fit max-w-[85%] rounded-md px-4 py-3 text-sm leading-6 shadow-xs sm:max-w-2xl",
+        mine ? "bg-secondary/85 text-foreground" : "bg-muted/70 text-foreground"
+      ),
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MarkdownBlock, { text })
+    }
+  );
+}
+function useStorageDownloadUrl(room, path) {
+  const [url, setUrl] = (0, import_react.useState)(null);
+  (0, import_react.useEffect)(() => {
+    let cancelled = false;
+    const normalizedPath = previewPath(path).trim();
+    if (normalizedPath === "") {
+      setUrl(null);
+      return;
+    }
+    if (/^https?:\/\//iu.test(normalizedPath)) {
+      setUrl(normalizedPath);
+      return;
+    }
+    void room.storage.downloadUrl(normalizedPath).then((nextUrl) => {
+      if (!cancelled) {
+        setUrl(nextUrl);
+      }
+    }).catch(() => {
+      if (!cancelled) {
+        setUrl(null);
+      }
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [path, room]);
+  return url;
+}
+function isImagePath(path) {
+  return /\.(avif|bmp|gif|jpe?g|png|svg|webp)$/iu.test(path);
+}
+function FileAttachmentView({
+  room,
+  path,
+  openFile
+}) {
+  const preview = previewPath(path);
+  const url = useStorageDownloadUrl(room, preview);
+  const filename = preview.split("/").pop() ?? preview;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "button",
+    {
+      type: "button",
+      className: "inline-flex max-w-full items-center gap-2 rounded-md bg-muted/60 px-3 py-2 text-left shadow-xs transition-colors hover:bg-muted/80",
+      onClick: () => {
+        if (openFile) {
+          void openFile(preview);
+          return;
+        }
+        if (url) {
+          window.open(url, "_blank", "noopener,noreferrer");
+        }
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.FileText, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "truncate text-sm font-medium", children: filename }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Download, { className: "h-4 w-4 shrink-0 text-muted-foreground" })
+      ]
+    }
+  );
+}
+function StorageImageAttachment({
+  room,
+  path
+}) {
+  const preview = previewPath(path);
+  const url = useStorageDownloadUrl(room, preview);
+  const filename = preview.split("/").pop() ?? "Image";
+  if (!url) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "button",
+    {
+      type: "button",
+      className: "block overflow-hidden rounded-md bg-muted/20 shadow-xs transition-opacity hover:opacity-95",
+      onClick: () => {
+        window.open(url, "_blank", "noopener,noreferrer");
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", { src: url, alt: filename, className: "max-h-[312px] w-auto max-w-full object-cover" })
+    }
+  );
+}
+function bytesFromValue(value) {
+  if (value instanceof Uint8Array) {
+    return value;
+  }
+  if (value instanceof ArrayBuffer) {
+    return new Uint8Array(value);
+  }
+  if (Array.isArray(value) && value.every((item) => typeof item === "number")) {
+    return Uint8Array.from(value);
+  }
+  return null;
+}
+async function loadGeneratedImageRecord({
+  room,
+  imageId,
+  imageUri,
+  fallbackMimeType
+}) {
+  const parsedUri = imageUri ? parseDatasetImageUri(imageUri) : null;
+  const table = parsedUri?.table ?? "images";
+  const namespace = parsedUri?.namespace;
+  const resolvedImageId = parsedUri?.imageId ?? imageId?.trim();
+  if (!resolvedImageId) {
+    return null;
+  }
+  try {
+    const tables = await room.datasets.search({
+      table,
+      namespace,
+      where: { id: resolvedImageId },
+      limit: 1,
+      select: ["data", "mime_type"]
+    });
+    const rows = tables.flatMap((resultTable) => tableToRows(resultTable));
+    const row = rows[0];
+    if (!row) {
+      return null;
+    }
+    const bytes = bytesFromValue(row.data);
+    if (!bytes) {
+      return null;
+    }
+    const storedMimeType = stringValue(row.mime_type);
+    return {
+      bytes,
+      mimeType: storedMimeType ?? fallbackMimeType?.trim() ?? "image/png"
+    };
+  } catch {
+    return null;
+  }
+}
+function displayImageSize(width, height) {
+  if (!width || !height || width <= 0 || height <= 0) {
+    return { width: maxPreviewEdgePx, height: maxPreviewEdgePx };
+  }
+  const largestEdge = Math.max(width, height);
+  if (largestEdge <= maxPreviewEdgePx) {
+    return { width, height };
+  }
+  const scale = maxPreviewEdgePx / largestEdge;
+  return { width: width * scale, height: height * scale };
+}
+function ImagePlaceholder({
+  image,
+  showSpinner,
+  label
+}) {
+  const size = displayImageSize(image.width, image.height);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      className: "flex items-center justify-center rounded-md border bg-background text-muted-foreground",
+      style: { width: size.width, height: size.height },
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex max-w-full flex-col items-center gap-2 px-3 text-center text-xs", children: [
+        showSpinner ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_spinner.Spinner, { className: "h-5 w-5" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ImageOff, { className: "h-5 w-5" }),
+        label?.trim() ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "line-clamp-2", children: label.trim() }) : null
+      ] })
+    }
+  );
+}
+function GeneratedImageAttachment({
+  room,
+  image
+}) {
+  const [record, setRecord] = (0, import_react.useState)(null);
+  const [loading, setLoading] = (0, import_react.useState)(true);
+  const [objectUrl, setObjectUrl] = (0, import_react.useState)(null);
+  const imageUri = image.uri?.trim();
+  const statusDetail = image.statusDetail?.trim();
+  const size = displayImageSize(image.width, image.height);
+  (0, import_react.useEffect)(() => {
+    let cancelled = false;
+    setRecord(null);
+    setLoading(true);
+    if (imageUri && /^https?:\/\//iu.test(imageUri) && !image.imageId) {
+      setLoading(false);
+      return;
+    }
+    void loadGeneratedImageRecord({
+      room,
+      imageId: image.imageId,
+      imageUri,
+      fallbackMimeType: image.mimeType
+    }).then((nextRecord) => {
+      if (!cancelled) {
+        setRecord(nextRecord);
+        setLoading(false);
+      }
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [image.imageId, image.mimeType, imageUri, room]);
+  (0, import_react.useEffect)(() => {
+    if (!record) {
+      setObjectUrl(null);
+      return;
+    }
+    const blobBytes = new Uint8Array(record.bytes.byteLength);
+    blobBytes.set(record.bytes);
+    const blob = new Blob([blobBytes], { type: record.mimeType });
+    const nextUrl = URL.createObjectURL(blob);
+    setObjectUrl(nextUrl);
+    return () => {
+      URL.revokeObjectURL(nextUrl);
+    };
+  }, [record]);
+  if (imageUri && /^https?:\/\//iu.test(imageUri) && !image.imageId) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "button",
+      {
+        type: "button",
+        className: "block overflow-hidden rounded-md bg-muted/20 shadow-xs transition-opacity hover:opacity-95",
+        onClick: () => {
+          window.open(imageUri, "_blank", "noopener,noreferrer");
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "img",
+          {
+            src: imageUri,
+            alt: "Generated image",
+            className: "max-w-full object-contain",
+            style: { width: size.width, height: size.height }
+          }
+        )
+      }
+    );
+  }
+  if (loading) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      ImagePlaceholder,
+      {
+        image,
+        showSpinner: true,
+        label: statusDetail || (isImageGenerationPendingStatus(image.status) ? "Generating image" : "Loading image")
+      }
+    );
+  }
+  if (!objectUrl) {
+    if (isImageGenerationPendingStatus(image.status)) {
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ImagePlaceholder, { image, showSpinner: true, label: statusDetail || "Generating image" });
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      ImagePlaceholder,
+      {
+        image,
+        showSpinner: false,
+        label: statusDetail || (isImageGenerationFailedStatus(image.status) ? "Image failed" : "Image unavailable")
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "button",
+    {
+      type: "button",
+      className: "block overflow-hidden rounded-md bg-muted/20 shadow-xs transition-opacity hover:opacity-95",
+      onClick: () => {
+        window.open(objectUrl, "_blank", "noopener,noreferrer");
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "img",
+        {
+          src: objectUrl,
+          alt: "Generated image",
+          className: "max-w-full object-contain",
+          style: { width: size.width, height: size.height }
+        }
+      )
+    }
+  );
+}
+function AttachmentView({
+  room,
+  path,
+  openFile
+}) {
+  const preview = previewPath(path);
+  if (isImagePath(preview)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StorageImageAttachment, { room, path: preview });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FileAttachmentView, { room, path: preview, openFile });
+}
+function ThreadMessageView({
+  room,
+  message,
+  previous,
+  localParticipantName,
+  agentName,
+  openFile
+}) {
+  if (message.kind !== "message") {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "px-6 py-1 text-center text-sm text-muted-foreground", children: message.text });
+  }
+  const isAgentMessage = message.role === "agent";
+  const rawAuthorName = message.authorName;
+  const mine = !isAgentMessage && (rawAuthorName === localParticipantName || (!rawAuthorName || rawAuthorName.trim() === "") && message.role === "user");
+  const authorName = rawAuthorName ?? (isAgentMessage ? displayParticipantName(agentName ?? "agent") : localParticipantName);
+  const previousAuthor = previous?.authorName ?? (previous?.role === "agent" ? displayParticipantName(agentName ?? "agent") : localParticipantName);
+  const shouldShowHeader = previous?.kind !== "message" || previousAuthor !== authorName;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-2", children: [
+    shouldShowHeader && (authorName.trim() !== "" || message.createdAt) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_utils.cn)("flex w-full", mine ? "justify-end" : "justify-start"), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_utils.cn)("max-w-[85%] px-1 sm:max-w-2xl", mine ? "text-right" : "text-left"), children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "div",
+      {
+        className: (0, import_utils.cn)(
+          "flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground",
+          mine ? "justify-end" : "justify-start"
+        ),
+        children: [
+          authorName.trim() !== "" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-semibold text-foreground", children: displayParticipantName(authorName) }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: (0, import_chat_thread.timeAgo)(message.createdAt.toISOString()) })
+        ]
+      }
+    ) }) }) : null,
+    message.text.trim() !== "" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_utils.cn)("flex w-full", mine ? "justify-end" : "justify-start"), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ChatBubble, { text: message.text, mine }) }) : null,
+    message.attachments.length > 0 || message.image ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_utils.cn)("flex w-full", mine ? "justify-end" : "justify-start"), children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "div",
+      {
+        className: (0, import_utils.cn)(
+          "flex max-w-[85%] flex-wrap gap-3 px-1 sm:max-w-2xl",
+          mine ? "justify-end" : "justify-start"
+        ),
+        children: [
+          message.attachments.map((attachment, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            AttachmentView,
+            {
+              room,
+              path: attachment,
+              openFile
+            },
+            `${message.id}:attachment:${attachment}:${index}`
+          )),
+          message.image ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GeneratedImageAttachment, { room, image: message.image }) : null
+        ]
+      }
+    ) }) : null
+  ] });
+}
+function PendingMessageView({
+  room,
+  message,
+  localParticipantName
+}) {
+  const authorName = message.senderName ?? localParticipantName;
+  const createdAt = message.createdAt ?? /* @__PURE__ */ new Date();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: (0, import_utils.cn)("flex flex-col gap-2", message.awaitingOnline ? "opacity-70" : null), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex w-full justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "max-w-[85%] px-1 text-right sm:max-w-2xl", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-center justify-end gap-x-3 gap-y-1 text-xs text-muted-foreground", children: [
+      authorName.trim() !== "" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-semibold text-foreground", children: displayParticipantName(authorName) }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: (0, import_chat_thread.timeAgo)(createdAt.toISOString()) })
+    ] }) }) }),
+    message.text.trim() !== "" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex w-full justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ChatBubble, { text: message.text, mine: true }) }) : null,
+    message.attachments.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex w-full justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex max-w-[85%] flex-wrap justify-end gap-3 px-1 sm:max-w-2xl", children: message.attachments.map((attachment, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      FileAttachmentView,
+      {
+        room,
+        path: previewPath(attachment)
+      },
+      `${message.messageId}:pending:${attachment}:${index}`
+    )) }) }) : null
+  ] });
+}
+function EmptyState({
+  title,
+  description
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mx-auto flex h-full max-w-2xl flex-col items-center justify-center px-6 py-20 text-center", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-4xl font-semibold tracking-tight text-foreground sm:text-5xl", children: title }),
+    description?.trim() ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-3 max-w-xl text-sm leading-6 text-muted-foreground sm:text-base", children: description }) : null
+  ] });
+}
+function ErrorBanner({ message }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "mx-auto w-full max-w-[912px] whitespace-pre-wrap rounded-md border border-destructive/30 bg-destructive/5 px-4 py-3 text-sm text-destructive", children: message });
+}
+function sendThreadSubscriptionMessage({
+  room,
+  agent,
+  messageType,
+  path
+}) {
+  void room.messaging.sendMessage({
+    to: agent,
+    type: agentRoomMessageType,
+    ignoreOffline: true,
+    message: {
+      payload: { type: messageType, thread_id: path }
+    }
+  }).catch(() => void 0);
+}
+function DatasetChatThread({
+  room,
+  path,
+  agentName,
+  emptyStateTitle,
+  emptyStateDescription,
+  inputPlaceholder,
+  initialShowCompletedToolCalls = false,
+  openFile
+}) {
+  const modelRef = (0, import_react.useRef)(createDatasetThreadModel());
+  const [modelVersion, setModelVersion] = (0, import_react.useState)(0);
+  const [attachments, setAttachments] = (0, import_react.useState)([]);
+  const [sendError, setSendError] = (0, import_react.useState)(null);
+  const [showCompletedToolCalls, setShowCompletedToolCalls] = (0, import_react.useState)(initialShowCompletedToolCalls);
+  const status = (0, import_chat_hooks.useThreadStatus)({ room, path, agentName });
+  const agentParticipant = findAgentParticipant(room, agentName);
+  const localParticipantName = getParticipantName(room.localParticipant);
+  const scrollContainerRef = (0, import_react.useRef)(null);
+  const contentRef = (0, import_react.useRef)(null);
+  const stickToBottomRef = (0, import_react.useRef)(true);
+  const bumpModelVersion = (0, import_react.useCallback)(() => {
+    setModelVersion((current) => current + 1);
+  }, []);
+  (0, import_react.useEffect)(() => {
+    const model2 = createDatasetThreadModel();
+    modelRef.current = model2;
+    bumpModelVersion();
+    if (isTmpThreadPath(path)) {
+      model2.ready = true;
+      bumpModelVersion();
+      return;
+    }
+    let cancelled = false;
+    let retryTimer = null;
+    let iterator = null;
+    const scheduleRetry = () => {
+      if (retryTimer !== null) {
+        clearTimeout(retryTimer);
+      }
+      retryTimer = setTimeout(() => {
+        retryTimer = null;
+        connect();
+      }, 500);
+    };
+    const handleWatchError = (error) => {
+      if (cancelled || modelRef.current !== model2) {
+        return;
+      }
+      if (isDatasetTableNotFoundError(error)) {
+        model2.error = null;
+        model2.fatalError = false;
+        model2.ready = true;
+        scheduleRetry();
+      } else {
+        model2.error = error;
+        model2.fatalError = true;
+        model2.ready = true;
+      }
+      bumpModelVersion();
+    };
+    const connect = () => {
+      if (cancelled || modelRef.current !== model2) {
+        return;
+      }
+      try {
+        const ref = parseDatasetThreadRef(path);
+        iterator = room.datasets.watchTable({ table: ref.table, namespace: ref.namespace })[Symbol.asyncIterator]();
+      } catch (error) {
+        model2.error = error;
+        model2.fatalError = true;
+        model2.ready = true;
+        bumpModelVersion();
+        return;
+      }
+      void (async () => {
+        try {
+          while (!cancelled && modelRef.current === model2 && iterator !== null) {
+            const result = await iterator.next();
+            if (result.done) {
+              return;
+            }
+            if (handleWatchEvent(model2, result.value)) {
+              bumpModelVersion();
+            }
+          }
+        } catch (error) {
+          handleWatchError(error);
+        }
+      })();
+    };
+    connect();
+    return () => {
+      cancelled = true;
+      if (retryTimer !== null) {
+        clearTimeout(retryTimer);
+      }
+      void iterator?.return?.();
+    };
+  }, [bumpModelVersion, path, room]);
+  (0, import_react.useEffect)(() => {
+    const subscription = (0, import_meshagent_react.subscribe)(room.listen(), {
+      next: (event) => {
+        if (!(event instanceof import_meshagent.RoomMessageEvent)) {
+          return;
+        }
+        if (event.message.type !== agentRoomMessageType) {
+          return;
+        }
+        const payload = event.message.message.payload;
+        if (!isRecord(payload)) {
+          return;
+        }
+        if (applyAgentMessagePayload(modelRef.current, payload, path)) {
+          bumpModelVersion();
+        }
+      }
+    });
+    return () => {
+      subscription.unsubscribe();
+    };
+  }, [bumpModelVersion, path, room]);
+  (0, import_react.useEffect)(() => {
+    if (!agentParticipant) {
+      return;
+    }
+    sendThreadSubscriptionMessage({
+      room,
+      agent: agentParticipant,
+      messageType: agentThreadOpenType,
+      path
+    });
+    return () => {
+      sendThreadSubscriptionMessage({
+        room,
+        agent: agentParticipant,
+        messageType: agentThreadCloseType,
+        path
+      });
+    };
+  }, [agentParticipant, path, room]);
+  const allMessages = (0, import_react.useMemo)(() => {
+    const model2 = modelRef.current;
+    const mergedRowsByItemId = /* @__PURE__ */ new Map();
+    for (const [itemId, row] of model2.agentRowsByItemId.entries()) {
+      mergedRowsByItemId.set(itemId, row);
+    }
+    for (const [itemId, row] of model2.rowsByItemId.entries()) {
+      mergedRowsByItemId.set(itemId, row);
+    }
+    return Array.from(mergedRowsByItemId.values()).sort(compareDatasetThreadRows).map(messageForRow).filter((message) => message !== null);
+  }, [modelVersion]);
+  const visibleMessages = (0, import_react.useMemo)(
+    () => allMessages.filter((message) => shouldRenderDatasetThreadMessage(message, showCompletedToolCalls)),
+    [allMessages, showCompletedToolCalls]
+  );
+  const hiddenCompletedToolCallCount = (0, import_react.useMemo)(
+    () => allMessages.filter((message) => message.kind === "tool_call").length,
+    [allMessages]
+  );
+  const pendingMessages = (0, import_react.useMemo)(() => {
+    const combined = /* @__PURE__ */ new Map();
+    for (const pending of status.pendingMessages) {
+      combined.set(pending.messageId, pending);
+    }
+    const values = Array.from(combined.values()).filter((pending) => !allMessages.some((message) => datasetThreadMessageMatchesPendingAgentMessage(message, pending)));
+    return [
+      ...values.filter((message) => !message.awaitingAcceptance),
+      ...values.filter((message) => message.awaitingAcceptance)
+    ];
+  }, [allMessages, status.pendingMessages]);
+  const canInterruptActiveTurn = status.supportsAgentMessages && status.turnId != null;
+  const cancelTurn = (0, import_react.useCallback)(async () => {
+    if (!status.turnId?.trim() || !agentParticipant) {
+      return;
+    }
+    await room.messaging.sendMessage({
+      to: agentParticipant,
+      type: agentRoomMessageType,
+      message: {
+        payload: {
+          type: agentTurnInterruptType,
+          thread_id: path,
+          turn_id: status.turnId
+        }
+      }
+    });
+  }, [agentParticipant, path, room, status.turnId]);
+  const selectAttachments = (0, import_react.useCallback)((files) => {
+    const nextAttachments = files.map((file) => new import_file_attachment.MeshagentFileUpload(
+      room,
+      `uploaded-files/${file.name}`,
+      (0, import_file_attachment.fileToAsyncIterable)(file),
+      file.size
+    ));
+    setAttachments((current) => [...current, ...nextAttachments]);
+  }, [room]);
+  const handleSend = (0, import_react.useCallback)(async (message) => {
+    if (message.text.trim() === "" && message.attachments.length === 0) {
+      return;
+    }
+    if (!agentParticipant) {
+      setSendError("This thread requires an online agent that supports agent messages.");
+      return;
+    }
+    const isSteer = status.mode === "steerable" && status.turnId != null;
+    const normalizedAttachments = message.attachments.map(normalizeAgentAttachmentUrl).filter((attachment) => attachment !== null);
+    const senderName = localParticipantName.trim() || void 0;
+    upsertAgentRow({
+      model: modelRef.current,
+      itemId: message.id,
+      turnId: null,
+      timestamp: /* @__PURE__ */ new Date(),
+      data: {
+        kind: "message",
+        role: "user",
+        text: message.text,
+        sender_name: senderName,
+        attachments: normalizedAttachments
+      }
+    });
+    bumpModelVersion();
+    try {
+      const payload = {
+        type: isSteer ? agentTurnSteerType : agentTurnStartType,
+        thread_id: path,
+        message_id: message.id,
+        content: agentInputContent(message.text, message.attachments)
+      };
+      if (isSteer && status.turnId) {
+        payload.turn_id = status.turnId;
+      }
+      await room.messaging.sendMessage({
+        to: agentParticipant,
+        type: agentRoomMessageType,
+        message: { payload }
+      });
+      setSendError(null);
+    } catch (error) {
+      modelRef.current.agentRowsByItemId.delete(message.id);
+      bumpModelVersion();
+      setSendError(describeError(error));
+    }
+  }, [
+    agentParticipant,
+    bumpModelVersion,
+    localParticipantName,
+    path,
+    room,
+    status.mode,
+    status.turnId
+  ]);
+  const hasWireBackedContent = modelRef.current.agentRowsByItemId.size > 0 || status.pendingMessages.length > 0 || pendingMessages.length > 0;
+  const model = modelRef.current;
+  const statusText = status.text?.trim() || null;
+  const hasOverlay = statusText != null;
+  const lastVisibleMessage = visibleMessages.length > 0 ? visibleMessages[visibleMessages.length - 1] : null;
+  const lastMessageKey = `${lastVisibleMessage?.id ?? ""}:${lastVisibleMessage?.text.length ?? 0}:${pendingMessages.length}:${modelVersion}`;
+  (0, import_react.useEffect)(() => {
+    const container = scrollContainerRef.current;
+    if (!container) {
+      return;
+    }
+    stickToBottomRef.current = true;
+    container.scrollTop = container.scrollHeight;
+  }, [path]);
+  (0, import_react.useEffect)(() => {
+    const container = scrollContainerRef.current;
+    if (!container || !stickToBottomRef.current) {
+      return;
+    }
+    container.scrollTop = container.scrollHeight;
+  }, [hasOverlay, lastMessageKey, statusText]);
+  (0, import_react.useEffect)(() => {
+    const container = scrollContainerRef.current;
+    const content = contentRef.current;
+    if (!container || !content || typeof ResizeObserver === "undefined") {
+      return;
+    }
+    const observer = new ResizeObserver(() => {
+      if (stickToBottomRef.current) {
+        container.scrollTop = container.scrollHeight;
+      }
+    });
+    observer.observe(content);
+    return () => {
+      observer.disconnect();
+    };
+  }, []);
+  if (model.fatalError && model.error != null && !hasWireBackedContent) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex min-h-0 flex-1 items-center justify-center p-6", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "max-w-xl text-center text-sm text-muted-foreground", children: describeError(model.error) }) });
+  }
+  if (!model.ready && !hasWireBackedContent) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex min-h-0 flex-1 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_spinner.Spinner, { size: "lg", className: "text-muted-foreground" }) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex min-h-0 flex-1 flex-col", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative flex min-h-0 flex-1 flex-col", children: [
+      hiddenCompletedToolCallCount > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pointer-events-none absolute inset-x-0 top-0 z-10 flex justify-center px-4 pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pointer-events-auto flex w-full max-w-[912px] justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_button.Button,
+        {
+          type: "button",
+          variant: "ghost",
+          size: "sm",
+          className: "rounded-full border bg-background/90 backdrop-blur",
+          onClick: () => {
+            setShowCompletedToolCalls((current) => !current);
+          },
+          children: showCompletedToolCalls ? "Hide tool calls" : "Show tool calls"
+        }
+      ) }) }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "div",
+        {
+          ref: scrollContainerRef,
+          className: "min-h-0 flex-1 overflow-y-auto overflow-x-hidden [overflow-anchor:none]",
+          onScroll: (event) => {
+            stickToBottomRef.current = isNearBottom(event.currentTarget);
+          },
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+            "div",
+            {
+              ref: contentRef,
+              className: (0, import_utils.cn)(
+                "mx-auto flex min-h-full w-full max-w-[912px] flex-col gap-8 px-4 pt-6",
+                visibleMessages.length > 0 || pendingMessages.length > 0 ? "justify-end" : null,
+                hasOverlay ? "pb-24" : "pb-6"
+              ),
+              children: [
+                visibleMessages.length === 0 && pendingMessages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  EmptyState,
+                  {
+                    title: emptyStateTitle ?? "Chat to get started",
+                    description: emptyStateDescription
+                  }
+                ) : null,
+                visibleMessages.map((message, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  ThreadMessageView,
+                  {
+                    room,
+                    message,
+                    previous: index > 0 ? visibleMessages[index - 1] : null,
+                    localParticipantName,
+                    agentName,
+                    openFile
+                  },
+                  message.id
+                )),
+                pendingMessages.map((message) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  PendingMessageView,
+                  {
+                    room,
+                    message,
+                    localParticipantName
+                  },
+                  `pending:${message.messageId}`
+                ))
+              ]
+            }
+          )
+        }
+      ),
+      hasOverlay ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 flex justify-center px-4 pb-4", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pointer-events-auto w-full max-w-[912px]", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_chat_typing_indicator.ChatTypingIndicator,
+        {
+          typing: false,
+          thinking: false,
+          statusText,
+          startedAt: status.startedAt,
+          onCancel: canInterruptActiveTurn ? cancelTurn : void 0,
+          showCancelButton: status.mode != null,
+          cancelEnabled: true
+        }
+      ) }) }) : null
+    ] }),
+    sendError ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "px-4 pb-2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ErrorBanner, { message: sendError }) }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_chat_input.ChatInput,
+      {
+        onSubmit: handleSend,
+        attachments,
+        onFilesSelected: selectAttachments,
+        setAttachments,
+        disabled: agentParticipant == null,
+        placeholder: inputPlaceholder ?? (agentParticipant ? "Type a message" : `Waiting for ${displayParticipantName(agentName ?? "agent")}`)
+      }
+    )
+  ] });
+}