import { Breadcrumbs, BreadcrumbsProps } from '@wix/design-system';
import { ReactElement } from 'react';
import { useCollectionPageHeader } from '../../state/CollectionPage';
import { MoreActionsElement } from '../MoreActions';
import { PageSubTitleProps } from '../PageSubTitle';
import { SecondaryActionsElement } from '../SecondaryActions';
import { PrimaryActionsElement } from '../PrimaryActions';

export type BreadcrumbsElement = ReactElement<
  BreadcrumbsProps,
  typeof Breadcrumbs
>;

export interface CollectionPageHeaderProps {
  /**
   * A [`Breadcrumbs`](https://www.docs.wixdesignsystem.com/?path=/story/components-navigation--breadcrumbs) element to be rendered on the header.
   * @overrideType [Breadcrumbs](https://www.docs.wixdesignsystem.com/?path=/story/components-navigation--breadcrumbs)
   * @external
   */
  breadcrumbs?: BreadcrumbsElement;

  /**
   * `text`: The title text. \
   * `hideTotal`: Determines whether to hide the number of total entities on the title of the page.
   * @external
   */
  title: { text: string; hideTotal?: boolean };

  /**
   * The page subtitle text.
   * @external
   */
  subtitle?: PageSubTitleProps;

  /**
   * A [`PrimaryActions`](./?path=/story/features-actions-primary-actions--primary-actions) component to be rendered on the header.
   * A primary button w/o PopoverMenu component to be rendered in the header.
   * @overrideType [PrimaryActions](./?path=/story/features-actions-primary-actions--primary-actions)
   * @external
   */
  primaryAction?: PrimaryActionsElement;

  /**
   * A [`SecondaryActions`](./?path=/story/features-actions-secondary-actions--secondary-actions) component to be rendered on the header.
   * A Secondary button w/o PopoverMenu component to be rendered on the header
   * @overrideType [SecondaryActions](./?path=/story/features-actions-secondary-actions--secondary-actions)
   * @external
   */
  secondaryActions?: SecondaryActionsElement;

  /**
   * A [`MoreActions`](./?path=/story/features-actions-more-actions--more-actions) component to be rendered on the header.
   * @overrideType [MoreActions](./?path=/story/features-actions-more-actions--more-actions)
   * @external
   */
  moreActions?: MoreActionsElement;
}

export type CollectionPageHeaderElement = ReactElement<
  CollectionPageHeaderProps,
  typeof CollectionPageHeader
>;

export function CollectionPageHeader(_props: CollectionPageHeaderProps) {
  return null;
}

CollectionPageHeader.useCollectionPageHeader = useCollectionPageHeader;
CollectionPageHeader.displayName = 'CollectionPageHeader';