import { ImageBlock } from "./ImageBlock";

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