refactor: migrate to Svelte 5

use runes ($props, $state, $derived, $effect, etc)

apps/website/src/routes/(site)/subscribe/+page.svelte

@@ -4,7 +4,6 @@
 
 <script lang="ts">
     import { navigating } from '$app/stores'
-    import { onMount } from 'svelte'
     import { stagger, timeline } from 'motion'
     import { DELAY } from '$utils/constants'
     import { quartOut } from '$animations/easings'
@@ -15,13 +14,12 @@
     import NewsletterIssue from '$components/molecules/NewsletterIssue/NewsletterIssue.svelte'
     import InteractiveGlobe from '$components/organisms/InteractiveGlobe/InteractiveGlobe.svelte'
 
-    export let data
+    let { data } = $props()
 
-    const { issues } = data
-    const latestIssue = issues[0]
+    const latestIssue = $derived(data.issues[0])
 
 
-    onMount(() => {
+    $effect(() => {
         /**
          * Animations
          */
@@ -79,10 +77,10 @@
             <NewsletterIssue size="large" date={latestIssue.date_sent} {...latestIssue} />
         </div>
 
-        {#if issues.length > 1}
+        {#if data.issues.length > 1}
             <h2 class="title-small">Past Issues</h2>
             <ul>
-                {#each issues.slice(1) as { issue, title, date_sent: date, link, thumbnail }}
+                {#each data.issues.slice(1) as { issue, title, date_sent: date, link, thumbnail }}
                     <li class="issue-container">
                         <NewsletterIssue {issue} {title} {link} {thumbnail} {date} />
                     </li>