From e728e67037bcf6fa43d4d79df23da16e7517699d Mon Sep 17 00:00:00 2001
From: Ewan Croft <git@ewancroft.uk>
Date: Wed, 5 Nov 2025 22:02:03 +0000
Subject: [PATCH] feat: implement fetch function injection for improved data
 fetching in AT Protocol services

---
 src/hooks.server.ts                     | 10 +++
 src/lib/components/layout/Footer.svelte | 22 ++----
 src/lib/services/atproto/agents.ts      | 91 +++++++++++++++++++------
 src/lib/services/atproto/fetch.ts       | 60 ++++++++++------
 src/lib/services/atproto/posts.ts       | 79 +++++++++++++--------
 src/routes/+layout.svelte               |  7 +-
 src/routes/+layout.ts                   | 22 +++++-
 src/routes/site/meta/+page.ts           |  6 +-
 8 files changed, 205 insertions(+), 92 deletions(-)
 create mode 100644 src/hooks.server.ts

diff --git a/src/hooks.server.ts b/src/hooks.server.ts
new file mode 100644
index 0000000..b2eaf55
--- /dev/null
+++ b/src/hooks.server.ts
@@ -0,0 +1,10 @@
+import type { Handle } from '@sveltejs/kit';
+
+export const handle: Handle = async ({ event, resolve }) => {
+	const response = await resolve(event, {
+		filterSerializedResponseHeaders: (name) => {
+			return name === 'content-type' || name.startsWith('x-');
+		}
+	});
+	return response;
+};
\ No newline at end of file
diff --git a/src/lib/components/layout/Footer.svelte b/src/lib/components/layout/Footer.svelte
index 7595ab0..8186664 100644
--- a/src/lib/components/layout/Footer.svelte
+++ b/src/lib/components/layout/Footer.svelte
@@ -1,10 +1,9 @@
 <script lang="ts">
-	import { onMount } from 'svelte';
-	import { fetchProfile, type ProfileData, fetchSiteInfo, type SiteInfoData } from '$lib/services/atproto';
+	import type { ProfileData, SiteInfoData } from '$lib/services/atproto';
 
-	let profile: ProfileData | null = null;
-	let siteInfo: SiteInfoData | null = null;
-	let loading = true;
+	export let profile: ProfileData | null = null;
+	export let siteInfo: SiteInfoData | null = null;
+	let loading = false;
 	let error: string | null = null;
 	let copyrightText: string;
 
@@ -32,18 +31,7 @@
 		}
 	}
 
-	onMount(async () => {
-		try {
-			[profile, siteInfo] = await Promise.all([
-				fetchProfile(),
-				fetchSiteInfo()
-			]);
-		} catch (err) {
-			error = err instanceof Error ? err.message : 'Failed to load data';
-		} finally {
-			loading = false;
-		}
-	});
+	// Data is provided by layout load; no client-side fetch here to avoid using window.fetch during navigation.
 </script>
 
 <footer
diff --git a/src/lib/services/atproto/agents.ts b/src/lib/services/atproto/agents.ts
index ad3a237..3c39f94 100644
--- a/src/lib/services/atproto/agents.ts
+++ b/src/lib/services/atproto/agents.ts
@@ -1,11 +1,42 @@
 import { AtpAgent } from '@atproto/api';
 import type { ResolvedIdentity } from './types';
 
+/**
+ * Creates an AtpAgent with optional fetch function injection
+ */
+export function createAgent(service: string, fetchFn?: typeof fetch): AtpAgent {
+  // If we have an injected fetch, wrap it to ensure we handle headers correctly
+  const wrappedFetch = fetchFn ? async (url: URL | RequestInfo, init?: RequestInit) => {
+    // Convert URL to string if needed
+    const urlStr = url instanceof URL ? url.toString() : url;
+    
+    // Make the request with the injected fetch
+    const response = await fetchFn(urlStr, init);
+
+    // Create a new response with the same body but add content-type if missing
+    const headers = new Headers(response.headers);
+    if (!headers.has('content-type')) {
+      headers.set('content-type', 'application/json');
+    }
+    
+    return new Response(response.body, {
+      status: response.status,
+      statusText: response.statusText,
+      headers
+    });
+  } : undefined;
+
+  return new AtpAgent({ 
+    service,
+    ...(wrappedFetch && { fetch: wrappedFetch })
+  });
+}
+
 // Primary Microcosm Constellation endpoint
-export const constellationAgent = new AtpAgent({ service: 'https://constellation.microcosm.blue' });
+export const constellationAgent = createAgent('https://constellation.microcosm.blue');
 
 // Default fallback agent for public Bluesky API calls
-export const defaultAgent = new AtpAgent({ service: 'https://public.api.bsky.app' });
+export const defaultAgent = createAgent('https://public.api.bsky.app');
 
 // Cached agents
 let resolvedAgent: AtpAgent | null = null;
@@ -14,11 +45,19 @@ let pdsAgent: AtpAgent | null = null;
 /**
  * Resolves a DID to find its PDS endpoint using Slingshot.
  */
-export async function resolveIdentity(did: string): Promise<ResolvedIdentity> {
+export async function resolveIdentity(
+	did: string,
+	fetchFn?: typeof fetch
+): Promise<ResolvedIdentity> {
 	console.info(`[Identity] Resolving DID: ${did}`);
-	
-	const response = await fetch(
-		`https://slingshot.microcosm.blue/xrpc/com.bad-example.identity.resolveMiniDoc?identifier=${encodeURIComponent(did)}`
+
+	// Prefer an injected fetch (from SvelteKit load), fall back to global fetch
+	const _fetch = fetchFn ?? globalThis.fetch;
+
+	const response = await _fetch(
+		`https://slingshot.microcosm.blue/xrpc/com.bad-example.identity.resolveMiniDoc?identifier=${encodeURIComponent(
+			did
+		)}`
 	);
 
 	if (!response.ok) {
@@ -26,8 +65,17 @@ export async function resolveIdentity(did: string): Promise<ResolvedIdentity> {
 		throw new Error(`Failed to resolve identifier via Slingshot: ${response.status} ${response.statusText}`);
 	}
 
-	console.debug(`[Identity] Raw response:`, await response.clone().text());
-	const data = await response.json();
+	// Some fetch implementations in Node (undici wrappers) can throw when calling Response.clone().
+	// Read the text once and parse it instead of cloning to avoid private field access errors.
+	const rawText = await response.text();
+	console.debug(`[Identity] Raw response:`, rawText);
+	let data: any;
+	try {
+		data = JSON.parse(rawText);
+	} catch (err) {
+		console.error('[Identity] Failed to parse identity resolver response as JSON', err);
+		throw err;
+	}
 
 	if (!data.did || !data.pds) {
 		throw new Error('Invalid response from identity resolver');
@@ -39,7 +87,7 @@ export async function resolveIdentity(did: string): Promise<ResolvedIdentity> {
 /**
  * Gets or creates an agent for the public Bluesky API with PDS fallback
  */
-export async function getPublicAgent(did: string): Promise<AtpAgent> {
+export async function getPublicAgent(did: string, fetchFn?: typeof fetch): Promise<AtpAgent> {
 	console.info(`[Agent] Getting public agent for DID: ${did}`);
 	if (resolvedAgent) {
 		console.debug('[Agent] Using cached agent');
@@ -60,11 +108,11 @@ export async function getPublicAgent(did: string): Promise<AtpAgent> {
 			console.warn('[Agent] Constellation endpoint unreachable:', constellationErr);
 		}
 
-		// Then try Slingshot for PDS resolution
-		console.info('[Agent] Attempting Slingshot resolution');
-		const resolved = await resolveIdentity(did);
+	// Then try Slingshot for PDS resolution
+	console.info('[Agent] Attempting Slingshot resolution');
+	const resolved = await resolveIdentity(did, fetchFn);
 		console.info(`[Agent] Resolved PDS endpoint: ${resolved.pds}`);
-		resolvedAgent = new AtpAgent({ service: resolved.pds });
+		resolvedAgent = createAgent(resolved.pds, fetchFn);
 		return resolvedAgent;
 	} catch (err) {
 		console.error('[Agent] All Microcosm endpoints failed, falling back to Bluesky:', err);
@@ -74,12 +122,12 @@ export async function getPublicAgent(did: string): Promise<AtpAgent> {
 }/**
  * Gets or creates a PDS-specific agent
  */
-export async function getPDSAgent(did: string): Promise<AtpAgent> {
+export async function getPDSAgent(did: string, fetchFn?: typeof fetch): Promise<AtpAgent> {
 	if (pdsAgent) return pdsAgent;
 
 	try {
-		const resolved = await resolveIdentity(did);
-		pdsAgent = new AtpAgent({ service: resolved.pds });
+		const resolved = await resolveIdentity(did, fetchFn);
+		pdsAgent = createAgent(resolved.pds, fetchFn);
 		return pdsAgent;
 	} catch (err) {
 		console.error('Failed to resolve PDS for DID:', err);
@@ -96,11 +144,16 @@ export async function getPDSAgent(did: string): Promise<AtpAgent> {
 export async function withFallback<T>(
 	did: string,
 	operation: (agent: AtpAgent) => Promise<T>,
-	usePDSFirst = false
+	usePDSFirst = false,
+	fetchFn?: typeof fetch
 ): Promise<T> {
+	const defaultAgentFn = () => fetchFn 
+		? createAgent('https://public.api.bsky.app', fetchFn) 
+		: Promise.resolve(defaultAgent);
+
 	const agents = usePDSFirst
-		? [() => getPDSAgent(did), () => Promise.resolve(defaultAgent)]
-		: [() => Promise.resolve(defaultAgent), () => getPDSAgent(did)];
+		? [() => getPDSAgent(did, fetchFn), defaultAgentFn]
+		: [defaultAgentFn, () => getPDSAgent(did, fetchFn)];
 
 	let lastError: any;
 
diff --git a/src/lib/services/atproto/fetch.ts b/src/lib/services/atproto/fetch.ts
index 8f7f573..f97a92f 100644
--- a/src/lib/services/atproto/fetch.ts
+++ b/src/lib/services/atproto/fetch.ts
@@ -6,7 +6,7 @@ import type { ProfileData, StatusData, SiteInfoData, LinkData } from './types';
 /**
  * Fetches user profile from AT Protocol
  */
-export async function fetchProfile(): Promise<ProfileData> {
+export async function fetchProfile(fetchFn?: typeof fetch): Promise<ProfileData> {
 	console.info('[Profile] Fetching profile data');
 	const cacheKey = `profile:${PUBLIC_ATPROTO_DID}`;
 	const cached = cache.get<ProfileData>(cacheKey);
@@ -18,11 +18,16 @@ export async function fetchProfile(): Promise<ProfileData> {
 	try {
 		console.info('[Profile] Cache miss, fetching from network');
 		// Profile data is public, try Bluesky API first, then PDS
-		const profile = await withFallback(PUBLIC_ATPROTO_DID, async (agent) => {
-			console.debug('[Profile] Attempting profile fetch with agent:', agent.service.toString());
-			const response = await agent.getProfile({ actor: PUBLIC_ATPROTO_DID });
-			return response.data;
-		});
+		const profile = await withFallback(
+			PUBLIC_ATPROTO_DID,
+			async (agent) => {
+				console.debug('[Profile] Attempting profile fetch with agent:', agent.service.toString());
+				const response = await agent.getProfile({ actor: PUBLIC_ATPROTO_DID });
+				return response.data;
+			},
+			false,
+			fetchFn
+		);
 
 		const data: ProfileData = {
 			did: profile.did,
@@ -49,7 +54,7 @@ export async function fetchProfile(): Promise<ProfileData> {
 /**
  * Fetches user status from custom lexicon
  */
-export async function fetchStatus(): Promise<StatusData | null> {
+export async function fetchStatus(fetchFn?: typeof fetch): Promise<StatusData | null> {
 	console.info('[Status] Fetching status data');
 	const cacheKey = `status:${PUBLIC_ATPROTO_DID}`;
 	const cached = cache.get<StatusData>(cacheKey);
@@ -71,7 +76,8 @@ export async function fetchStatus(): Promise<StatusData | null> {
 				});
 				return response.data.records;
 			},
-			true
+			true,
+			fetchFn
 		); // usePDSFirst = true
 
 		if (records.length === 0) return null;
@@ -93,27 +99,40 @@ export async function fetchStatus(): Promise<StatusData | null> {
 /**
  * Fetches site information from custom lexicon
  */
-export async function fetchSiteInfo(): Promise<SiteInfoData | null> {
+export async function fetchSiteInfo(fetchFn?: typeof fetch): Promise<SiteInfoData | null> {
 	const cacheKey = `siteinfo:${PUBLIC_ATPROTO_DID}`;
 	const cached = cache.get<SiteInfoData>(cacheKey);
 	if (cached) return cached;
 
 	try {
 		// Custom collection, prefer PDS first
-		const value = await withFallback(
+		const result = await withFallback(
 			PUBLIC_ATPROTO_DID,
 			async (agent) => {
-				const response = await agent.com.atproto.repo.getRecord({
-					repo: PUBLIC_ATPROTO_DID,
-					collection: 'uk.ewancroft.site.info',
-					rkey: 'self'
-				});
-				return response.data.value;
+				try {
+					const response = await agent.com.atproto.repo.getRecord({
+						repo: PUBLIC_ATPROTO_DID,
+						collection: 'uk.ewancroft.site.info',
+						rkey: 'self'
+					});
+					return response.data;
+				} catch (err: any) {
+					// If record not found, return null instead of throwing
+					if (err.error === 'RecordNotFound') {
+						return null;
+					}
+					throw err;
+				}
 			},
-			true
+			true,
+			fetchFn
 		); // usePDSFirst = true
 
-		const data = value as SiteInfoData;
+		if (!result || !result.value) {
+			return null;
+		}
+
+		const data = result.value as SiteInfoData;
 		cache.set(cacheKey, data);
 		return data;
 	} catch (error) {
@@ -125,7 +144,7 @@ export async function fetchSiteInfo(): Promise<SiteInfoData | null> {
 /**
  * Fetches links from Linkat board
  */
-export async function fetchLinks(): Promise<LinkData | null> {
+export async function fetchLinks(fetchFn?: typeof fetch): Promise<LinkData | null> {
 	const cacheKey = `links:${PUBLIC_ATPROTO_DID}`;
 	const cached = cache.get<LinkData>(cacheKey);
 	if (cached) return cached;
@@ -142,7 +161,8 @@ export async function fetchLinks(): Promise<LinkData | null> {
 				});
 				return response.data.value;
 			},
-			true
+			true,
+			fetchFn
 		); // usePDSFirst = true
 
 		// Validate the response has the expected structure
diff --git a/src/lib/services/atproto/posts.ts b/src/lib/services/atproto/posts.ts
index 1593928..919a6af 100644
--- a/src/lib/services/atproto/posts.ts
+++ b/src/lib/services/atproto/posts.ts
@@ -1,6 +1,6 @@
 import { PUBLIC_ATPROTO_DID } from '$env/static/public';
 import { cache } from './cache';
-import { withFallback, defaultAgent } from './agents';
+import { withFallback, defaultAgent, createAgent } from './agents';
 import { resolveIdentity } from './agents';
 import { buildPdsBlobUrl } from './media';
 import { fetchAllEngagement } from './engagement';
@@ -17,7 +17,7 @@ import type {
 /**
  * Fetches all Leaflet publications for a user
  */
-export async function fetchLeafletPublications(): Promise<LeafletPublicationsData> {
+export async function fetchLeafletPublications(fetchFn?: typeof fetch): Promise<LeafletPublicationsData> {
 	console.info('[Leaflet] Fetching publications');
 	const cacheKey = `leaflet:publications:${PUBLIC_ATPROTO_DID}`;
 	const cached = cache.get<LeafletPublicationsData>(cacheKey);
@@ -41,7 +41,8 @@ export async function fetchLeafletPublications(): Promise<LeafletPublicationsDat
 				});
 				return response.data.records;
 			},
-			true
+			true,
+			fetchFn
 		);
 
 		for (const pubRecord of publicationsRecords) {
@@ -54,7 +55,7 @@ export async function fetchLeafletPublications(): Promise<LeafletPublicationsDat
 				uri: pubRecord.uri,
 				basePath: pubValue.base_path,
 				description: pubValue.description,
-				icon: pubValue.icon ? await getBlobUrl(pubValue.icon) : undefined
+				icon: pubValue.icon ? await getBlobUrl(pubValue.icon, fetchFn) : undefined
 			});
 		}
 
@@ -70,12 +71,12 @@ export async function fetchLeafletPublications(): Promise<LeafletPublicationsDat
 /**
  * Helper function to get a blob URL for Leaflet publication icons
  */
-async function getBlobUrl(blob: any): Promise<string | undefined> {
+async function getBlobUrl(blob: any, fetchFn?: typeof fetch): Promise<string | undefined> {
 	try {
 		const cid = blob.ref?.$link || blob.cid;
 		if (!cid) return undefined;
 
-		const resolved = await resolveIdentity(PUBLIC_ATPROTO_DID);
+		const resolved = await resolveIdentity(PUBLIC_ATPROTO_DID, fetchFn);
 		return buildPdsBlobUrl(resolved.pds, PUBLIC_ATPROTO_DID, cid);
 	} catch (error) {
 		console.warn('Failed to resolve blob URL:', error);
@@ -87,7 +88,7 @@ async function getBlobUrl(blob: any): Promise<string | undefined> {
  * Fetches blog posts from both WhiteWind and Leaflet sources
  * Now supports multiple Leaflet publications
  */
-export async function fetchBlogPosts(): Promise<BlogPostsData> {
+export async function fetchBlogPosts(fetchFn?: typeof fetch): Promise<BlogPostsData> {
 	const cacheKey = `blogposts:${PUBLIC_ATPROTO_DID}`;
 	const cached = cache.get<BlogPostsData>(cacheKey);
 	if (cached) return cached;
@@ -106,7 +107,8 @@ export async function fetchBlogPosts(): Promise<BlogPostsData> {
 				});
 				return response.data.records;
 			},
-			true
+			true,
+			fetchFn
 		);
 
 		for (const record of whiteWindRecords) {
@@ -132,7 +134,7 @@ export async function fetchBlogPosts(): Promise<BlogPostsData> {
 	// Fetch Leaflet publications and documents
 	try {
 		// Get all publications first
-		const publicationsData = await fetchLeafletPublications();
+	const publicationsData = await fetchLeafletPublications(fetchFn);
 		const publicationsMap = new Map<string, LeafletPublication>();
 		for (const pub of publicationsData.publications) {
 			publicationsMap.set(pub.uri, pub);
@@ -149,7 +151,8 @@ export async function fetchBlogPosts(): Promise<BlogPostsData> {
 				});
 				return response.data.records;
 			},
-			true
+			true,
+			fetchFn
 		);
 
 		for (const record of leafletDocsRecords) {
@@ -201,7 +204,7 @@ export async function fetchBlogPosts(): Promise<BlogPostsData> {
 /**
  * Fetches the latest Bluesky post (including replies and reposts)
  */
-export async function fetchLatestBlueskyPost(): Promise<BlueskyPost | null> {
+export async function fetchLatestBlueskyPost(fetchFn?: typeof fetch): Promise<BlueskyPost | null> {
 	console.log('[fetchLatestBlueskyPost] Starting fetch...');
 	const cacheKey = `blueskypost:latest:${PUBLIC_ATPROTO_DID}`;
 	const cached = cache.get<BlueskyPost>(cacheKey);
@@ -212,11 +215,18 @@ export async function fetchLatestBlueskyPost(): Promise<BlueskyPost | null> {
 
 	try {
 		console.log('[fetchLatestBlueskyPost] Fetching author feed...');
-		// Use getAuthorFeed to get posts AND reposts in chronological order
-		const feedResponse = await defaultAgent.getAuthorFeed({
-			actor: PUBLIC_ATPROTO_DID,
-			limit: 5
-		});
+		// Use withFallback to get posts AND reposts in chronological order
+		const feedResponse = await withFallback(
+			PUBLIC_ATPROTO_DID,
+			async (agent) => {
+				return agent.getAuthorFeed({
+					actor: PUBLIC_ATPROTO_DID,
+					limit: 5
+				});
+			},
+			false,
+			fetchFn
+		);
 
 		const feed = feedResponse.data.feed;
 		console.log('[fetchLatestBlueskyPost] Feed items fetched:', feed.length);
@@ -249,7 +259,7 @@ export async function fetchLatestBlueskyPost(): Promise<BlueskyPost | null> {
 		}
 		
 		// Fetch the full post data
-		const post = await fetchPostFromUri(latestPostData.uri, 0);
+		const post = await fetchPostFromUri(latestPostData.uri, 0, fetchFn);
 		
 		if (!post) {
 			console.warn('[fetchLatestBlueskyPost] fetchPostFromUri returned null');
@@ -277,7 +287,11 @@ export async function fetchLatestBlueskyPost(): Promise<BlueskyPost | null> {
 /**
  * Recursively fetches a Bluesky post by URI, supporting quoted posts up to 2 levels deep
  */
-export async function fetchPostFromUri(uri: string, depth: number): Promise<BlueskyPost | null> {
+export async function fetchPostFromUri(
+	uri: string, 
+	depth: number, 
+	fetchFn?: typeof fetch
+): Promise<BlueskyPost | null> {
 	console.log(`[fetchPostFromUri] Starting fetch at depth ${depth} for URI:`, uri);
 
 	if (depth >= 3) {
@@ -287,7 +301,14 @@ export async function fetchPostFromUri(uri: string, depth: number): Promise<Blue
 
 	try {
 		console.log(`[fetchPostFromUri] Fetching post thread from Bluesky API...`);
-		const threadResponse = await defaultAgent.getPostThread({ uri, depth: 0 });
+		const threadResponse = await withFallback(
+			PUBLIC_ATPROTO_DID,
+			async (agent) => {
+				return agent.getPostThread({ uri, depth: 0 });
+			},
+			false,
+			fetchFn
+		);
 
 		if (!threadResponse.data.thread || !('post' in threadResponse.data.thread)) {
 			console.warn(`[fetchPostFromUri] No valid thread data found for URI:`, uri);
@@ -434,13 +455,13 @@ export async function fetchPostFromUri(uri: string, depth: number): Promise<Blue
 			const quotedRecord = embed.record?.record || embed.record;
 			console.log(`[fetchPostFromUri] Quoted record in recordWithMedia:`, quotedRecord?.uri);
 			if (quotedRecord && typeof quotedRecord.uri === 'string') {
-				quotedPostUri = quotedRecord.uri;
-				console.log(
-					`[fetchPostFromUri] Recursively fetching quoted post at depth ${depth + 1}:`,
-					quotedPostUri
-				);
-				if (quotedPostUri) {
-					quotedPost = (await fetchPostFromUri(quotedPostUri, depth + 1)) ?? undefined;
+					quotedPostUri = quotedRecord.uri;
+					console.log(
+						`[fetchPostFromUri] Recursively fetching quoted post at depth ${depth + 1}:`,
+						quotedPostUri
+					);
+					if (quotedPostUri) {
+						quotedPost = (await fetchPostFromUri(quotedPostUri, depth + 1, fetchFn)) ?? undefined;
 					console.log(`[fetchPostFromUri] Quoted post fetched:`, quotedPost ? 'success' : 'failed');
 				}
 			}
@@ -458,7 +479,7 @@ export async function fetchPostFromUri(uri: string, depth: number): Promise<Blue
 					quotedPostUri
 				);
 				if (quotedPostUri) {
-					quotedPost = (await fetchPostFromUri(quotedPostUri, depth + 1)) ?? undefined;
+					quotedPost = (await fetchPostFromUri(quotedPostUri, depth + 1, fetchFn)) ?? undefined;
 					console.log(`[fetchPostFromUri] Quoted post fetched:`, quotedPost ? 'success' : 'failed');
 				}
 			}
@@ -470,10 +491,10 @@ export async function fetchPostFromUri(uri: string, depth: number): Promise<Blue
 		if (value.reply) {
 			console.log(`[fetchPostFromUri] Post is a reply, fetching parent...`);
 			if (value.reply.parent?.uri) {
-				replyParent = (await fetchPostFromUri(value.reply.parent.uri, depth + 1)) ?? undefined;
+				replyParent = (await fetchPostFromUri(value.reply.parent.uri, depth + 1, fetchFn)) ?? undefined;
 			}
 			if (value.reply.root?.uri && value.reply.root.uri !== value.reply.parent?.uri) {
-				replyRoot = (await fetchPostFromUri(value.reply.root.uri, depth + 1)) ?? undefined;
+				replyRoot = (await fetchPostFromUri(value.reply.root.uri, depth + 1, fetchFn)) ?? undefined;
 			}
 		}
 
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 58e8c23..7f4970b 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -3,6 +3,7 @@
 	import { Header, Footer, ScrollToTop } from '$lib/components/layout';
 	import { MetaTags } from '$lib/components/seo';
 	import { createSiteMeta, type SiteMetadata } from '$lib/helper/siteMeta';
+	import type { ProfileData, SiteInfoData } from '$lib/services/atproto';
 	import type { Snippet } from 'svelte';
 	import { onMount } from 'svelte';
 
@@ -10,6 +11,8 @@
 		data: {
 			siteMeta: SiteMetadata;
 			meta?: Partial<SiteMetadata>;
+			profile?: ProfileData | null;
+			siteInfo?: SiteInfoData | null;
 		};
 		children: Snippet;
 	}
@@ -75,11 +78,11 @@
 
 <div class="flex min-h-screen flex-col overflow-x-hidden bg-canvas-50 text-ink-900 dark:bg-canvas-950 dark:text-ink-50">
 	<Header />
-	
+    
 	<main class="container mx-auto flex-grow px-4 py-8">
 		<ScrollToTop />
 		{@render children()}
 	</main>
 
-	<Footer />
+	<Footer profile={data.profile} siteInfo={data.siteInfo} />
 </div>
diff --git a/src/routes/+layout.ts b/src/routes/+layout.ts
index 1a02308..da231a0 100644
--- a/src/routes/+layout.ts
+++ b/src/routes/+layout.ts
@@ -1,7 +1,8 @@
 import type { LayoutLoad } from './$types';
 import { createSiteMeta, type SiteMetadata, defaultSiteMeta } from '$lib/helper/siteMeta';
+import { fetchProfile, fetchSiteInfo } from '$lib/services/atproto';
 
-export const load: LayoutLoad = async ({ url }) => {
+export const load: LayoutLoad = async ({ url, fetch }) => {
 	// Provide the default site metadata
 	const siteMeta: SiteMetadata = createSiteMeta({
 		title: defaultSiteMeta.title,
@@ -9,5 +10,22 @@ export const load: LayoutLoad = async ({ url }) => {
 		url: url.href // Include current URL for proper OG tags
 	});
 
-	return { siteMeta };
+	// Fetch lightweight public data for layout using injected fetch
+	let profile = null;
+	let siteInfo = null;
+
+	try {
+		profile = await fetchProfile(fetch);
+	} catch (err) {
+		// Non-fatal: layout should still render even if profile fails
+		console.warn('Layout: failed to fetch profile in load', err);
+	}
+
+	try {
+		siteInfo = await fetchSiteInfo(fetch);
+	} catch (err) {
+		console.warn('Layout: failed to fetch siteInfo in load', err);
+	}
+
+	return { siteMeta, profile, siteInfo };
 };
diff --git a/src/routes/site/meta/+page.ts b/src/routes/site/meta/+page.ts
index 6effe61..7c6b686 100644
--- a/src/routes/site/meta/+page.ts
+++ b/src/routes/site/meta/+page.ts
@@ -3,14 +3,14 @@ import { fetchSiteInfo, type SiteInfoData } from '$lib/services/atproto';
 import { createSiteMeta, type SiteMetadata, defaultSiteMeta } from '$lib/helper/siteMeta';
 import { ogImages } from '$lib/helper/ogImages';
 
-export const load: PageLoad = async ({ parent }) => {
+export const load: PageLoad = async ({ parent, fetch }) => {
   const { siteMeta } = await parent();
 
   let siteInfo: SiteInfoData | null = null;
   let error: string | null = null;
 
-  try {
-    siteInfo = await fetchSiteInfo();
+    try {
+    siteInfo = await fetchSiteInfo(fetch);
   } catch (err) {
     error = err instanceof Error ? err.message : 'Failed to load site information';
   }
-- 
2.51.2