GPT

Correct Root Configuration

// app/root.tsx import { json, type LoaderFunctionArgs } from '@remix-run/node' import { useLoaderData, useRevalidator } from '@remix-run/react' import { createBrowserClient } from '@supabase/auth-helpers-remix' import {

Prompt text

Original English text. Replace placeholders with your own details.

// app/root.tsx
import { json, type LoaderFunctionArgs } from '@remix-run/node'
import { useLoaderData, useRevalidator } from '@remix-run/react'
import { createBrowserClient } from '@supabase/auth-helpers-remix'
import { useState, useEffect } from 'react'
import type { Database } from '~/types/supabase'
import { createSupabaseServerClient } from '~/utils/supabase.server'

export async function loader({ request }: LoaderFunctionArgs) {
 const response = new Response()
 const supabase = createSupabaseServerClient({ request, response })
 const { data: { session } } = await supabase.auth.getSession()

 return json(
 {
 session,
 env: {
 SUPABASE_URL: process.env.SUPABASE_URL!,
 SUPABASE_ANON_KEY: process.env.SUPABASE_ANON_KEY!
 }
 },
 { headers: response.headers }
 )
}

export default function Root() {
 const { env, session } = useLoaderData<typeof loader>()
 const revalidator = useRevalidator()
 
 const [supabase] = useState(() =>
 createBrowserClient<Database>(env.SUPABASE_URL, env.SUPABASE_ANON_KEY)
 )

 useEffect(() => {
 const {
 data: { subscription }
 } = supabase.auth.onAuthStateChange((event, session) => {
 if (session?.access_token !== session?.access_token) {
 revalidator.revalidate()
 }
 })

 return () => subscription.unsubscribe()
 }, [supabase, revalidator])

 return (
 <html lang="en">
 <head>
 <Meta />
 <Links />
 </head>
 <body>
 <Outlet context={{ supabase, session }} />
 <ScrollRestoration />
 <Scripts />
 <LiveReload />
 </body>
 </html>
 )
}

Source & attribution

Instructa AI Prompts · Instructa AI Prompts

Source-listed license: CC-BY-4.0. Prompt text is preserved; titles and previews may be shortened for display. Source examples are not NexGateHub test results.

View original source ↗ · Source credits & licenses

Explore more prompts →