glitchgrab 1.58.2 → 1.59.0

package/dist/index.js

@@ -49,12 +49,14 @@ __export(index_exports, {
   computeSignature: () => computeSignature,
   enhanceText: () => enhanceText,
   fetchGlitchgrabFeedback: () => fetchGlitchgrabFeedback,
+  fetchGlitchgrabReportThread: () => fetchGlitchgrabReportThread,
   fetchGlitchgrabReports: () => fetchGlitchgrabReports,
   getAppContext: () => getAppContext,
   getBreadcrumbs: () => getBreadcrumbs,
   getShortcutLabel: () => getShortcutLabel2,
   initBreadcrumbs: () => initBreadcrumbs,
   matchesShortcut: () => matchesShortcut,
+  postGlitchgrabReportComment: () => postGlitchgrabReportComment,
   sanitizeUrl: () => sanitizeUrl,
   sendFeedback: () => sendFeedback,
   sendLead: () => sendLead,
@@ -65,6 +67,7 @@ __export(index_exports, {
   useGlitchgrab: () => useGlitchgrab,
   useGlitchgrabActions: () => useGlitchgrabActions,
   useGlitchgrabFeedback: () => useGlitchgrabFeedback,
+  useGlitchgrabReportThread: () => useGlitchgrabReportThread,
   useGlitchgrabReports: () => useGlitchgrabReports
 });
 module.exports = __toCommonJS(index_exports);
@@ -239,7 +242,7 @@ function argsToString(args) {
 function previewJson(value, max) {
   let out = "";
   const path = /* @__PURE__ */ new WeakSet();
-  const write = (input, inArray) => {
+  const write2 = (input, inArray) => {
     if (out.length > max) return;
     let v = input;
     if (v !== null && typeof v === "object" && typeof v.toJSON === "function") {
@@ -276,7 +279,7 @@ function previewJson(value, max) {
       out += "[";
       for (let i = 0; i < obj.length && out.length <= max; i++) {
         if (i > 0) out += ",";
-        write(obj[i], true);
+        write2(obj[i], true);
       }
       out += "]";
     } else {
@@ -289,13 +292,13 @@ function previewJson(value, max) {
         if (child === void 0 || typeof child === "function" || typeof child === "symbol") continue;
         out += `${first ? "" : ","}${JSON.stringify(key)}:`;
         first = false;
-        write(child, false);
+        write2(child, false);
       }
       out += "}";
     }
     path.delete(obj);
   };
-  write(value, false);
+  write2(value, false);
   return out;
 }
 async function readErrorBody(response, url) {
@@ -772,12 +775,21 @@ function signedFields(identity) {
   return { userId: identity.userId, signature: identity.signature };
 }
 async function enhanceText(text, token, baseUrl, screenshot, context, identity) {
+  try {
+    return await enhanceTextOrThrow(text, token, baseUrl, screenshot, context, identity);
+  } catch (e) {
+    return text;
+  }
+}
+async function enhanceTextOrThrow(text, token, baseUrl, screenshot, context, identity) {
   var _a;
+  const trimmed = text.trim();
+  if (!trimmed) return text;
+  const unavailable = "AI enhance isn't available right now \u2014 send your report as written.";
+  let response;
   try {
-    const trimmed = text.trim();
-    if (!trimmed) return text;
     const url = `${baseUrl != null ? baseUrl : DEFAULT_BASE_URL}/api/v1/ai/enhance-text`;
-    const response = await fetch(url, {
+    response = await fetch(url, {
       method: "POST",
       headers: {
         "Content-Type": "application/json",
@@ -790,15 +802,20 @@ async function enhanceText(text, token, baseUrl, screenshot, context, identity)
         ...signedFields(identity)
       })
     });
-    if (!response.ok) return text;
-    const envelope = await response.json();
-    if ((envelope == null ? void 0 : envelope.success) && typeof ((_a = envelope.data) == null ? void 0 : _a.text) === "string") {
-      return envelope.data.text;
-    }
-    return text;
   } catch (e) {
-    return text;
+    throw new Error(unavailable);
+  }
+  if (response.status === 429) {
+    throw new Error("Too many AI enhance tries \u2014 wait a while, or send your report as written.");
   }
+  const envelope = await response.json().catch(() => null);
+  if (response.ok && (envelope == null ? void 0 : envelope.success) && typeof ((_a = envelope.data) == null ? void 0 : _a.text) === "string") {
+    return envelope.data.text;
+  }
+  if (response.status === 400 && typeof (envelope == null ? void 0 : envelope.error) === "string") {
+    throw new Error(envelope.error);
+  }
+  throw new Error(unavailable);
 }
 async function findSimilarIssues(description, token, baseUrl, identity, files) {
   var _a;
@@ -956,6 +973,292 @@ function clearDedupCache() {
   seen.clear();
 }
 
+// src/hydration.ts
+var HYDRATION_CODE_RE = /Minified React error #(418|419|422|423|425)\b/;
+var HYDRATION_DEV_RE = /Hydration failed|hydration mismatch|Text content does not match|did not match\. Server|There was an error while hydrating|error occurred during hydration|server rendered HTML didn't match/i;
+var BAILOUT_DIGEST = "BAILOUT_TO_CLIENT_SIDE_RENDERING";
+var DOM_SNIPPET_MAX = 3e3;
+var STACK_FRAMES_MAX = 40;
+function messageOf(error) {
+  if (error && typeof error === "object" && typeof error.message === "string") {
+    return error.message;
+  }
+  return typeof error === "string" ? error : "";
+}
+function hydrationCode(message) {
+  if (!message) return null;
+  const m = HYDRATION_CODE_RE.exec(message);
+  if (m) return m[1];
+  return HYDRATION_DEV_RE.test(message) ? "dev" : null;
+}
+function isHydrationError(error) {
+  if (hydrationCode(messageOf(error))) return true;
+  const cause = error && typeof error === "object" ? error.cause : void 0;
+  return cause !== void 0 && cause !== error && hydrationCode(messageOf(cause)) !== null;
+}
+function isBailout(error) {
+  const e = error;
+  if (!e || typeof e !== "object") return false;
+  if (e.digest === BAILOUT_DIGEST) return true;
+  const c = e.cause;
+  return !!c && typeof c === "object" && c.digest === BAILOUT_DIGEST;
+}
+function componentStackNames(stack) {
+  if (!stack) return [];
+  const names = [];
+  for (const raw of stack.split("\n")) {
+    const line = raw.trim();
+    if (!line) continue;
+    let name = "";
+    if (line.startsWith("at ")) {
+      name = line.slice(3).split(" (")[0].trim();
+    } else if (line.includes("@")) {
+      name = line.slice(0, line.indexOf("@")).trim();
+    } else {
+      name = line;
+    }
+    if (name) names.push(name);
+    if (names.length >= STACK_FRAMES_MAX) break;
+  }
+  return names;
+}
+function componentStackKey(stack) {
+  return componentStackNames(stack).join(">");
+}
+var observer = null;
+var observerStarted = false;
+var observerStopAt = 0;
+var OBSERVE_MS = 3e4;
+function startObserver() {
+  if (observerStarted || typeof MutationObserver === "undefined" || typeof document === "undefined") {
+    return;
+  }
+  observerStarted = true;
+  try {
+    observer = new MutationObserver(() => {
+      if (Date.now() > observerStopAt) stopObserver();
+    });
+    observer.observe(document, { childList: true, subtree: true });
+    observerStopAt = Date.now() + OBSERVE_MS;
+    setTimeout(stopObserver, OBSERVE_MS);
+  } catch (e) {
+    observer = null;
+  }
+}
+function stopObserver() {
+  try {
+    observer == null ? void 0 : observer.disconnect();
+  } catch (e) {
+  }
+  observer = null;
+}
+function describeNode(node) {
+  if (!node) return "";
+  if (node.nodeType === 9) return "#document";
+  const el = node;
+  if (!el.tagName) return node.nodeName;
+  const id = el.id ? `#${el.id}` : "";
+  const cls = typeof el.className === "string" && el.className.trim() ? "." + el.className.trim().split(/\s+/).slice(0, 3).join(".") : "";
+  return `${el.tagName.toLowerCase()}${id}${cls}`;
+}
+function pathOf(node) {
+  const parts = [];
+  let cur = node;
+  while (cur && parts.length < 6) {
+    parts.unshift(describeNode(cur));
+    if (cur.nodeType === 9) break;
+    cur = cur.parentNode;
+  }
+  return parts.join(" > ");
+}
+var NON_CONTENT_TAGS = /* @__PURE__ */ new Set(["SCRIPT", "STYLE", "LINK", "META", "NOSCRIPT", "TEMPLATE", "TITLE", "HEAD"]);
+function isInHead(node) {
+  for (let cur = node; cur; cur = cur.parentNode) {
+    if (cur.nodeName === "HEAD") return true;
+    if (cur.nodeName === "BODY") return false;
+  }
+  return false;
+}
+var GSTIN_RE = /\b\d{2}[A-Z]{5}\d{4}[A-Z][A-Z0-9]Z[A-Z0-9]\b/g;
+var PAN_RE = /\b[A-Z]{5}\d{4}[A-Z]\b/g;
+function scrubHtml(html) {
+  return redactString(
+    html.replace(/\svalue="[^"]*"/gi, ' value="[REDACTED]"').replace(GSTIN_RE, "[REDACTED_GSTIN]").replace(PAN_RE, "[REDACTED_PAN]").replace(/\d{6,}/g, (m) => "#".repeat(Math.min(m.length, 6)))
+  );
+}
+function takeRemovedServerHtml() {
+  var _a, _b;
+  if (!observer) return { html: "", where: "" };
+  try {
+    const records = observer.takeRecords();
+    let html = "";
+    let where = "";
+    for (const rec of records) {
+      if (rec.type !== "childList" || rec.removedNodes.length === 0) continue;
+      if (isInHead(rec.target)) continue;
+      if (!where) where = pathOf(rec.target);
+      for (const node of Array.from(rec.removedNodes)) {
+        if (node.nodeType === 1 && NON_CONTENT_TAGS.has(node.tagName)) continue;
+        if (node.nodeType === 3 && !((_a = node.textContent) != null ? _a : "").trim()) continue;
+        const piece = node.nodeType === 1 ? node.outerHTML : node.nodeType === 3 ? `#text "${(_b = node.textContent) != null ? _b : ""}"` : "";
+        if (!piece) continue;
+        html += (html ? "\n" : "") + piece;
+        if (html.length >= DOM_SNIPPET_MAX) break;
+      }
+      if (html.length >= DOM_SNIPPET_MAX) break;
+    }
+    const scrubbed = scrubHtml(html);
+    return {
+      html: scrubbed.length > DOM_SNIPPET_MAX ? `${scrubbed.slice(0, DOM_SNIPPET_MAX)}\u2026[truncated]` : scrubbed,
+      where
+    };
+  } catch (e) {
+    return { html: "", where: "" };
+  }
+}
+function detectForeignNodes(doc = document) {
+  var _a;
+  const found = [];
+  try {
+    const html = doc.documentElement;
+    if ((html == null ? void 0 : html.classList.contains("translated-ltr")) || (html == null ? void 0 : html.classList.contains("translated-rtl"))) {
+      found.push("Google Translate is active (html.translated-*)");
+    }
+    const fonts = doc.getElementsByTagName("font").length;
+    if (fonts > 0) found.push(`<font> \xD7 ${fonts} (Google Translate or a translation extension)`);
+    const detectors = doc.querySelectorAll("a[x-apple-data-detectors]").length;
+    if (detectors > 0) {
+      found.push(`<a x-apple-data-detectors> \xD7 ${detectors} (iOS format detection turned text into links)`);
+    }
+    if (doc.querySelector("[data-gr-ext-installed],[data-new-gr-c-s-check-loaded],grammarly-desktop-integration")) {
+      found.push("Grammarly extension attributes");
+    }
+    if (doc.querySelector("[data-lt-installed]")) found.push("LanguageTool extension attributes");
+    if ((_a = doc.body) == null ? void 0 : _a.hasAttribute("cz-shortcut-listen")) found.push("ColorZilla extension attribute on <body>");
+    const custom = /* @__PURE__ */ new Set();
+    for (const parent of [html, doc.body]) {
+      if (!parent) continue;
+      for (const child of Array.from(parent.children)) {
+        const tag = child.tagName.toLowerCase();
+        if (tag.includes("-")) custom.add(tag);
+      }
+    }
+    if (custom.size > 0) {
+      found.push(`custom elements at top level: ${Array.from(custom).slice(0, 5).join(", ")} (often an extension)`);
+    }
+  } catch (e) {
+  }
+  return found;
+}
+function hydrationTiming() {
+  var _a, _b, _c, _d;
+  try {
+    if (typeof performance === "undefined") return "";
+    const at2 = Math.round(performance.now());
+    const parts = [`error at ${at2}ms after navigation start`];
+    const nav = (_b = (_a = performance.getEntriesByType) == null ? void 0 : _a.call(performance, "navigation")) == null ? void 0 : _b[0];
+    if (nav == null ? void 0 : nav.domContentLoadedEventEnd) {
+      parts.push(`DOMContentLoaded ${Math.round(nav.domContentLoadedEventEnd)}ms`);
+    }
+    const fetches = ((_d = (_c = performance.getEntriesByType) == null ? void 0 : _c.call(performance, "resource")) != null ? _d : []).filter((e) => {
+      const t = e.initiatorType;
+      return t === "fetch" || t === "xmlhttprequest";
+    }).sort((a, b) => a.responseEnd - b.responseEnd).slice(0, 8).map((e) => {
+      let path = e.name;
+      try {
+        const u = new URL(e.name);
+        path = u.origin === window.location.origin ? u.pathname : `${u.host}${u.pathname}`;
+      } catch (e2) {
+      }
+      return `${path} ${Math.round(e.responseEnd)}ms`;
+    });
+    if (fetches.length > 0) parts.push(`fetches finished before it: ${fetches.join(", ")}`);
+    else parts.push("no fetch had finished yet");
+    return parts.join("; ");
+  } catch (e) {
+    return "";
+  }
+}
+function hydrationMetadata(error, extra) {
+  var _a, _b, _c;
+  const code = (_a = hydrationCode(messageOf(error))) != null ? _a : hydrationCode(messageOf(error == null ? void 0 : error.cause));
+  const meta = { errorKind: "hydration" };
+  if (code) meta.hydrationCode = code;
+  const cause = error == null ? void 0 : error.cause;
+  if (cause && cause !== error && messageOf(cause)) {
+    meta.hydrationCause = messageOf(cause).slice(0, 500);
+  }
+  if ((_b = extra == null ? void 0 : extra.removed) == null ? void 0 : _b.html) meta.hydrationServerHtml = extra.removed.html;
+  if ((_c = extra == null ? void 0 : extra.removed) == null ? void 0 : _c.where) meta.hydrationReplacedIn = extra.removed.where;
+  const foreign = detectForeignNodes();
+  if (foreign.length > 0) meta.hydrationForeignNodes = foreign.join("\n");
+  const timing = hydrationTiming();
+  if (timing) meta.hydrationTiming = timing;
+  return meta;
+}
+var handled = /* @__PURE__ */ new WeakSet();
+function isHandledHydrationError(error) {
+  return !!error && typeof error === "object" && handled.has(error);
+}
+function markHandled(error) {
+  if (error && typeof error === "object") {
+    handled.add(error);
+    const cause = error.cause;
+    if (cause && typeof cause === "object") handled.add(cause);
+  }
+}
+var reporter = null;
+var PATCHED = "__glitchgrabHydrationPatched";
+function findFiberRoot(container) {
+  if (!container || typeof container !== "object") return null;
+  try {
+    const key = Object.keys(container).find((k) => k.startsWith("__reactContainer$"));
+    if (!key) return null;
+    const hostRoot = container[key];
+    const root = hostRoot == null ? void 0 : hostRoot.stateNode;
+    return root && typeof root === "object" ? root : null;
+  } catch (e) {
+    return null;
+  }
+}
+function patchRoot(root) {
+  if (root[PATCHED]) return true;
+  const original = root.onRecoverableError;
+  if (typeof original !== "function") return false;
+  root.onRecoverableError = function glitchgrabOnRecoverableError(error, info) {
+    var _a;
+    try {
+      if (reporter && isHydrationError(error) && !isBailout(error)) {
+        const removed = takeRemovedServerHtml();
+        markHandled(error);
+        reporter(error, (_a = info == null ? void 0 : info.componentStack) != null ? _a : "", hydrationMetadata(error, { removed }));
+      }
+    } catch (e) {
+    }
+    return original.call(this, error, info);
+  };
+  root[PATCHED] = true;
+  return true;
+}
+function patchKnownRoots() {
+  if (typeof document === "undefined") return false;
+  let patched = false;
+  for (const container of [document, document.getElementById("__next"), document.getElementById("root")]) {
+    const root = findFiberRoot(container);
+    if (root && patchRoot(root)) patched = true;
+  }
+  return patched;
+}
+function installHydrationCapture(report) {
+  try {
+    if (typeof window === "undefined") return;
+    reporter = report;
+    startObserver();
+    patchKnownRoots();
+  } catch (e) {
+  }
+}
+
 // src/capture.ts
 var config = null;
 function registerCaptureConfig(next) {
@@ -975,7 +1278,7 @@ function sessionMetadata(session) {
     ...(session == null ? void 0 : session.phone) ? { sessionUserPhone: String(session.phone) } : {}
   };
 }
-function buildCapturedErrorPayload(error, options, cfg, capturedBy = "captureError") {
+function buildCapturedErrorPayload(error, options, cfg, capturedBy = "captureError", dedupKey) {
   var _a, _b, _c;
   const err = error instanceof Error ? error : void 0;
   const errorMessage = err ? err.message : String(error);
@@ -987,7 +1290,7 @@ function buildCapturedErrorPayload(error, options, cfg, capturedBy = "captureErr
   const sig = computeSignature({
     errorMessage,
     pageUrl: context.url,
-    errorStack: err == null ? void 0 : err.stack,
+    errorStack: dedupKey ? `at ${dedupKey}` : err == null ? void 0 : err.stack,
     digest
   });
   if (shouldSkipDuplicate(sig)) return null;
@@ -1027,6 +1330,25 @@ function captureError(error, options) {
   } catch (e) {
   }
 }
+function reportHydrationError(error, componentStack, metadata) {
+  try {
+    const cfg = config;
+    if (!(cfg == null ? void 0 : cfg.token)) return;
+    const payload = buildCapturedErrorPayload(
+      error,
+      { componentStack: componentStack || void 0, metadata },
+      cfg,
+      "onRecoverableError",
+      componentStackKey(componentStack) || void 0
+    );
+    if (!payload) return;
+    void sendReport(payload, cfg.baseUrl).then((result) => {
+      if (result && cfg.onReportSent) cfg.onReportSent(result);
+    });
+    if (cfg.onError && error instanceof Error) cfg.onError(error);
+  } catch (e) {
+  }
+}
 
 // src/error-boundary.tsx
 var GlitchgrabErrorBoundary = class extends React.Component {
@@ -1948,6 +2270,79 @@ function renderBlocks(lines, theme, key) {
 function ChatMarkdown({ text, theme }) {
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: STACK, children: renderBlocks(text.replace(/\r\n?/g, "\n").split("\n"), theme, "md") });
 }
+var MAX_SAVED_CHATS = 20;
+var SAVED_CHAT_MAX_AGE_MS = 30 * 24 * 60 * 60 * 1e3;
+var TITLE_CHARS = 80;
+var PREFIX = "glitchgrab:ai-chats:";
+function chatHistoryKey(...parts) {
+  const input = parts.map((p) => p != null ? p : "").join("\0");
+  let hash = 2166136261;
+  for (let i = 0; i < input.length; i++) {
+    hash ^= input.charCodeAt(i);
+    hash = Math.imul(hash, 16777619);
+  }
+  return (hash >>> 0).toString(36);
+}
+function chatTitle(messages) {
+  var _a, _b;
+  const first = (_b = (_a = messages.find((m) => m.role === "user")) == null ? void 0 : _a.content.trim()) != null ? _b : "";
+  const line = first.replace(/\s+/g, " ");
+  return line.length > TITLE_CHARS ? `${line.slice(0, TITLE_CHARS - 1)}\u2026` : line;
+}
+function storage() {
+  try {
+    return typeof window !== "undefined" && window.localStorage ? window.localStorage : null;
+  } catch (e) {
+    return null;
+  }
+}
+function isSavedChat(value) {
+  if (!value || typeof value !== "object") return false;
+  const c = value;
+  return typeof c.id === "string" && typeof c.title === "string" && typeof c.updatedAt === "number" && (c.status === "open" || c.status === "filed") && Array.isArray(c.messages);
+}
+function loadChats(key, now = Date.now()) {
+  const store = storage();
+  if (!store) return [];
+  try {
+    const raw = store.getItem(PREFIX + key);
+    if (!raw) return [];
+    const parsed = JSON.parse(raw);
+    if (!Array.isArray(parsed)) return [];
+    return parsed.filter(isSavedChat).filter((c) => now - c.updatedAt < SAVED_CHAT_MAX_AGE_MS).sort((a, b) => b.updatedAt - a.updatedAt).slice(0, MAX_SAVED_CHATS);
+  } catch (e) {
+    return [];
+  }
+}
+function write(key, chats) {
+  const store = storage();
+  if (!store) return;
+  try {
+    if (chats.length === 0) store.removeItem(PREFIX + key);
+    else store.setItem(PREFIX + key, JSON.stringify(chats));
+  } catch (e) {
+  }
+}
+function saveChat(key, chat, now = Date.now()) {
+  const rest = loadChats(key, now).filter((c) => c.id !== chat.id);
+  const next = [chat, ...rest].slice(0, MAX_SAVED_CHATS);
+  write(key, next);
+  return next;
+}
+function markChatFiled(key, conversationId, label, now = Date.now()) {
+  const chats = loadChats(key, now);
+  const hit = chats.find((c) => c.conversationId === conversationId);
+  if (!hit || hit.status === "filed") return;
+  write(
+    key,
+    chats.map((c) => c === hit ? { ...c, status: "filed", filedLabel: label, updatedAt: now } : c)
+  );
+}
+function removeChat(key, id, now = Date.now()) {
+  const next = loadChats(key, now).filter((c) => c.id !== id);
+  write(key, next);
+  return next;
+}
 function pickAssistImages(all) {
   const picked = [];
   let total = 0;
@@ -1974,6 +2369,18 @@ function pickAssistFiles(files) {
   }
   return picked;
 }
+function newChatId() {
+  return `local-${Date.now().toString(36)}${Math.random().toString(36).slice(2, 6)}`;
+}
+function chatAge(at2, now = Date.now()) {
+  const min = Math.round((now - at2) / 6e4);
+  if (min < 1) return "just now";
+  if (min < 60) return `${min} min ago`;
+  const hours = Math.round(min / 60);
+  if (hours < 24) return `${hours} h ago`;
+  if (hours < 48) return "yesterday";
+  return new Date(at2).toLocaleDateString(void 0, { day: "numeric", month: "short" });
+}
 var STARTERS = [
   "Something on this page is broken",
   "It did the wrong thing",
@@ -2056,6 +2463,33 @@ function Avatar({
     }
   );
 }
+var THINKING_SLOW_SECONDS = 20;
+function ThinkingClock({ color }) {
+  const [seconds, setSeconds] = (0, import_react3.useState)(0);
+  (0, import_react3.useEffect)(() => {
+    const started = Date.now();
+    const id = setInterval(() => setSeconds(Math.floor((Date.now() - started) / 1e3)), 1e3);
+    return () => clearInterval(id);
+  }, []);
+  return (
+    // Hidden from screen readers: the bubble already says "Thinking", and a
+    // number changing every second would be read out every second.
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+      "span",
+      {
+        "data-gg-thinking-clock": "",
+        "aria-hidden": "true",
+        style: { marginLeft: "6px", fontSize: "12px", color, fontVariantNumeric: "tabular-nums" },
+        children: [
+          "Thinking\u2026 ",
+          seconds,
+          "s",
+          seconds >= THINKING_SLOW_SECONDS ? " \xB7 taking longer than usual, still working" : ""
+        ]
+      }
+    )
+  );
+}
 function AssistSheet({
   assist,
   theme: t,
@@ -2096,14 +2530,22 @@ function AssistSheet({
   onDegrade,
   onClose,
   onFinish,
-  onReportGlitchgrabProblem
+  onReportGlitchgrabProblem,
+  historyKey = null
 }) {
+  var _a;
   const narrow = useIsNarrow();
   const severityAsked = showSeverity && currentTile === "BUG";
   const [messages, setMessages] = (0, import_react3.useState)([]);
   const [input, setInput] = (0, import_react3.useState)("");
   const [busy, setBusy] = (0, import_react3.useState)(false);
   const [conversationId, setConversationId] = (0, import_react3.useState)(null);
+  const chatIdRef = (0, import_react3.useRef)(newChatId());
+  const [savedChats, setSavedChats] = (0, import_react3.useState)(
+    () => historyKey ? loadChats(historyKey) : []
+  );
+  const [showChats, setShowChats] = (0, import_react3.useState)(false);
+  const [viewingChat, setViewingChat] = (0, import_react3.useState)(null);
   const [hoveredStar, setHoveredStar] = (0, import_react3.useState)(0);
   const [options, setOptions] = (0, import_react3.useState)([]);
   const [duplicate, setDuplicate] = (0, import_react3.useState)(null);
@@ -2155,8 +2597,8 @@ function AssistSheet({
     if (el) el.scrollTop = el.scrollHeight;
   }, [messages, busy, phase]);
   (0, import_react3.useEffect)(() => {
-    var _a;
-    if (phase === "draft") (_a = draftRef.current) == null ? void 0 : _a.focus();
+    var _a2;
+    if (phase === "draft") (_a2 = draftRef.current) == null ? void 0 : _a2.focus();
   }, [phase]);
   (0, import_react3.useEffect)(() => {
     const el = composerRef.current;
@@ -2188,7 +2630,8 @@ function AssistSheet({
     onDegrade(message, retryable);
   }
   async function runTurn(history2, autoFile = false) {
-    var _a, _b, _c;
+    var _a2, _b, _c;
+    const turnChat = chatIdRef.current;
     setBusy(true);
     setAutoFileLeft(null);
     let result;
@@ -2225,6 +2668,7 @@ function AssistSheet({
     } finally {
       setBusy(false);
     }
+    if (chatIdRef.current !== turnChat) return;
     if (result.degraded) {
       degradeKeepingEvents(events, result.degraded, result.retryable === true);
       return;
@@ -2235,7 +2679,7 @@ function AssistSheet({
     }
     const attach = result.duplicate ? { ...result.duplicate, kind: "duplicate" } : result.related ? { ...result.related, kind: "related" } : null;
     setDuplicate(attach);
-    onDuplicateChange == null ? void 0 : onDuplicateChange((_a = attach == null ? void 0 : attach.number) != null ? _a : null, attach == null ? void 0 : attach.kind);
+    onDuplicateChange == null ? void 0 : onDuplicateChange((_a2 = attach == null ? void 0 : attach.number) != null ? _a2 : null, attach == null ? void 0 : attach.kind);
     setGlitchgrabOffer(!!result.aboutGlitchgrab && !!onReportGlitchgrabProblem && !!result.question);
     if (result.solved) {
       setSolved(result.solved);
@@ -2289,9 +2733,9 @@ function AssistSheet({
     }
   }
   function sendTyped(text) {
-    var _a;
+    var _a2;
     const lastAssistant = [...messages].reverse().find((m) => m.role === "assistant");
-    const checkingBack = options.includes(CONFIRM_OPTION) || (lastAssistant == null ? void 0 : lastAssistant.kind) !== "report" && isCheckBackQuestion((_a = lastAssistant == null ? void 0 : lastAssistant.content) != null ? _a : "");
+    const checkingBack = options.includes(CONFIRM_OPTION) || (lastAssistant == null ? void 0 : lastAssistant.kind) !== "report" && isCheckBackQuestion((_a2 = lastAssistant == null ? void 0 : lastAssistant.content) != null ? _a2 : "");
     send(text, checkingBack && isAffirmativeReply(text));
   }
   function send(text, autoFile = false) {
@@ -2333,7 +2777,215 @@ function AssistSheet({
     flushEvents();
     onSend();
   }
+  (0, import_react3.useEffect)(() => {
+    if (!historyKey || !messages.some((m) => m.role === "user")) return;
+    const done = submitted || phase === "solved";
+    const kept = submitted || phase === "draft" ? withCurrentDraft(messages) : messages;
+    setSavedChats(
+      saveChat(historyKey, {
+        id: chatIdRef.current,
+        conversationId,
+        title: chatTitle(kept),
+        tile: currentTile,
+        messages: kept,
+        ...issueTitle ? { issueTitle } : {},
+        status: done ? "filed" : "open",
+        ...done ? {
+          filedLabel: submitted ? submittedText != null ? submittedText : `${reportTypeLabel} sent` : "Answered \u2014 nothing was filed"
+        } : {},
+        updatedAt: Date.now()
+      })
+    );
+  }, [
+    historyKey,
+    messages,
+    conversationId,
+    submitted,
+    phase === "solved",
+    issueTitle,
+    phase === "draft" ? description : null
+  ]);
+  function resumeChat(chat) {
+    var _a2;
+    flushEvents();
+    chatIdRef.current = chat.id;
+    setMessages(chat.messages);
+    setConversationId(chat.conversationId);
+    onConversationChange == null ? void 0 : onConversationChange(chat.conversationId);
+    setOptions([]);
+    setDuplicate(null);
+    onDuplicateChange == null ? void 0 : onDuplicateChange(null);
+    setGlitchgrabOffer(false);
+    setAutoFileLeft(null);
+    setInput("");
+    if (chat.tile !== currentTile && tiles.includes(chat.tile)) {
+      onPickType(chat.tile);
+    }
+    const last = chat.messages[chat.messages.length - 1];
+    if ((last == null ? void 0 : last.kind) === "report") {
+      onDescriptionChange(last.content);
+      onIssueTitleChange((_a2 = chat.issueTitle) != null ? _a2 : "");
+      aiDraftRef.current = last.content;
+      setPhase("draft");
+    } else {
+      setPhase("chat");
+    }
+    setShowChats(false);
+    setViewingChat(null);
+  }
+  function startNewChat() {
+    flushEvents();
+    chatIdRef.current = newChatId();
+    setMessages([]);
+    setConversationId(null);
+    onConversationChange == null ? void 0 : onConversationChange(null);
+    setOptions([]);
+    setDuplicate(null);
+    onDuplicateChange == null ? void 0 : onDuplicateChange(null);
+    setGlitchgrabOffer(false);
+    setAutoFileLeft(null);
+    setInput("");
+    onDescriptionChange("");
+    onIssueTitleChange("");
+    aiDraftRef.current = null;
+    setPhase("chat");
+    setShowChats(false);
+    setViewingChat(null);
+  }
+  function forgetChat(id) {
+    if (!historyKey) return;
+    setSavedChats(removeChat(historyKey, id));
+    if (viewingChat === id) setViewingChat(null);
+  }
+  const otherChats = savedChats.filter((c) => c.id !== chatIdRef.current);
+  const resumable = (_a = otherChats.find((c) => c.status === "open" && c.messages.length > 0)) != null ? _a : null;
   const empty = phase === "chat" && messages.length === 0 && !busy;
+  function renderChatList() {
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { "data-gg-chat-list": "", style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { fontSize: "13px", fontWeight: 600 }, children: "Your chats" }),
+        messages.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          "button",
+          {
+            type: "button",
+            "data-gg-new-chat": "",
+            onClick: startNewChat,
+            style: {
+              border: `1px solid ${t.inputBorder}`,
+              borderRadius: "999px",
+              background: "transparent",
+              color: t.text,
+              padding: "7px 12px",
+              fontSize: "12px",
+              fontFamily: "inherit",
+              cursor: "pointer"
+            },
+            children: "+ New chat"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { fontSize: "11.5px", color: t.textMuted, lineHeight: 1.5 }, children: "Kept in this browser only, for 30 days." }),
+      otherChats.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { fontSize: "12.5px", color: t.textMuted, padding: "12px 0" }, children: "No other chats yet." }),
+      otherChats.map((chat) => {
+        var _a2;
+        const filed = chat.status === "filed";
+        const open = viewingChat === chat.id;
+        return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+          "div",
+          {
+            "data-gg-saved-chat": chat.status,
+            style: {
+              border: `1px solid ${t.border}`,
+              borderRadius: "10px",
+              padding: "10px 12px",
+              display: "flex",
+              flexDirection: "column",
+              gap: "6px",
+              minWidth: 0
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px", alignItems: "flex-start", minWidth: 0 }, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => filed ? setViewingChat(open ? null : chat.id) : resumeChat(chat),
+                    style: {
+                      flex: 1,
+                      minWidth: 0,
+                      textAlign: "left",
+                      border: "none",
+                      background: "transparent",
+                      color: t.text,
+                      padding: 0,
+                      fontFamily: "inherit",
+                      cursor: "pointer",
+                      display: "flex",
+                      flexDirection: "column",
+                      gap: "4px"
+                    },
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { fontSize: "13px", lineHeight: 1.45, overflowWrap: "anywhere" }, children: chat.title || "Untitled chat" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { style: { fontSize: "11.5px", color: t.textMuted }, children: [
+                        filed ? (_a2 = chat.filedLabel) != null ? _a2 : "Sent" : "Not sent yet \u2014 tap to continue",
+                        " \xB7",
+                        " ",
+                        chatAge(chat.updatedAt)
+                      ] })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-label": `Delete chat: ${chat.title}`,
+                    onClick: () => forgetChat(chat.id),
+                    style: {
+                      flexShrink: 0,
+                      border: "none",
+                      background: "transparent",
+                      color: t.textMuted,
+                      fontSize: "16px",
+                      lineHeight: 1,
+                      padding: "4px 6px",
+                      cursor: "pointer",
+                      fontFamily: "inherit"
+                    },
+                    children: "\xD7"
+                  }
+                )
+              ] }),
+              open && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                "div",
+                {
+                  "data-gg-saved-transcript": "",
+                  style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: "6px",
+                    borderTop: `1px solid ${t.border}`,
+                    paddingTop: "8px",
+                    fontSize: "12.5px",
+                    lineHeight: 1.5
+                  },
+                  children: chat.messages.map((m, i) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { minWidth: 0, overflowWrap: "anywhere" }, children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { style: { color: t.textMuted, fontWeight: 600 }, children: [
+                      m.role === "user" ? "You" : m.kind === "report" ? "Report" : "Assistant",
+                      ":",
+                      " "
+                    ] }),
+                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { whiteSpace: "pre-wrap" }, children: m.content })
+                  ] }, i))
+                }
+              )
+            ]
+          },
+          chat.id
+        );
+      })
+    ] });
+  }
   function renderKnownIssue({ title, footer }) {
     if (!duplicate) return null;
     return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
@@ -2367,8 +3019,8 @@ function AssistSheet({
     );
   }
   const initials2 = (reporterName != null ? reporterName : "").split(/\s+/).filter(Boolean).slice(0, 2).map((w) => {
-    var _a, _b;
-    return (_b = (_a = w[0]) == null ? void 0 : _a.toUpperCase()) != null ? _b : "";
+    var _a2, _b;
+    return (_b = (_a2 = w[0]) == null ? void 0 : _a2.toUpperCase()) != null ? _b : "";
   }).join("");
   const panelStyle = narrow ? {
     width: "100%",
@@ -2459,7 +3111,9 @@ function AssistSheet({
                               alignItems: "center",
                               gap: "7px",
                               fontSize: "14px",
-                              fontWeight: 600
+                              fontWeight: 600,
+                              // One line even with the Chats pill beside it (#567).
+                              whiteSpace: "nowrap"
                             },
                             children: [
                               /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Sparkle, { color: t.accent }),
@@ -2489,801 +3143,914 @@ function AssistSheet({
                           projectSlot ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { marginLeft: "6px" }, children: projectSlot }) : null
                         ] })
                       ] }),
-                      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                        "button",
-                        {
-                          type: "button",
-                          "data-gg-write-myself": "",
-                          onClick: () => leave("write_myself", `header, ${phase}`),
-                          "aria-label": "Write it myself instead",
-                          style: {
-                            flexShrink: 0,
-                            border: `1px solid ${t.inputBorder}`,
-                            borderRadius: "999px",
-                            background: "transparent",
-                            color: t.textMuted,
-                            cursor: "pointer",
-                            fontSize: "11.5px",
-                            lineHeight: 1,
-                            fontFamily: "inherit",
-                            whiteSpace: "nowrap",
-                            // ~32px tall either way — this is the escape hatch, not a hint.
-                            padding: "9px 11px"
-                          },
-                          children: "Write it myself"
-                        }
-                      )
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                  "div",
-                  {
-                    ref: scrollRef,
-                    style: {
-                      flex: 1,
-                      minHeight: narrow ? "180px" : 0,
-                      overflowY: "auto",
-                      padding: "16px",
+                      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "6px", flexShrink: 0 }, children: [
+                        historyKey && (showChats || otherChats.length > 0) && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                          "button",
+                          {
+                            type: "button",
+                            "data-gg-chats-toggle": "",
+                            disabled: busy,
+                            "aria-pressed": showChats,
+                            onClick: () => {
+                              setShowChats((v) => !v);
+                              setViewingChat(null);
+                            },
+                            style: {
+                              flexShrink: 0,
+                              border: `1px solid ${showChats ? t.accent : t.inputBorder}`,
+                              borderRadius: "999px",
+                              background: "transparent",
+                              color: showChats ? t.accent : t.textMuted,
+                              cursor: busy ? "default" : "pointer",
+                              opacity: busy ? 0.5 : 1,
+                              fontSize: "11.5px",
+                              lineHeight: 1,
+                              fontFamily: "inherit",
+                              whiteSpace: "nowrap",
+                              padding: "9px 11px"
+                            },
+                            children: showChats ? "\u2190 Chat" : `Chats \xB7 ${otherChats.length}`
+                          }
+                        ),
+                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                          "button",
+                          {
+                            type: "button",
+                            "data-gg-write-myself": "",
+                            onClick: () => leave("write_myself", `header, ${phase}`),
+                            "aria-label": "Write it myself instead",
+                            style: {
+                              flexShrink: 0,
+                              border: `1px solid ${t.inputBorder}`,
+                              borderRadius: "999px",
+                              background: "transparent",
+                              color: t.textMuted,
+                              cursor: "pointer",
+                              fontSize: "11.5px",
+                              lineHeight: 1,
+                              fontFamily: "inherit",
+                              whiteSpace: "nowrap",
+                              // ~32px tall either way — this is the escape hatch, not a hint.
+                              padding: "9px 11px"
+                            },
+                            children: "Write it myself"
+                          }
+                        )
+                      ] })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                  "div",
+                  {
+                    ref: scrollRef,
+                    style: {
+                      flex: 1,
+                      minHeight: narrow ? "180px" : 0,
+                      overflowY: "auto",
+                      padding: "16px",
                       display: "flex",
                       flexDirection: "column"
                     },
-                    children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-                      "div",
-                      {
-                        style: {
-                          marginTop: "auto",
-                          display: "flex",
-                          flexDirection: "column",
-                          gap: "12px",
-                          minWidth: 0
-                        },
-                        children: [
-                          phase === "type" && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "12px" }, children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px" }, children: [
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                    children: [
+                      showChats && renderChatList(),
+                      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                        "div",
+                        {
+                          style: {
+                            marginTop: "auto",
+                            display: "flex",
+                            flexDirection: "column",
+                            gap: "12px",
+                            minWidth: 0
+                          },
+                          children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: showChats ? "none" : "contents" }, children: [
+                            phase === "type" && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "12px" }, children: [
+                              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px" }, children: [
+                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
+                                /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                                  "div",
+                                  {
+                                    style: {
+                                      padding: "9px 12px",
+                                      borderRadius: "12px 12px 12px 4px",
+                                      backgroundColor: t.bgSecondary,
+                                      fontSize: "13px",
+                                      lineHeight: 1.55,
+                                      maxWidth: "88%"
+                                    },
+                                    children: [
+                                      reporterName ? `Hi ${reporterName.split(" ")[0]} \u2014 w` : "W",
+                                      "hat do you want to do? Pick one and I'll take it from there."
+                                    ]
+                                  }
+                                )
+                              ] }),
+                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                                 "div",
                                 {
                                   style: {
-                                    padding: "9px 12px",
-                                    borderRadius: "12px 12px 12px 4px",
-                                    backgroundColor: t.bgSecondary,
-                                    fontSize: "13px",
-                                    lineHeight: 1.55,
-                                    maxWidth: "88%"
+                                    display: "flex",
+                                    flexWrap: "wrap",
+                                    gap: "6px",
+                                    paddingLeft: "32px"
                                   },
-                                  children: [
-                                    reporterName ? `Hi ${reporterName.split(" ")[0]} \u2014 w` : "W",
-                                    "hat do you want to do? Pick one and I'll take it from there."
-                                  ]
+                                  children: tiles.map((tile) => {
+                                    const rate = tile === "RATING";
+                                    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                      "button",
+                                      {
+                                        type: "button",
+                                        "data-gg-chip": "",
+                                        "data-gg-tile": tile,
+                                        onClick: () => pickType(tile),
+                                        style: {
+                                          display: "inline-flex",
+                                          alignItems: "center",
+                                          gap: "5px",
+                                          // The rating is the only tile that isn't a report, so
+                                          // it wears the star colour the dialog's hero row uses
+                                          // rather than hiding among the report types.
+                                          border: `1px solid ${rate ? "rgba(245,158,11,0.5)" : t.inputBorder}`,
+                                          background: rate ? "rgba(245,158,11,0.08)" : "transparent",
+                                          color: rate ? "#f59e0b" : t.textMuted,
+                                          borderRadius: "999px",
+                                          // 8px vertical keeps the tap target at ~32px.
+                                          padding: "8px 12px",
+                                          fontSize: "12px",
+                                          fontWeight: rate ? 600 : 400,
+                                          fontFamily: "inherit",
+                                          cursor: "pointer"
+                                        },
+                                        children: rate ? "\u2605 Rate us" : getTypeLabel(tile)
+                                      },
+                                      tile
+                                    );
+                                  })
                                 }
                               )
                             ] }),
-                            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                              "div",
-                              {
-                                style: {
-                                  display: "flex",
-                                  flexWrap: "wrap",
-                                  gap: "6px",
-                                  paddingLeft: "32px"
-                                },
-                                children: tiles.map((tile) => {
-                                  const rate = tile === "RATING";
-                                  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                            phase === "severity" && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "12px" }, children: [
+                              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px" }, children: [
+                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
+                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                  "div",
+                                  {
+                                    style: {
+                                      padding: "9px 12px",
+                                      borderRadius: "12px 12px 12px 4px",
+                                      backgroundColor: t.bgSecondary,
+                                      fontSize: "13px",
+                                      lineHeight: 1.55,
+                                      maxWidth: "88%"
+                                    },
+                                    children: "How bad is it?"
+                                  }
+                                )
+                              ] }),
+                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                "div",
+                                {
+                                  role: "radiogroup",
+                                  "aria-label": "Severity",
+                                  style: {
+                                    display: "flex",
+                                    flexWrap: "wrap",
+                                    gap: "6px",
+                                    paddingLeft: "32px"
+                                  },
+                                  children: SEVERITY_LEVELS.map((s) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                                     "button",
                                     {
                                       type: "button",
+                                      role: "radio",
+                                      "aria-checked": severity === s,
                                       "data-gg-chip": "",
-                                      "data-gg-tile": tile,
-                                      onClick: () => pickType(tile),
+                                      "data-gg-severity": s,
+                                      onClick: () => answerSeverity(s),
                                       style: {
-                                        display: "inline-flex",
-                                        alignItems: "center",
-                                        gap: "5px",
-                                        // The rating is the only tile that isn't a report, so
-                                        // it wears the star colour the dialog's hero row uses
-                                        // rather than hiding among the report types.
-                                        border: `1px solid ${rate ? "rgba(245,158,11,0.5)" : t.inputBorder}`,
-                                        background: rate ? "rgba(245,158,11,0.08)" : "transparent",
-                                        color: rate ? "#f59e0b" : t.textMuted,
+                                        border: `1px solid ${t.inputBorder}`,
+                                        background: "transparent",
+                                        color: t.textMuted,
                                         borderRadius: "999px",
-                                        // 8px vertical keeps the tap target at ~32px.
+                                        // Same as the picker and option chips — one chip size.
                                         padding: "8px 12px",
                                         fontSize: "12px",
-                                        fontWeight: rate ? 600 : 400,
                                         fontFamily: "inherit",
                                         cursor: "pointer"
                                       },
-                                      children: rate ? "\u2605 Rate us" : getTypeLabel(tile)
+                                      children: SEVERITY_LABELS[s]
                                     },
-                                    tile
-                                  );
-                                })
-                              }
-                            )
-                          ] }),
-                          phase === "severity" && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "12px" }, children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px" }, children: [
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                "div",
-                                {
-                                  style: {
-                                    padding: "9px 12px",
-                                    borderRadius: "12px 12px 12px 4px",
-                                    backgroundColor: t.bgSecondary,
-                                    fontSize: "13px",
-                                    lineHeight: 1.55,
-                                    maxWidth: "88%"
-                                  },
-                                  children: "How bad is it?"
+                                    s
+                                  ))
                                 }
                               )
                             ] }),
-                            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                              "div",
-                              {
-                                role: "radiogroup",
-                                "aria-label": "Severity",
-                                style: {
-                                  display: "flex",
-                                  flexWrap: "wrap",
-                                  gap: "6px",
-                                  paddingLeft: "32px"
-                                },
-                                children: SEVERITY_LEVELS.map((s) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                  "button",
+                            phase === "rating" && !submitted && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "12px" }, children: [
+                              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px" }, children: [
+                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
+                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                  "div",
                                   {
-                                    type: "button",
-                                    role: "radio",
-                                    "aria-checked": severity === s,
-                                    "data-gg-chip": "",
-                                    "data-gg-severity": s,
-                                    onClick: () => answerSeverity(s),
                                     style: {
-                                      border: `1px solid ${t.inputBorder}`,
-                                      background: "transparent",
-                                      color: t.textMuted,
-                                      borderRadius: "999px",
-                                      // Same as the picker and option chips — one chip size.
-                                      padding: "8px 12px",
-                                      fontSize: "12px",
-                                      fontFamily: "inherit",
-                                      cursor: "pointer"
+                                      padding: "9px 12px",
+                                      borderRadius: "12px 12px 12px 4px",
+                                      backgroundColor: t.bgSecondary,
+                                      fontSize: "13px",
+                                      lineHeight: 1.55,
+                                      maxWidth: "88%"
                                     },
-                                    children: SEVERITY_LABELS[s]
-                                  },
-                                  s
-                                ))
-                              }
-                            )
-                          ] }),
-                          phase === "rating" && !submitted && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "12px" }, children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px" }, children: [
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                    children: "How are we doing? Tap a star \u2014 the words are optional."
+                                  }
+                                )
+                              ] }),
+                              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
                                 "div",
                                 {
                                   style: {
-                                    padding: "9px 12px",
-                                    borderRadius: "12px 12px 12px 4px",
-                                    backgroundColor: t.bgSecondary,
-                                    fontSize: "13px",
-                                    lineHeight: 1.55,
-                                    maxWidth: "88%"
+                                    display: "flex",
+                                    flexDirection: "column",
+                                    gap: "10px",
+                                    marginLeft: "32px",
+                                    padding: "12px",
+                                    borderRadius: "12px",
+                                    border: "1px solid rgba(245,158,11,0.4)",
+                                    backgroundColor: "rgba(245,158,11,0.06)"
                                   },
-                                  children: "How are we doing? Tap a star \u2014 the words are optional."
-                                }
-                              )
-                            ] }),
-                            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-                              "div",
-                              {
-                                style: {
-                                  display: "flex",
-                                  flexDirection: "column",
-                                  gap: "10px",
-                                  marginLeft: "32px",
-                                  padding: "12px",
-                                  borderRadius: "12px",
-                                  border: "1px solid rgba(245,158,11,0.4)",
-                                  backgroundColor: "rgba(245,158,11,0.06)"
-                                },
-                                children: [
-                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { display: "flex", gap: "4px" }, role: "group", "aria-label": "Rating", children: [1, 2, 3, 4, 5].map((star) => {
-                                    const filled = star <= (hoveredStar || rating);
-                                    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                  children: [
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { display: "flex", gap: "4px" }, role: "group", "aria-label": "Rating", children: [1, 2, 3, 4, 5].map((star) => {
+                                      const filled = star <= (hoveredStar || rating);
+                                      return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                        "button",
+                                        {
+                                          type: "button",
+                                          "aria-label": `${star} star${star > 1 ? "s" : ""}`,
+                                          "aria-pressed": star <= rating,
+                                          onClick: () => onRatingChange(star),
+                                          onMouseEnter: () => setHoveredStar(star),
+                                          onMouseLeave: () => setHoveredStar(0),
+                                          style: {
+                                            border: "none",
+                                            background: "transparent",
+                                            padding: 0,
+                                            cursor: "pointer",
+                                            lineHeight: 0
+                                          },
+                                          children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("svg", { width: "30", height: "30", viewBox: "0 0 24 24", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                            "path",
+                                            {
+                                              d: "M12 3l2.6 5.3 5.9.9-4.3 4.1 1 5.8L12 16.4 6.8 19.1l1-5.8L3.5 9.2l5.9-.9L12 3z",
+                                              fill: filled ? "#f59e0b" : "transparent",
+                                              stroke: filled ? "#f59e0b" : t.inputBorder,
+                                              strokeWidth: "1.5",
+                                              strokeLinejoin: "round"
+                                            }
+                                          ) })
+                                        },
+                                        star
+                                      );
+                                    }) }),
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                      "textarea",
+                                      {
+                                        value: description,
+                                        onChange: (e) => onDescriptionChange(e.target.value),
+                                        rows: 3,
+                                        placeholder: "What made it good \u2014 or what let you down? (optional)",
+                                        style: {
+                                          width: "100%",
+                                          padding: "10px",
+                                          borderRadius: "8px",
+                                          border: `1px solid ${t.inputBorder}`,
+                                          backgroundColor: t.inputBg,
+                                          color: t.text,
+                                          fontSize: "13px",
+                                          lineHeight: 1.5,
+                                          fontFamily: "inherit",
+                                          resize: "vertical",
+                                          outline: "none",
+                                          boxSizing: "border-box"
+                                        }
+                                      }
+                                    ),
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                                       "button",
                                       {
                                         type: "button",
-                                        "aria-label": `${star} star${star > 1 ? "s" : ""}`,
-                                        "aria-pressed": star <= rating,
-                                        onClick: () => onRatingChange(star),
-                                        onMouseEnter: () => setHoveredStar(star),
-                                        onMouseLeave: () => setHoveredStar(0),
+                                        onClick: () => setPhase("type"),
                                         style: {
+                                          alignSelf: "flex-start",
                                           border: "none",
                                           background: "transparent",
-                                          padding: 0,
+                                          color: t.textMuted,
+                                          fontSize: "12px",
+                                          fontFamily: "inherit",
+                                          // A bare text link is ~14px tall — half a thumb.
+                                          padding: "9px 0",
                                           cursor: "pointer",
-                                          lineHeight: 0
+                                          textDecoration: "underline"
                                         },
-                                        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("svg", { width: "30", height: "30", viewBox: "0 0 24 24", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                          "path",
-                                          {
-                                            d: "M12 3l2.6 5.3 5.9.9-4.3 4.1 1 5.8L12 16.4 6.8 19.1l1-5.8L3.5 9.2l5.9-.9L12 3z",
-                                            fill: filled ? "#f59e0b" : "transparent",
-                                            stroke: filled ? "#f59e0b" : t.inputBorder,
-                                            strokeWidth: "1.5",
-                                            strokeLinejoin: "round"
-                                          }
-                                        ) })
-                                      },
-                                      star
-                                    );
-                                  }) }),
-                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                    "textarea",
-                                    {
-                                      value: description,
-                                      onChange: (e) => onDescriptionChange(e.target.value),
-                                      rows: 3,
-                                      placeholder: "What made it good \u2014 or what let you down? (optional)",
-                                      style: {
-                                        width: "100%",
-                                        padding: "10px",
-                                        borderRadius: "8px",
-                                        border: `1px solid ${t.inputBorder}`,
-                                        backgroundColor: t.inputBg,
-                                        color: t.text,
-                                        fontSize: "13px",
-                                        lineHeight: 1.5,
-                                        fontFamily: "inherit",
-                                        resize: "vertical",
-                                        outline: "none",
-                                        boxSizing: "border-box"
+                                        children: "Report something instead"
                                       }
-                                    }
-                                  ),
-                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                    "button",
-                                    {
-                                      type: "button",
-                                      onClick: () => setPhase("type"),
-                                      style: {
-                                        alignSelf: "flex-start",
-                                        border: "none",
-                                        background: "transparent",
-                                        color: t.textMuted,
-                                        fontSize: "12px",
-                                        fontFamily: "inherit",
-                                        // A bare text link is ~14px tall — half a thumb.
-                                        padding: "9px 0",
-                                        cursor: "pointer",
-                                        textDecoration: "underline"
-                                      },
-                                      children: "Report something instead"
-                                    }
-                                  )
-                                ]
-                              }
-                            )
-                          ] }),
-                          empty && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "12px" }, children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px" }, children: [
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                                    )
+                                  ]
+                                }
+                              )
+                            ] }),
+                            empty && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "12px" }, children: [
+                              resumable && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
                                 "div",
                                 {
+                                  "data-gg-resume-chat": "",
                                   style: {
-                                    padding: "9px 12px",
-                                    borderRadius: "12px 12px 12px 4px",
+                                    display: "flex",
+                                    flexDirection: "column",
+                                    gap: "8px",
+                                    padding: "10px 12px",
+                                    borderRadius: "10px",
+                                    border: `1px solid ${t.accent}55`,
                                     backgroundColor: t.bgSecondary,
-                                    fontSize: "13px",
-                                    lineHeight: 1.55,
-                                    maxWidth: "88%"
+                                    minWidth: 0
                                   },
                                   children: [
-                                    reporterName ? `Hi ${reporterName.split(" ")[0]} \u2014 t` : "T",
-                                    "ell me what went wrong in your own words. I can already see your screenshot and what you clicked, so skip the boring parts."
-                                  ]
-                                }
-                              )
-                            ] }),
-                            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                              "div",
-                              {
-                                style: {
-                                  display: "flex",
-                                  flexWrap: "wrap",
-                                  gap: "6px",
-                                  paddingLeft: "32px"
-                                },
-                                children: STARTERS.map((s) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                  "button",
-                                  {
-                                    type: "button",
-                                    "data-gg-chip": "",
-                                    onClick: () => {
-                                      logEvent("starter_tap", s);
-                                      send(s);
-                                    },
-                                    style: {
-                                      border: `1px solid ${t.inputBorder}`,
-                                      background: "transparent",
-                                      color: t.textMuted,
-                                      borderRadius: "999px",
-                                      padding: "6px 11px",
-                                      fontSize: "12px",
-                                      fontFamily: "inherit",
-                                      cursor: "pointer"
-                                    },
-                                    children: s
-                                  },
-                                  s
-                                ))
-                              }
-                            )
-                          ] }),
-                          messages.map((m, i) => {
-                            const mine = m.role === "user";
-                            if (m.kind === "report") {
-                              const live = phase === "draft" && i === messages.length - 1;
-                              return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px", minWidth: 0 }, children: [
-                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
-                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                  "div",
-                                  {
-                                    "data-gg-draft-bubble": "",
-                                    style: {
-                                      maxWidth: "82%",
-                                      minWidth: 0,
-                                      padding: "9px 12px",
-                                      borderRadius: "12px 12px 12px 4px",
-                                      fontSize: "13px",
-                                      lineHeight: 1.55,
-                                      backgroundColor: t.bgSecondary,
-                                      color: t.text,
-                                      border: live ? "none" : `1px solid ${t.accent}66`
-                                    },
-                                    children: live ? (
-                                      // #402: "have a read" beside a countdown reads as a
-                                      // contradiction. Say what is about to happen instead.
-                                      autoFileLeft !== null ? "Here's your report \u2014 I'll file it unless you want to change something." : "Here's your report \u2014 have a read."
-                                    ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { style: { fontSize: "11.5px", color: t.textMuted }, children: [
+                                      "Pick up where you left off \xB7 ",
+                                      chatAge(resumable.updatedAt)
+                                    ] }),
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                      "span",
+                                      {
+                                        style: {
+                                          fontSize: "13px",
+                                          lineHeight: 1.45,
+                                          overflowWrap: "anywhere"
+                                        },
+                                        children: resumable.title
+                                      }
+                                    ),
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px", flexWrap: "wrap" }, children: [
                                       /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                        "span",
+                                        "button",
                                         {
+                                          type: "button",
+                                          "data-gg-resume-continue": "",
+                                          onClick: () => resumeChat(resumable),
                                           style: {
-                                            display: "block",
-                                            fontSize: "10px",
-                                            fontWeight: 700,
-                                            letterSpacing: ".06em",
-                                            textTransform: "uppercase",
-                                            color: t.accent,
-                                            marginBottom: "4px"
+                                            border: "none",
+                                            borderRadius: "999px",
+                                            backgroundColor: t.accent,
+                                            color: t.accentText,
+                                            padding: "7px 13px",
+                                            fontSize: "12px",
+                                            fontWeight: 600,
+                                            fontFamily: "inherit",
+                                            cursor: "pointer"
                                           },
-                                          children: "Draft so far"
+                                          children: "Continue this chat"
                                         }
                                       ),
                                       /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                        "span",
+                                        "button",
                                         {
+                                          type: "button",
+                                          onClick: () => setShowChats(true),
                                           style: {
-                                            display: "block",
-                                            whiteSpace: "pre-wrap",
-                                            wordBreak: "break-word",
-                                            maxHeight: "160px",
-                                            overflowY: "auto",
-                                            color: t.textMuted
+                                            border: `1px solid ${t.inputBorder}`,
+                                            borderRadius: "999px",
+                                            background: "transparent",
+                                            color: t.textMuted,
+                                            padding: "7px 13px",
+                                            fontSize: "12px",
+                                            fontFamily: "inherit",
+                                            cursor: "pointer"
                                           },
-                                          children: m.content
+                                          children: "All chats"
                                         }
                                       )
                                     ] })
+                                  ]
+                                }
+                              ),
+                              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px" }, children: [
+                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
+                                /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                                  "div",
+                                  {
+                                    style: {
+                                      padding: "9px 12px",
+                                      borderRadius: "12px 12px 12px 4px",
+                                      backgroundColor: t.bgSecondary,
+                                      fontSize: "13px",
+                                      lineHeight: 1.55,
+                                      maxWidth: "88%"
+                                    },
+                                    children: [
+                                      reporterName ? `Hi ${reporterName.split(" ")[0]} \u2014 t` : "T",
+                                      "ell me what went wrong in your own words. I can already see your screenshot and what you clicked, so skip the boring parts."
+                                    ]
                                   }
                                 )
-                              ] }, i);
-                            }
-                            return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-                              "div",
-                              {
-                                style: {
-                                  display: "flex",
-                                  gap: "8px",
-                                  minWidth: 0,
-                                  flexDirection: mine ? "row-reverse" : "row"
-                                },
-                                children: [
-                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: m.role, theme: t, initials: initials2 }),
-                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                    "div",
-                                    {
-                                      style: {
-                                        maxWidth: "82%",
-                                        minWidth: 0,
-                                        padding: "9px 12px",
-                                        borderRadius: mine ? "12px 12px 4px 12px" : "12px 12px 12px 4px",
-                                        fontSize: "13px",
-                                        lineHeight: 1.55,
-                                        // Markdown owns the assistant's line breaks and lists.
-                                        whiteSpace: mine ? "pre-wrap" : "normal",
-                                        wordBreak: "break-word",
-                                        backgroundColor: mine ? t.accent : t.bgSecondary,
-                                        color: mine ? t.accentText : t.text
-                                      },
-                                      children: mine ? m.content : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ChatMarkdown, { text: m.content, theme: t })
-                                    }
-                                  )
-                                ]
-                              },
-                              i
-                            );
-                          }),
-                          duplicate && !busy && phase === "chat" && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { paddingLeft: "32px", minWidth: 0 }, children: renderKnownIssue({ title: false }) }),
-                          glitchgrabOffer && onReportGlitchgrabProblem && !busy && phase === "chat" && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { paddingLeft: "32px", minWidth: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-                            "div",
-                            {
-                              "data-gg-glitchgrab-offer": "",
-                              style: {
-                                display: "flex",
-                                flexDirection: "column",
-                                gap: "8px",
-                                padding: "10px",
-                                borderRadius: "8px",
-                                border: `1px solid ${t.accent}55`,
-                                backgroundColor: `${t.accent}14`,
-                                fontSize: "12px",
-                                lineHeight: 1.5
-                              },
-                              children: [
-                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { color: t.text, fontWeight: 600 }, children: "This is about Glitchgrab, not this app" }),
-                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { color: t.textMuted }, children: "It goes to the team that builds this reporter, with your chat attached." }),
-                                /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", flexWrap: "wrap", gap: "6px" }, children: [
-                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                              ] }),
+                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                "div",
+                                {
+                                  style: {
+                                    display: "flex",
+                                    flexWrap: "wrap",
+                                    gap: "6px",
+                                    paddingLeft: "32px"
+                                  },
+                                  children: STARTERS.map((s) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                                     "button",
                                     {
                                       type: "button",
-                                      "data-gg-glitchgrab-offer-send": "",
+                                      "data-gg-chip": "",
                                       onClick: () => {
-                                        logEvent("glitchgrab_offer_tap");
-                                        setGlitchgrabOffer(false);
-                                        onReportGlitchgrabProblem(
-                                          messages.filter((m) => m.role === "user").map((m) => m.content.trim()).filter(Boolean).join("\n\n")
-                                        );
+                                        logEvent("starter_tap", s);
+                                        send(s);
                                       },
                                       style: {
-                                        padding: "8px 12px",
+                                        border: `1px solid ${t.inputBorder}`,
+                                        background: "transparent",
+                                        color: t.textMuted,
                                         borderRadius: "999px",
-                                        border: "none",
-                                        backgroundColor: t.accent,
-                                        color: t.accentText,
+                                        padding: "6px 11px",
                                         fontSize: "12px",
-                                        fontWeight: 700,
                                         fontFamily: "inherit",
-                                        cursor: "pointer",
-                                        // Both stretch, so on a phone each wrapped line reads as
-                                        // a choice rather than one button left stranded.
-                                        flex: "1 1 auto"
+                                        cursor: "pointer"
                                       },
-                                      children: "Send to the Glitchgrab team"
-                                    }
-                                  ),
+                                      children: s
+                                    },
+                                    s
+                                  ))
+                                }
+                              )
+                            ] }),
+                            messages.map((m, i) => {
+                              const mine = m.role === "user";
+                              if (m.kind === "report") {
+                                const live = phase === "draft" && i === messages.length - 1;
+                                return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px", minWidth: 0 }, children: [
+                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
                                   /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                    "button",
+                                    "div",
                                     {
-                                      type: "button",
-                                      "data-gg-glitchgrab-offer-no": "",
-                                      onClick: () => {
-                                        logEvent("glitchgrab_offer_declined");
-                                        send("No \u2014 it's about this app, not the reporting tool");
-                                      },
+                                      "data-gg-draft-bubble": "",
                                       style: {
-                                        padding: "8px 12px",
-                                        borderRadius: "999px",
-                                        border: `1px solid ${t.inputBorder}`,
-                                        background: "transparent",
-                                        color: t.textMuted,
-                                        fontSize: "12px",
-                                        fontFamily: "inherit",
-                                        cursor: "pointer",
-                                        flex: "1 1 auto"
+                                        maxWidth: "82%",
+                                        minWidth: 0,
+                                        padding: "9px 12px",
+                                        borderRadius: "12px 12px 12px 4px",
+                                        fontSize: "13px",
+                                        lineHeight: 1.55,
+                                        backgroundColor: t.bgSecondary,
+                                        color: t.text,
+                                        border: live ? "none" : `1px solid ${t.accent}66`
                                       },
-                                      children: "No, it's about this app"
+                                      children: live ? (
+                                        // #402: "have a read" beside a countdown reads as a
+                                        // contradiction. Say what is about to happen instead.
+                                        autoFileLeft !== null ? "Here's your report \u2014 I'll file it unless you want to change something." : "Here's your report \u2014 have a read."
+                                      ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+                                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                          "span",
+                                          {
+                                            style: {
+                                              display: "block",
+                                              fontSize: "10px",
+                                              fontWeight: 700,
+                                              letterSpacing: ".06em",
+                                              textTransform: "uppercase",
+                                              color: t.accent,
+                                              marginBottom: "4px"
+                                            },
+                                            children: "Draft so far"
+                                          }
+                                        ),
+                                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                          "span",
+                                          {
+                                            style: {
+                                              display: "block",
+                                              whiteSpace: "pre-wrap",
+                                              wordBreak: "break-word",
+                                              maxHeight: "160px",
+                                              overflowY: "auto",
+                                              color: t.textMuted
+                                            },
+                                            children: m.content
+                                          }
+                                        )
+                                      ] })
                                     }
                                   )
-                                ] })
-                              ]
-                            }
-                          ) }),
-                          options.length > 0 && !busy && phase === "chat" && !glitchgrabOffer && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                            "div",
-                            {
-                              style: {
-                                display: "flex",
-                                // Long labels wrapped into a ragged row that always stranded
-                                // the last chip on a line of its own. Past ~24 characters
-                                // these stop being chips and become a choice list, so they
-                                // stack full width and read like one.
-                                flexDirection: options.some((o) => o.length > 24) ? "column" : "row",
-                                alignItems: options.some((o) => o.length > 24) ? "stretch" : "flex-start",
-                                flexWrap: "wrap",
-                                gap: "6px",
-                                paddingLeft: "32px"
-                              },
-                              children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                "button",
+                                ] }, i);
+                              }
+                              return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                                "div",
                                 {
-                                  type: "button",
-                                  "data-gg-chip": "",
-                                  "data-gg-option": "",
-                                  onClick: () => {
-                                    logEvent("option_tap", option);
-                                    send(option, option === CONFIRM_OPTION);
-                                  },
                                   style: {
-                                    border: `1px solid ${t.inputBorder}`,
-                                    background: "transparent",
-                                    color: t.textMuted,
-                                    borderRadius: "999px",
-                                    // Same 8px as the picker chips — one tap target size in
-                                    // this sheet, not two.
-                                    padding: "8px 12px",
-                                    fontSize: "12px",
-                                    fontFamily: "inherit",
-                                    cursor: "pointer",
-                                    textAlign: "left"
+                                    display: "flex",
+                                    gap: "8px",
+                                    minWidth: 0,
+                                    flexDirection: mine ? "row-reverse" : "row"
                                   },
-                                  children: option
+                                  children: [
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: m.role, theme: t, initials: initials2 }),
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                      "div",
+                                      {
+                                        style: {
+                                          maxWidth: "82%",
+                                          minWidth: 0,
+                                          padding: "9px 12px",
+                                          borderRadius: mine ? "12px 12px 4px 12px" : "12px 12px 12px 4px",
+                                          fontSize: "13px",
+                                          lineHeight: 1.55,
+                                          // Markdown owns the assistant's line breaks and lists.
+                                          whiteSpace: mine ? "pre-wrap" : "normal",
+                                          wordBreak: "break-word",
+                                          backgroundColor: mine ? t.accent : t.bgSecondary,
+                                          color: mine ? t.accentText : t.text
+                                        },
+                                        children: mine ? m.content : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ChatMarkdown, { text: m.content, theme: t })
+                                      }
+                                    )
+                                  ]
                                 },
-                                option
-                              ))
-                            }
-                          ),
-                          busy && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px" }, role: "status", "aria-label": "Thinking", children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
-                            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                              "span",
+                                i
+                              );
+                            }),
+                            duplicate && !busy && phase === "chat" && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { paddingLeft: "32px", minWidth: 0 }, children: renderKnownIssue({ title: false }) }),
+                            glitchgrabOffer && onReportGlitchgrabProblem && !busy && phase === "chat" && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { paddingLeft: "32px", minWidth: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                              "div",
                               {
+                                "data-gg-glitchgrab-offer": "",
                                 style: {
-                                  display: "inline-flex",
-                                  alignItems: "center",
-                                  gap: "4px",
-                                  padding: "12px",
-                                  borderRadius: "12px 12px 12px 4px",
-                                  backgroundColor: t.bgSecondary
+                                  display: "flex",
+                                  flexDirection: "column",
+                                  gap: "8px",
+                                  padding: "10px",
+                                  borderRadius: "8px",
+                                  border: `1px solid ${t.accent}55`,
+                                  backgroundColor: `${t.accent}14`,
+                                  fontSize: "12px",
+                                  lineHeight: 1.5
                                 },
-                                children: [0, 1, 2].map((i) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                  "span",
-                                  {
-                                    style: {
-                                      width: "5px",
-                                      height: "5px",
-                                      borderRadius: "50%",
-                                      backgroundColor: t.textMuted,
-                                      animation: `gg-dot 1.1s ease-in-out ${i * 0.15}s infinite`
-                                    }
-                                  },
-                                  i
-                                ))
+                                children: [
+                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { color: t.text, fontWeight: 600 }, children: "This is about Glitchgrab, not this app" }),
+                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { color: t.textMuted }, children: "It goes to the team that builds this reporter, with your chat attached." }),
+                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", flexWrap: "wrap", gap: "6px" }, children: [
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                      "button",
+                                      {
+                                        type: "button",
+                                        "data-gg-glitchgrab-offer-send": "",
+                                        onClick: () => {
+                                          logEvent("glitchgrab_offer_tap");
+                                          setGlitchgrabOffer(false);
+                                          onReportGlitchgrabProblem(
+                                            messages.filter((m) => m.role === "user").map((m) => m.content.trim()).filter(Boolean).join("\n\n")
+                                          );
+                                        },
+                                        style: {
+                                          padding: "8px 12px",
+                                          borderRadius: "999px",
+                                          border: "none",
+                                          backgroundColor: t.accent,
+                                          color: t.accentText,
+                                          fontSize: "12px",
+                                          fontWeight: 700,
+                                          fontFamily: "inherit",
+                                          cursor: "pointer",
+                                          // Both stretch, so on a phone each wrapped line reads as
+                                          // a choice rather than one button left stranded.
+                                          flex: "1 1 auto"
+                                        },
+                                        children: "Send to the Glitchgrab team"
+                                      }
+                                    ),
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                      "button",
+                                      {
+                                        type: "button",
+                                        "data-gg-glitchgrab-offer-no": "",
+                                        onClick: () => {
+                                          logEvent("glitchgrab_offer_declined");
+                                          send("No \u2014 it's about this app, not the reporting tool");
+                                        },
+                                        style: {
+                                          padding: "8px 12px",
+                                          borderRadius: "999px",
+                                          border: `1px solid ${t.inputBorder}`,
+                                          background: "transparent",
+                                          color: t.textMuted,
+                                          fontSize: "12px",
+                                          fontFamily: "inherit",
+                                          cursor: "pointer",
+                                          flex: "1 1 auto"
+                                        },
+                                        children: "No, it's about this app"
+                                      }
+                                    )
+                                  ] })
+                                ]
                               }
-                            )
-                          ] }),
-                          phase === "draft" && !submitted && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-                            "div",
-                            {
-                              style: {
-                                border: `1px solid ${t.accent}`,
-                                borderRadius: "12px",
-                                backgroundColor: t.bgSecondary,
-                                padding: "12px",
-                                display: "flex",
-                                flexDirection: "column",
-                                gap: "10px",
-                                minWidth: 0,
-                                boxSizing: "border-box"
-                              },
-                              children: [
-                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                  "span",
-                                  {
-                                    style: {
-                                      fontSize: "10px",
-                                      fontWeight: 700,
-                                      letterSpacing: ".06em",
-                                      textTransform: "uppercase",
-                                      color: t.accent
-                                    },
-                                    children: duplicate ? `What we'll add to #${duplicate.number}${duplicate.kind === "related" ? " as a related request" : ""} \xB7 edit anything` : "Your report \xB7 edit anything"
-                                  }
-                                ),
-                                renderKnownIssue({
-                                  title: true,
-                                  footer: "Your details will be added to it instead of opening a new issue."
-                                }),
-                                !duplicate && issueTitle && // Wraps rather than scrolls sideways: a title cut off at the
-                                // box edge is the very thing #543 is about. One line of text,
-                                // so Enter is swallowed.
-                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                  "textarea",
-                                  {
-                                    "aria-label": "Title",
-                                    value: issueTitle,
-                                    maxLength: 120,
-                                    rows: 2,
-                                    onKeyDown: (e) => {
-                                      if (e.key === "Enter") e.preventDefault();
-                                    },
-                                    onChange: (e) => {
-                                      stopAutoFile("edited the title");
-                                      onIssueTitleChange(e.target.value.replace(/[\r\n]+/g, " "));
-                                    },
-                                    style: {
-                                      width: "100%",
-                                      padding: "8px 10px",
-                                      lineHeight: 1.45,
-                                      resize: "none",
-                                      borderRadius: "8px",
-                                      border: `1px solid ${t.inputBorder}`,
-                                      backgroundColor: t.inputBg,
-                                      color: t.text,
-                                      fontSize: "13px",
-                                      fontWeight: 600,
-                                      fontFamily: "inherit",
-                                      outline: "none",
-                                      boxSizing: "border-box"
-                                    }
-                                  }
-                                ),
-                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                  "textarea",
+                            ) }),
+                            options.length > 0 && !busy && phase === "chat" && !glitchgrabOffer && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                              "div",
+                              {
+                                style: {
+                                  display: "flex",
+                                  // Long labels wrapped into a ragged row that always stranded
+                                  // the last chip on a line of its own. Past ~24 characters
+                                  // these stop being chips and become a choice list, so they
+                                  // stack full width and read like one.
+                                  flexDirection: options.some((o) => o.length > 24) ? "column" : "row",
+                                  alignItems: options.some((o) => o.length > 24) ? "stretch" : "flex-start",
+                                  flexWrap: "wrap",
+                                  gap: "6px",
+                                  paddingLeft: "32px"
+                                },
+                                children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                  "button",
                                   {
-                                    ref: draftRef,
-                                    value: description,
-                                    onChange: (e) => {
-                                      stopAutoFile("edited the draft");
-                                      onDescriptionChange(e.target.value);
+                                    type: "button",
+                                    "data-gg-chip": "",
+                                    "data-gg-option": "",
+                                    onClick: () => {
+                                      logEvent("option_tap", option);
+                                      send(option, option === CONFIRM_OPTION);
                                     },
-                                    rows: 6,
                                     style: {
-                                      width: "100%",
-                                      minHeight: "120px",
-                                      padding: "10px",
-                                      borderRadius: "8px",
                                       border: `1px solid ${t.inputBorder}`,
-                                      backgroundColor: t.inputBg,
-                                      color: t.text,
-                                      fontSize: "13px",
-                                      lineHeight: 1.55,
+                                      background: "transparent",
+                                      color: t.textMuted,
+                                      borderRadius: "999px",
+                                      // Same 8px as the picker chips — one tap target size in
+                                      // this sheet, not two.
+                                      padding: "8px 12px",
+                                      fontSize: "12px",
                                       fontFamily: "inherit",
-                                      resize: "vertical",
-                                      outline: "none",
-                                      boxSizing: "border-box"
-                                    }
-                                  }
-                                ),
-                                severityAsked && autoFileLeft === null && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { children: [
-                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                                      cursor: "pointer",
+                                      textAlign: "left"
+                                    },
+                                    children: option
+                                  },
+                                  option
+                                ))
+                              }
+                            ),
+                            busy && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px", minWidth: 0 }, role: "status", "aria-label": "Thinking", children: [
+                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
+                              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                                "span",
+                                {
+                                  style: {
+                                    display: "inline-flex",
+                                    alignItems: "center",
+                                    // The "still working" line must wrap on a phone, not push
+                                    // the bubble past the sheet's edge.
+                                    flexWrap: "wrap",
+                                    minWidth: 0,
+                                    gap: "4px",
+                                    padding: "12px",
+                                    borderRadius: "12px 12px 12px 4px",
+                                    backgroundColor: t.bgSecondary
+                                  },
+                                  children: [
+                                    [0, 1, 2].map((i) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                      "span",
+                                      {
+                                        style: {
+                                          width: "5px",
+                                          height: "5px",
+                                          borderRadius: "50%",
+                                          backgroundColor: t.textMuted,
+                                          animation: `gg-dot 1.1s ease-in-out ${i * 0.15}s infinite`
+                                        }
+                                      },
+                                      i
+                                    )),
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ThinkingClock, { color: t.textMuted })
+                                  ]
+                                }
+                              )
+                            ] }),
+                            phase === "draft" && !submitted && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                              "div",
+                              {
+                                style: {
+                                  border: `1px solid ${t.accent}`,
+                                  borderRadius: "12px",
+                                  backgroundColor: t.bgSecondary,
+                                  padding: "12px",
+                                  display: "flex",
+                                  flexDirection: "column",
+                                  gap: "10px",
+                                  minWidth: 0,
+                                  boxSizing: "border-box"
+                                },
+                                children: [
+                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                                     "span",
                                     {
                                       style: {
-                                        fontSize: "11.5px",
-                                        color: t.textMuted,
-                                        display: "block",
-                                        marginBottom: "6px"
+                                        fontSize: "10px",
+                                        fontWeight: 700,
+                                        letterSpacing: ".06em",
+                                        textTransform: "uppercase",
+                                        color: t.accent
                                       },
-                                      children: [
-                                        "How bad is it?",
-                                        !severity && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                          "span",
-                                          {
-                                            style: {
-                                              marginLeft: "6px",
-                                              fontSize: "11px",
-                                              color: severityRefused ? "#ef4444" : t.textMuted
-                                            },
-                                            children: "\xB7 required"
-                                          }
-                                        )
-                                      ]
+                                      children: duplicate ? `What we'll add to #${duplicate.number}${duplicate.kind === "related" ? " as a related request" : ""} \xB7 edit anything` : "Your report \xB7 edit anything"
                                     }
                                   ),
+                                  renderKnownIssue({
+                                    title: true,
+                                    footer: "Your details will be added to it instead of opening a new issue."
+                                  }),
+                                  !duplicate && issueTitle && // Wraps rather than scrolls sideways: a title cut off at the
+                                  // box edge is the very thing #543 is about. One line of text,
+                                  // so Enter is swallowed.
                                   /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                    "div",
+                                    "textarea",
                                     {
-                                      role: "radiogroup",
-                                      "aria-label": "Severity",
-                                      style: { display: "flex", gap: "6px" },
-                                      children: SEVERITY_LEVELS.map((s) => {
-                                        const on = severity === s;
-                                        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                          "button",
-                                          {
-                                            type: "button",
-                                            onClick: () => onSeverityChange(s),
-                                            role: "radio",
-                                            "aria-checked": on,
-                                            style: {
-                                              flex: 1,
-                                              minWidth: 0,
-                                              padding: "8px 2px",
-                                              borderRadius: "8px",
-                                              border: `1px solid ${on ? t.accent : severityRefused ? "#ef4444" : t.inputBorder}`,
-                                              backgroundColor: on ? t.accent : "transparent",
-                                              color: on ? t.accentText : t.textMuted,
-                                              fontSize: "12px",
-                                              fontWeight: 600,
-                                              fontFamily: "inherit",
-                                              whiteSpace: "nowrap",
-                                              overflow: "hidden",
-                                              textOverflow: "ellipsis",
-                                              cursor: "pointer"
-                                            },
-                                            children: SEVERITY_LABELS[s]
-                                          },
-                                          s
-                                        );
-                                      })
+                                      "aria-label": "Title",
+                                      value: issueTitle,
+                                      maxLength: 120,
+                                      rows: 2,
+                                      onKeyDown: (e) => {
+                                        if (e.key === "Enter") e.preventDefault();
+                                      },
+                                      onChange: (e) => {
+                                        stopAutoFile("edited the title");
+                                        onIssueTitleChange(e.target.value.replace(/[\r\n]+/g, " "));
+                                      },
+                                      style: {
+                                        width: "100%",
+                                        padding: "8px 10px",
+                                        lineHeight: 1.45,
+                                        resize: "none",
+                                        borderRadius: "8px",
+                                        border: `1px solid ${t.inputBorder}`,
+                                        backgroundColor: t.inputBg,
+                                        color: t.text,
+                                        fontSize: "13px",
+                                        fontWeight: 600,
+                                        fontFamily: "inherit",
+                                        outline: "none",
+                                        boxSizing: "border-box"
+                                      }
                                     }
-                                  )
-                                ] }),
-                                attachmentCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { style: { fontSize: "11.5px", color: t.textMuted }, children: [
-                                  attachmentCount,
-                                  " ",
-                                  attachmentCount === 1 ? "attachment" : "attachments",
-                                  " will be sent with this."
-                                ] })
-                              ]
-                            }
-                          ),
-                          phase === "solved" && solved && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "12px" }, children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px" }, children: [
-                              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
+                                  ),
+                                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                    "textarea",
+                                    {
+                                      ref: draftRef,
+                                      value: description,
+                                      onChange: (e) => {
+                                        stopAutoFile("edited the draft");
+                                        onDescriptionChange(e.target.value);
+                                      },
+                                      rows: 6,
+                                      style: {
+                                        width: "100%",
+                                        minHeight: "120px",
+                                        padding: "10px",
+                                        borderRadius: "8px",
+                                        border: `1px solid ${t.inputBorder}`,
+                                        backgroundColor: t.inputBg,
+                                        color: t.text,
+                                        fontSize: "13px",
+                                        lineHeight: 1.55,
+                                        fontFamily: "inherit",
+                                        resize: "vertical",
+                                        outline: "none",
+                                        boxSizing: "border-box"
+                                      }
+                                    }
+                                  ),
+                                  severityAsked && autoFileLeft === null && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { children: [
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                                      "span",
+                                      {
+                                        style: {
+                                          fontSize: "11.5px",
+                                          color: t.textMuted,
+                                          display: "block",
+                                          marginBottom: "6px"
+                                        },
+                                        children: [
+                                          "How bad is it?",
+                                          !severity && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                            "span",
+                                            {
+                                              style: {
+                                                marginLeft: "6px",
+                                                fontSize: "11px",
+                                                color: severityRefused ? "#ef4444" : t.textMuted
+                                              },
+                                              children: "\xB7 required"
+                                            }
+                                          )
+                                        ]
+                                      }
+                                    ),
+                                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                      "div",
+                                      {
+                                        role: "radiogroup",
+                                        "aria-label": "Severity",
+                                        style: { display: "flex", gap: "6px" },
+                                        children: SEVERITY_LEVELS.map((s) => {
+                                          const on = severity === s;
+                                          return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                            "button",
+                                            {
+                                              type: "button",
+                                              onClick: () => onSeverityChange(s),
+                                              role: "radio",
+                                              "aria-checked": on,
+                                              style: {
+                                                flex: 1,
+                                                minWidth: 0,
+                                                padding: "8px 2px",
+                                                borderRadius: "8px",
+                                                border: `1px solid ${on ? t.accent : severityRefused ? "#ef4444" : t.inputBorder}`,
+                                                backgroundColor: on ? t.accent : "transparent",
+                                                color: on ? t.accentText : t.textMuted,
+                                                fontSize: "12px",
+                                                fontWeight: 600,
+                                                fontFamily: "inherit",
+                                                whiteSpace: "nowrap",
+                                                overflow: "hidden",
+                                                textOverflow: "ellipsis",
+                                                cursor: "pointer"
+                                              },
+                                              children: SEVERITY_LABELS[s]
+                                            },
+                                            s
+                                          );
+                                        })
+                                      }
+                                    )
+                                  ] }),
+                                  attachmentCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { style: { fontSize: "11.5px", color: t.textMuted }, children: [
+                                    attachmentCount,
+                                    " ",
+                                    attachmentCount === 1 ? "attachment" : "attachments",
+                                    " will be sent with this."
+                                  ] })
+                                ]
+                              }
+                            ),
+                            phase === "solved" && solved && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "12px" }, children: [
+                              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "flex", gap: "8px" }, children: [
+                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Avatar, { who: "assistant", theme: t }),
+                                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                                  "div",
+                                  {
+                                    style: {
+                                      padding: "9px 12px",
+                                      borderRadius: "12px 12px 12px 4px",
+                                      backgroundColor: t.bgSecondary,
+                                      fontSize: "13px",
+                                      lineHeight: 1.55,
+                                      maxWidth: "88%",
+                                      whiteSpace: "pre-wrap"
+                                    },
+                                    children: solved
+                                  }
+                                )
+                              ] }),
                               /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                                "div",
+                                "span",
                                 {
-                                  style: {
-                                    padding: "9px 12px",
-                                    borderRadius: "12px 12px 12px 4px",
-                                    backgroundColor: t.bgSecondary,
-                                    fontSize: "13px",
-                                    lineHeight: 1.55,
-                                    maxWidth: "88%",
-                                    whiteSpace: "pre-wrap"
-                                  },
-                                  children: solved
+                                  style: { fontSize: "11.5px", color: t.textMuted, paddingLeft: "32px" },
+                                  children: "Nothing was filed \u2014 you are all set."
                                 }
                               )
                             ] }),
-                            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                              "span",
+                            submitted && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+                              "div",
                               {
-                                style: { fontSize: "11.5px", color: t.textMuted, paddingLeft: "32px" },
-                                children: "Nothing was filed \u2014 you are all set."
+                                style: {
+                                  textAlign: "center",
+                                  padding: "24px 0",
+                                  color: t.accent,
+                                  fontSize: "14px",
+                                  fontWeight: 600
+                                },
+                                children: submittedText != null ? submittedText : `${reportTypeLabel} sent. Thank you!`
                               }
                             )
-                          ] }),
-                          submitted && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                            "div",
-                            {
-                              style: {
-                                textAlign: "center",
-                                padding: "24px 0",
-                                color: t.accent,
-                                fontSize: "14px",
-                                fontWeight: 600
-                              },
-                              children: submittedText != null ? submittedText : `${reportTypeLabel} sent. Thank you!`
-                            }
-                          )
-                        ]
-                      }
-                    )
+                          ] })
+                        }
+                      )
+                    ]
                   }
                 ),
-                !submitted && phase !== "type" && phase !== "severity" && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+                !submitted && !showChats && phase !== "type" && phase !== "severity" && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
                   "div",
                   {
                     style: {
@@ -3600,8 +4367,8 @@ function AssistSheet({
                                             accept: canReadPdf ? ASSIST_ATTACHMENT_ACCEPT_WITH_PDF : ASSIST_ATTACHMENT_ACCEPT,
                                             multiple: true,
                                             onChange: (e) => {
-                                              var _a;
-                                              const picked = Array.from((_a = e.target.files) != null ? _a : []);
+                                              var _a2;
+                                              const picked = Array.from((_a2 = e.target.files) != null ? _a2 : []);
                                               if (picked.length) {
                                                 stopAutoFile("changed attachments");
                                                 const images = picked.filter((f) => f.type.startsWith("image/")).length;
@@ -4579,20 +5346,20 @@ function initialsOf(name) {
   }).join("");
 }
 function ReporterChip({
-  reporter,
+  reporter: reporter2,
   t
 }) {
   var _a;
   const [avatarFailed, setAvatarFailed] = (0, import_react.useState)(false);
-  const avatarUrl = (reporter == null ? void 0 : reporter.avatarUrl) || "";
+  const avatarUrl = (reporter2 == null ? void 0 : reporter2.avatarUrl) || "";
   (0, import_react.useEffect)(() => {
     setAvatarFailed(false);
   }, [avatarUrl]);
-  const name = ((_a = reporter == null ? void 0 : reporter.name) == null ? void 0 : _a.trim()) || "";
+  const name = ((_a = reporter2 == null ? void 0 : reporter2.name) == null ? void 0 : _a.trim()) || "";
   const isAnonymous = !name;
   const initials2 = isAnonymous ? "" : initialsOf(name);
   const label = isAnonymous ? "Anonymous" : name;
-  const title = isAnonymous ? "No reporter identity was passed to Glitchgrab \u2014 this report won't be attributed to anyone" : [name, reporter == null ? void 0 : reporter.email, reporter == null ? void 0 : reporter.role].filter(Boolean).join(" \xB7 ");
+  const title = isAnonymous ? "No reporter identity was passed to Glitchgrab \u2014 this report won't be attributed to anyone" : [name, reporter2 == null ? void 0 : reporter2.email, reporter2 == null ? void 0 : reporter2.role].filter(Boolean).join(" \xB7 ");
   const showAvatarImage = !!avatarUrl && !avatarFailed;
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
     "span",
@@ -4656,7 +5423,7 @@ function ReporterChip({
             },
             children: [
               label,
-              (reporter == null ? void 0 : reporter.role) ? ` \xB7 ${reporter.role}` : ""
+              (reporter2 == null ? void 0 : reporter2.role) ? ` \xB7 ${reporter2.role}` : ""
             ]
           }
         )
@@ -4773,11 +5540,12 @@ function ReportDialog({
   types,
   showSeverity = true,
   captureScreenshot = captureDefaultScreenshot,
-  reporter,
+  reporter: reporter2,
   onClose,
   headerSlot,
   reportGlitchgrabProblem,
-  layout = "modal"
+  layout = "modal",
+  chatHistoryKey: chatHistoryKey2 = null
 }) {
   var _a;
   const sheet = layout === "sheet";
@@ -4799,6 +5567,7 @@ function ReportDialog({
   const [aiConversationId, setAiConversationId] = (0, import_react.useState)(null);
   const [issueTitle, setIssueTitle] = (0, import_react.useState)("");
   const [isEnhanced, setIsEnhanced] = (0, import_react.useState)(false);
+  const [enhanceError, setEnhanceError] = (0, import_react.useState)(null);
   const [originalDescription, setOriginalDescription] = (0, import_react.useState)(
     null
   );
@@ -4882,15 +5651,15 @@ function ReportDialog({
       });
     };
     applyInert();
-    const observer = new MutationObserver((mutations) => {
+    const observer2 = new MutationObserver((mutations) => {
       const structural = mutations.some(
         (m) => m.addedNodes.length > 0 || m.removedNodes.length > 0
       );
       if (structural) applyInert();
     });
-    observer.observe(document.body, { childList: true, subtree: true });
+    observer2.observe(document.body, { childList: true, subtree: true });
     return () => {
-      observer.disconnect();
+      observer2.disconnect();
       inerted.forEach((el) => el.removeAttribute("inert"));
     };
   }, [isOpen]);
@@ -5253,6 +6022,7 @@ function ReportDialog({
     setSelfReportFrom(null);
     setVoiceError(null);
     setIsEnhanced(false);
+    setEnhanceError(null);
     setOriginalDescription(null);
     setAssistOpen(false);
     setAssistUsed(false);
@@ -5318,6 +6088,7 @@ function ReportDialog({
               const sep = base.trim() ? " " : "";
               setDescriptionFromVoice(base + sep + text.trim());
               setValidationError(null);
+              setEnhanceError(null);
               setIsEnhanced(false);
               setOriginalDescription(null);
             }
@@ -5542,6 +6313,9 @@ function ReportDialog({
         setAddedAsRelated(!!duplicateOf && result.issueNumber === duplicateOf && attachKind === "related");
         const queued = result.status === "QUEUED" && !!result.message;
         setQueuedMessage(queued ? (_c = result.message) != null ? _c : null : null);
+        if (chatHistoryKey2 && aiConversationId) {
+          markChatFiled(chatHistoryKey2, aiConversationId, `${getTypeLabel(reportType)} sent`);
+        }
         setSubmitted(true);
         setDescription("");
         setScreenshots([]);
@@ -6410,6 +7184,7 @@ function ReportDialog({
                                 notePushToTalkEdit();
                                 setDescription(e.target.value);
                                 if (validationError) setValidationError(null);
+                                if (enhanceError) setEnhanceError(null);
                                 if (isEnhanced) {
                                   setIsEnhanced(false);
                                   setOriginalDescription(null);
@@ -6531,6 +7306,7 @@ function ReportDialog({
                                 var _a2;
                                 if (!description.trim() || isEnhancing) return;
                                 setIsEnhancing(true);
+                                setEnhanceError(null);
                                 try {
                                   const polished = await enhanceText2(
                                     description,
@@ -6543,6 +7319,10 @@ function ReportDialog({
                                     if (validationError)
                                       setValidationError(null);
                                   }
+                                } catch (err) {
+                                  setEnhanceError(
+                                    err instanceof Error && err.message ? err.message : "AI enhance isn't available right now \u2014 send your report as written."
+                                  );
                                 } finally {
                                   setIsEnhancing(false);
                                 }
@@ -6801,6 +7581,20 @@ function ReportDialog({
                             children: voiceError
                           }
                         ),
+                        enhanceError && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+                          "p",
+                          {
+                            role: "alert",
+                            style: {
+                              color: "#ef4444",
+                              fontSize: "11px",
+                              lineHeight: 1.5,
+                              marginTop: "4px",
+                              marginBottom: 0
+                            },
+                            children: enhanceError
+                          }
+                        ),
                         assistNotice && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
                           "p",
                           {
@@ -7361,7 +8155,7 @@ function ReportDialog({
                       gap: "12px"
                     },
                     children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ReporterChip, { reporter, t }),
+                      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ReporterChip, { reporter: reporter2, t }),
                       reportGlitchgrabProblem ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
                         "button",
                         {
@@ -7641,6 +8435,7 @@ function ReportDialog({
           setDuplicateKind(issueNumber && kind === "related" ? "related" : "duplicate");
         },
         onConversationChange: setAiConversationId,
+        historyKey: chatHistoryKey2,
         onFinish: handleClose,
         rating,
         onRatingChange: (value) => {
@@ -7648,7 +8443,7 @@ function ReportDialog({
           if (validationError) setValidationError(null);
         },
         projectSlot: headerSlot,
-        reporterName: (_a = reporter == null ? void 0 : reporter.name) != null ? _a : null,
+        reporterName: (_a = reporter2 == null ? void 0 : reporter2.name) != null ? _a : null,
         description,
         onDescriptionChange: (value) => {
           setDescription(value);
@@ -9235,6 +10030,9 @@ function GlitchgrabProviderInner({
     onError,
     onReportSent
   });
+  if (process.env.NODE_ENV !== "development") {
+    installHydrationCapture(reportHydrationError);
+  }
   (0, import_react6.useEffect)(() => {
     if (enableBreadcrumbs) {
       initBreadcrumbs(maxBreadcrumbs2, { responseBodyOrigins: responseBodyOrigins2 });
@@ -9290,7 +10088,7 @@ function GlitchgrabProviderInner({
         return matchesIgnorePatterns(message, ignoreErrors);
       };
       const handleError = (event) => {
-        var _a, _b, _c, _d, _e, _f, _g;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _i;
         try {
           const isOpaqueCrossOrigin = event.message === "Script error." || event.message === "Script error" || !event.error && !event.filename;
           if (isOpaqueCrossOrigin) {
@@ -9305,6 +10103,7 @@ function GlitchgrabProviderInner({
           if (event.filename && EXTENSION_ORIGIN_RE.test(event.filename) || ((_a = event.error) == null ? void 0 : _a.stack) && EXTENSION_ORIGIN_RE.test(event.error.stack)) {
             return;
           }
+          if (isHandledHydrationError(event.error)) return;
           incrementErrorCount();
           const context = captureContext(visitedPagesRef.current);
           const sig = computeSignature({
@@ -9330,6 +10129,9 @@ function GlitchgrabProviderInner({
               filename: (_e = event.filename) != null ? _e : "",
               lineno: String((_f = event.lineno) != null ? _f : ""),
               colno: String((_g = event.colno) != null ? _g : ""),
+              // The root patch could not attach (React internals moved, or a
+              // root it does not know): still label it and send the DOM context.
+              ...isHydrationError((_h = event.error) != null ? _h : event.message) ? hydrationMetadata((_i = event.error) != null ? _i : event.message) : {},
               ...(session == null ? void 0 : session.userId) ? { sessionUserId: session.userId } : {},
               ...(session == null ? void 0 : session.name) ? { sessionUserName: String(session.name) } : {},
               ...(session == null ? void 0 : session.email) ? { sessionUserEmail: String(session.email) } : {},
@@ -9546,21 +10348,27 @@ function GlitchgrabProviderInner({
     () => ({ userId: signedUserId != null ? signedUserId : null, signature }),
     [signedUserId, signature]
   );
+  const enhanceForDialog = (0, import_react6.useCallback)(
+    async (text, screenshot) => {
+      const ctx = captureContext(visitedPagesRef.current);
+      const context = {
+        url: ctx.url,
+        visitedPages: ctx.visitedPages.slice(-5),
+        breadcrumbs: ctx.breadcrumbs.slice(-10).map((b) => ({ type: b.type, message: b.message }))
+      };
+      return await enhanceTextOrThrow(text, token, baseUrl, screenshot, context, identity);
+    },
+    [token, baseUrl, identity]
+  );
   const enhance = (0, import_react6.useCallback)(
     async (text, screenshot) => {
       try {
-        const ctx = captureContext(visitedPagesRef.current);
-        const context = {
-          url: ctx.url,
-          visitedPages: ctx.visitedPages.slice(-5),
-          breadcrumbs: ctx.breadcrumbs.slice(-10).map((b) => ({ type: b.type, message: b.message }))
-        };
-        return await enhanceText(text, token, baseUrl, screenshot, context, identity);
+        return await enhanceForDialog(text, screenshot);
       } catch (e) {
         return text;
       }
     },
-    [token, baseUrl, identity]
+    [enhanceForDialog]
   );
   const assist = (0, import_react6.useCallback)(
     async (params) => {
@@ -9671,7 +10479,7 @@ function GlitchgrabProviderInner({
     } catch (e) {
     }
   }, [openReportDialog]);
-  const reporter = (0, import_react6.useMemo)(() => {
+  const reporter2 = (0, import_react6.useMemo)(() => {
     var _a;
     if (!session) return null;
     const avatar = (_a = session.avatarUrl) != null ? _a : session.image;
@@ -9734,7 +10542,7 @@ function GlitchgrabProviderInner({
           {
             report,
             sendFeedback: feedback,
-            enhanceText: aiAssist && !aiBlockedUnsigned ? enhance : void 0,
+            enhanceText: aiAssist && !aiBlockedUnsigned ? enhanceForDialog : void 0,
             assist: aiAssist && !aiBlockedUnsigned ? assist : void 0,
             findSimilarIssues: aiAssist && !aiBlockedUnsigned ? findSimilar : void 0,
             readFile: aiAssist && !aiBlockedUnsigned ? readFile : void 0,
@@ -9742,7 +10550,8 @@ function GlitchgrabProviderInner({
             transcribeAudio: aiBlockedUnsigned ? void 0 : transcribe,
             types,
             showSeverity,
-            reporter,
+            reporter: reporter2,
+            chatHistoryKey: chatHistoryKey("sdk", token, session == null ? void 0 : session.userId),
             headerSlot: projectName ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { fontSize: 11, color: "#9aa0a6" }, children: [
               "Reporting to ",
               /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("strong", { style: { color: "#e5e5e5" }, children: projectName })
@@ -10078,6 +10887,87 @@ function useGlitchgrabActions({
     error
   };
 }
+async function fetchGlitchgrabReportThread({
+  token,
+  reportId
+}) {
+  var _a, _b, _c;
+  const res = await fetch(`${BASE_URL}/api/v1/sdk/reports/${encodeURIComponent(reportId)}`, {
+    headers: { Authorization: `Bearer ${token}` }
+  });
+  const data = await res.json().catch(() => ({}));
+  if (!res.ok || !data.success) throw new Error((_a = data.error) != null ? _a : "Failed to fetch report");
+  return { ...data.data, comments: (_c = (_b = data.data) == null ? void 0 : _b.comments) != null ? _c : [] };
+}
+async function postGlitchgrabReportComment({
+  token,
+  reportId,
+  message,
+  reporterName,
+  reporterEmail
+}) {
+  var _a;
+  const res = await fetch(`${BASE_URL}/api/v1/sdk/reports/${encodeURIComponent(reportId)}/comments`, {
+    method: "POST",
+    headers: { Authorization: `Bearer ${token}`, "Content-Type": "application/json" },
+    body: JSON.stringify({ message, reporterName, reporterEmail })
+  });
+  const data = await res.json().catch(() => ({}));
+  if (!res.ok || !data.success) throw new Error((_a = data.error) != null ? _a : "Failed to post comment");
+  return data.data;
+}
+function useGlitchgrabReportThread({
+  token,
+  reportId,
+  reporterName,
+  reporterEmail
+}) {
+  var _a;
+  const [report, setReport] = (0, import_react8.useState)(null);
+  const [isLoading, setIsLoading] = (0, import_react8.useState)(!!reportId);
+  const [isFetching, setIsFetching] = (0, import_react8.useState)(false);
+  const [isPosting, setIsPosting] = (0, import_react8.useState)(false);
+  const [error, setError] = (0, import_react8.useState)(null);
+  const refetch = (0, import_react8.useCallback)(async () => {
+    if (!token || !reportId) {
+      setReport(null);
+      setIsLoading(false);
+      return;
+    }
+    setIsFetching(true);
+    setError(null);
+    try {
+      setReport(await fetchGlitchgrabReportThread({ token, reportId }));
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Network error");
+    } finally {
+      setIsLoading(false);
+      setIsFetching(false);
+    }
+  }, [token, reportId]);
+  (0, import_react8.useEffect)(() => {
+    refetch();
+  }, [refetch]);
+  const addComment = (0, import_react8.useCallback)(
+    async (message) => {
+      if (!token || !reportId || !message.trim()) return false;
+      setIsPosting(true);
+      setError(null);
+      try {
+        await postGlitchgrabReportComment({ token, reportId, message: message.trim(), reporterName, reporterEmail });
+        await refetch();
+        return true;
+      } catch (e) {
+        setError(e instanceof Error ? e.message : "Failed to post comment");
+        return false;
+      } finally {
+        setIsPosting(false);
+      }
+    },
+    [token, reportId, reporterName, reporterEmail, refetch]
+  );
+  return { report, comments: (_a = report == null ? void 0 : report.comments) != null ? _a : [], isLoading, isFetching, isPosting, error, refetch, addComment };
+}
 
 // src/use-feedback.ts
 var import_react9 = require("react");
@@ -10159,12 +11049,14 @@ function useGlitchgrabFeedback(query) {
   computeSignature,
   enhanceText,
   fetchGlitchgrabFeedback,
+  fetchGlitchgrabReportThread,
   fetchGlitchgrabReports,
   getAppContext,
   getBreadcrumbs,
   getShortcutLabel,
   initBreadcrumbs,
   matchesShortcut,
+  postGlitchgrabReportComment,
   sanitizeUrl,
   sendFeedback,
   sendLead,
@@ -10175,6 +11067,7 @@ function useGlitchgrabFeedback(query) {
   useGlitchgrab,
   useGlitchgrabActions,
   useGlitchgrabFeedback,
+  useGlitchgrabReportThread,
   useGlitchgrabReports
 });
 //# sourceMappingURL=index.js.map