glitchgrab 1.43.0 → 1.44.0

package/dist/index.mjs

@@ -634,7 +634,11 @@ async function sendFeedback(payload, baseUrl) {
     return null;
   }
 }
-async function enhanceText(text, token, baseUrl, screenshot, context) {
+function signedFields(identity) {
+  if (!(identity == null ? void 0 : identity.signature) || !identity.userId) return {};
+  return { userId: identity.userId, signature: identity.signature };
+}
+async function enhanceText(text, token, baseUrl, screenshot, context, identity) {
   var _a;
   try {
     const trimmed = text.trim();
@@ -649,7 +653,8 @@ async function enhanceText(text, token, baseUrl, screenshot, context) {
       body: JSON.stringify({
         text: trimmed,
         ...screenshot ? { screenshot } : {},
-        ...context ? { context } : {}
+        ...context ? { context } : {},
+        ...signedFields(identity)
       })
     });
     if (!response.ok) return text;
@@ -662,6 +667,26 @@ async function enhanceText(text, token, baseUrl, screenshot, context) {
     return text;
   }
 }
+async function findSimilarIssues(description, token, baseUrl, identity) {
+  var _a;
+  try {
+    const url = `${baseUrl != null ? baseUrl : DEFAULT_BASE_URL}/api/v1/reports/similar`;
+    const response = await fetch(url, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        Authorization: `Bearer ${token}`
+      },
+      body: JSON.stringify({ text: description, ...signedFields(identity) })
+    });
+    const envelope = await response.json().catch(() => null);
+    if (!response.ok || !(envelope == null ? void 0 : envelope.success)) return null;
+    if (!((_a = envelope.data) == null ? void 0 : _a.enabled)) return [];
+    return Array.isArray(envelope.data.matches) ? envelope.data.matches : [];
+  } catch (e) {
+    return null;
+  }
+}
 async function assistTurn(params, token, baseUrl) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
   const offline = {
@@ -703,13 +728,18 @@ async function assistTurn(params, token, baseUrl) {
     return offline;
   }
 }
-async function transcribeAudio(blob, token, baseUrl) {
+async function transcribeAudio(blob, token, baseUrl, identity) {
   var _a;
   try {
     if (blob.size === 0) return "";
     const url = `${baseUrl != null ? baseUrl : DEFAULT_BASE_URL}/api/v1/sdk/stt`;
     const form = new FormData();
     form.append("file", blob, "audio.webm");
+    const signed = signedFields(identity);
+    if (signed.userId && signed.signature) {
+      form.append("userId", signed.userId);
+      form.append("signature", signed.signature);
+    }
     const response = await fetch(url, {
       method: "POST",
       headers: { Authorization: `Bearer ${token}` },
@@ -1614,7 +1644,7 @@ function AssistSheet({
           minWidth: 0
         },
         children: [
-          /* @__PURE__ */ jsx2("span", { style: { color: "#f59e0b", fontWeight: 600 }, children: title ? "Our team is already on this" : `Our team is already on #${duplicate.number}` }),
+          /* @__PURE__ */ jsx2("span", { style: { color: t2.text, fontWeight: 600 }, children: title ? "Our team is already on this" : `Our team is already on #${duplicate.number}` }),
           title && /* @__PURE__ */ jsxs2("span", { style: { color: t2.textMuted, wordBreak: "break-word" }, children: [
             "#",
             duplicate.number,
@@ -3238,6 +3268,27 @@ function captureDefaultScreenshot(options) {
 }
 var SEVERITY_REQUIRED = "Pick how bad it is before sending.";
 var SHOT_WAIT_MS = 3e3;
+var SIMILAR_WAIT_MS = 2500;
+var MAX_SIMILAR_SHOWN = 3;
+function ButtonSpinner() {
+  return /* @__PURE__ */ jsx4(
+    "span",
+    {
+      "aria-hidden": "true",
+      style: {
+        display: "inline-block",
+        width: "11px",
+        height: "11px",
+        marginRight: "6px",
+        verticalAlign: "-1px",
+        border: "2px solid currentColor",
+        borderRightColor: "transparent",
+        borderRadius: "50%",
+        animation: "gg-spin .7s linear infinite"
+      }
+    }
+  );
+}
 function detectDark() {
   if (typeof window === "undefined") return true;
   try {
@@ -3544,6 +3595,7 @@ function ReportDialog({
   sendFeedback: sendFeedback2,
   enhanceText: enhanceText2,
   assist,
+  findSimilarIssues: findSimilarIssues2,
   assistContext = null,
   transcribeAudio: transcribeAudio2,
   types,
@@ -3563,6 +3615,11 @@ function ReportDialog({
   const [selfReportPrefill, setSelfReportPrefill] = useState4("");
   const [typeChosen, setTypeChosen] = useState4(false);
   const [duplicateIssueNumber, setDuplicateIssueNumber] = useState4(null);
+  const [similarIssues, setSimilarIssues] = useState4(null);
+  const [checkingSimilar, setCheckingSimilar] = useState4(false);
+  const [attachingTo, setAttachingTo] = useState4(null);
+  const [pickedSimilar, setPickedSimilar] = useState4(null);
+  const [addedToIssue, setAddedToIssue] = useState4(null);
   const [aiConversationId, setAiConversationId] = useState4(null);
   const [isEnhanced, setIsEnhanced] = useState4(false);
   const [originalDescription, setOriginalDescription] = useState4(
@@ -3993,6 +4050,10 @@ function ReportDialog({
     setReportType("BUG");
     setTypeChosen(false);
     setDuplicateIssueNumber(null);
+    setSimilarIssues(null);
+    setPickedSimilar(null);
+    setCheckingSimilar(false);
+    setAttachingTo(null);
     setSeverity(null);
     setValidationError(null);
     setSelfReportFrom(null);
@@ -4180,7 +4241,8 @@ function ReportDialog({
       stopListeningAndTranscribe();
     }
   };
-  const handleSubmit = async () => {
+  const handleSubmit = async (opts) => {
+    var _a2;
     try {
       if (isSubmitting) return;
       if (isRating) {
@@ -4217,6 +4279,22 @@ function ReportDialog({
         setStep(2);
         return;
       }
+      const duplicateOf = (_a2 = opts == null ? void 0 : opts.duplicateOf) != null ? _a2 : duplicateIssueNumber;
+      if (findSimilarIssues2 && !(opts == null ? void 0 : opts.skipSimilar) && !duplicateOf && !aiConversationId) {
+        setIsSubmitting(true);
+        setCheckingSimilar(true);
+        const matches = await Promise.race([
+          findSimilarIssues2(description.trim()).catch(() => null),
+          new Promise((resolve) => setTimeout(() => resolve(null), SIMILAR_WAIT_MS))
+        ]);
+        setCheckingSimilar(false);
+        if (matches && matches.length > 0) {
+          setSimilarIssues(matches.slice(0, MAX_SIMILAR_SHOWN));
+          setPickedSimilar(null);
+          setIsSubmitting(false);
+          return;
+        }
+      }
       setIsSubmitting(true);
       let shots = screenshots;
       const pending = pendingShotRef.current;
@@ -4235,8 +4313,8 @@ function ReportDialog({
       if (showSeverity && reportType === "BUG" && severity) {
         metadata.severity = severity;
       }
-      if (duplicateIssueNumber) {
-        metadata.duplicateIssueNumber = String(duplicateIssueNumber);
+      if (duplicateOf) {
+        metadata.duplicateIssueNumber = String(duplicateOf);
       }
       if (aiConversationId) {
         metadata.aiConversationId = aiConversationId;
@@ -4249,20 +4327,26 @@ function ReportDialog({
         Object.keys(metadata).length > 0 ? metadata : void 0
       );
       if (result) {
+        setAddedToIssue(duplicateOf && result.issueNumber === duplicateOf ? duplicateOf : null);
         setSubmitted(true);
         setDescription("");
         setScreenshots([]);
         setAttachments([]);
         setAiConversationId(null);
         setDuplicateIssueNumber(null);
+        setSimilarIssues(null);
+        setPickedSimilar(null);
         setTimeout(() => {
           setSubmitted(false);
           handleClose();
         }, 2e3);
       }
       setIsSubmitting(false);
+      setAttachingTo(null);
     } catch (e) {
       setIsSubmitting(false);
+      setCheckingSimilar(false);
+      setAttachingTo(null);
     }
   };
   if (!mounted) return null;
@@ -4270,6 +4354,7 @@ function ReportDialog({
     isOpen && createPortal3(
       /* @__PURE__ */ jsx4("style", { children: `
           @keyframes gg-pulse{0%,100%{opacity:1}50%{opacity:0.35}}
+          @keyframes gg-spin{to{transform:rotate(360deg)}}
           @keyframes gg-b1{0%,100%{height:3px}40%{height:13px}}
           @keyframes gg-b2{0%,100%{height:8px}50%{height:3px}}
           @keyframes gg-b3{0%,100%{height:4px}30%{height:14px}70%{height:5px}}
@@ -4554,7 +4639,7 @@ function ReportDialog({
                       flex: "1 1 auto",
                       minHeight: 0
                     },
-                    children: submitted ? /* @__PURE__ */ jsxs4(
+                    children: submitted ? /* @__PURE__ */ jsx4(
                       "div",
                       {
                         style: {
@@ -4564,10 +4649,7 @@ function ReportDialog({
                           fontSize: "14px",
                           fontWeight: 500
                         },
-                        children: [
-                          getTypeLabel(reportType),
-                          " sent. Thank you!"
-                        ]
+                        children: 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,
@@ -5792,11 +5874,194 @@ function ReportDialog({
                             children: validationError
                           }
                         ),
-                        /* @__PURE__ */ jsx4(
+                        similarIssues ? (
+                          // Same visual language as the assistant's "Our team is
+                          // already on this" card, so both routes to a duplicate
+                          // read as one feature.
+                          /* @__PURE__ */ jsxs4(
+                            "div",
+                            {
+                              "data-gg-similar": "",
+                              style: {
+                                marginTop: "12px",
+                                display: "flex",
+                                flexDirection: "column",
+                                gap: "10px",
+                                padding: "12px",
+                                borderRadius: "10px",
+                                border: "1px solid rgba(245,158,11,0.4)",
+                                backgroundColor: "rgba(245,158,11,0.08)"
+                              },
+                              children: [
+                                /* @__PURE__ */ jsxs4("div", { style: { display: "flex", flexDirection: "column", gap: "2px" }, children: [
+                                  /* @__PURE__ */ jsx4("span", { style: { color: t2.text, fontWeight: 600, fontSize: "13px" }, children: "Our team may already have this" }),
+                                  /* @__PURE__ */ jsx4("span", { style: { color: t2.textMuted, fontSize: "12px", lineHeight: 1.5 }, children: similarIssues.length > 1 ? "Pick the one that matches \u2014 your report is added to it, so the team sees everyone hitting it in one place." : "If it's the same problem, pick it \u2014 your report is added to it, so the team sees everyone hitting it in one place." })
+                                ] }),
+                                /* @__PURE__ */ jsx4(
+                                  "div",
+                                  {
+                                    role: "radiogroup",
+                                    "aria-label": "Existing issues",
+                                    style: { display: "flex", flexDirection: "column", gap: "6px" },
+                                    children: similarIssues.map((issue) => {
+                                      const picked = pickedSimilar === issue.number;
+                                      return /* @__PURE__ */ jsxs4(
+                                        "button",
+                                        {
+                                          type: "button",
+                                          role: "radio",
+                                          "aria-checked": picked,
+                                          disabled: isSubmitting,
+                                          onClick: () => setPickedSimilar(issue.number),
+                                          style: {
+                                            display: "flex",
+                                            alignItems: "flex-start",
+                                            gap: "10px",
+                                            width: "100%",
+                                            minHeight: "44px",
+                                            padding: "9px 10px",
+                                            borderRadius: "8px",
+                                            border: `1px solid ${picked ? t2.accent : t2.border}`,
+                                            boxShadow: picked ? `0 0 0 1px ${t2.accent}` : "none",
+                                            backgroundColor: t2.bg,
+                                            color: t2.text,
+                                            textAlign: "left",
+                                            cursor: isSubmitting ? "not-allowed" : "pointer",
+                                            fontFamily: "inherit"
+                                          },
+                                          children: [
+                                            /* @__PURE__ */ jsx4(
+                                              "span",
+                                              {
+                                                "aria-hidden": "true",
+                                                style: {
+                                                  flexShrink: 0,
+                                                  marginTop: "2px",
+                                                  width: "14px",
+                                                  height: "14px",
+                                                  boxSizing: "border-box",
+                                                  borderRadius: "50%",
+                                                  border: `2px solid ${picked ? t2.accent : t2.textMuted}`,
+                                                  backgroundColor: picked ? t2.accent : "transparent",
+                                                  boxShadow: picked ? `inset 0 0 0 2px ${t2.bg}` : "none"
+                                                }
+                                              }
+                                            ),
+                                            /* @__PURE__ */ jsxs4(
+                                              "span",
+                                              {
+                                                style: {
+                                                  display: "flex",
+                                                  flexDirection: "column",
+                                                  gap: "3px",
+                                                  minWidth: 0
+                                                },
+                                                children: [
+                                                  /* @__PURE__ */ jsxs4(
+                                                    "span",
+                                                    {
+                                                      title: issue.title,
+                                                      style: {
+                                                        fontSize: "12.5px",
+                                                        lineHeight: 1.45,
+                                                        wordBreak: "break-word",
+                                                        overflow: "hidden",
+                                                        display: "-webkit-box",
+                                                        WebkitLineClamp: 3,
+                                                        WebkitBoxOrient: "vertical"
+                                                      },
+                                                      children: [
+                                                        /* @__PURE__ */ jsxs4("span", { style: { color: t2.textMuted, fontWeight: 600 }, children: [
+                                                          "#",
+                                                          issue.number
+                                                        ] }),
+                                                        " ",
+                                                        issue.title
+                                                      ]
+                                                    }
+                                                  ),
+                                                  issue.status && /* @__PURE__ */ jsx4("span", { style: { fontSize: "11.5px", color: t2.textMuted }, children: issue.status })
+                                                ]
+                                              }
+                                            )
+                                          ]
+                                        },
+                                        issue.number
+                                      );
+                                    })
+                                  }
+                                ),
+                                /* @__PURE__ */ jsx4(
+                                  "button",
+                                  {
+                                    type: "button",
+                                    disabled: isSubmitting || !pickedSimilar,
+                                    onClick: () => {
+                                      if (!pickedSimilar) return;
+                                      setAttachingTo(pickedSimilar);
+                                      setDuplicateIssueNumber(pickedSimilar);
+                                      void handleSubmit({ duplicateOf: pickedSimilar });
+                                    },
+                                    style: {
+                                      width: "100%",
+                                      minHeight: "40px",
+                                      padding: "10px",
+                                      borderRadius: "8px",
+                                      border: "none",
+                                      backgroundColor: isSubmitting || !pickedSimilar ? t2.bgSecondary : t2.accent,
+                                      color: isSubmitting || !pickedSimilar ? t2.textMuted : t2.accentText,
+                                      fontSize: "14px",
+                                      fontWeight: 600,
+                                      cursor: isSubmitting || !pickedSimilar ? "not-allowed" : "pointer",
+                                      fontFamily: "inherit"
+                                    },
+                                    children: typeof attachingTo === "number" ? /* @__PURE__ */ jsxs4(Fragment3, { children: [
+                                      /* @__PURE__ */ jsx4(ButtonSpinner, {}),
+                                      "Adding to #",
+                                      attachingTo,
+                                      "\u2026"
+                                    ] }) : pickedSimilar ? `Add to #${pickedSimilar}` : "Pick the matching issue"
+                                  }
+                                ),
+                                /* @__PURE__ */ jsx4(
+                                  "button",
+                                  {
+                                    type: "button",
+                                    disabled: isSubmitting,
+                                    onClick: () => {
+                                      setAttachingTo("new");
+                                      void handleSubmit({ skipSimilar: true });
+                                    },
+                                    style: {
+                                      width: "100%",
+                                      minHeight: "40px",
+                                      marginTop: "-4px",
+                                      padding: "8px",
+                                      borderRadius: "8px",
+                                      border: "none",
+                                      backgroundColor: "transparent",
+                                      color: isSubmitting ? t2.textMuted : t2.text,
+                                      fontSize: "13px",
+                                      fontWeight: 500,
+                                      textDecoration: "underline",
+                                      textUnderlineOffset: "3px",
+                                      cursor: isSubmitting ? "not-allowed" : "pointer",
+                                      fontFamily: "inherit"
+                                    },
+                                    children: attachingTo === "new" ? /* @__PURE__ */ jsxs4(Fragment3, { children: [
+                                      /* @__PURE__ */ jsx4(ButtonSpinner, {}),
+                                      "Sending as new\u2026"
+                                    ] }) : "No, mine is different \u2014 send as new"
+                                  }
+                                )
+                              ]
+                            }
+                          )
+                        ) : /* @__PURE__ */ jsx4(
                           "button",
                           {
                             type: "button",
-                            onClick: handleSubmit,
+                            onClick: () => void handleSubmit(),
                             disabled: submitDisabled,
                             style: {
                               marginTop: "12px",
@@ -5812,7 +6077,10 @@ function ReportDialog({
                               fontFamily: "inherit",
                               transition: "background-color 0.15s ease"
                             },
-                            children: isSubmitting ? shotPending && !isRating ? "Attaching screenshot\u2026" : "Sending..." : isRating ? "Send Rating" : "Send Report"
+                            children: checkingSimilar ? /* @__PURE__ */ jsxs4(Fragment3, { children: [
+                              /* @__PURE__ */ jsx4(ButtonSpinner, {}),
+                              "Checking for existing reports\u2026"
+                            ] }) : isSubmitting ? shotPending && !isRating ? "Attaching screenshot\u2026" : "Sending..." : isRating ? "Send Rating" : "Send Report"
                           }
                         )
                       ] })
@@ -6124,7 +6392,7 @@ function ReportDialog({
         severityRefused: needsSeverity,
         isSubmitting,
         submitted,
-        onSend: () => void handleSubmit(),
+        onSend: () => void handleSubmit({ skipSimilar: true }),
         onReportGlitchgrabProblem: reportGlitchgrabProblem ? (prefill) => {
           setSelfReportPrefill(prefill != null ? prefill : "");
           setSelfReportFrom("assist");
@@ -7149,6 +7417,12 @@ 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(
+    () => ({ userId: signedUserId != null ? signedUserId : null, signature }),
+    [signedUserId, signature]
+  );
   const enhance = useCallback2(
     async (text, screenshot) => {
       try {
@@ -7158,12 +7432,12 @@ function GlitchgrabProviderInner({
           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);
+        return await enhanceText(text, token, baseUrl, screenshot, context, identity);
       } catch (e) {
         return text;
       }
     },
-    [token, baseUrl]
+    [token, baseUrl, identity]
   );
   const assist = useCallback2(
     async (params) => {
@@ -7176,7 +7450,8 @@ function GlitchgrabProviderInner({
           reporter: session ? {
             key: session.userId,
             name: session.name ? String(session.name) : null,
-            email: session.email ? String(session.email) : null
+            email: session.email ? String(session.email) : null,
+            ...signature ? { signature } : {}
           } : void 0,
           context: {
             ...(_a = params.context) != null ? _a : {},
@@ -7191,15 +7466,19 @@ function GlitchgrabProviderInner({
     },
     [token, baseUrl, session]
   );
+  const findSimilar = useCallback2(
+    (description) => findSimilarIssues(description, token, baseUrl, identity),
+    [token, baseUrl, identity]
+  );
   const transcribe = useCallback2(
     async (blob) => {
       try {
-        return await transcribeAudio(blob, token, baseUrl);
+        return await transcribeAudio(blob, token, baseUrl, identity);
       } catch (e) {
         return "";
       }
     },
-    [token, baseUrl]
+    [token, baseUrl, identity]
   );
   const openReportDialog = useCallback2((options) => {
     if (typeof window !== "undefined") {
@@ -7217,6 +7496,8 @@ function GlitchgrabProviderInner({
   const [projectName, setProjectName] = useState6(null);
   const [aiAssist, setAiAssist] = useState6(false);
   const [glitchgrabReport, setGlitchgrabReport] = useState6(false);
+  const [signedUsers, setSignedUsers] = useState6("OFF");
+  const aiBlockedUnsigned = signedUsers === "ENFORCE" && !signature;
   const [bookingOpen, setBookingOpen] = useState6(false);
   const openBookingDialog = useCallback2(() => setBookingOpen(true), []);
   useEffect6(() => {
@@ -7229,12 +7510,25 @@ function GlitchgrabProviderInner({
       setProjectName(json.data.name);
       setAiAssist(json.data.aiAssist === true);
       setGlitchgrabReport(json.data.glitchgrabReport === true);
+      const mode = json.data.signedUsers;
+      setSignedUsers(mode === "WARN" || mode === "ENFORCE" ? mode : "OFF");
     }).catch(() => {
     });
     return () => {
       cancelled = true;
     };
   }, [baseUrl, token]);
+  useEffect6(() => {
+    var _a;
+    try {
+      if (signedUsers === "OFF" || signature || !session) return;
+      if (typeof process === "undefined" || ((_a = process.env) == null ? void 0 : _a.NODE_ENV) !== "development") return;
+      console.warn(
+        signedUsers === "ENFORCE" ? '[glitchgrab] This project enforces signed users and `session.signature` is missing \u2014 AI features are hidden. Sign it on your server with signSession() from "glitchgrab/server".' : '[glitchgrab] This project warns on unsigned users and `session.signature` is missing. Sign it on your server with signSession() from "glitchgrab/server" before the owner switches to Enforce.'
+      );
+    } catch (e) {
+    }
+  }, [signedUsers, signature, session]);
   useEffect6(() => {
     try {
       if (typeof window === "undefined") return;
@@ -7309,10 +7603,11 @@ function GlitchgrabProviderInner({
           {
             report,
             sendFeedback: feedback,
-            enhanceText: enhance,
-            assist: aiAssist ? assist : void 0,
+            enhanceText: aiAssist && !aiBlockedUnsigned ? enhance : void 0,
+            assist: aiAssist && !aiBlockedUnsigned ? assist : void 0,
+            findSimilarIssues: aiAssist && !aiBlockedUnsigned ? findSimilar : void 0,
             reportGlitchgrabProblem: glitchgrabReport ? reportGlitchgrabProblem : void 0,
-            transcribeAudio: transcribe,
+            transcribeAudio: aiBlockedUnsigned ? void 0 : transcribe,
             types,
             showSeverity,
             reporter,