all good

frontend/src/index.tsx

@@ -1,15 +1,29 @@
 import { createRoot } from 'react-dom/client';
 import App from './App';
 import { i18nReady } from './i18n';
+import { BugsinkErrorBoundary, initBugsink } from './lib/bugsink';
 import './index.css';
 import './hooks/usePlausible';
 
+initBugsink();
+
 const container = document.getElementById('root');
 if (!container) {
   throw new Error('Root element not found');
 }
 const root = container;
 
+function AppErrorFallback() {
+  return (
+    <div className="flex min-h-screen items-center justify-center bg-warm-50 px-6 text-center text-warm-900 dark:bg-navy-950 dark:text-warm-100">
+      <div>
+        <h1 className="text-xl font-semibold">Something went wrong</h1>
+        <p className="mt-2 text-sm text-warm-600 dark:text-warm-300">Refresh the page to try again.</p>
+      </div>
+    </div>
+  );
+}
+
 function renderApp() {
   const hasPrerenderedMarkup = root.children.length > 0;
 
@@ -18,7 +32,11 @@ function renderApp() {
   }
   root.removeAttribute('data-prerender-path');
 
-  createRoot(root).render(<App />);
+  createRoot(root).render(
+    <BugsinkErrorBoundary fallback={<AppErrorFallback />}>
+      <App />
+    </BugsinkErrorBoundary>
+  );
 }
 
 void i18nReady.then(renderApp);