import { VideoBlock } from "./VideoBlock";

export function TextVideoBlock({ content, onWatchProgress, resumePercent, antiSkipEnabled }) {
    const vidLeft = content.video_position === "left";
    return (
        <div className="flex flex-col gap-6 items-start sm:grid sm:grid-cols-2 sm:gap-6">
            {vidLeft && <VideoBlock content={content} onWatchProgress={onWatchProgress} resumePercent={resumePercent} antiSkipEnabled={antiSkipEnabled} />}
            <div
                className="typeset text-sm w-full"
                dangerouslySetInnerHTML={{
                    __html: content.body || "<p class='text-muted-foreground italic'>Empty text</p>",
                }}
            />
            {!vidLeft && <VideoBlock content={content} onWatchProgress={onWatchProgress} resumePercent={resumePercent} antiSkipEnabled={antiSkipEnabled} />}
        </div>
    );
}