/**
 * YouTube Widget (Live)
 * 
 * Embeds YouTube videos with lazy loading thumbnail.
 * Uses the shared YouTube component for parity with preview.
 * 
 * @since 1.0.0
 * @updated 1.6.0 - Migrated to shared component
 */

import { YouTube } from '@shared/components/widgets/YouTube';
import type { GlobalValues, FieldValue } from '@/utils/resolveAppearance';
import type { ButtonStyleSettings } from '@/types';

interface YouTubeWidgetConfig {
    video_url: string;
    video_id?: string;
    title?: string;
    description?: string;
    autoplay?: boolean;
    is_rtl?: boolean;
}

// Must match the structure from admin/src/types/appearance.ts
interface YouTubeWidgetSettings {
    container?: {
        background?: FieldValue;
        borderRadius?: FieldValue;
        shadow?: FieldValue;
        padding?: FieldValue;
        borderStyle?: 'none' | 'solid' | 'dashed' | 'dotted';
        borderWidth?: { top: string; right: string; bottom: string; left: string };
        borderColor?: FieldValue;
    };
    thumbnail?: {
        overlayBackground?: FieldValue | string;
        overlayOpacity?: number;
        hoverScale?: string;
        playButtonStyle?: ButtonStyleSettings;
        playButtonIcon?: string;
        playButtonHoverScale?: string;
    };
    title?: {
        color?: FieldValue;
        font?: FieldValue;
        padding?: FieldValue;
        typography?: Record<string, FieldValue | undefined>;
    };
    description?: {
        color?: FieldValue;
        font?: FieldValue;
        typography?: Record<string, FieldValue | undefined>;
    };
}

interface YouTubeWidgetProps {
    config: YouTubeWidgetConfig;
    widgetSettings?: YouTubeWidgetSettings;
    globalValues?: GlobalValues;
    language?: string;
}

export function YouTubeWidget({ config, widgetSettings, globalValues = {}, language }: YouTubeWidgetProps) {
    const { 
        video_url, 
        video_id,
        title, 
        description, 
        autoplay = false,
        is_rtl = true 
    } = config;

    return (
        <YouTube
            globalValues={globalValues}
            widgetSettings={widgetSettings as any}
            context="live"
            isRTL={is_rtl}
            language={language}
            videoUrl={video_url}
            videoId={video_id}
            title={title}
            description={description}
            autoplay={autoplay}
        />
    );
}

export default YouTubeWidget;
