From 7b8ccb0e83c18475ecdfd1ef70285876cf96d425 Mon Sep 17 00:00:00 2001
From: Yuri Tatishchev <itatishch@gmail.com>
Date: Sat, 7 Feb 2026 21:13:15 -0800
Subject: [PATCH] refactor ClientOnly component to simplify a bit

---
 src/lib/components/util/ClientOnly.svelte | 15 +++++----------
 1 file changed, 5 insertions(+), 10 deletions(-)

diff --git a/src/lib/components/util/ClientOnly.svelte b/src/lib/components/util/ClientOnly.svelte
index 1fbe3c7..d5ce283 100644
--- a/src/lib/components/util/ClientOnly.svelte
+++ b/src/lib/components/util/ClientOnly.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
-	import { onMount } from "svelte";
+	import type { Snippet } from "svelte";
+	import { browser } from "$app/environment";
 
 	type ClientOnlyProps = {
 		/**
@@ -11,24 +12,18 @@
 		/**
 		 * Main content to render once mounted (client-only).
 		 */
-		children: import("svelte").Snippet;
+		children: Snippet;
 
 		/**
 		 * Optional fallback content to render during SSR / before mount.
 		 */
-		fallback?: import("svelte").Snippet;
+		fallback?: Snippet;
 	};
 
 	let { showFallback = true, children, fallback }: ClientOnlyProps = $props();
-
-	let mounted = $state(false);
-
-	onMount(() => {
-		mounted = true;
-	});
 </script>
 
-{#if mounted}
+{#if browser}
 	{@render children()}
 {:else if showFallback && fallback}
 	{@render fallback()}