import type { FigureBlock } from "#types/block.types";
import { createCodeBlock } from "#presentation/components/code.component";
import { createElement } from "#core/factories/element.factory";
import { renderGrammarBlock } from "#presentation/renderers/grammar.renderer";

const innerOf = function innerOf(block: FigureBlock): Element {
    const { figure } = block;
    if (figure.kind === "code") {
        return createCodeBlock(figure.code, figure.title, figure.language);
    }
    return renderGrammarBlock(figure);
};

export const renderFigure = function renderFigure(block: FigureBlock): Element {
    return createElement("figure", {
        children: [createElement("figcaption", { className: "figure-caption", text: block.caption }), innerOf(block)],
        className: "block-figure",
    });
};