enh: make promo banner pull from latest blog post

packages/dashboard/src/routes/(static)/blog/+page.md

@@ -1,11 +1,9 @@
-### [YouTube Dev Channel is Live](/blog/announcing-dev-channel)
+<script lang="ts">
+  import { toc } from './toc'
+</script>
 
-### [Moving to a hard paywall](/blog/hard-paywall)
+{#each toc as item}
 
-### [Why no SLA?](/blog/why-no-sla)
+## [{item.title}]({item.path})
 
-### [PocketHost is live in 40+ countries](/blog/live-in-40-countries)
-
-### [Announcing Pocker](/blog/announcing-pocker)
-
-### [What's Next For PocketBase (Early Morning Dev Round 1)](/blog/early-morning-dev-1)
+{/each}

packages/dashboard/src/routes/(static)/blog/toc.ts

@@ -0,0 +1,26 @@
+export const toc = [
+  {
+    title: 'YouTube Dev Channel is Live',
+    path: '/blog/announcing-dev-channel',
+  },
+  {
+    title: 'Moving to a hard paywall',
+    path: '/blog/hard-paywall',
+  },
+  {
+    title: 'Why no SLA?',
+    path: '/blog/why-no-sla',
+  },
+  {
+    title: 'PocketHost is live in 40+ countries',
+    path: '/blog/live-in-40-countries',
+  },
+  {
+    title: 'Announcing Pocker',
+    path: '/blog/announcing-pocker',
+  },
+  {
+    title: "What's Next For PocketBase (Early Morning Dev Round 1)",
+    path: '/blog/early-morning-dev-1',
+  },
+]

packages/dashboard/src/routes/Navbar/Navbar.svelte

@@ -6,6 +6,7 @@
     faDiscord,
     faGithub,
     faProductHunt,
+    faYoutube,
   } from '@fortawesome/free-brands-svg-icons'
 </script>
 
@@ -59,6 +60,14 @@
     >
       <Fa icon={faDiscord} />
     </a>
+    <a
+      href="https://www.youtube.com/@pocketba5ed"
+      rel="noreferrer"
+      target="_blank"
+      class="m-2"
+    >
+      <Fa icon={faYoutube} />
+    </a>
   </div>
   <div class="flex-none">
     <NavbarMenu />

packages/dashboard/src/routes/PromoBanner.svelte

@@ -1,16 +1,13 @@
 <script lang="ts">
-  import UserLoggedIn from '$components/guards/UserLoggedIn.svelte'
-  import UserLoggedOut from '$components/guards/UserLoggedOut.svelte'
-  import { onMount } from 'svelte'
-  import { browser, dev } from '$app/environment'
-  import { is23Available } from '$util/stores'
+  import { browser } from '$app/environment'
+  import { toc } from '$src/routes/(static)/blog/toc'
 
-  const BANNER_KEY = 'pocker-announcement'
-  $: isActive = $is23Available
-  $: isVisible = isActive && browser && !localStorage.getItem(BANNER_KEY)
+  const latestPost = toc[0]!
+  const BANNER_KEY = 'promo-banner'
+  $: isVisible = browser && localStorage.getItem(BANNER_KEY) !== latestPost.path
 
   function dismissBanner() {
-    localStorage.setItem(BANNER_KEY, 'true')
+    localStorage.setItem(BANNER_KEY, toc[0]?.path ?? '')
     isVisible = false
   }
 </script>
@@ -18,9 +15,8 @@
 {#if isVisible}
   <div class="alert alert-info bg-yellow-300 rounded-none mb-10 relative">
     <div class="text-info-content flex-1">
-      PocketHost is live in 40+ countries.
-      <a href="/blog/live-in-40-countries" class="btn btn-sm btn-neutral m-2"
-        >Learn more</a
+      {latestPost.title}
+      <a href={latestPost.path} class="btn btn-sm btn-neutral m-2">Learn more</a
       >
     </div>
     <button