fix: another hydration attempt

tannerlinsley · tannerlinsley · commit d273e29e926c · 2024-05-11T16:47:49.000-06:00
diff --git a/app/client.tsx b/app/client.tsx
@@ -8,4 +8,5 @@ import { StartClient } from '@tanstack/start'
 
 const router = createRouter()
 
-hydrateRoot(document, <StartClient router={router} />)
+// hydrateRoot(document, <StartClient router={router} />)
+hydrateRoot(document.getElementById('root')!, <StartClient router={router} />)
diff --git a/app/routes/__root.tsx b/app/routes/__root.tsx
@@ -13,7 +13,7 @@ import appCss from '~/styles/app.css?url'
 import carbonStyles from '~/styles/carbon.css?url'
 import { seo } from '~/utils/seo'
 import ogImage from '~/images/og.png'
-import { Meta, RouterManagedTag, Scripts } from '@tanstack/start'
+import { RouterManagedTag, Scripts, Html, Head, Body } from '@tanstack/start'
 import { TanStackRouterDevtools } from '@tanstack/router-devtools'
 import { NotFound } from '~/components/NotFound'
 import { CgSpinner } from 'react-icons/cg'
@@ -142,14 +142,13 @@ function RootDocument({ children }: { children: React.ReactNode }) {
   const showDevtools = showLoading && isRouterPage
 
   return (
-    <html lang="en">
-      <head>
-        <Meta />
+    <Html lang="en">
+      <Head>
         {matches.find((d) => d.staticData?.baseParent) ? (
           <base target="_parent" />
         ) : null}
-      </head>
-      <body>
+      </Head>
+      <Body>
         <SpeedInsights />
         <Analytics />
         <React.Suspense fallback={null}>{children}</React.Suspense>
@@ -179,7 +178,7 @@ function RootDocument({ children }: { children: React.ReactNode }) {
         ) : null}
         <ScrollRestoration />
         <Scripts />
-      </body>
-    </html>
+      </Body>
+    </Html>
   )
 }
diff --git a/app/utils/sentry.ts b/app/utils/sentry.ts
@@ -0,0 +1,16 @@
+import * as Sentry from '@sentry/react'
+
+Sentry.init({
+  dsn: 'https://ac4bfc43ff4a892f8dc7053c4a50d92f@o4507236158537728.ingest.us.sentry.io/4507236163649536',
+  integrations: [
+    Sentry.browserTracingIntegration(),
+    Sentry.replayIntegration(),
+  ],
+  // Performance Monitoring
+  tracesSampleRate: 1.0, //  Capture 100% of the transactions
+  // Set 'tracePropagationTargets' to control for which URLs distributed tracing should be enabled
+  tracePropagationTargets: ['localhost', /^https:\/\/tanstack\.com\//],
+  // Session Replay
+  replaysSessionSampleRate: 0.1, // This sets the sample rate at 10%. You may want to change it to 100% while in development and then sample at a lower rate in production.
+  replaysOnErrorSampleRate: 1.0, // If you're not already sampling the entire session, change the sample rate to 100% when sampling sessions where errors occur.
+})
diff --git a/package.json b/package.json
@@ -24,10 +24,10 @@
     "@oramacloud/client": "^1.1.5",
     "@remix-run/node": "^2.8.1",
     "@tailwindcss/typography": "^0.5.13",
-    "@tanstack/react-router": "1.31.28",
-    "@tanstack/router-devtools": "1.31.28",
+    "@tanstack/react-router": "1.32.0",
+    "@tanstack/router-devtools": "1.32.0",
     "@tanstack/router-vite-plugin": "1.31.18",
-    "@tanstack/start": "1.31.28",
+    "@tanstack/start": "1.32.1",
     "@typescript-eslint/parser": "^7.2.0",
     "@vercel/analytics": "^1.2.2",
     "@vercel/speed-insights": "^1.0.10",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/vite.config.js b/vite.config.js
@@ -0,0 +1,16 @@
+import { defineConfig } from "vite";
+import { sentryVitePlugin } from "@sentry/vite-plugin";
+
+export default defineConfig({
+  build: {
+    sourcemap: true, // Source map generation must be turned on
+  },
+  plugins: [
+    // Put the Sentry vite plugin after all other plugins
+    sentryVitePlugin({
+      authToken: process.env.SENTRY_AUTH_TOKEN,
+      org: "tanstack",
+      project: "tanstack-com",
+    }),
+  ],
+});
