"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const path_1 = require("path");
const server_1 = require("@loadable/server");
const fs_extra_1 = require("fs-extra");
const react_1 = require("react");
const server_2 = require("react-dom/server");
const micro_core_1 = require("@vtex/micro-core");
const container_1 = require("../../components/container");
const data_1 = require("../../components/data");
const runtime_1 = require("../../components/runtime");
const cjsChunkExtractor_1 = require("./cjsChunkExtractor");
class Html extends micro_core_1.HtmlFrameworkPlugin {
    constructor(options) {
        super(options);
        this.renderToString = (element) => {
            let ssr = '';
            if (element) {
                ssr = server_2.renderToString(react_1.createElement(server_1.ChunkExtractorManager, {
                    extractor: this.extractor,
                    children: element,
                })); // TODO: fix this as any
            }
            return container_1.withAppContainerTags(ssr);
        };
        this.requireEntrypoint = () => {
            const { page: { data, name }, } = this.options;
            const locator = path_1.join(this.options.assetsDist.nodejs, 'pages', name);
            const { default: App } = require(locator);
            // TODO: Figure out a way to the error come from the router
            return react_1.createElement(App, { data, error: null });
        };
        this.getScriptTags = () => {
            const { publicPaths } = this.options;
            const tags = [];
            tags.push(runtime_1.withRuntimeTags({ publicPaths }));
            tags.push(this.extractor.getScriptTags());
            return tags.join('\n');
        };
        this.getStyleTags = () => {
            if (typeof this.extractor.getMainAssets === 'function') {
                const assets = this.extractor.getMainAssets('style');
                return assets
                    .map(({ path, chunk }) => {
                    const content = fs_extra_1.readFileSync(path);
                    return `<style data-chunk="${chunk}" rel="stylesheet">${content}</style>`;
                })
                    .join('\n');
            }
            return '';
            // return this.extractor.getStyleTags()
        };
        this.getLinkTags = () => {
            const { page: { name, data }, publicPaths: { data: rootPath }, path, } = this.options;
            const tagsNoCSS = this.extractor.getLinkTags()
                .split('\n')
                .filter((x) => !x.includes('as="style"'))
                .join('\n');
            const dataTags = data_1.withPageDataTags({ name, data, rootPath, path });
            return [tagsNoCSS, dataTags].join('\n');
            // return [
            //   dataTags,
            //   this.extractor.getLinkTags()
            // ].join('\n')
        };
        this.getMetaTags = () => [
            '<meta name="viewport" content="width=device-width, initial-scale=1">',
            '<meta name="generator" content="micro@1.x">',
            "<meta charset='utf-8'>",
        ].join('\n');
        if (this.options.lifecycleTarget === 'bundle') {
            this.extractor = new server_1.ChunkExtractor({
                entrypoints: [options.page.name],
                publicPath: options.publicPaths.assets,
                stats: options.stats,
            }); // TODO: fix this as any
        }
        else {
            this.extractor = new cjsChunkExtractor_1.CJSChunkExtractor(options);
        }
    }
}
exports.default = {
    html: Html,
};
