import React from 'react';
import shortid from 'shortid'
import {PageConfigFileInterface, PossibleBlockTypes} from "./types/pageConfigFile";
import {ComponentConfigFileInterface} from "./types/componentConfigFile";

type GenericTypes = {
    pageConfigFile: PageConfigFileInterface,
    componentConfigFile?: ComponentConfigFileInterface
}

export const Generic = ({pageConfigFile, componentConfigFile}: GenericTypes) => {
    if (!pageConfigFile) return null;

    const order = getOrderElements(pageConfigFile)

    const GetComponent = ({ field }: { field: PossibleBlockTypes }) => {
        return componentConfigFile[field]
            ? componentConfigFile[field](pageConfigFile[field], pageConfigFile.path)
            : null
    }

    return (
        <>
            {
                order?.map((field: string) => (
                <div key={shortid.generate()}>
                <GetComponent field={field || ''}/>
    </div>
))
}
    </>
)
}


function getOrderElements (pageConfigFile: any) {
    return pageConfigFile.order && pageConfigFile.order.length ? pageConfigFile.order : Object.keys(pageConfigFile)
}