import { Children, ReactElement, ReactNode, useEffect, useMemo } from 'react';

import { TableHeaderCellProps } from '../components/TableHeader/TableHeaderCell';
import { HeadersMeta, useTableHeaderCellsRegister } from '../contexts/TableHeaderCellsMetaContext';

/** Collects metadata from HeaderCell component while rendering and register them into {@link TableHeaderCellsMetaContextProvider} */
export function useTableHeaderCellsMetaRegister<C extends string>(children: ReactNode): HeadersMeta<C> {
  const register = useTableHeaderCellsRegister();

  const meta = useMemo(() => {
    const childrenArray = Children.toArray(children) as ReactElement<TableHeaderCellProps<C>>[];

    return childrenArray.reduce((acc, child) => {
      acc[child.props.column] = {
        title: child.props.children,
        sortable: child.props.sortable ?? false,
        alwaysVisible: child.props.alwaysVisible ?? false,
      };
      return acc;
    }, {} as HeadersMeta<C>);
  }, [children]);

  useEffect(() => {
    register(meta);
  }, [register, meta]);

  return meta;
}