screenshot should grab user

apps/web/src/routes/screenshots/_content.tsx

@@ -1,9 +1,24 @@
 import { createFileRoute, Outlet } from '@tanstack/react-router';
+import { getWebRequest } from '@tanstack/react-start/server';
+import { prefetchGetMyUserInfo } from '@/api/buster_rest/users';
+import { env } from '@/env';
+import { getSupabaseSession } from '@/integrations/supabase/getSupabaseUserClient';
 
 export const Route = createFileRoute('/screenshots/_content')({
+  ssr: true,
   component: RouteComponent,
-  beforeLoad: async ({ matches }) => {
-    //
+  beforeLoad: async ({ context }) => {
+    const user = await getSupabaseSession();
+    await prefetchGetMyUserInfo(context.queryClient);
+    return {
+      user,
+    };
+  },
+  loader: async ({ context }) => {
+    const { user } = context;
+    return {
+      user,
+    };
   },
 });
 

apps/web/src/routes/screenshots/_content/metrics.$metricId.content.tsx

@@ -1,5 +1,7 @@
 import { createFileRoute } from '@tanstack/react-router';
 import { z } from 'zod';
+import { useGetUserBasicInfo } from '@/api/buster_rest/users/useGetUserInfo';
+import { Route as ScreenshotsRoute } from '../_content';
 import { GetMetricScreenshotQuerySchema } from '../metrics.$metricId.index';
 
 export const Route = createFileRoute('/screenshots/_content/metrics/$metricId/content')({
@@ -10,10 +12,14 @@ export const Route = createFileRoute('/screenshots/_content/metrics/$metricId/co
 
 function RouteComponent() {
   const { version_number, type, width, height } = Route.useSearch();
+  const { user } = ScreenshotsRoute.useLoaderData();
+  const x = useGetUserBasicInfo();
 
   return (
     <div className="p-10 flex flex-col h-full border-red-500 border-10 items-center justify-center bg-blue-100 text-2xl text-blue-500">
-      Hello "/screenshot/hello-world"!
+      <div> Hello "/screenshot/hello-world"!</div>
+      <div className="truncate max-w-[300px]">{x?.name}</div>
+      <div className="truncate max-w-[300px]">{user.accessToken}</div>
     </div>
   );
 }