Use Podcast common template for both pages that render podcast info; add public support for podcast custom HTML.

CHANGELOG.md

@@ -11,6 +11,8 @@ release channel, you can take advantage of these new features and fixes.
       into your playback, and also creating podcasts with the same media.
     - You can now disable podcasts from public view while still editing them, similar to playlists.
     - You can specify season and episode numbers on individual podcast episodes.
+    - Podcasts can have public HTML associated with them that will display on public pages (useful for things like links
+      to third-party syndication sites).
 
 ## Code Quality/Technical Changes
 

frontend/src/components/Public/Podcasts/Podcast.vue

@@ -20,32 +20,8 @@
                             </ol>
                         </nav>
 
-                        <h4 class="card-title mb-1">
-                            {{ podcast.title }}
-                            <br>
-                            <small>
-                                {{ $gettext('by') }} <a
-                                    :href="'mailto:'+podcast.email"
-                                    target="_blank"
-                                >{{ podcast.author }}</a>
-                            </small>
-                        </h4>
+                        <podcast-common :podcast="podcast" />
 
-                        <div class="badges my-2">
-                            <span class="badge text-bg-info">
-                                {{ podcast.language_name }}
-                            </span>
-                            <span
-                                v-for="category in podcast.categories"
-                                :key="category.category"
-                                class="badge text-bg-secondary"
-                            >
-                                {{ category.text }}
-                            </span>
-                        </div>
-                        <p class="card-text">
-                            {{ podcast.description }}
-                        </p>
                         <div class="buttons">
                             <a
                                 class="btn btn-warning btn-sm"
@@ -145,6 +121,7 @@ import {IconRss} from "~/components/Common/icons.ts";
 import Icon from "~/components/Common/Icon.vue";
 import PlayButton from "~/components/Common/PlayButton.vue";
 import useStationDateTimeFormatter from "~/functions/useStationDateTimeFormatter.ts";
+import PodcastCommon from "./PodcastCommon.vue";
 
 const {params} = useRoute();
 

frontend/src/components/Public/Podcasts/PodcastCommon.vue

@@ -0,0 +1,43 @@
+<template>
+    <h4 class="card-title mb-1">
+        {{ podcast.title }}
+        <span v-if="podcast.author">
+            <br>
+            <small>
+                {{ $gettext('by') }} <a
+                    :href="'mailto:'+podcast.email"
+                    target="_blank"
+                >{{ podcast.author }}</a>
+            </small>
+        </span>
+    </h4>
+
+    <div class="badges my-2">
+        <span class="badge text-bg-info">
+            {{ podcast.language_name }}
+        </span>
+        <span
+            v-for="category in podcast.categories"
+            :key="category.category"
+            class="badge text-bg-secondary"
+        >
+            {{ category.text }}
+        </span>
+    </div>
+    <p class="card-text">
+        {{ podcast.description }}
+    </p>
+    <p
+        v-if="podcast.branding_config.public_custom_html"
+        class="card-text"
+        v-html="podcast.branding_config.public_custom_html"
+    />
+</template>
+
+<script setup lang="ts">
+import {ApiPodcast} from "~/entities/ApiInterfaces.ts";
+
+const props = defineProps<{
+    podcast: ApiPodcast
+}>();
+</script>

frontend/src/components/Public/Podcasts/PodcastEpisode.vue

@@ -33,33 +33,7 @@
                 :loading="podcastLoading"
                 lazy
             >
-                <h4 class="card-title mb-1">
-                    {{ podcast.title }}
-                    <br>
-                    <small>
-                        {{ $gettext('by') }} <a
-                            :href="'mailto:'+podcast.email"
-                            class="alert-link"
-                            target="_blank"
-                        >{{ podcast.author }}</a>
-                    </small>
-                </h4>
-
-                <div class="badges my-2">
-                    <span class="badge text-bg-info">
-                        {{ podcast.language_name }}
-                    </span>
-                    <span
-                        v-for="category in podcast.categories"
-                        :key="category.category"
-                        class="badge text-bg-secondary"
-                    >
-                        {{ category.text }}
-                    </span>
-                </div>
-                <p class="card-text">
-                    {{ podcast.description }}
-                </p>
+                <podcast-common :podcast="podcast" />
             </loading>
         </div>
 
@@ -126,6 +100,7 @@ import useRefreshableAsyncState from "~/functions/useRefreshableAsyncState.ts";
 import AlbumArt from "~/components/Common/AlbumArt.vue";
 import PlayButton from "~/components/Common/PlayButton.vue";
 import useStationDateTimeFormatter from "~/functions/useStationDateTimeFormatter.ts";
+import PodcastCommon from "./PodcastCommon.vue";
 
 const {params} = useRoute();