glitchgrab 1.44.0 → 1.46.0

package/dist/index.mjs

@@ -6,8 +6,8 @@ import {
   useContext,
   useRef as useRef5,
   useEffect as useEffect6,
-  useCallback as useCallback2,
-  useMemo as useMemo3,
+  useCallback as useCallback3,
+  useMemo as useMemo4,
   useState as useState6
 } from "react";
 
@@ -711,7 +711,9 @@ async function assistTurn(params, token, baseUrl) {
         conversationId: null,
         question: null,
         report: null,
-        degraded: (_a = envelope == null ? void 0 : envelope.error) != null ? _a : offline.degraded
+        degraded: (_a = envelope == null ? void 0 : envelope.error) != null ? _a : offline.degraded,
+        // An hourly limit, not a cap: the dialog keeps the assistant button.
+        retryable: (envelope == null ? void 0 : envelope.retryable) === true
       };
     }
     return {
@@ -944,15 +946,15 @@ import {
   useState as useState4,
   useRef as useRef4,
   useEffect as useEffect4,
-  useMemo
+  useMemo as useMemo2
 } from "react";
 import { createPortal as createPortal3 } from "react-dom";
 import { useEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useEffect as useEffect2, useRef as useRef2, useState as useState2 } from "react";
+import { useEffect as useEffect2, useMemo, useRef as useRef2, useState as useState2 } from "react";
 import { createPortal } from "react-dom";
 import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-import { useEffect as useEffect3, useRef as useRef3, useState as useState3 } from "react";
+import { useCallback, useEffect as useEffect3, useRef as useRef3, useState as useState3 } from "react";
 import { createPortal as createPortal2 } from "react-dom";
 import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
@@ -1313,6 +1315,59 @@ var SEVERITY_LABELS = {
 };
 var MAX_ASSIST_IMAGES = 3;
 var MAX_ASSIST_IMAGE_CHARS = 35e5;
+var MAX_ASSIST_FILES = 3;
+var MAX_ASSIST_FILE_CHARS = 3e5;
+var MAX_ASSIST_FILE_CHARS_EACH = 2e5;
+var TEXT_ATTACHMENT_EXTENSIONS = [
+  ".html",
+  ".htm",
+  ".txt",
+  ".md",
+  ".json",
+  ".xml",
+  ".log",
+  ".yml",
+  ".yaml",
+  ".csv",
+  ".har",
+  ".js",
+  ".mjs",
+  ".cjs",
+  ".ts",
+  ".tsx",
+  ".jsx",
+  ".css",
+  ".scss",
+  ".py",
+  ".sh"
+];
+var BINARY_ATTACHMENT_EXTENSIONS = [".pdf", ".doc", ".docx", ".xls", ".xlsx", ".zip"];
+var ATTACHMENT_ACCEPT = [
+  "image/*",
+  ...TEXT_ATTACHMENT_EXTENSIONS,
+  ...BINARY_ATTACHMENT_EXTENSIONS
+].join(",");
+var ASSIST_ATTACHMENT_ACCEPT = ["image/*", ...TEXT_ATTACHMENT_EXTENSIONS].join(",");
+function isAssistReadableFile(name) {
+  const lower = name.toLowerCase();
+  return TEXT_ATTACHMENT_EXTENSIONS.some((ext) => lower.endsWith(ext));
+}
+function decodeTextDataUrl(dataUrl) {
+  try {
+    if (!dataUrl.startsWith("data:")) return null;
+    const comma = dataUrl.indexOf(",");
+    if (comma < 0) return null;
+    const meta = dataUrl.slice(5, comma);
+    const payload = dataUrl.slice(comma + 1);
+    if (!meta.endsWith(";base64")) return decodeURIComponent(payload);
+    const binary = atob(payload);
+    const bytes = new Uint8Array(binary.length);
+    for (let i = 0; i < binary.length; i++) bytes[i] = binary.charCodeAt(i);
+    return new TextDecoder("utf-8").decode(bytes);
+  } catch (e) {
+    return null;
+  }
+}
 function getTypeLabel(type) {
   switch (type) {
     case "RATING":
@@ -1344,6 +1399,22 @@ function pickAssistImages(all) {
   }
   return picked;
 }
+var NO_FILES = [];
+function pickAssistFiles(files) {
+  const picked = [];
+  let total = 0;
+  for (let i = files.length - 1; i >= 0 && picked.length < MAX_ASSIST_FILES; i--) {
+    const attached = files[i];
+    if (!isAssistReadableFile(attached.name)) continue;
+    const text = decodeTextDataUrl(attached.dataUrl);
+    if (!text || !text.trim()) continue;
+    const content = text.slice(0, MAX_ASSIST_FILE_CHARS_EACH);
+    if (total + content.length > MAX_ASSIST_FILE_CHARS) continue;
+    picked.unshift({ index: i, file: { name: attached.name, content } });
+    total += content.length;
+  }
+  return picked;
+}
 var STARTERS = [
   "Something on this page is broken",
   "It did the wrong thing",
@@ -1420,7 +1491,9 @@ function AssistSheet({
   theme: t2,
   screenshots,
   pageShot = null,
-  onAddImages,
+  onAddFiles,
+  files = NO_FILES,
+  onRemoveFile,
   onRemoveImage,
   attachmentCount,
   context,
@@ -1491,6 +1564,8 @@ function AssistSheet({
     }
   }
   const readShots = new Set(pickAssistImages(screenshots));
+  const sentFiles = useMemo(() => pickAssistFiles(files), [files]);
+  const readFiles = new Set(sentFiles.map((f) => f.index));
   function leave(type, detail) {
     logEvent(type, detail);
     flushEvents();
@@ -1504,10 +1579,10 @@ function AssistSheet({
     var _a;
     if (phase === "draft") (_a = draftRef.current) == null ? void 0 : _a.focus();
   }, [phase]);
-  function degradeKeepingEvents(events, message) {
+  function degradeKeepingEvents(events, message, retryable) {
     if (events) eventsRef.current = [...events, ...eventsRef.current];
     flushEvents();
-    onDegrade(message);
+    onDegrade(message, retryable);
   }
   async function runTurn(history2) {
     var _a, _b, _c, _d;
@@ -1525,6 +1600,9 @@ function AssistSheet({
         ),
         conversationId,
         screenshots: sent,
+        // Only when there is something: an older server then sees the body
+        // it always did.
+        ...sentFiles.length > 0 ? { files: sentFiles.map((f) => f.file) } : {},
         context: {
           ...context != null ? context : {},
           imageSources: sent.map((shot) => pageShot && shot === pageShot ? "page" : "attached"),
@@ -1544,7 +1622,7 @@ function AssistSheet({
       setBusy(false);
     }
     if (result.degraded) {
-      degradeKeepingEvents(events, result.degraded);
+      degradeKeepingEvents(events, result.degraded, result.retryable === true);
       return;
     }
     if (result.conversationId) {
@@ -1727,6 +1805,7 @@ function AssistSheet({
                 /* @__PURE__ */ jsxs2(
                   "div",
                   {
+                    "data-gg-sheet-header": "",
                     style: {
                       flexShrink: 0,
                       padding: "14px 16px",
@@ -1738,7 +1817,7 @@ function AssistSheet({
                       minWidth: 0
                     },
                     children: [
-                      /* @__PURE__ */ jsxs2("div", { style: { minWidth: 0, overflow: "hidden" }, children: [
+                      /* @__PURE__ */ jsxs2("div", { style: { minWidth: 0 }, children: [
                         /* @__PURE__ */ jsxs2(
                           "div",
                           {
@@ -2532,7 +2611,7 @@ function AssistSheet({
                         // instead of remounting, and a draft is something you can
                         // still reply to (#360), not a form that replaced the chat.
                         /* @__PURE__ */ jsxs2(Fragment, { children: [
-                          (screenshots.length > 0 || onAddImages) && /* @__PURE__ */ jsxs2(
+                          (screenshots.length > 0 || files.length > 0 || onAddFiles) && /* @__PURE__ */ jsxs2(
                             "div",
                             {
                               style: {
@@ -2636,11 +2715,118 @@ function AssistSheet({
                                     `${i}-${shot.slice(-16)}`
                                   );
                                 }),
-                                onAddImages && /* @__PURE__ */ jsxs2(
+                                files.map((file, i) => {
+                                  const read = readFiles.has(i);
+                                  const why = read ? "the assistant reads this file" : isAssistReadableFile(file.name) ? "attached, but more than one message can carry, so the assistant is not reading it" : "attached to the report \u2014 the assistant can't read this kind of file";
+                                  return /* @__PURE__ */ jsxs2(
+                                    "div",
+                                    {
+                                      "data-gg-assist-file": "",
+                                      "data-gg-assist-file-read": read ? "" : void 0,
+                                      title: `${file.name} \u2014 ${why}`,
+                                      style: {
+                                        position: "relative",
+                                        height: "40px",
+                                        maxWidth: "170px",
+                                        display: "flex",
+                                        alignItems: "center",
+                                        gap: "6px",
+                                        padding: "0 10px",
+                                        borderRadius: "8px",
+                                        border: `1px solid ${read ? t2.accent : t2.inputBorder}`,
+                                        opacity: read ? 1 : 0.55,
+                                        boxSizing: "border-box",
+                                        flexShrink: 0
+                                      },
+                                      children: [
+                                        /* @__PURE__ */ jsx2("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", style: { flexShrink: 0 }, children: /* @__PURE__ */ jsx2(
+                                          "path",
+                                          {
+                                            d: "M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z M14 2v6h6",
+                                            stroke: t2.textMuted,
+                                            strokeWidth: "1.5",
+                                            strokeLinecap: "round",
+                                            strokeLinejoin: "round"
+                                          }
+                                        ) }),
+                                        /* @__PURE__ */ jsx2(
+                                          "span",
+                                          {
+                                            style: {
+                                              fontSize: "11.5px",
+                                              color: t2.text,
+                                              overflow: "hidden",
+                                              textOverflow: "ellipsis",
+                                              whiteSpace: "nowrap"
+                                            },
+                                            children: file.name
+                                          }
+                                        ),
+                                        onRemoveFile && /* @__PURE__ */ jsx2(
+                                          "button",
+                                          {
+                                            type: "button",
+                                            "data-gg-assist-remove-file": "",
+                                            "aria-label": `Remove file ${file.name}`,
+                                            title: "Remove this file",
+                                            onClick: () => {
+                                              logEvent("file_removed", read ? "read" : "not read");
+                                              onRemoveFile(i);
+                                            },
+                                            style: {
+                                              position: "absolute",
+                                              top: "-13px",
+                                              right: "-13px",
+                                              width: "32px",
+                                              height: "32px",
+                                              border: "none",
+                                              background: "transparent",
+                                              padding: 0,
+                                              cursor: "pointer",
+                                              display: "flex",
+                                              alignItems: "center",
+                                              justifyContent: "center",
+                                              borderRadius: "50%"
+                                            },
+                                            children: /* @__PURE__ */ jsx2(
+                                              "span",
+                                              {
+                                                "aria-hidden": "true",
+                                                style: {
+                                                  width: "20px",
+                                                  height: "20px",
+                                                  boxSizing: "border-box",
+                                                  borderRadius: "50%",
+                                                  border: `2px solid ${t2.bg}`,
+                                                  background: "#ef4444",
+                                                  color: "#fff",
+                                                  display: "flex",
+                                                  alignItems: "center",
+                                                  justifyContent: "center"
+                                                },
+                                                children: /* @__PURE__ */ jsx2("svg", { width: "8", height: "8", viewBox: "0 0 10 10", fill: "none", children: /* @__PURE__ */ jsx2(
+                                                  "path",
+                                                  {
+                                                    d: "M1 1L9 9M9 1L1 9",
+                                                    stroke: "currentColor",
+                                                    strokeWidth: "1.6",
+                                                    strokeLinecap: "round"
+                                                  }
+                                                ) })
+                                              }
+                                            )
+                                          }
+                                        )
+                                      ]
+                                    },
+                                    `file-${i}-${file.name}`
+                                  );
+                                }),
+                                onAddFiles && /* @__PURE__ */ jsxs2(
                                   "label",
                                   {
                                     "data-gg-assist-attach": "",
-                                    title: "Attach an image \u2014 or just paste one",
+                                    title: "Attach an image or a file (html, json, log\u2026) \u2014 or paste one",
                                     style: {
                                       width: "40px",
                                       height: "40px",
@@ -2660,14 +2846,18 @@ function AssistSheet({
                                         "input",
                                         {
                                           type: "file",
-                                          accept: "image/*",
+                                          accept: ASSIST_ATTACHMENT_ACCEPT,
                                           multiple: true,
                                           onChange: (e) => {
                                             var _a;
-                                            const files = Array.from((_a = e.target.files) != null ? _a : []);
-                                            if (files.length) {
-                                              logEvent("image_added", String(files.length));
-                                              onAddImages(files);
+                                            const picked = Array.from((_a = e.target.files) != null ? _a : []);
+                                            if (picked.length) {
+                                              const images = picked.filter((f) => f.type.startsWith("image/")).length;
+                                              if (images) logEvent("image_added", String(images));
+                                              if (picked.length > images) {
+                                                logEvent("file_added", String(picked.length - images));
+                                              }
+                                              onAddFiles(picked);
                                             }
                                             e.target.value = "";
                                           },
@@ -2848,6 +3038,7 @@ function AssistSheet({
 }
 var FONT = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
 var FAILED = "Couldn't send it. Try again in a moment.";
+var MAX_SELF_REPORT_IMAGES = 5;
 function describeSentAlong(hasChat, screenshotCount) {
   const parts = [
     ...hasChat ? ["your AI chat"] : [],
@@ -2871,11 +3062,49 @@ function GlitchgrabProblemPanel({
   const [busy, setBusy] = useState3(false);
   const [sent, setSent] = useState3(false);
   const [error, setError] = useState3(null);
+  const [images, setImages] = useState3(
+    () => screenshots.slice(0, MAX_SELF_REPORT_IMAGES)
+  );
   const inputRef = useRef3(null);
+  const fileRef = useRef3(null);
   useEffect3(() => {
     var _a;
     (_a = inputRef.current) == null ? void 0 : _a.focus();
   }, []);
+  const addImages = useCallback((files) => {
+    const picked = files.filter((file) => file.type.startsWith("image/"));
+    if (!picked.length) return;
+    void Promise.all(picked.map((file) => encodeImageFile(file).catch(() => null))).then(
+      (encoded) => {
+        const added = encoded.filter((url) => !!url);
+        if (added.length) {
+          setImages((prev) => [...prev, ...added].slice(0, MAX_SELF_REPORT_IMAGES));
+        }
+      }
+    );
+  }, []);
+  useEffect3(() => {
+    const onPaste = (e) => {
+      var _a;
+      try {
+        const items = (_a = e.clipboardData) == null ? void 0 : _a.items;
+        if (!items) return;
+        const files = [];
+        for (let i = 0; i < items.length; i++) {
+          if (items[i].kind !== "file") continue;
+          const file = items[i].getAsFile();
+          if (file) files.push(file);
+        }
+        if (!files.length) return;
+        e.preventDefault();
+        e.stopImmediatePropagation();
+        addImages(files);
+      } catch (e2) {
+      }
+    };
+    window.addEventListener("paste", onPaste, true);
+    return () => window.removeEventListener("paste", onPaste, true);
+  }, [addImages]);
   useEffect3(() => {
     const onKey = (e) => {
       if (e.key !== "Escape") return;
@@ -2891,7 +3120,13 @@ function GlitchgrabProblemPanel({
     setBusy(true);
     setError(null);
     try {
-      const result = await send({ description, surface, conversationId, reportType, screenshots });
+      const result = await send({
+        description,
+        surface,
+        conversationId,
+        reportType,
+        screenshots: images
+      });
       if (result == null ? void 0 : result.success) setSent(true);
       else setError((result == null ? void 0 : result.message) || FAILED);
     } catch (e) {
@@ -3044,6 +3279,134 @@ function GlitchgrabProblemPanel({
                   }
                 }
               ),
+              /* @__PURE__ */ jsxs3(
+                "div",
+                {
+                  "data-gg-self-report-images": "",
+                  style: {
+                    display: "flex",
+                    flexWrap: "wrap",
+                    alignItems: "center",
+                    gap: "8px",
+                    marginTop: "10px"
+                  },
+                  children: [
+                    images.map((src, i) => /* @__PURE__ */ jsxs3("div", { style: { position: "relative", width: "48px", height: "48px" }, children: [
+                      /* @__PURE__ */ jsx3(
+                        "img",
+                        {
+                          src,
+                          alt: `Screenshot ${i + 1}`,
+                          style: {
+                            width: "100%",
+                            height: "100%",
+                            objectFit: "cover",
+                            display: "block",
+                            boxSizing: "border-box",
+                            borderRadius: "8px",
+                            border: `1px solid ${t2.inputBorder}`
+                          }
+                        }
+                      ),
+                      /* @__PURE__ */ jsx3(
+                        "button",
+                        {
+                          type: "button",
+                          "data-gg-self-report-remove-image": "",
+                          "aria-label": `Remove screenshot ${i + 1}`,
+                          title: "Don't send this one",
+                          onClick: () => setImages((prev) => prev.filter((_, j) => j !== i)),
+                          style: {
+                            position: "absolute",
+                            top: "-13px",
+                            right: "-13px",
+                            width: "32px",
+                            height: "32px",
+                            border: "none",
+                            background: "transparent",
+                            padding: 0,
+                            cursor: "pointer",
+                            display: "flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            borderRadius: "50%"
+                          },
+                          children: /* @__PURE__ */ jsx3(
+                            "span",
+                            {
+                              "aria-hidden": "true",
+                              style: {
+                                width: "20px",
+                                height: "20px",
+                                boxSizing: "border-box",
+                                borderRadius: "50%",
+                                border: `2px solid ${t2.bg}`,
+                                background: "#ef4444",
+                                color: "#fff",
+                                display: "flex",
+                                alignItems: "center",
+                                justifyContent: "center"
+                              },
+                              children: /* @__PURE__ */ jsx3("svg", { width: "8", height: "8", viewBox: "0 0 10 10", fill: "none", children: /* @__PURE__ */ jsx3(
+                                "path",
+                                {
+                                  d: "M1 1L9 9M9 1L1 9",
+                                  stroke: "currentColor",
+                                  strokeWidth: "1.6",
+                                  strokeLinecap: "round"
+                                }
+                              ) })
+                            }
+                          )
+                        }
+                      )
+                    ] }, i)),
+                    images.length < MAX_SELF_REPORT_IMAGES && /* @__PURE__ */ jsx3(
+                      "button",
+                      {
+                        type: "button",
+                        "data-gg-self-report-attach": "",
+                        "aria-label": "Add screenshot",
+                        title: "Add a screenshot \u2014 or paste one",
+                        onClick: () => {
+                          var _a;
+                          return (_a = fileRef.current) == null ? void 0 : _a.click();
+                        },
+                        style: {
+                          height: "48px",
+                          padding: "0 12px",
+                          boxSizing: "border-box",
+                          borderRadius: "8px",
+                          border: `1px dashed ${t2.inputBorder}`,
+                          background: "transparent",
+                          color: t2.textMuted,
+                          fontSize: "12.5px",
+                          fontWeight: 600,
+                          fontFamily: "inherit",
+                          cursor: "pointer"
+                        },
+                        children: images.length >= 3 ? "+ Add" : "+ Add screenshot"
+                      }
+                    ),
+                    /* @__PURE__ */ jsx3(
+                      "input",
+                      {
+                        ref: fileRef,
+                        type: "file",
+                        accept: "image/*",
+                        multiple: true,
+                        "data-gg-self-report-file": "",
+                        onChange: (e) => {
+                          var _a;
+                          addImages(Array.from((_a = e.target.files) != null ? _a : []));
+                          e.target.value = "";
+                        },
+                        style: { display: "none" }
+                      }
+                    )
+                  ]
+                }
+              ),
               /* @__PURE__ */ jsxs3(
                 "p",
                 {
@@ -3052,7 +3415,7 @@ function GlitchgrabProblemPanel({
                   children: [
                     "Also sent, so we can see what happened:",
                     " ",
-                    describeSentAlong(conversationId !== null, screenshots.length),
+                    describeSentAlong(conversationId !== null, images.length),
                     "."
                   ]
                 }
@@ -3093,38 +3456,6 @@ function isMac() {
 function getShortcutLabel() {
   return isMac() ? GLITCHGRAB_SHORTCUT_MAC : GLITCHGRAB_SHORTCUT;
 }
-var ATTACHMENT_ACCEPT = [
-  "image/*",
-  // text — inlined into the issue body
-  ".html",
-  ".htm",
-  ".txt",
-  ".md",
-  ".json",
-  ".xml",
-  ".log",
-  ".yml",
-  ".yaml",
-  ".csv",
-  ".har",
-  ".js",
-  ".mjs",
-  ".cjs",
-  ".ts",
-  ".tsx",
-  ".jsx",
-  ".css",
-  ".scss",
-  ".py",
-  ".sh",
-  // binary documents
-  ".pdf",
-  ".doc",
-  ".docx",
-  ".xls",
-  ".xlsx",
-  ".zip"
-].join(",");
 var MAX_SCALE = 2;
 var FRAME_TIMEOUT_MS = 3e3;
 var GRAB_TIMEOUT_MS = FRAME_TIMEOUT_MS + 2e3;
@@ -3637,6 +3968,7 @@ function ReportDialog({
   const [description, setDescription] = useState4("");
   const [isSubmitting, setIsSubmitting] = useState4(false);
   const [submitted, setSubmitted] = useState4(false);
+  const [queuedMessage, setQueuedMessage] = useState4(null);
   const [screenshots, setScreenshots] = useState4([]);
   const [pageShot, setPageShot] = useState4(null);
   const [shotPending, setShotPending] = useState4(false);
@@ -3770,7 +4102,7 @@ function ReportDialog({
     const next = current === -1 ? 0 : Math.min(Math.max(current + delta, 0), tiles.length - 1);
     (_c = tiles[next]) == null ? void 0 : _c.focus();
   };
-  const isDark = useMemo(() => isOpen ? detectDark() : true, [isOpen]);
+  const isDark = useMemo2(() => isOpen ? detectDark() : true, [isOpen]);
   const t2 = getTheme(isDark);
   const layerTheme = {
     bg: t2.bg,
@@ -4242,7 +4574,7 @@ function ReportDialog({
     }
   };
   const handleSubmit = async (opts) => {
-    var _a2;
+    var _a2, _b;
     try {
       if (isSubmitting) return;
       if (isRating) {
@@ -4328,6 +4660,8 @@ function ReportDialog({
       );
       if (result) {
         setAddedToIssue(duplicateOf && result.issueNumber === duplicateOf ? duplicateOf : null);
+        const queued = result.status === "QUEUED" && !!result.message;
+        setQueuedMessage(queued ? (_b = result.message) != null ? _b : null : null);
         setSubmitted(true);
         setDescription("");
         setScreenshots([]);
@@ -4338,8 +4672,9 @@ function ReportDialog({
         setPickedSimilar(null);
         setTimeout(() => {
           setSubmitted(false);
+          setQueuedMessage(null);
           handleClose();
-        }, 2e3);
+        }, queued ? 6e3 : 2e3);
       }
       setIsSubmitting(false);
       setAttachingTo(null);
@@ -4649,7 +4984,18 @@ function ReportDialog({
                           fontSize: "14px",
                           fontWeight: 500
                         },
-                        children: addedToIssue ? `Added to #${addedToIssue}. Thank you!` : `${getTypeLabel(reportType)} sent. Thank you!`
+                        children: queuedMessage ? /* @__PURE__ */ jsx4(
+                          "span",
+                          {
+                            style: {
+                              // amber-500 reads on the dark panel, amber-700 on the light one
+                              color: isDark ? "#f59e0b" : "#b45309",
+                              fontWeight: 400,
+                              lineHeight: 1.5
+                            },
+                            children: queuedMessage
+                          }
+                        ) : addedToIssue ? `Added to #${addedToIssue}. Thank you!` : `${getTypeLabel(reportType)} sent. Thank you!`
                       }
                     ) : /* @__PURE__ */ jsxs4(Fragment3, { children: [
                       step === 1 && headerSlot ? /* @__PURE__ */ jsx4("div", { style: { marginBottom: "14px" }, children: headerSlot }) : null,
@@ -6354,8 +6700,10 @@ function ReportDialog({
         theme: layerTheme,
         screenshots,
         pageShot,
-        onAddImages: addFiles,
+        onAddFiles: addFiles,
         onRemoveImage: (index) => setScreenshots((prev) => prev.filter((_, i) => i !== index)),
+        files: attachments,
+        onRemoveFile: (index) => setAttachments((prev) => prev.filter((_, i) => i !== index)),
         attachmentCount: screenshots.length + attachments.length,
         context: { ...assistContext != null ? assistContext : {}, reportType },
         reportTypeLabel: getTypeLabel(reportType),
@@ -6397,9 +6745,9 @@ function ReportDialog({
           setSelfReportPrefill(prefill != null ? prefill : "");
           setSelfReportFrom("assist");
         } : void 0,
-        onDegrade: (message) => {
+        onDegrade: (message, retryable) => {
           setAssistOpen(false);
-          setAssistUsed(true);
+          if (!retryable) setAssistUsed(true);
           setAssistNotice(message);
         },
         onClose: () => {
@@ -6545,7 +6893,7 @@ function getTypeIcon(type, color, size = 24) {
 }
 
 // src/booking-dialog.tsx
-import { useCallback, useEffect as useEffect5, useMemo as useMemo2, useState as useState5 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect5, useMemo as useMemo3, useState as useState5 } from "react";
 import { Fragment as Fragment4, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 var t = {
   bg: "#141414",
@@ -6600,11 +6948,11 @@ function BookingDialog({
   const [meetUrl, setMeetUrl] = useState5(null);
   const [busy, setBusy] = useState5(false);
   const [error, setError] = useState5(null);
-  const headers = useMemo2(
+  const headers = useMemo3(
     () => ({ Authorization: `Bearer ${token}`, "Content-Type": "application/json" }),
     [token]
   );
-  const loadSlots = useCallback(async () => {
+  const loadSlots = useCallback2(async () => {
     var _a2, _b, _c;
     setError(null);
     setSlots(null);
@@ -7111,7 +7459,7 @@ function GlitchgrabProviderInner({
     sessionProp.avatarUrl,
     sessionProp.image
   ].map((v) => v == null ? "" : String(v)).join("\0") : "";
-  const session = useMemo3(() => sessionProp, [sessionKey]);
+  const session = useMemo4(() => sessionProp, [sessionKey]);
   setRelease(release2);
   if (appContext2) setContexts(appContext2);
   registerCaptureConfig({
@@ -7292,7 +7640,7 @@ function GlitchgrabProviderInner({
     } catch (e) {
     }
   }, [token, baseUrl, onError, onReportSent, session, ignoreErrors]);
-  const report = useCallback2(
+  const report = useCallback3(
     async (type, description, metadata) => {
       var _a;
       try {
@@ -7326,11 +7674,11 @@ function GlitchgrabProviderInner({
     },
     [token, baseUrl, onReportSent, session]
   );
-  const reportBug = useCallback2(
+  const reportBug = useCallback3(
     (description, metadata) => report("BUG", description, metadata),
     [report]
   );
-  const reportGlitchgrabProblem = useCallback2(
+  const reportGlitchgrabProblem = useCallback3(
     async (params) => {
       var _a, _b;
       try {
@@ -7364,7 +7712,7 @@ function GlitchgrabProviderInner({
     },
     [token, baseUrl, session]
   );
-  const feedback = useCallback2(
+  const feedback = useCallback3(
     async (rating, message, metadata) => {
       try {
         const context = captureContext(visitedPagesRef.current);
@@ -7392,26 +7740,26 @@ function GlitchgrabProviderInner({
     },
     [token, baseUrl, session]
   );
-  const openFeedbackDialog = useCallback2(() => {
+  const openFeedbackDialog = useCallback3(() => {
     if (typeof window !== "undefined") {
       window.dispatchEvent(
         new CustomEvent("glitchgrab:open-report", { detail: { type: "RATING" } })
       );
     }
   }, []);
-  const captureError2 = useCallback2(
+  const captureError2 = useCallback3(
     (error, options) => {
       captureError(error, options);
     },
     []
   );
-  const setContext2 = useCallback2((key, value) => {
+  const setContext2 = useCallback3((key, value) => {
     setContext(key, value);
   }, []);
-  const setContexts2 = useCallback2((values) => {
+  const setContexts2 = useCallback3((values) => {
     setContexts(values);
   }, []);
-  const addBreadcrumb2 = useCallback2(
+  const addBreadcrumb2 = useCallback3(
     (message, data) => {
       addBreadcrumb("custom", message, data);
     },
@@ -7419,11 +7767,11 @@ function GlitchgrabProviderInner({
   );
   const signedUserId = session == null ? void 0 : session.userId;
   const signature = typeof (session == null ? void 0 : session.signature) === "string" ? session.signature : null;
-  const identity = useMemo3(
+  const identity = useMemo4(
     () => ({ userId: signedUserId != null ? signedUserId : null, signature }),
     [signedUserId, signature]
   );
-  const enhance = useCallback2(
+  const enhance = useCallback3(
     async (text, screenshot) => {
       try {
         const ctx = captureContext(visitedPagesRef.current);
@@ -7439,7 +7787,7 @@ function GlitchgrabProviderInner({
     },
     [token, baseUrl, identity]
   );
-  const assist = useCallback2(
+  const assist = useCallback3(
     async (params) => {
       var _a;
       const ctx = captureContext(visitedPagesRef.current);
@@ -7466,11 +7814,11 @@ function GlitchgrabProviderInner({
     },
     [token, baseUrl, session]
   );
-  const findSimilar = useCallback2(
+  const findSimilar = useCallback3(
     (description) => findSimilarIssues(description, token, baseUrl, identity),
     [token, baseUrl, identity]
   );
-  const transcribe = useCallback2(
+  const transcribe = useCallback3(
     async (blob) => {
       try {
         return await transcribeAudio(blob, token, baseUrl, identity);
@@ -7480,7 +7828,7 @@ function GlitchgrabProviderInner({
     },
     [token, baseUrl, identity]
   );
-  const openReportDialog = useCallback2((options) => {
+  const openReportDialog = useCallback3((options) => {
     if (typeof window !== "undefined") {
       window.dispatchEvent(new CustomEvent("glitchgrab:open-report", { detail: options }));
     }
@@ -7499,7 +7847,7 @@ function GlitchgrabProviderInner({
   const [signedUsers, setSignedUsers] = useState6("OFF");
   const aiBlockedUnsigned = signedUsers === "ENFORCE" && !signature;
   const [bookingOpen, setBookingOpen] = useState6(false);
-  const openBookingDialog = useCallback2(() => setBookingOpen(true), []);
+  const openBookingDialog = useCallback3(() => setBookingOpen(true), []);
   useEffect6(() => {
     let cancelled = false;
     fetch(`${baseUrl}/api/v1/sdk/project`, {
@@ -7543,7 +7891,7 @@ function GlitchgrabProviderInner({
     } catch (e) {
     }
   }, [openReportDialog]);
-  const reporter = useMemo3(() => {
+  const reporter = useMemo4(() => {
     var _a;
     if (!session) return null;
     const avatar = (_a = session.avatarUrl) != null ? _a : session.image;
@@ -7842,7 +8190,7 @@ function FeedbackButton({
 }
 
 // src/use-reports.ts
-import { useState as useState8, useEffect as useEffect7, useCallback as useCallback3 } from "react";
+import { useState as useState8, useEffect as useEffect7, useCallback as useCallback4 } from "react";
 var BASE_URL = "https://glitchgrab.dev";
 function useGlitchgrabReports({
   token,
@@ -7853,7 +8201,7 @@ function useGlitchgrabReports({
   const [isLoading, setIsLoading] = useState8(true);
   const [isFetching, setIsFetching] = useState8(false);
   const [error, setError] = useState8(null);
-  const fetchReports = useCallback3(async () => {
+  const fetchReports = useCallback4(async () => {
     var _a, _b;
     if (!token || !userId) {
       setIsLoading(false);
@@ -7918,7 +8266,7 @@ function useGlitchgrabActions({
 }) {
   const [isPending, setIsPending] = useState8(false);
   const [error, setError] = useState8(null);
-  const run = useCallback3(
+  const run = useCallback4(
     async (reportId, body) => {
       setIsPending(true);
       setError(null);
@@ -7948,7 +8296,7 @@ function useGlitchgrabActions({
 }
 
 // src/use-feedback.ts
-import { useState as useState9, useEffect as useEffect8, useCallback as useCallback4 } from "react";
+import { useState as useState9, useEffect as useEffect8, useCallback as useCallback5 } from "react";
 var DEFAULT_BASE_URL3 = "https://glitchgrab.dev";
 function buildUrl({
   approvedOnly,
@@ -7978,7 +8326,7 @@ function useGlitchgrabFeedback(query) {
   const [isLoading, setIsLoading] = useState9(true);
   const [isFetching, setIsFetching] = useState9(false);
   const [error, setError] = useState9(null);
-  const load = useCallback4(async () => {
+  const load = useCallback5(async () => {
     if (!token) {
       setIsLoading(false);
       return;