fix: pass sandbox management auth from server

Author: ben-fornefeld

src/app/dashboard/[teamSlug]/sandboxes/[sandboxId]/filesystem/page.tsx

@@ -1,14 +1,49 @@
 import { cookies } from 'next/headers'
+import { redirect } from 'next/navigation'
 import { COOKIE_KEYS } from '@/configs/cookies'
+import { AUTH_URLS, PROTECTED_URLS } from '@/configs/urls'
+import { auth } from '@/core/server/auth'
+import { getTeamIdFromSlug } from '@/core/server/functions/team/get-team-id-from-slug'
+import { createSandboxManagementAuth } from '@/core/shared/sandbox-management-auth.server'
 import SandboxInspectView from '@/features/dashboard/sandbox/inspect/view'
 
 const DEFAULT_ROOT_PATH = '/home/user'
 
-export default async function SandboxInspectPage() {
-  const cookieStore = await cookies()
+interface SandboxInspectPageProps {
+  params: Promise<{
+    teamSlug: string
+  }>
+}
+
+export default async function SandboxInspectPage({
+  params,
+}: SandboxInspectPageProps) {
+  const [{ teamSlug }, cookieStore, authContext] = await Promise.all([
+    params,
+    cookies(),
+    auth.getAuthContext(),
+  ])
+
+  if (!authContext) {
+    redirect(AUTH_URLS.SIGN_IN)
+  }
+
+  const teamId = await getTeamIdFromSlug(teamSlug, authContext.accessToken)
+  if (!teamId.ok || !teamId.data) {
+    redirect(PROTECTED_URLS.DASHBOARD)
+  }
+
   const rootPath =
     cookieStore.get(COOKIE_KEYS.SANDBOX_INSPECT_ROOT_PATH)?.value ||
     DEFAULT_ROOT_PATH
 
-  return <SandboxInspectView rootPath={rootPath} />
+  return (
+    <SandboxInspectView
+      rootPath={rootPath}
+      sandboxManagementAuth={createSandboxManagementAuth(
+        authContext,
+        teamId.data
+      )}
+    />
+  )
 }

src/app/dashboard/[teamSlug]/team-gate.tsx

@@ -3,7 +3,7 @@
 import { useQuery } from '@tanstack/react-query'
 import { DASHBOARD_TEAMS_LIST_QUERY_OPTIONS } from '@/core/application/teams/queries'
 import { DASHBOARD_USER_PROFILE_QUERY_OPTIONS } from '@/core/application/user/queries'
-import type { AuthUser } from '@/core/server/auth'
+import type { AuthUser } from '@/core/shared/auth-user'
 import { DashboardContextProvider } from '@/features/dashboard/context'
 import LoadingLayout from '@/features/dashboard/loading-layout'
 import { useTRPC } from '@/trpc/client'

src/app/dashboard/terminal/page.tsx

@@ -11,6 +11,7 @@ import {
 import { auth } from '@/core/server/auth'
 import { resolveUserTeam } from '@/core/server/functions/team/resolve-user-team'
 import { infra } from '@/core/shared/clients/api'
+import { createSandboxManagementAuth } from '@/core/shared/sandbox-management-auth.server'
 import { SandboxIdSchema } from '@/core/shared/schemas/api'
 import DashboardTerminal from '@/features/dashboard/terminal/dashboard-terminal'
 import { normalizeTerminalTemplate } from '@/features/dashboard/terminal/template'
@@ -110,7 +111,10 @@ export default async function TerminalPage({
         initialCommand={command}
         initialSandboxId={terminalSandboxId}
         initialTemplate={terminalTemplate}
-        teamId={team.id}
+        sandboxManagementAuth={createSandboxManagementAuth(
+          authContext,
+          team.id
+        )}
       />
     </main>
   )

src/core/server/auth/index.ts

@@ -40,5 +40,5 @@ export function createAuthForHeaders(headers: Headers): AuthProvider {
     : createSupabaseAuthForHeaders(headers)
 }
 
+export type { AuthUser } from '@/core/shared/auth-user'
 export type { AuthAdmin } from './admin'
-export type { AuthUser } from './types'

src/core/server/auth/types.ts

@@ -1,12 +1,6 @@
-export type AuthUser = {
-  id: string
-  email: string | null
-  name: string | null
-  avatarUrl: string | null
-  providers: string[]
-  canChangeEmail: boolean
-  canChangePassword: boolean
-}
+import type { AuthUser } from '@/core/shared/auth-user'
+
+export type { AuthUser } from '@/core/shared/auth-user'
 
 export type AuthContext = {
   user: AuthUser

src/core/shared/auth-user.ts

@@ -0,0 +1,9 @@
+export type AuthUser = {
+  id: string
+  email: string | null
+  name: string | null
+  avatarUrl: string | null
+  providers: string[]
+  canChangeEmail: boolean
+  canChangePassword: boolean
+}

src/core/shared/sandbox-management-auth.server.ts

@@ -0,0 +1,15 @@
+import 'server-only'
+
+import { SUPABASE_AUTH_HEADERS } from '@/configs/api'
+import type { AuthContext } from '@/core/server/auth/types'
+import type { SandboxManagementAuth } from './sandbox-management-auth'
+
+export function createSandboxManagementAuth(
+  authContext: AuthContext,
+  teamId: string
+): SandboxManagementAuth {
+  return {
+    headers: SUPABASE_AUTH_HEADERS(authContext.accessToken, teamId),
+    userId: authContext.user.id,
+  }
+}

src/core/shared/sandbox-management-auth.ts

@@ -0,0 +1,4 @@
+export interface SandboxManagementAuth {
+  userId: string
+  headers: Record<string, string>
+}

src/features/dashboard/context.tsx

@@ -3,7 +3,7 @@
 import { createContext, type ReactNode, useContext, useEffect } from 'react'
 import { useDebounceCallback } from 'usehooks-ts'
 import type { TeamModel } from '@/core/modules/teams/models'
-import type { AuthUser } from '@/core/server/auth'
+import type { AuthUser } from '@/core/shared/auth-user'
 
 interface DashboardContextValue {
   team: TeamModel

src/features/dashboard/sandbox/inspect/context.tsx

@@ -1,7 +1,6 @@
 'use client'
 
 import Sandbox from 'e2b'
-import { useRouter } from 'next/navigation'
 import type { ReactNode } from 'react'
 import {
   createContext,
@@ -11,9 +10,7 @@ import {
   useMemo,
   useRef,
 } from 'react'
-import { SUPABASE_AUTH_HEADERS } from '@/configs/api'
-import { AUTH_URLS } from '@/configs/urls'
-import { supabase } from '@/core/shared/clients/supabase/client'
+import type { SandboxManagementAuth } from '@/core/shared/sandbox-management-auth'
 import { useSandboxInspectAnalytics } from '@/lib/hooks/use-analytics'
 import { getParentPath, normalizePath } from '@/lib/utils/filesystem'
 import { useDashboard } from '../../context'
@@ -34,11 +31,13 @@ const SandboxInspectContext = createContext<SandboxInspectContextValue | null>(
 interface SandboxInspectProviderProps {
   children: ReactNode
   rootPath: string
+  sandboxManagementAuth: SandboxManagementAuth
 }
 
 export default function SandboxInspectProvider({
   children,
   rootPath,
+  sandboxManagementAuth,
 }: SandboxInspectProviderProps) {
   const { team } = useDashboard()
   const teamId = team.id
@@ -47,7 +46,6 @@ export default function SandboxInspectProvider({
   const storeRef = useRef<FilesystemStore | null>(null)
   const sandboxManagerRef = useRef<SandboxManager | null>(null)
 
-  const router = useRouter()
   const { trackInteraction } = useSandboxInspectAnalytics()
 
   // ---------- synchronous store initialisation ----------
@@ -181,19 +179,12 @@ export default function SandboxInspectProvider({
       sandboxManagerRef.current.stopWatching()
     }
 
-    const { data } = await supabase.auth.getSession()
-
-    if (!data || !data.session) {
-      router.replace(AUTH_URLS.SIGN_IN)
-      return
-    }
-
     const sandbox = await Sandbox.connect(sandboxInfo.sandboxID, {
       domain: process.env.NEXT_PUBLIC_E2B_DOMAIN,
       // Keep inspect connections from extending sandbox TTL via SDK default connect timeout.
       timeoutMs: 1_000,
       headers: {
-        ...SUPABASE_AUTH_HEADERS(data.session.access_token, teamId),
+        ...sandboxManagementAuth.headers,
       },
     })
 
@@ -209,7 +200,7 @@ export default function SandboxInspectProvider({
       team_id: teamId,
       root_path: rootPath,
     })
-  }, [sandboxInfo, teamId, rootPath, trackInteraction, router])
+  }, [sandboxInfo, teamId, rootPath, trackInteraction, sandboxManagementAuth])
 
   // handle sandbox connection / disconnection
   useEffect(() => {