SvelteKit Integration

// src/hooks.client.ts
import { init, captureException } from '@codmir/overseer';

init({
  dsn: import.meta.env.VITE_OVERSEER_DSN,
  service: 'sveltekit-app',
  environment: import.meta.env.MODE,
  enableReplay: true,
  enablePerformance: true,
});

export function handleError({ error, event }) {
  captureException(error as Error, {
    extra: {
      url: event.url.pathname,
      route: event.route?.id,
    },
  });
  console.error('Client error:', error);
}

// src/hooks.server.ts
import { captureException } from '@codmir/overseer';

export function handleError({ error, event }) {
  captureException(error as Error, {
    extra: {
      url: event.url.pathname,
      method: event.request.method,
    },
  });
  console.error('Server error:', error);
}

<script lang="ts">
  import { onMount } from 'svelte';
  import { captureException, addBreadcrumb, setUser } from '@codmir/overseer';
  
  export let user: { id: string; email: string };
  
  onMount(() => {
    setUser({ id: user.id, email: user.email });
  });
  
  async function handleClick() {
    addBreadcrumb({
      category: 'ui.click',
      message: 'Button clicked',
      level: 'info',
    });
    
    try {
      await performAction();
    } catch (error) {
      captureException(error as Error);
    }
  }
</script>

<button on:click={handleClick}>
  Do Action
</button>

<script lang="ts">
  import { page } from '$app/stores';
  import { captureException } from '@codmir/overseer';
  import { onMount } from 'svelte';
  
  onMount(() => {
    if ($page.error) {
      captureException(new Error($page.error.message));
    }
  });
</script>

<div class="error-page">
  <h1>{$page.status}</h1>
  <p>{$page.error?.message}</p>
  <a href="/">Go home</a>
</div>

# .env
VITE_OVERSEER_DSN=https://your-project.codmir.com/overseer