From cbdf3382840011418e5b80d2a42192bee1c7429c Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Wed, 4 Feb 2026 18:34:33 +0000
Subject: [PATCH 1/3] Initial plan


From e083e3784c340783ae6cedcd54181f85c5efcbd1 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Wed, 4 Feb 2026 18:38:30 +0000
Subject: [PATCH 2/3] Add no episodes placeholder to EpisodeList component

Co-authored-by: argyleink <1134620+argyleink@users.noreply.github.com>
---
 src/components/EpisodeList.astro | 108 ++++++++++++++++---------------
 1 file changed, 57 insertions(+), 51 deletions(-)

diff --git a/src/components/EpisodeList.astro b/src/components/EpisodeList.astro
index 884af47..4748198 100644
--- a/src/components/EpisodeList.astro
+++ b/src/components/EpisodeList.astro
@@ -12,61 +12,67 @@ export interface Props {
 const { episodes, show } = Astro.props;
 ---
 
-<ul aria-label="EpisodeList">
-  {
-    episodes.map((episode) => {
-      return (
-        <li class="dark:border-dark-border border-b">
-          <div class="flex w-full flex-col py-12 lg:flex-row">
-            <img
-              alt={`${episode.title} - episode art`}
-              aria-hidden="true"
-              class="mb-3 block h-20 w-20 rounded-md lg:mr-6"
-              height={80}
-              loading="lazy"
-              src={episode.episodeThumbnail ?? show.image}
-              width={80}
-            />
+{
+  episodes.length === 0 ? (
+    <p class="py-12 text-center text-lg">
+      No episodes yet. Check back soon!
+    </p>
+  ) : (
+    <ul aria-label="EpisodeList">
+      {episodes.map((episode) => {
+        return (
+          <li class="dark:border-dark-border border-b">
+            <div class="flex w-full flex-col py-12 lg:flex-row">
+              <img
+                alt={`${episode.title} - episode art`}
+                aria-hidden="true"
+                class="mb-3 block h-20 w-20 rounded-md lg:mr-6"
+                height={80}
+                loading="lazy"
+                src={episode.episodeThumbnail ?? show.image}
+                width={80}
+              />
 
-            <div class="flex flex-col">
-              <FormattedDate date={new Date(episode.published)} />
+              <div class="flex flex-col">
+                <FormattedDate date={new Date(episode.published)} />
 
-              <h2 class="text-light-text-heading my-2 text-lg font-bold dark:text-white">
-                <a
-                  href={`/${episode.episodeSlug}`}
-                  style={
-                    'view-transition-name: var(--should-vt); --vt-name: vt-' +
-                    dasherize(episode.title)
-                  }
-                >
-                  {episode.episodeNumber}: {episode.title}
-                </a>
-              </h2>
+                <h2 class="text-light-text-heading my-2 text-lg font-bold dark:text-white">
+                  <a
+                    href={`/${episode.episodeSlug}`}
+                    style={
+                      'view-transition-name: var(--should-vt); --vt-name: vt-' +
+                      dasherize(episode.title)
+                    }
+                  >
+                    {episode.episodeNumber}: {episode.title}
+                  </a>
+                </h2>
 
-              <p class="mb-5">{episode.description}</p>
+                <p class="mb-5">{episode.description}</p>
 
-              <div class="flex items-center gap-6 text-sm">
-                <FullPlayButton
-                  client:visible
-                  episode={{
-                    audio: episode.audio,
-                    episodeNumber: episode.episodeNumber,
-                    id: episode.id,
-                    title: episode.title
-                  }}
-                />
+                <div class="flex items-center gap-6 text-sm">
+                  <FullPlayButton
+                    client:visible
+                    episode={{
+                      audio: episode.audio,
+                      episodeNumber: episode.episodeNumber,
+                      id: episode.id,
+                      title: episode.title
+                    }}
+                  />
 
-                <a
-                  class="text-light-text-heading font-bold dark:text-white"
-                  href={`/${episode.episodeSlug}`}
-                >
-                  Show notes
-                </a>
+                  <a
+                    class="text-light-text-heading font-bold dark:text-white"
+                    href={`/${episode.episodeSlug}`}
+                  >
+                    Show notes
+                  </a>
+                </div>
               </div>
             </div>
-          </div>
-        </li>
-      );
-    })
-  }
-</ul>
+          </li>
+        );
+      })}
+    </ul>
+  )
+}

From 2a4577d28798c7ea2c5d657b21e0833baa179028 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Thu, 5 Feb 2026 12:54:39 +0000
Subject: [PATCH 3/3] Use UFOIllustration for no episodes placeholder

Co-authored-by: RobbieTheWagner <2640861+RobbieTheWagner@users.noreply.github.com>
---
 src/components/EpisodeList.astro | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/components/EpisodeList.astro b/src/components/EpisodeList.astro
index 4748198..c49a3dc 100644
--- a/src/components/EpisodeList.astro
+++ b/src/components/EpisodeList.astro
@@ -1,6 +1,7 @@
 ---
 import FormattedDate from '../components/FormattedDate';
 import FullPlayButton from '../components/FullPlayButton';
+import UFOIllustration from '../components/illustrations/UFOIllustration.astro';
 import type { Episode, Show } from '../lib/rss';
 import { dasherize } from '../utils/dasherize';
 
@@ -14,9 +15,15 @@ const { episodes, show } = Astro.props;
 
 {
   episodes.length === 0 ? (
-    <p class="py-12 text-center text-lg">
-      No episodes yet. Check back soon!
-    </p>
+    <div class="flex flex-col items-center">
+      <div class="h-auto w-full max-w-80">
+        <UFOIllustration />
+      </div>
+
+      <p class="text-light-text-heading py-10 text-lg font-bold dark:text-white">
+        No episodes yet. Check back soon!
+      </p>
+    </div>
   ) : (
     <ul aria-label="EpisodeList">
       {episodes.map((episode) => {