import type { FC } from 'react';
import React from 'react';
import { TableExtensions } from './tableExtensions';
import type { TableProps } from './types';

interface TableExtensionsHostProps<Data> {
    children: React.ReactNode;
    props: TableProps<Data>;
}

interface TableExtensionHostProps<Data> extends TableExtensionsHostProps<Data> {
    wrappers: FC<{ children?: React.ReactNode }>[];
}

function TableExtensionHost<Data>({ wrappers, children, props }: TableExtensionHostProps<Data>) {
    const [ExtensionWrapper] = wrappers;

    if (!ExtensionWrapper) return <>{children}</>;

    return (
        <TableExtensionHost props={props} wrappers={wrappers.slice(1)}>
            <ExtensionWrapper>{children}</ExtensionWrapper>
        </TableExtensionHost>
    );
}

export function TableExtensionsHost<Data>({ children, props }: TableExtensionsHostProps<Data>) {
    const wrappers = TableExtensions.getWrappers(props);

    return (
        <TableExtensionHost wrappers={wrappers} props={props}>
            {children}
        </TableExtensionHost>
    );
}