youtube embeds

src/components/blog/BlogEntry.svelte

@@ -15,11 +15,13 @@
   import { displayNameOf, formatCount, fullHandle, profilePath } from '$lib/util/profile'
   import { renderDisplayName } from '$lib/util/html'
   import { isoDate, longDate, stampDate } from '$lib/util/time'
+  import { extractYouTubeVideoIds } from '$lib/util/youtube'
   import Avatar from '../common/Avatar.svelte'
   import RichText from '../common/RichText.svelte'
   import Attachments from './Attachments.svelte'
   import PollView from './PollView.svelte'
   import PreviewCardView from './PreviewCardView.svelte'
+  import YouTubeEmbeds from './YouTubeEmbeds.svelte'
 
   interface Props {
     status: Status
@@ -45,6 +47,7 @@
   const handle = $derived(fullHandle(author, session.host))
   const permalink = $derived(`#/blog/${entry.id}`)
   const isMine = $derived(session.me?.id === entry.account.id)
+  const youtubeVideoIds = $derived(extractYouTubeVideoIds(entry.content))
 
   let busy = $state(false)
   let actionError = $state<string | null>(null)
@@ -188,6 +191,7 @@
         {#if entry.media_attachments.length > 0}
           <Attachments attachments={entry.media_attachments} sensitive={entry.sensitive} />
         {/if}
+        <YouTubeEmbeds videoIds={youtubeVideoIds} sensitive={entry.sensitive} />
       </details>
     {:else}
       <RichText
@@ -200,13 +204,14 @@
       {#if entry.media_attachments.length > 0}
         <Attachments attachments={entry.media_attachments} sensitive={entry.sensitive} />
       {/if}
+      <YouTubeEmbeds videoIds={youtubeVideoIds} sensitive={entry.sensitive} />
     {/if}
 
     {#if entry.poll}
       <PollView poll={entry.poll} />
     {/if}
 
-    {#if entry.card && entry.media_attachments.length === 0}
+    {#if entry.card && entry.media_attachments.length === 0 && youtubeVideoIds.length === 0}
       <PreviewCardView card={entry.card} />
     {/if}