/**
 * Component to render data for site documents
 * @class SiteDocuments
 */
export class SiteDocuments {
    /**
     * @param {object} data
     */
    set siteData(data) {
        this._siteData = data;
    }

    render() {
        let content = `
            <div class="has-bottom-border">
                <div class="p-2">
                    <table class="p-4 table is-fullwidth is-striped">
                        <thead>
                            <tr><th colspan=3 class="p-2 has-text-centered is-size-5">Documentazione di archivio</th>
                            <tr><th>Titolo</th><th>Autori</th><th>Download</th></tr>
                        </thead>
                        <tbody>
            `;
		for (const doc of this._siteData.documents.filter(d => d.type === 'documentazione')) {
			content += `
				<tr><td>${doc.title}</td><td>${doc.authors}</td><td><a class="button is-link has-text-white" href="docs/${doc.filename}">
                    <i class="fa fa-download mr-2"></i> PDF
                </a></td></tr>
			`;
		}
		content += `
                </tbody>
                <thead>
                    <tr><th colspan=3 class="p-2 has-text-centered is-size-5">Pubblicazioni del progetto Carta Archeologica</th>
                    <tr><th>Titolo</th><th>Autori</th><th>Download</th></tr>
                </thead>
                <tbody>
        `;
		for (const doc of this._siteData.documents.filter(d => d.type === 'pubblicazione')) {
			content += `
				<tr><td>${doc.title}</td><td>${doc.authors}</td><td><a class="button is-link has-text-white" href="docs/${doc.filename}">
                    <i class="fa fa-download mr-2"></i> PDF
                </a></td></tr>
			`;
		}
		content += `
                </tbody>
                </table>
                </div>
            </div>
        `;

        return content;
    }
}