chore: load stars on client

apps/classroomio-com/src/lib/Navigation/Navigation.svelte

@@ -6,10 +6,10 @@
   import ForumIcon from 'carbon-icons-svelte/lib/Forum.svelte';
   import MapCenter from 'carbon-icons-svelte/lib/MapCenter.svelte';
   import TextAlignJustify from 'carbon-icons-svelte/lib/TextAlignJustify.svelte';
+  import { onMount } from 'svelte';
   import { fly } from 'svelte/transition';
 
-  export let stars = 0;
-
+  let stars = 0;
   let showDrawer = false;
   let showSolutions = false;
   let activeLink = '';
@@ -53,6 +53,20 @@
   $: activeLink = $page.url.pathname;
   $: activeHash = $page.url.hash;
   $: isSolutionsActive = solutions.some((s) => activeHash.includes(s.key));
+
+  async function setStars() {
+    try {
+      const response = await fetch('http://api.github.com/repos/classroomio/classroomio');
+      const data = await response.json();
+      stars = data?.stargazers_count || 0;
+    } catch (error) {
+      console.error('Error fetching GitHub stars:', error);
+    }
+  }
+
+  onMount(() => {
+    setStars();
+  });
 </script>
 
 <div
@@ -175,7 +189,7 @@
         <span
           class="text-sm text-gray-600 font-medium leading-none transition-colors duration-200 group-hover:text-black"
         >
-        {stars}
+          {stars}
         </span>
       </a>
     </div>

apps/classroomio-com/src/routes/+layout.server.ts

@@ -1,15 +0,0 @@
-export async function load({ fetch }) {
-    let githubStars = 0;
-  
-    try {
-      const response = await fetch('http://api.github.com/repos/classroomio/classroomio');
-      const data = await response.json();
-      githubStars = data?.stargazers_count || 0;
-    } catch (error) {
-      console.error('Error fetching GitHub stars:', error);
-    }
-  
-    return {
-      githubStars
-    };
-  }

apps/classroomio-com/src/routes/+layout.svelte

@@ -1,13 +1,13 @@
 <script>
+  import { dev } from '$app/environment';
   import { page } from '$app/stores';
-  import { MetaTags } from 'svelte-meta-tags';
-  import Navigation from '$lib/Navigation/Navigation.svelte';
   import Footer from '$lib/Footer/Footer.svelte';
-  import PageTransition from './transition.svelte';
+  import Navigation from '$lib/Navigation/Navigation.svelte';
   import NotFound from '$lib/NotFound/NotFound.svelte';
   import extend from 'just-extend';
-  import { dev } from '$app/environment';
   import { onMount } from 'svelte';
+  import { MetaTags } from 'svelte-meta-tags';
+  import PageTransition from './transition.svelte';
 
   import '../app.css';
 
@@ -25,7 +25,7 @@
 <MetaTags {...metaTags} />
 
 <div class="overflow-hidden bg-white">
-  <Navigation stars={data.githubStars} />
+  <Navigation />
 
   <PageTransition url={data.url}>
     {#if $page.status === 404}

apps/classroomio-com/src/routes/+layout.ts

@@ -2,11 +2,10 @@ import type { MetaTagsProps } from 'svelte-meta-tags';
 
 export const prerender = true;
 
-export function load({ url, data }) {
+export function load({ url }) {
   return {
     baseMetaTags: getBaseMetaTags(url),
-    url: url.pathname,
-		...data,
+    url: url.pathname
   };
 }