refactor: cleanup skeleton, setup supabase properly

src/routes/+layout.ts

@@ -0,0 +1,44 @@
+import { createBrowserClient, createServerClient, isBrowser } from "@supabase/ssr";
+import { PUBLIC_SUPABASE_ANON_KEY, PUBLIC_SUPABASE_URL } from "$env/static/public";
+import type { Database } from "$lib/database";
+import type { LayoutLoad } from "./$types";
+
+export const load: LayoutLoad = async ({ data, depends, fetch }) => {
+    /**
+     * Declare a dependency so the layout can be invalidated, for example, on
+     * session refresh.
+     */
+    depends("supabase:auth");
+
+    const supabase = isBrowser()
+        ? createBrowserClient<Database>(PUBLIC_SUPABASE_URL, PUBLIC_SUPABASE_ANON_KEY, {
+              global: {
+                  fetch
+              }
+          })
+        : createServerClient<Database>(PUBLIC_SUPABASE_URL, PUBLIC_SUPABASE_ANON_KEY, {
+              global: {
+                  fetch
+              },
+              cookies: {
+                  getAll() {
+                      return data.cookies;
+                  }
+              }
+          });
+
+    /**
+     * It's fine to use `getSession` here, because on the client, `getSession` is
+     * safe, and on the server, it reads `session` from the `LayoutData`, which
+     * safely checked the session using `safeGetSession`.
+     */
+    const {
+        data: { session }
+    } = await supabase.auth.getSession();
+
+    const {
+        data: { user }
+    } = await supabase.auth.getUser();
+
+    return { session, supabase, user };
+};