From 677cec3a7010f32b8376d574be85225575441b0a Mon Sep 17 00:00:00 2001
From: Andrew Smith <andrew@supabase.io>
Date: Sat, 4 Nov 2023 06:02:23 +0000
Subject: [PATCH] Update sveltekit ssr guide (#18716)

* Update sveltekit ssr guide

* run prettier

---------

Co-authored-by: Jon Meyers <jonathon.d.meyers@gmail.com>
---
 .../auth/server-side/creating-a-client.mdx    | 25 ++++++++++++++++---
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/apps/docs/pages/guides/auth/server-side/creating-a-client.mdx b/apps/docs/pages/guides/auth/server-side/creating-a-client.mdx
index b236ef0adb0..a2ca9e9b1d1 100644
--- a/apps/docs/pages/guides/auth/server-side/creating-a-client.mdx
+++ b/apps/docs/pages/guides/auth/server-side/creating-a-client.mdx
@@ -467,7 +467,7 @@ export const handle: Handle = async ({ event, resolve }) => {
 
 </TabPanel>
 
-<TabPanel id="layout" label="Layout Load">
+<TabPanel id="layout" label="Root Layout Load">
 
 <Admonition type="note">
 
@@ -478,7 +478,7 @@ Page components can get access to the supabase client from the `data` object due
 ```ts +layout.ts
 import { PUBLIC_SUPABASE_ANON_KEY, PUBLIC_SUPABASE_URL } from '$env/static/public'
 import type { LayoutLoad } from './$types'
-import { createBrowserClient, isBrowser, parse } from '@supabase/ssr'
+import { combineChunks, createBrowserClient, isBrowser, parse } from '@supabase/ssr'
 
 export const load: LayoutLoad = async ({ fetch, data, depends }) => {
   depends('supabase:auth')
@@ -493,8 +493,11 @@ export const load: LayoutLoad = async ({ fetch, data, depends }) => {
           return JSON.stringify(data.session)
         }
 
-        const cookie = parse(document.cookie)
-        return cookie[key]
+        const cookie = combineChunks(key, (name) => {
+          const cookies = parse(document.cookie)
+          return cookies[name]
+        })
+        return cookie
       },
     },
   })
@@ -509,6 +512,20 @@ export const load: LayoutLoad = async ({ fetch, data, depends }) => {
 
 </TabPanel>
 
+<TabPanel id="layout-server" label="Root Server Layout">
+
+```ts +layout.server.ts
+import type { LayoutServerLoad } from './$types'
+
+export const load: LayoutServerLoad = async ({ locals: { getSession } }) => {
+  return {
+    session: await getSession(),
+  }
+}
+```
+
+</TabPanel>
+
 <TabPanel id="page-component" label="Page Component">
 
 ```svelte +page.svelte