@djangocfg/monitor 2.1.230 → 2.1.232

package/README.md

@@ -76,6 +76,7 @@ const res = await monitoredFetch('/api/orders', { method: 'POST', body: JSON.str
 |--------|------|---------|-------------|
 | `project` | `string` | `''` | Project name sent with every event |
 | `environment` | `string` | `''` | `production` / `staging` / `development` |
+| `buildId` | `string` | `sdk:<version>` | Build identifier (e.g. Next.js `BUILD_ID` or git SHA). Stamped on every event as `build_id`. Auto-filled with SDK version if not set |
 | `baseUrl` | `string` | same origin | Base URL of the django-cfg backend |
 | `flushInterval` | `number` | `5000` | Buffer flush interval (ms) |
 | `maxBufferSize` | `number` | `20` | Max events before immediate flush |
@@ -137,7 +138,21 @@ window.monitor.flush()
 
 // Inspect current state
 window.monitor.status()
-// → logs config, buffer size, session_id
+// → logs sdk version, build_id, config, buffer size, session_id
+```
+
+## Debug Mode
+
+`useDebugMode` hook controls whether the debug panel is unlocked:
+
+- **development** — always `true`, no localStorage needed
+- **production** — `?debug=1` in URL → persists to `localStorage.__debug_mode__`, panel unlocks
+- **production** — `?debug=0` in URL → clears `localStorage.__debug_mode__`, panel locks
+
+```typescript
+import { useDebugMode } from '@djangocfg/monitor/client'
+
+const isDebug = useDebugMode()
 ```
 
 ## Debug Panel Integration

package/dist/client.cjs

@@ -266,6 +266,7 @@ __export(client_exports, {
   EventLevel: () => FrontendEventIngestRequestLevel,
   EventType: () => FrontendEventIngestRequestEventType,
   FrontendMonitor: () => FrontendMonitor,
+  MONITOR_VERSION: () => MONITOR_VERSION,
   MonitorProvider: () => MonitorProvider,
   getSessionId: () => getSessionId,
   initWindowMonitor: () => initWindowMonitor,
@@ -994,43 +995,47 @@ var _APIClient = class _APIClient {
       if (error instanceof APIError) {
         throw error;
       }
-      const isCORSError = error instanceof TypeError && (error.message.toLowerCase().includes("cors") || error.message.toLowerCase().includes("failed to fetch") || error.message.toLowerCase().includes("network request failed"));
+      let possiblyCors = false;
+      if (error instanceof TypeError && typeof window !== "undefined") {
+        try {
+          const isCrossOrigin = (() => {
+            try {
+              return new URL(url).origin !== window.location.origin;
+            } catch {
+              return false;
+            }
+          })();
+          if (isCrossOrigin) {
+            const entries = performance.getEntriesByName(url, "resource");
+            if (entries.length > 0) {
+              const last = entries[entries.length - 1];
+              possiblyCors = "responseStatus" in last && last.responseStatus === 0;
+            }
+          }
+        } catch {
+        }
+      }
       if (this.logger) {
-        if (isCORSError) {
-          this.logger.error(`\u{1F6AB} CORS Error: ${method} ${url}`);
-          this.logger.error(`  \u2192 ${error instanceof Error ? error.message : String(error)}`);
-          this.logger.error(`  \u2192 Configure security_domains parameter on the server`);
-        } else {
-          this.logger.error(`\u26A0\uFE0F  Network Error: ${method} ${url}`);
-          this.logger.error(`  \u2192 ${error instanceof Error ? error.message : String(error)}`);
+        this.logger.error(`\u26A0\uFE0F  Network Error: ${method} ${url}`);
+        this.logger.error(`  \u2192 ${error instanceof Error ? error.message : String(error)}`);
+        if (possiblyCors) {
+          this.logger.error(`  \u2192 Possibly blocked by CORS policy (configure CORS on the server)`);
         }
       }
       if (typeof window !== "undefined") {
         try {
-          if (isCORSError) {
-            window.dispatchEvent(new CustomEvent("cors-error", {
-              detail: {
-                url,
-                method,
-                error: error instanceof Error ? error.message : String(error),
-                timestamp: /* @__PURE__ */ new Date()
-              },
-              bubbles: true,
-              cancelable: false
-            }));
-          } else {
-            window.dispatchEvent(new CustomEvent("network-error", {
-              detail: {
-                url,
-                method,
-                error: error instanceof Error ? error.message : String(error),
-                timestamp: /* @__PURE__ */ new Date()
-              },
-              bubbles: true,
-              cancelable: false
-            }));
-          }
-        } catch (eventError) {
+          window.dispatchEvent(new CustomEvent("network-error", {
+            detail: {
+              url,
+              method,
+              error: error instanceof Error ? error.message : String(error),
+              possibly_cors: possiblyCors,
+              timestamp: /* @__PURE__ */ new Date()
+            },
+            bubbles: true,
+            cancelable: false
+          }));
+        } catch {
         }
       }
       const networkError = error instanceof Error ? new NetworkError(error.message, url, error) : new NetworkError("Unknown error", url);
@@ -1356,6 +1361,11 @@ async function sendBatch(batch, useBeacon = false) {
 }
 __name(sendBatch, "sendBatch");
 
+// src/client/utils/env.ts
+var isDevelopment = true;
+var isProduction = false;
+var MONITOR_VERSION = "2.1.232";
+
 // src/client/store/index.ts
 var CIRCUIT_BREAKER_THRESHOLD = 3;
 var CIRCUIT_BREAKER_COOLDOWN_MS = 6e4;
@@ -1369,6 +1379,7 @@ var monitorStore = (0, import_vanilla.createStore)((set, get) => ({
     const { config, buffer } = get();
     const maxSize = config.maxBufferSize ?? 20;
     const sanitized = {
+      build_id: event.build_id ?? config.buildId ?? `sdk:${MONITOR_VERSION}`,
       ...event,
       // Enforce field size limits before buffering (last-resort backstop)
       message: event.message && event.message.length > 4997 ? event.message.slice(0, 4997) + "..." : event.message,
@@ -1730,6 +1741,8 @@ function initWindowMonitor() {
     status() {
       const state = monitorStore.getState();
       console.group("[monitor] status");
+      console.log("sdk version:", MONITOR_VERSION);
+      console.log("build_id:", state.config.buildId ?? `sdk:${MONITOR_VERSION}`);
       console.log("config:", state.config);
       console.log("buffer size:", state.buffer.length);
       console.log("initialized:", state.initialized);
@@ -1754,12 +1767,6 @@ __name(MonitorProvider, "MonitorProvider");
 
 // src/client/hooks/useDebugMode.ts
 var import_react2 = require("react");
-
-// src/client/utils/env.ts
-var isDevelopment = true;
-var isProduction = false;
-
-// src/client/hooks/useDebugMode.ts
 var LS_KEY = "__debug_mode__";
 function readFromStorage() {
   try {
@@ -1776,16 +1783,27 @@ function persistToStorage() {
   }
 }
 __name(persistToStorage, "persistToStorage");
+function clearFromStorage() {
+  try {
+    localStorage.removeItem(LS_KEY);
+  } catch {
+  }
+}
+__name(clearFromStorage, "clearFromStorage");
 function consumeDebugParam() {
-  if (typeof window === "undefined") return false;
+  if (typeof window === "undefined") return null;
   const params = new URLSearchParams(window.location.search);
   const value = params.get("debug");
-  if (!value) return false;
-  persistToStorage();
+  if (value === null) return null;
+  if (value === "1") {
+    persistToStorage();
+  } else {
+    clearFromStorage();
+  }
   params.delete("debug");
   const newUrl = `${window.location.pathname}${params.toString() ? `?${params.toString()}` : ""}${window.location.hash}`;
   window.history.replaceState(null, "", newUrl);
-  return true;
+  return value === "1";
 }
 __name(consumeDebugParam, "consumeDebugParam");
 function useDebugMode() {
@@ -1793,8 +1811,8 @@ function useDebugMode() {
   const [isDebug, setIsDebug] = (0, import_react2.useState)(false);
   (0, import_react2.useEffect)(() => {
     const fromUrl = consumeDebugParam();
-    if (fromUrl) {
-      setIsDebug(true);
+    if (fromUrl !== null) {
+      setIsDebug(fromUrl);
       return;
     }
     setIsDebug(readFromStorage());