import { isValidElement, ReactElement, useMemo } from 'react';
import { CollectionPageHeader } from '../components/CollectionPageHeaderNew';

type ChildArray = (
  | React.ReactChild
  | React.ReactFragment
  | React.ReactPortal
)[];

export function usePageHeader(childrenArr: ChildArray): {
  header: ReactElement | undefined;
  title?: string;
  hideTotal?: boolean;
} {
  const header = useMemo(
    () =>
      childrenArr.find(
        (child): child is ReactElement =>
          isValidElement(child) && child.type === CollectionPageHeader,
      ),
    [childrenArr],
  );

  const { text: title, hideTotal } = header?.props?.title || {};
  return { header, title, hideTotal };
}