Bug Reporting

Report bugs programmatically from inside your app. The reportBug() API lets you capture user-reported issues with custom metadata and send them through the standard event pipeline.

Quick Start

import WhatzBug from '@whatzbug/react-native';

// Report a bug from a support screen or error boundary
WhatzBug.reportBug('Checkout button not responding', {
  screen: 'CheckoutScreen',
  cartItemCount: 3,
  paymentMethod: 'apple_pay',
});

API Reference

reportBug(description, metadata?)

Submit a bug report with a description and optional structured metadata.

How It Works

reportBug() is a convenience wrapper over track(). It emits a $bug_report event with the description and metadata merged into the payload from there it follows the standard event pipeline: envelope → persistent queue → batch flush → backend.

When debug mode is active, bug reports are also streamed to the Desktop App in real time, appearing in the event log with a $bug_report label.

Usage Patterns

Error Boundary Integration

class ErrorBoundary extends React.Component {
  componentDidCatch(error, errorInfo) {
    WhatzBug.reportBug(error.message, {
      componentStack: errorInfo.componentStack,
      screen: 'ErrorBoundary',
    });
  }
}

User-Triggered Reports

function ReportBugButton() {
  const handleReport = () => {
    WhatzBug.reportBug('User reported issue', {
      screen: useRoute().name,
      timestamp: Date.now(),
    });
    Alert.alert('Thanks', 'Bug report submitted.');
  };

  return <Button title="Report Bug" onPress={handleReport} />;
}

Next Steps