feat: add embed sub-components (Generic, Video, Image, Rich) and dispatcher

2026-03-20 23:45:32 +01:00
parent a800d9ff25
commit 5a670bc6ad
5 changed files with 315 additions and 0 deletions
@@ -0,0 +1,49 @@
+import React from 'react';
+import type { Embed } from '@backspace/shared';
+import { GenericEmbed } from './embeds/GenericEmbed';
+import { VideoEmbed } from './embeds/VideoEmbed';
+import { ImageEmbed } from './embeds/ImageEmbed';
+import { RichEmbed } from './embeds/RichEmbed';
+
+interface EmbedRendererProps {
+  embed: Embed;
+}
+
+export function EmbedRenderer({ embed }: EmbedRendererProps) {
+  switch (embed.embedType) {
+    case 'video':
+      return <VideoEmbed embed={embed} />;
+
+    case 'image':
+      return <ImageEmbed embed={embed} />;
+
+    case 'audio':
+      return (
+        <div className="mt-2 max-w-[520px] bg-surface-channel rounded-[4px] border-l-4 border-border-hard p-3">
+          {embed.title && (
+            <a
+              href={embed.url}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="text-[14px] text-sky-400 font-semibold hover:underline block mb-2 truncate"
+            >
+              {embed.title}
+            </a>
+          )}
+          <audio
+            src={embed.url}
+            controls
+            preload="metadata"
+            className="w-full"
+          />
+        </div>
+      );
+
+    case 'rich':
+      return <RichEmbed embed={embed} />;
+
+    case 'generic':
+    default:
+      return <GenericEmbed embed={embed} />;
+  }
+}