import type { ReactChild } from 'react';
import React, { createContext, useContext } from 'react';
import { useTableApi } from './api';
import { TableExtensionsHost } from './tableExtensionsHost';
import type { TableApi, TableProps } from './types';

export const TableContext = createContext<object | undefined>(undefined);

interface TableContextProviderProps<Data> {
    props: TableProps<Data>;
    wrapperRef: React.MutableRefObject<HTMLDivElement | null>;
    children: ReactChild;
}

export function TableContextProvider<Data>({
    props,
    wrapperRef,
    children,
}: TableContextProviderProps<Data>) {
    const api = useTableApi<Data>(props, wrapperRef);

    return (
        <TableContext.Provider value={api}>
            <TableExtensionsHost props={props}>{children}</TableExtensionsHost>
        </TableContext.Provider>
    );
}

export function useTableContext<Data>() {
    const context = useContext(TableContext);
    if (!context) throw new Error('Failed to get table context. No context available.');
    return context as TableApi<Data>;
}