feat(skills-next): add react-router-framework SDK references (#250)

Author: evanpurkhiser

skills-next/references/sdks/react-router-framework/error-monitoring.md

@@ -0,0 +1,127 @@
+# Error Monitoring — Sentry React Router Framework SDK
+
+> Minimum SDK: `@sentry/react-router` (beta)
+
+---
+
+## Automatic and Manual Capture
+
+| Area | Auto Captured? | Mechanism |
+|------|----------------|-----------|
+| Client-side framework errors | ✅ Yes | `HydratedRouter onError={Sentry.sentryOnError}` |
+| Unhandled client exceptions | ✅ Yes | Browser global handlers from SDK init |
+| Server request/render errors | ✅ Yes | `createSentryHandleRequest` + `createSentryHandleError` |
+| Custom handled server errors | ❌ Not always | Call `Sentry.captureException` manually |
+| Custom loader/action failures | ⚠️ Depends | Use `wrapServerLoader` / `wrapServerAction` or manual capture |
+
+---
+
+## Client setup requirement
+
+`entry.client.tsx` must include:
+
+```tsx
+import * as Sentry from "@sentry/react-router";
+import { HydratedRouter } from "react-router/dom";
+
+Sentry.init({
+  dsn: "___PUBLIC_DSN___",
+});
+
+hydrateRoot(document, <HydratedRouter onError={Sentry.sentryOnError} />);
+```
+
+Without `sentryOnError`, framework-level client errors may be missed.
+
+---
+
+## Server setup requirement
+
+`entry.server.tsx`:
+
+```tsx
+import * as Sentry from "@sentry/react-router";
+import { createReadableStreamFromReadable } from "@react-router/node";
+import { renderToPipeableStream } from "react-dom/server";
+import { ServerRouter } from "react-router";
+
+const handleRequest = Sentry.createSentryHandleRequest({
+  ServerRouter,
+  renderToPipeableStream,
+  createReadableStreamFromReadable,
+});
+
+export default handleRequest;
+
+export const handleError = Sentry.createSentryHandleError({
+  logErrors: false,
+});
+```
+
+---
+
+## Manual capture in custom handlers
+
+```tsx
+import * as Sentry from "@sentry/react-router";
+
+export function handleError(error: unknown, args: unknown) {
+  Sentry.captureException(error);
+  console.error(error);
+}
+```
+
+For custom streaming request implementations, wrap your handler:
+
+```tsx
+import { wrapSentryHandleRequest } from "@sentry/react-router";
+
+export default wrapSentryHandleRequest(customHandleRequest);
+```
+
+---
+
+## Loader/action wrappers
+
+```ts
+import * as Sentry from "@sentry/react-router";
+
+export const loader = Sentry.wrapServerLoader(
+  { name: "Load Data", description: "Loads route data" },
+  async () => {
+    // loader logic
+  },
+);
+
+export const action = Sentry.wrapServerAction(
+  { name: "Submit Data", description: "Handles form submission" },
+  async () => {
+    // action logic
+  },
+);
+```
+
+---
+
+## Verification
+
+Use a route loader that throws:
+
+```tsx
+export async function loader() {
+  throw new Error("My first Sentry error!");
+}
+```
+
+Open the route and verify the event appears in **Issues**.
+
+---
+
+## Troubleshooting
+
+| Issue | Solution |
+|-------|----------|
+| Client framework errors missing | Ensure `HydratedRouter` uses `onError={Sentry.sentryOnError}` |
+| Server render/request errors missing | Verify both `createSentryHandleRequest` and `createSentryHandleError` are exported |
+| Custom handlers not captured | Add explicit `captureException` calls |
+| Error appears locally but not in Sentry | Check DSN, network restrictions, and `debug: true` output |