diff --git a/surfsense_web/app/layout.tsx b/surfsense_web/app/layout.tsx
index f679bd968..9ba06c04d 100644
--- a/surfsense_web/app/layout.tsx
+++ b/surfsense_web/app/layout.tsx
@@ -4,6 +4,7 @@ import { RootProvider } from "fumadocs-ui/provider/next";
 import { Roboto } from "next/font/google";
 import { AnnouncementToastProvider } from "@/components/announcements/AnnouncementToastProvider";
 import { GlobalLoadingProvider } from "@/components/providers/GlobalLoadingProvider";
+import { ZeroProvider } from "@/components/providers/ZeroProvider";
 import { I18nProvider } from "@/components/providers/I18nProvider";
 import { PostHogProvider } from "@/components/providers/PostHogProvider";
 import { ThemeProvider } from "@/components/theme/theme-provider";
@@ -140,7 +141,9 @@ export default function RootLayout({
 							>
 								<RootProvider>
 								<ReactQueryClientProvider>
-									<GlobalLoadingProvider>{children}</GlobalLoadingProvider>
+									<ZeroProvider>
+										<GlobalLoadingProvider>{children}</GlobalLoadingProvider>
+									</ZeroProvider>
 								</ReactQueryClientProvider>
 									<Toaster />
 									<AnnouncementToastProvider />
diff --git a/surfsense_web/components/providers/ZeroProvider.tsx b/surfsense_web/components/providers/ZeroProvider.tsx
new file mode 100644
index 000000000..5e20e9cda
--- /dev/null
+++ b/surfsense_web/components/providers/ZeroProvider.tsx
@@ -0,0 +1,21 @@
+"use client";
+
+import { currentUserAtom } from "@/atoms/user/user-query.atoms";
+import { queries } from "@/zero/queries";
+import { schema } from "@/zero/schema";
+import { ZeroProvider as ZeroReactProvider } from "@rocicorp/zero/react";
+import { useAtomValue } from "jotai";
+
+const cacheURL = process.env.NEXT_PUBLIC_ZERO_CACHE_URL || "http://localhost:4848";
+
+export function ZeroProvider({ children }: { children: React.ReactNode }) {
+	const { data: user } = useAtomValue(currentUserAtom);
+	const userID = user?.id ? String(user.id) : "";
+	const context = user?.id ? { userId: String(user.id) } : undefined;
+
+	return (
+		<ZeroReactProvider {...{ userID, context, cacheURL, schema, queries }}>
+			{children}
+		</ZeroReactProvider>
+	);
+}