'use client';

/** Video block — thin chat wrapper around `VideoPlayer`. */

import { VideoPlayer } from '../../../../VideoPlayer/VideoPlayer';
import type { UrlSource } from '../../../../VideoPlayer/types';
import type { VideoBlock } from '../../../types/block';
import type { BlockRendererProps } from './types';

export default function VideoBlockRenderer({ block }: BlockRendererProps<VideoBlock>) {
  // `poster` lives on the structured source, not as a top-level prop. A
  // raw URL string is auto-classified, but to carry a poster we wrap it
  // in a `UrlSource`.
  const source: UrlSource | string = block.poster
    ? { type: 'url', url: block.src, poster: block.poster, title: block.title }
    : block.src;
  return (
    <VideoPlayer
      source={source}
      aspectRatio={block.aspectRatio ?? 16 / 9}
      className="overflow-hidden rounded-xl"
    />
  );
}
