@glitch-sdk/react

React SDK for Glitch Bug Reporter. Captures component crashes, React state, Redux actions, and React Query failures automatically.

Install

npm install @glitch-sdk/react

Quick Start

import { GlitchProvider, GlitchErrorBoundary, useGlitchState } from '@glitch-sdk/react';

function App() {
  return (
    <GlitchProvider projectKey="pak_splat_xxx" user={{ id: '123', email: '[email protected]' }}>
      <GlitchErrorBoundary fallback={<ErrorPage />}>
        <MyApp />
      </GlitchErrorBoundary>
    </GlitchProvider>
  );
}

Track React State

function CheckoutPage() {
  const [cart, setCart] = useState([]);
  const [step, setStep] = useState(1);

  // These values are captured on every bug report
  useGlitchState('checkout', { cart, step });

  return <div>...</div>;
}

Redux Middleware

import { glitchReduxMiddleware } from '@glitch-sdk/react';

const store = configureStore({
  middleware: (getDefault) => getDefault().concat(
    glitchReduxMiddleware({
      maxActions: 50,
      sanitize: (action) => action.type.includes('auth')
        ? { ...action, payload: '[REDACTED]' }
        : action
    })
  )
});

React Query Plugin

import { glitchQueryPlugin } from '@glitch-sdk/react';

const queryClient = new QueryClient({
  defaultOptions: {
    queries: {
      plugins: [glitchQueryPlugin({ captureFailedQueries: true, captureSlowQueries: 2000 })]
    }
  }
});

Manual Bug Report

import { glitch } from '@glitch-sdk/react';

glitch.report({
  title: 'Payment failed',
  severity: 'critical',
  metadata: { orderId: 'ORD-123' }
});

API

| Export | Description | |---|---| | GlitchProvider | React context provider — wraps your app | | GlitchErrorBoundary | Auto-catches React crashes and reports them | | useGlitchState(name, state) | Registers React state for capture | | useGlitch() | Access the Glitch client in any component | | glitch | Global instance for manual operations | | glitchReduxMiddleware(config) | Redux middleware for action capture | | glitchQueryPlugin(config) | React Query plugin for query failure capture |