fix: bug que al inicio no se cargaban los posts

src/lib/head/Header.svelte

@@ -50,13 +50,13 @@
 <header class="border-b bg-background/95 backdrop-blur">
 	<div class="mx-4 ms-2 flex h-12 items-center justify-between">
 		<div class="flex items-center">
-			<a data-sveltekit-preload-data={false} href="/" class="mr-6 flex items-center space-x-2">
+			<button class="mr-6 flex items-center space-x-2" onclick={() => (window.location.href = '/')}>
 				<Avatar
 					class="h-8 w-8 transform rounded-sm! transition-transform duration-300 ease-in-out hover:scale-130 hover:rotate-12"
 				>
 					<AvatarImage src="/x.png" alt="minix" />
 				</Avatar>
-			</a>
+			</button>
 			<!-- <nav class="me-2 items-center space-x-6 text-sm font-medium md:flex">
 				<ButtonTheme />
 			</nav> -->

src/lib/hooks/loadMorePosts.ts

@@ -1,5 +1,5 @@
 import { get } from 'svelte/store';
-import { page, loadingPosts, PAGE_SIZE } from '@/stores/posts';
+import { page, loadingPosts, PAGE_SIZE, resetPosts } from '@/stores/posts';
 import { appendPosts } from '@/stores/posts';
 import { getPosts } from './getPosts';
 

src/lib/stores/posts.ts

@@ -1,7 +1,7 @@
 import { writable } from 'svelte/store';
 import type { Post } from '../../types';
 
-export const posts = writable<Post[]>([]);
+export const posts = writable<Post[] | null>(null);
 export const loadingPosts = writable(false);
 export const page = writable(1);
 

src/routes/+page.svelte

@@ -20,6 +20,8 @@
 	let mensajeError = $state('');
 	let sentinel: HTMLDivElement;
 
+	$inspect($posts);
+
 	resetPosts();
 	$effect(() => {
 		loadMorePosts();
@@ -78,19 +80,13 @@
 			{/if}
 			<hr />
 
-			{#if $posts.length === 0 && $loadingPosts}
+			{#if $posts === null || $posts.length === 0}
 				<Card>
 					<Content class="flex items-center justify-center gap-2">
 						<Spinner class="h-10 w-10" />
 						<p>Cargando</p>
 					</Content>
 				</Card>
-			{:else if $posts.length === 0}
-				<Card>
-					<Content>
-						<p class="text-center leading-7">No hay Posts que mostrar</p>
-					</Content>
-				</Card>
 			{:else}
 				{#each $posts as post (post.id)}
 					<div transition:slide>
@@ -101,7 +97,7 @@
 		</div>
 		<div bind:this={sentinel} class="h-1"></div>
 
-		{#if $loadingPosts && $posts.length > 0}
+		{#if $loadingPosts && $posts!.length > 0}
 			<div class="flex justify-center py-4">
 				<Spinner />
 			</div>