astro-tractstack 2.0.0-rc.0

package/templates/src/components/codehooks/BunnyVideoWrapper.astro

@@ -0,0 +1,78 @@
+---
+import BunnyVideo from '@/components/widgets/BunnyVideoHero.astro';
+
+export interface Props {
+  options?: {
+    params?: {
+      options?: string;
+    };
+  };
+}
+
+const { options } = Astro.props;
+
+interface ParsedOptions {
+  videoUrl: string;
+  title: string;
+  chapters: any[];
+  description?: string;
+}
+
+// Parse the options from the CodeHookPayload
+let parsedOptions: ParsedOptions;
+try {
+  parsedOptions = JSON.parse(options?.params?.options || '{}') as ParsedOptions;
+  // Ensure default values for missing properties
+  parsedOptions = {
+    videoUrl: parsedOptions.videoUrl || '',
+    title: parsedOptions.title || 'Video',
+    chapters: Array.isArray(parsedOptions.chapters)
+      ? parsedOptions.chapters
+      : [],
+    description: parsedOptions.description || '',
+  };
+} catch (e) {
+  console.error('Invalid options', e);
+  parsedOptions = {
+    videoUrl: '',
+    title: 'Video',
+    chapters: [],
+    description: '',
+  };
+}
+
+const videoUrl = parsedOptions.videoUrl;
+const title = parsedOptions.title;
+const chapters = parsedOptions.chapters;
+const description = parsedOptions.description;
+
+// Validate chapters if present
+const validChapters: any[] = chapters.filter(
+  (chapter: any) =>
+    typeof chapter.startTime === 'number' &&
+    typeof chapter.endTime === 'number' &&
+    typeof chapter.title === 'string'
+);
+---
+
+<div class="mx-auto mb-8 max-w-7xl px-2.5 py-1.5 md:mb-10 md:px-3.5">
+  {
+    videoUrl ? (
+      <BunnyVideo
+        videoUrl={videoUrl}
+        title={title}
+        chapters={validChapters}
+        description={description}
+      />
+    ) : (
+      <div class="flex aspect-video w-full items-center justify-center bg-gray-100 p-4 text-center">
+        <div>
+          <p class="mb-2 text-gray-500">No video URL configured</p>
+          <p class="text-xs text-gray-400">
+            Configure this component with a valid Bunny Stream URL
+          </p>
+        </div>
+      </div>
+    )
+  }
+</div>