Prevented flash on page load.

src/routes/+layout.server.ts

@@ -1,6 +1,7 @@
 /** @type {import('./$types').LayoutServerLoad} */
 export async function load({ locals }) {
 	return {
-		session: locals.session
+		session: locals.session,
+		user: locals.user
 	};
 }

src/routes/org/[orgid]/+layout.server.ts

@@ -1,11 +1,16 @@
 import OrganizationsDB, { type OrganizationPayload } from '$database/OrganizationsDB';
+import type { User } from '@supabase/supabase-js';
 
 /** @type {import('./$types').LayoutServerLoad} */
-export async function load({ params, locals }): Promise<{ payload: OrganizationPayload | null }> {
+export async function load({
+	params,
+	locals
+}): Promise<{ payload: OrganizationPayload | null; user: User | null }> {
 	/** Get the serializable organization payload from the database */
 	const org = await new OrganizationsDB(locals.supabase).getPayload(params.orgid);
 
 	return {
-		payload: org
+		payload: org,
+		user: locals.user
 	};
 }

src/routes/org/[orgid]/+layout.svelte

@@ -1,20 +1,19 @@
 <script lang="ts">
 	import Oops from '$lib/Oops.svelte';
 	import Title from '$lib/Title.svelte';
-	import { OrgSymbol, getDB, getUser } from '$lib/contexts';
+	import { OrgSymbol, getDB } from '$lib/contexts';
 	import { onMount, setContext } from 'svelte';
 	import { page } from '$app/stores';
 
 	export let data;
 
+	$: ({ payload, user } = data);
+
 	const db = getDB();
-	const user = getUser();
 
 	// Save the payload in the database cache.
-	$: payload = data.payload;
 	$: org = data.payload ? $db.updateOrg(data.payload) : undefined;
 	$: if (payload) setContext(OrgSymbol, org);
-
 	onMount(() => {
 		// When this layout mounts, listen to realtime changes on the organization payload.
 		const orgid = $page.params.orgid;
@@ -28,9 +27,10 @@
 </script>
 
 {#if $org}
-	{#if $org.getVisibility() === 'public' || ($user && $org.getVisibility() === 'org' && $org.hasPerson($user.id)) || ($user && $org.getVisibility() === 'admin' && $org.hasAdminPerson($user.id))}
+	{#if $org.getVisibility() === 'public' || (user && (($org.getVisibility() === 'org' && $org.hasPerson(user.id)) || ($org.getVisibility() === 'admin' && $org.hasAdminPerson(user.id))))}
 		<slot />
 	{:else}
+		<Title title="Oops" kind="organization" />
 		<Oops text="This organization's details aren't visible to you." />
 	{/if}
 {:else}