trails/apps/journal/app/root.tsx
Ullrich Schäfer 9a904d9f69
Sentry improvements: context, tracing, source maps, privacy manifest
- Set Sentry user context (id, username) in Journal root for all routes
- Tag Planner errors with session_id
- Use reactRouterV7BrowserTracingIntegration for route-aware traces
- Hidden source maps (no sourceMappingURL in bundles, .map deleted after
  upload to Sentry)
- Privacy manifest at /privacy documenting all data collection
- robots.txt blocking all bots on both apps
- Suppress i18next promotional console log

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-25 03:11:07 +01:00

82 lines
2.5 KiB
TypeScript

import { useEffect } from "react";
import { Links, Meta, Outlet, Scripts, ScrollRestoration, isRouteErrorResponse } from "react-router";
import type { LinksFunction } from "react-router";
import type { Route } from "./+types/root";
import * as Sentry from "@sentry/react";
import { useTranslation } from "react-i18next";
import { initI18n } from "@trails-cool/i18n";
import { getSessionUser } from "~/lib/auth.server";
import stylesheet from "@trails-cool/ui/styles.css?url";
initI18n();
export const links: LinksFunction = () => [{ rel: "stylesheet", href: stylesheet }];
export function Layout({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<head>
<meta charSet="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<Meta />
<Links />
</head>
<body className="min-h-screen bg-gray-50">
{children}
<ScrollRestoration />
<Scripts />
</body>
</html>
);
}
export async function loader({ request }: Route.LoaderArgs) {
const user = await getSessionUser(request);
return { user: user ? { id: user.id, username: user.username } : null };
}
export default function App({ loaderData }: Route.ComponentProps) {
const user = loaderData?.user;
useEffect(() => {
if (user) {
Sentry.setUser({ id: user.id, username: user.username });
} else {
Sentry.setUser(null);
}
}, [user]);
return <Outlet />;
}
export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
Sentry.captureException(error);
const { t } = useTranslation();
if (isRouteErrorResponse(error)) {
return (
<div className="mx-auto max-w-md px-4 py-16 text-center">
<h1 className="text-4xl font-bold text-gray-900">{error.status}</h1>
<p className="mt-2 text-gray-600">
{error.status === 404 && t("pageNotFound")}
{error.status === 503 && t("serviceUnavailable")}
{error.status !== 404 && error.status !== 503 && (error.statusText || t("error"))}
</p>
<a href="/" className="mt-6 inline-block text-blue-600 hover:underline">
{t("goHome")}
</a>
</div>
);
}
return (
<div className="mx-auto max-w-md px-4 py-16 text-center">
<h1 className="text-4xl font-bold text-gray-900">{t("error")}</h1>
<p className="mt-2 text-gray-600">
{error instanceof Error ? error.message : t("error")}
</p>
<a href="/" className="mt-6 inline-block text-blue-600 hover:underline">
{t("goHome")}
</a>
</div>
);
}