mirror of
https://github.com/supabase/supabase.git
synced 2026-09-22 13:37:53 +08:00
ac714e81ba
## Summary TanStack Start's quickstart only ever wired up an anonymous `supabase-js` client — no cookies, no `@supabase/ssr`, no auth. This ports the real `@supabase/ssr` client/server split and password-based auth flow (already shipped in `apps/ui-library`) into the quickstart and adds a matching tab to the SSR guide. ## Where this changed - `apps/docs/content/guides/getting-started/quickstarts/tanstack.mdx` — quickstart now installs the cookie-based auth flow via the Supabase UI Library registry and queries data through the SSR-aware server client. - `apps/docs/content/guides/auth/server-side/creating-a-client.mdx` — new TanStack Start tab (client/server setup + protecting routes). - `examples/auth/tanstack/` (new) — source files backing the `$CodeSample` snippets above, ported from `apps/ui-library`'s registry. ## Test plan - [x] Scaffolded a real TanStack Start app and ran the quickstart commands end-to-end - [x] Confirmed SSR loader + protected-route redirect work as documented - [x] `pnpm lint:mdx` and `pnpm build:guides-markdown` pass <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added TanStack Start SSR setup examples for Supabase, including browser and server client helpers with cookie-based session support. * Included a protected route example that checks authentication on the server and redirects unauthenticated users to the login page. * Added a server-side claims fetch helper for authorization checks. * **Documentation** * Expanded the “creating a client” guide with TanStack Start-specific route protection and environment variable examples. * Updated the TanStack Start quickstart to use the official CLI and refined server-side authorization guidance. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
32 lines
849 B
TypeScript
32 lines
849 B
TypeScript
import { createServerClient } from '@supabase/ssr'
|
|
import { getCookies, setCookie, setResponseHeader } from '@tanstack/react-start/server'
|
|
|
|
export function createClient() {
|
|
return createServerClient(
|
|
process.env.VITE_SUPABASE_URL!,
|
|
process.env.VITE_SUPABASE_PUBLISHABLE_KEY!,
|
|
{
|
|
cookies: {
|
|
getAll() {
|
|
return Object.entries(getCookies()).map(
|
|
([name, value]) =>
|
|
({
|
|
name,
|
|
value,
|
|
}) as { name: string; value: string }
|
|
)
|
|
},
|
|
setAll(cookies, headers) {
|
|
cookies.forEach(({ name, value, options }) => {
|
|
setCookie(name, value, options)
|
|
})
|
|
|
|
Object.entries(headers).forEach(([name, value]) => {
|
|
setResponseHeader(name, value)
|
|
})
|
|
},
|
|
},
|
|
}
|
|
)
|
|
}
|