import { api } from "lwc";
import { ArchiveCard } from "dxBaseElements/archiveCard";
import cx from "classnames";
import { toJson } from "dxUtils/normalizers";
import ImageAndLabel from "dx/imageAndLabel";

export default class ExpandedCard extends ArchiveCard {
    @api body!: string;
    @api date: string | null = null;
    @api topics: Array<string> = [];
    @api length?: string;
    @api
    get authors() {
        if (this._authors && this._authors.length) {
            return this._authors!.map(
                (author: ImageAndLabel, index: number) => ({
                    ...author,
                    // @ts-ignore we're doing some hacky stuff to get at LWC internals here
                    imgSrc: !this.mobile ? author.image_src : "",
                    key: index
                })
            );
        }
        return undefined;
    }

    set authors(value: any) {
        if (value !== "undefined") {
            this._authors = (toJson(value) as Array<any>)?.filter(
                (author) => author.name
            );
        }
    }
    private _authors?: any;

    private get isBlog(): boolean {
        return this.contentType === "blog";
    }

    private get hasAuthor(): boolean {
        return this.authors?.length;
    }

    private get renderAuthor(): boolean {
        return this.isBlog && this.hasAuthor;
    }

    private get renderLength(): boolean {
        return !this.isBlog && !!this.length;
    }

    private get renderDot(): boolean {
        return !!(this.renderLength && this.date);
    }

    private get hasTopics(): boolean {
        return !!this.topics?.length;
    }

    private get containerClass(): string {
        return cx("card-container", this.mobile && "card-mobile");
    }
}