<script lang="ts">
  import { resolve } from '$app/paths';
  import type { PageProps } from '../_/$types';
  import { browser } from '$app/environment';
  import { onMount, tick } from 'svelte';
  import { goto } from '$app/navigation';

  let { data }: PageProps = $props();
  let posts = $derived(Object.entries(data.posts));
  onMount(() => {
    requestAnimationFrame(() => goto(resolve('/blog/')));
    tick().then(() => goto(resolve('/blog/')));
  });
</script>

{#if !browser}
  {#each posts as a}
    <!-- svelte-ignore a11y_consider_explicit_label -->
    <a
      href={resolve('/blog/[id=int]-[slug]', {
        id: a[1].metadata.id.toString(),
        slug: a[1].metadata.slug,
      })}
    ></a>
    <!-- svelte-ignore a11y_consider_explicit_label -->
    <a
      href={resolve('/blog/[id=int]', {
        id: a[1].metadata.id.toString(),
      })}
    ></a>
  {/each}
{/if}
