Documentation
IntegrationFramework Guides

Framework Guides

Next.js

Create or update sentry.client.config.ts:

// sentry.client.config.ts
import * as Sentry from "@sentry/nextjs";

let cachedPatterns: Array<{ pattern: string; type: string }> | null = null;
let cacheExpiry = 0;

async function getPatterns() {
  if (cachedPatterns && Date.now() < cacheExpiry) {
    return cachedPatterns;
  }

  const response = await fetch("https://api.noisegate.dev/v1/filters", {
    headers: { "Authorization": `Bearer ${process.env.NEXT_PUBLIC_NOISEGATE_API_KEY}` }
  });
  const data = await response.json();
  cachedPatterns = data.patterns;
  cacheExpiry = Date.now() + 5 * 60 * 1000;
  return cachedPatterns;
}

Sentry.init({
  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
  beforeSend: async (event) => {
    try {
      const patterns = await getPatterns();
      const message = event.exception?.values?.[0]?.value || "";

      const shouldFilter = patterns.some(p =>
        p.type === "regex"
          ? new RegExp(p.pattern).test(message)
          : message.includes(p.pattern)
      );

      return shouldFilter ? null : event;
    } catch {
      return event;
    }
  },
});

Add to .env.local:

NEXT_PUBLIC_NOISEGATE_API_KEY=ng_live_xxxxxxxxxxxx

React

// src/sentry.ts
import * as Sentry from "@sentry/react";

let cachedPatterns: Array<{ pattern: string; type: string }> | null = null;
let cacheExpiry = 0;

async function getPatterns() {
  if (cachedPatterns && Date.now() < cacheExpiry) {
    return cachedPatterns;
  }

  const response = await fetch("https://api.noisegate.dev/v1/filters", {
    headers: { "Authorization": `Bearer ${import.meta.env.VITE_NOISEGATE_API_KEY}` }
  });
  const data = await response.json();
  cachedPatterns = data.patterns;
  cacheExpiry = Date.now() + 5 * 60 * 1000;
  return cachedPatterns;
}

export function initSentry() {
  Sentry.init({
    dsn: import.meta.env.VITE_SENTRY_DSN,
    integrations: [Sentry.browserTracingIntegration()],
    beforeSend: async (event) => {
      try {
        const patterns = await getPatterns();
        const message = event.exception?.values?.[0]?.value || "";

        const shouldFilter = patterns.some(p =>
          p.type === "regex"
            ? new RegExp(p.pattern).test(message)
            : message.includes(p.pattern)
        );

        return shouldFilter ? null : event;
      } catch {
        return event;
      }
    },
  });
}

Call in your entry point:

// src/main.tsx
import { initSentry } from "./sentry";

initSentry();

Vue

// src/plugins/sentry.ts
import * as Sentry from "@sentry/vue";
import type { App } from "vue";

let cachedPatterns: Array<{ pattern: string; type: string }> | null = null;
let cacheExpiry = 0;

async function getPatterns() {
  if (cachedPatterns && Date.now() < cacheExpiry) {
    return cachedPatterns;
  }

  const response = await fetch("https://api.noisegate.dev/v1/filters", {
    headers: { "Authorization": `Bearer ${import.meta.env.VITE_NOISEGATE_API_KEY}` }
  });
  const data = await response.json();
  cachedPatterns = data.patterns;
  cacheExpiry = Date.now() + 5 * 60 * 1000;
  return cachedPatterns;
}

export function initSentry(app: App) {
  Sentry.init({
    app,
    dsn: import.meta.env.VITE_SENTRY_DSN,
    beforeSend: async (event) => {
      try {
        const patterns = await getPatterns();
        const message = event.exception?.values?.[0]?.value || "";

        const shouldFilter = patterns.some(p =>
          p.type === "regex"
            ? new RegExp(p.pattern).test(message)
            : message.includes(p.pattern)
        );

        return shouldFilter ? null : event;
      } catch {
        return event;
      }
    },
  });
}

Initialize in your app:

// src/main.ts
import { createApp } from "vue";
import App from "./App.vue";
import { initSentry } from "./plugins/sentry";

const app = createApp(App);
initSentry(app);
app.mount("#app");

Node.js

// src/sentry.ts
import * as Sentry from "@sentry/node";

let cachedPatterns: Array<{ pattern: string; type: string }> | null = null;
let cacheExpiry = 0;

async function getPatterns() {
  if (cachedPatterns && Date.now() < cacheExpiry) {
    return cachedPatterns;
  }

  const response = await fetch("https://api.noisegate.dev/v1/filters", {
    headers: { "Authorization": `Bearer ${process.env.NOISEGATE_API_KEY}` }
  });
  const data = await response.json();
  cachedPatterns = data.patterns;
  cacheExpiry = Date.now() + 5 * 60 * 1000;
  return cachedPatterns;
}

Sentry.init({
  dsn: process.env.SENTRY_DSN,
  beforeSend: async (event) => {
    try {
      const patterns = await getPatterns();
      const message = event.exception?.values?.[0]?.value || "";

      const shouldFilter = patterns.some(p =>
        p.type === "regex"
          ? new RegExp(p.pattern).test(message)
          : message.includes(p.pattern)
      );

      return shouldFilter ? null : event;
    } catch {
      return event;
    }
  },
});

Environment Variables

FrameworkVariable
Next.jsNEXT_PUBLIC_NOISEGATE_API_KEY
React (Vite)VITE_NOISEGATE_API_KEY
Vue (Vite)VITE_NOISEGATE_API_KEY
Node.jsNOISEGATE_API_KEY

Next Steps