reportli 1.0.2 → 1.0.3

package/src/index.ts

@@ -1,180 +1,425 @@
-// reportli.ts
+// src/index.ts — Reportli SDK v1.0.3
 
 const ENDPOINT =
   "https://fahikyfmgdyzejdfftox.supabase.co/functions/v1/rapid-processor";
 
+// ─── Types ────────────────────────────────────────────────────────────────────
+
 type Config = {
   apiKey: string;
   environment?: string;
 };
 
+type QueueItem = Record<string, unknown>;
+
+// ─── State ────────────────────────────────────────────────────────────────────
+
 let initialized = false;
-let config: Config;
-
-function post(payload: Record<string, unknown>) {
-  fetch(ENDPOINT, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-    },
-    body: JSON.stringify(payload),
-  }).catch(() => {
-    // Never throw from the SDK.
-  });
+let _config: Config;
+const queue: QueueItem[] = [];
+let flushTimer: ReturnType<typeof setTimeout> | null = null;
+let isFlushing = false;
+
+// ─── Queue & Batch Send ───────────────────────────────────────────────────────
+
+function scheduleFlush() {
+  if (flushTimer) return;
+  flushTimer = setTimeout(() => {
+    flushTimer = null;
+    flush();
+  }, 2000); // batch every 2 seconds
+}
+
+async function flush() {
+  if (isFlushing || queue.length === 0) return;
+  isFlushing = true;
+
+  const batch = queue.splice(0, 10); // send max 10 at a time
+
+  for (const payload of batch) {
+    await sendNow(payload);
+  }
+
+  isFlushing = false;
+
+  if (queue.length > 0) flush(); // flush remaining
+}
+
+async function sendNow(payload: QueueItem, attempts = 3): Promise<void> {
+  for (let i = 0; i < attempts; i++) {
+    try {
+      const res = await fetch(ENDPOINT, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "x-api-key": _config?.apiKey ?? "",
+        },
+        body: JSON.stringify(payload),
+      });
+      if (res.ok) return; // success — stop retrying
+    } catch {
+      // network error — wait before retry
+    }
+    await sleep(1000 * (i + 1)); // 1s, 2s, 3s
+  }
+  // give up silently after 3 attempts — never crash user app
+}
+
+function sleep(ms: number) {
+  return new Promise((resolve) => setTimeout(resolve, ms));
+}
+
+// ─── Enqueue ──────────────────────────────────────────────────────────────────
+
+function enqueue(payload: QueueItem) {
+  if (queue.length >= 100) return; // cap queue to prevent memory issues
+  queue.push(payload);
+  scheduleFlush();
+}
+
+// ─── Send immediately (for critical messages) ─────────────────────────────────
+
+function sendImmediate(payload: QueueItem) {
+  sendNow(payload).catch(() => {}); // fire and forget
+}
+
+// ─── Helpers ──────────────────────────────────────────────────────────────────
+
+function getUrl(): string {
+  if (typeof window !== "undefined") return window.location.href;
+  try { return require("os").hostname(); } catch { return "server"; }
 }
 
-function sendError(data: {
-  message: string;
-  code?: string;
-  stack?: string;
-  file?: string;
-  line?: number;
-  column?: number;
-  severity?: string;
-}) {
-  post({
+function getBrowser(): string {
+  if (typeof navigator !== "undefined") return navigator.userAgent;
+  return `Node.js ${typeof process !== "undefined" ? process.version : "unknown"}`;
+}
+
+function getEnvironment(): string {
+  return _config?.environment ?? (typeof window !== "undefined" ? "browser" : "server");
+}
+
+function parseStack(stack: string | undefined): { file: string; line: number; column: number } {
+  if (!stack) return { file: "unknown", line: 0, column: 0 };
+  const match =
+    stack.match(/at .+ \((.+):(\d+):(\d+)\)/) ||
+    stack.match(/at (.+):(\d+):(\d+)/);
+  return {
+    file: match?.[1]?.split("/")?.pop() || "unknown",
+    line: parseInt(match?.[2] || "0"),
+    column: parseInt(match?.[3] || "0"),
+  };
+}
+
+function getErrorCode(error: any): string {
+  return (
+    error?.code ||
+    error?.status?.toString() ||
+    error?.statusCode?.toString() ||
+    error?.name ||
+    "ERR_UNKNOWN"
+  );
+}
+
+function classifyError(error: any, context?: string): { category: string; severity: "low" | "medium" | "high" | "critical" } {
+  const msg = String(error?.message || error || "").toLowerCase();
+  const name = String(error?.name || "").toLowerCase();
+
+  // Payment — always critical
+  if (msg.includes("stripe") || msg.includes("payment") || msg.includes("card declined") || msg.includes("checkout") || msg.includes("refund"))
+    return { category: "Payment Error", severity: "critical" };
+
+  // Auth
+  if (msg.includes("jwt") || msg.includes("token expired") || msg.includes("unauthorized") || msg.includes("session") || msg.includes("oauth") || msg.includes("login failed"))
+    return { category: "Auth Error", severity: "high" };
+
+  // Database
+  if (msg.includes("supabase") || msg.includes("database") || msg.includes("query") || msg.includes("connection lost") || msg.includes("transaction") || msg.includes("duplicate key") || msg.includes("foreign key"))
+    return { category: "Database Error", severity: "critical" };
+
+  // React/Next.js
+  if (msg.includes("hydration") || msg.includes("does not match server"))
+    return { category: "Hydration Error", severity: "high" };
+  if (msg.includes("invalid hook") || msg.includes("rules of hooks"))
+    return { category: "Hook Error", severity: "critical" };
+  if (msg.includes("render") || msg.includes("error boundary"))
+    return { category: "Render Error", severity: "critical" };
+  if (msg.includes("dynamic import") || msg.includes("failed to fetch dynamically"))
+    return { category: "Import Error", severity: "high" };
+
+  // Network
+  if (msg.includes("cors") || msg.includes("cross-origin"))
+    return { category: "CORS Error", severity: "high" };
+  if (msg.includes("fetch failed") || msg.includes("failed to fetch") || name === "fetcherror")
+    return { category: "Network Error", severity: "high" };
+  if (msg.includes("timeout") || msg.includes("timed out") || msg.includes("etimedout"))
+    return { category: "Timeout Error", severity: "medium" };
+  if (msg.includes("websocket"))
+    return { category: "WebSocket Error", severity: "high" };
+
+  // HTTP status codes
+  if (msg.includes("http 401") || msg.includes("xhr 401"))
+    return { category: "Auth Error", severity: "high" };
+  if (msg.includes("http 403") || msg.includes("xhr 403"))
+    return { category: "Auth Error", severity: "high" };
+  if (msg.includes("http 404") || msg.includes("xhr 404"))
+    return { category: "Not Found Error", severity: "medium" };
+  if (msg.includes("http 500") || msg.includes("xhr 500"))
+    return { category: "Server Error", severity: "critical" };
+  if (msg.includes("http 503") || msg.includes("xhr 503"))
+    return { category: "Server Error", severity: "critical" };
+
+  // Memory
+  if (msg.includes("maximum call stack") || msg.includes("out of memory") || msg.includes("heap limit"))
+    return { category: "Memory Error", severity: "critical" };
+
+  // Server
+  if (msg.includes("cannot find module") || msg.includes("module not found"))
+    return { category: "Module Error", severity: "critical" };
+  if (msg.includes("econnrefused") || msg.includes("connection refused"))
+    return { category: "Connection Error", severity: "critical" };
+
+  // Email & Jobs
+  if (msg.includes("email") || msg.includes("smtp") || msg.includes("sendgrid"))
+    return { category: "Email Error", severity: "high" };
+  if (msg.includes("cron") || msg.includes("webhook") || msg.includes("queue"))
+    return { category: "Job Error", severity: "high" };
+
+  // Files
+  if (msg.includes("upload") || msg.includes("file size") || msg.includes("invalid file"))
+    return { category: "File Error", severity: "medium" };
+
+  // Storage
+  if (msg.includes("quota exceeded") || msg.includes("localstorage") || msg.includes("indexeddb"))
+    return { category: "Storage Error", severity: "medium" };
+
+  // JS core
+  if (name === "typeerror") return { category: "TypeError", severity: "high" };
+  if (name === "referenceerror") return { category: "ReferenceError", severity: "critical" };
+  if (name === "rangeerror") return { category: "RangeError", severity: "high" };
+  if (name === "syntaxerror") return { category: "SyntaxError", severity: "high" };
+
+  // Context based
+  if (context === "unhandledrejection") return { category: "Promise Error", severity: "medium" };
+  if (context === "express") return { category: "Server Error", severity: "high" };
+  if (context === "resource") return { category: "Resource Error", severity: "low" };
+
+  return { category: "Unknown Error", severity: "medium" };
+}
+
+function buildErrorPayload(error: any, context?: string): QueueItem {
+  const message = error?.message || String(error) || "Unknown error";
+  const stack = error?.stack || "";
+  const { file, line, column } = parseStack(stack);
+  const { category, severity } = classifyError(error, context);
+
+  return {
     type: "ERROR",
-    apiKey: config.apiKey,
-    message: data.message,
-    code: data.code ?? "Error",
-    stack: data.stack ?? null,
-    file: data.file ?? null,
-    line: data.line ?? null,
-    column: data.column ?? null,
-    url:
-      typeof window !== "undefined" ? window.location.href : null,
+    apiKey: _config?.apiKey,
+    message,
+    code: getErrorCode(error),
+    stack,
+    file,
+    line,
+    column,
+    url: getUrl(),
     timestamp: new Date().toISOString(),
-    environment: config.environment ?? "production",
-    browser:
-      typeof navigator !== "undefined"
-        ? navigator.userAgent
-        : "node",
-    error_category: data.code ?? "Error",
-    severity: data.severity ?? "high",
+    environment: getEnvironment(),
+    browser: getBrowser(),
+    error_category: category,
+    severity,
     status: "open",
-  });
+    context: context || "auto",
+  };
 }
 
-export const Reportli = {
-  init(cfg: Config) {
-    if (initialized) return;
+// ─── Browser Listeners ────────────────────────────────────────────────────────
 
-    config = cfg;
-    initialized = true;
+function activateBrowserListeners() {
+  // JS errors + resource errors
+  window.addEventListener("error", (event) => {
+    // Resource load error (img, script, link, video)
+    const target = event.target as HTMLElement;
+    if (target && target.tagName && ["IMG", "SCRIPT", "LINK", "VIDEO", "AUDIO"].includes(target.tagName)) {
+      const src = (target as any).src || (target as any).href || "unknown";
+      enqueue(buildErrorPayload({ name: "ResourceError", message: `${target.tagName} failed to load: ${src}`, stack: "" }, "resource"));
+      return;
+    }
 
-    console.log(
-      "✅ Reportli initialized successfully. Error monitoring is active."
-    );
-
-    // JS errors
-    window.addEventListener("error", (event: any) => {
-      if (event.error instanceof Error) {
-        sendError({
-          message: event.error.message,
-          code: event.error.name,
-          stack: event.error.stack,
-          file: event.filename,
-          line: event.lineno,
-          column: event.colno,
-        });
-      } else if (event.target) {
-        // Resource load failure
-        sendError({
-          message: "Resource failed to load",
-          code: "ResourceLoadError",
-        });
-      }
-    }, true);
-
-    // Promise rejections
-    window.addEventListener("unhandledrejection", (event: any) => {
-      const err = event.reason;
-      sendError({
-        message: err?.message ?? String(err),
-        code: err?.name ?? "UnhandledPromiseRejection",
-        stack: err?.stack,
-      });
-    });
+    const err = (event as ErrorEvent).error || {
+      name: "Error",
+      message: (event as ErrorEvent).message,
+      stack: `at ${(event as ErrorEvent).filename}:${(event as ErrorEvent).lineno}:${(event as ErrorEvent).colno}`,
+    };
+    enqueue(buildErrorPayload(err, "window"));
+  }, true);
 
-    // fetch interception
-    const originalFetch = window.fetch;
-    window.fetch = async (...args) => {
-      try {
-        const response = await originalFetch(...args);
-
-        if (!response.ok) {
-          sendError({
-            message: `Fetch HTTP ${response.status}`,
-            code: `HTTP_${response.status}`,
-            severity: "medium",
-          });
-        }
+  // Unhandled promise rejections
+  window.addEventListener("unhandledrejection", (event) => {
+    const err = event.reason instanceof Error
+      ? event.reason
+      : { name: "UnhandledRejection", message: String(event.reason || "Unhandled Promise Rejection"), stack: "" };
+    enqueue(buildErrorPayload(err, "unhandledrejection"));
+  });
+
+  // Intercept fetch — catches all API errors automatically
+  const originalFetch = window.fetch;
+  window.fetch = async function (...args: Parameters<typeof fetch>): Promise<Response> {
+    const url = typeof args[0] === "string"
+      ? args[0]
+      : args[0] instanceof URL
+      ? args[0].toString()
+      : (args[0] as Request)?.url ?? "";
+
+    // Never intercept our own requests
+    if (url.includes("rapid-processor")) return originalFetch(...args);
 
-        return response;
-      } catch (e: any) {
-        sendError({
-          message: e?.message ?? "Fetch failed",
-          code: "FetchError",
-          stack: e?.stack,
-        });
-        throw e;
+    try {
+      const response = await originalFetch(...args);
+      if (!response.ok) {
+        enqueue(buildErrorPayload({
+          name: `HTTP_${response.status}`,
+          message: `HTTP ${response.status}: ${(args[1] as RequestInit)?.method || "GET"} ${url}`,
+          stack: `${(args[1] as RequestInit)?.method || "GET"} ${url} → ${response.status} ${response.statusText}`,
+          status: response.status,
+        }, "fetch"));
       }
-    };
+      return response;
+    } catch (err: any) {
+      enqueue(buildErrorPayload({
+        name: "FetchError",
+        message: `Fetch failed: ${(args[1] as RequestInit)?.method || "GET"} ${url} — ${err.message}`,
+        stack: err.stack,
+      }, "fetch"));
+      throw err;
+    }
+  };
 
-    // XMLHttpRequest interception
-    const open = XMLHttpRequest.prototype.open;
-    const send = XMLHttpRequest.prototype.send;
-
-    XMLHttpRequest.prototype.open = function (
-      method,
-      url,
-      ...rest
-    ) {
-      (this as any).__reportli_url = url;
-      return open.call(this, method, url, ...rest);
-    };
+  // Intercept XHR
+  const originalOpen = XMLHttpRequest.prototype.open;
+  const originalSend = XMLHttpRequest.prototype.send;
+
+  XMLHttpRequest.prototype.open = function (method: string, url: string, ...rest: any[]) {
+    (this as any)._r_method = method;
+    (this as any)._r_url = url;
+    return originalOpen.call(this, method, url, ...rest);
+  } as any;
 
-    XMLHttpRequest.prototype.send = function (...args) {
-      this.addEventListener("load", function () {
-        if (this.status >= 400) {
-          sendError({
-            message: `XHR HTTP ${this.status}`,
-            code: `XHR_${this.status}`,
-          });
+  XMLHttpRequest.prototype.send = function (...args: any[]) {
+    const url: string = (this as any)._r_url || "";
+    const method: string = (this as any)._r_method || "GET";
+
+    if (!url.includes("rapid-processor")) {
+      this.addEventListener("loadend", () => {
+        if (this.status >= 400 || this.status === 0) {
+          enqueue(buildErrorPayload({
+            name: `XHR_${this.status}`,
+            message: `XHR ${this.status}: ${method} ${url}`,
+            stack: `${method} ${url} → ${this.status} ${this.statusText}`,
+            status: this.status,
+          }, "xhr"));
         }
       });
+    }
 
-      this.addEventListener("error", function () {
-        sendError({
-          message: "XHR connection failed",
-          code: "XHRConnectionError",
-        });
-      });
+    return originalSend.apply(this, args);
+  } as any;
 
-      return send.apply(this, args as any);
-    };
+  // Disconnect when page closes
+  window.addEventListener("beforeunload", () => {
+    try {
+      navigator.sendBeacon(
+        ENDPOINT,
+        JSON.stringify({
+          type: "SDK_DISCONNECTED",
+          apiKey: _config?.apiKey,
+          timestamp: new Date().toISOString(),
+          environment: getEnvironment(),
+          url: getUrl(),
+        })
+      );
+    } catch { /* silent */ }
+  });
+}
+
+// ─── Server Listeners ─────────────────────────────────────────────────────────
+
+function activateServerListeners() {
+  process.on("uncaughtException", (error: Error) => {
+    enqueue(buildErrorPayload(error, "uncaughtException"));
+    flush(); // flush immediately on crash
+  });
+
+  process.on("unhandledRejection", (reason: any) => {
+    enqueue(buildErrorPayload(
+      reason instanceof Error ? reason : { name: "UnhandledRejection", message: String(reason), stack: "" },
+      "unhandledrejection"
+    ));
+  });
+
+  const shutdown = async (signal: string) => {
+    await sendNow({
+      type: "SDK_DISCONNECTED",
+      apiKey: _config?.apiKey,
+      timestamp: new Date().toISOString(),
+      environment: getEnvironment(),
+      url: getUrl(),
+      signal,
+    });
+    process.exit(0);
+  };
+
+  process.on("SIGTERM", () => shutdown("SIGTERM"));
+  process.on("SIGINT", () => shutdown("SIGINT"));
+}
+
+// ─── Public API ───────────────────────────────────────────────────────────────
+
+export const Reportli = {
+  init(cfg: Config) {
+    if (initialized) return;
+    if (!cfg?.apiKey) return;
+
+    _config = cfg;
+    initialized = true;
+
+    // Send SDK_INITIALIZED immediately — not queued
+    sendImmediate({
+      type: "SDK_INITIALIZED",
+      apiKey: cfg.apiKey,
+      timestamp: new Date().toISOString(),
+      environment: getEnvironment(),
+      url: getUrl(),
+      browser: getBrowser(),
+    });
+
+    // Activate listeners
+    if (typeof window !== "undefined") {
+      activateBrowserListeners();
+    } else if (typeof process !== "undefined" && process.versions?.node) {
+      activateServerListeners();
+    }
   },
 
   capture(error: unknown) {
-    if (error instanceof Error) {
-      sendError({
-        message: error.message,
-        code: error.name,
-        stack: error.stack,
-      });
-    } else {
-      sendError({
-        message: String(error),
-        code: "ManualCapture",
-      });
-    }
+    if (!initialized) return;
+    const err = error instanceof Error
+      ? error
+      : { name: "ManualCapture", message: String(error), stack: new Error().stack };
+    enqueue(buildErrorPayload(err, "manual"));
   },
 
   captureMessage(message: string) {
-    sendError({
-      message,
-      code: "Message",
-      severity: "low",
-    });
+    if (!initialized) return;
+    enqueue(buildErrorPayload({ name: "Message", message, stack: "" }, "manual"));
+  },
+
+  errorHandler() {
+    return function (err: any, _req: any, _res: any, next: any) {
+      enqueue(buildErrorPayload(err, "express"));
+      next(err);
+    };
   },
-};
+};
+
+export default Reportli;