import { TinaMarkdown, TinaMarkdownContent } from "tinacms/dist/rich-text";
import { RichTextTemplate } from "@tinacms/schema-tools";
import React from "react";

export interface BlockQuoteProps {
    children: TinaMarkdownContent;
    authorName: string;
}

const BlockQuote = (props: BlockQuoteProps): React.ReactElement => (
    <div>
        <blockquote>
            <TinaMarkdown content={ props.children } />
            { props.authorName }
        </blockquote>
    </div>);

export const blockQuoteSchema: RichTextTemplate = {
    name: "BlockQuote",
    label: "Block Quote",
    fields: [
        {
            name: "children",
            label: "Quote",
            type: "rich-text"
        },
        {
            name: "authorName",
            label: "Author",
            type: "string"
        }
    ]
};

export default BlockQuote;