import { IContentType } from '../../ContentTypes/ContentType.interface';
import { RichText } from '../../ContentTypes/RichText/RichText';
import { BlockFactory } from '../Black.factory';
import { Block } from '../Block'

type ParagraphContentType = { rich_text: any[], color:string }

export class Paragraph extends Block {
    static tagName:string = 'p'

    toHTML(): string {
        const paragraphContent:ParagraphContentType = this.content as ParagraphContentType
        const texts:IContentType[] = paragraphContent.rich_text.map( richTextJson => BlockFactory.transformWithType(richTextJson) )
        const color = paragraphContent.color
        const classTag = ['notion', color]
        const textContent:string = texts.map(item => item.toHTML()).join('')
        const childrenContent:string = this.children.map((childItem:IContentType) => {
            return childItem.toHTML()
        }).join('')
        return `<${Paragraph.tagName} id="${this.id}" class="${classTag.join(' ')}">${textContent}${childrenContent}</${Paragraph.tagName}>`
    }   
}