import React from 'react';
import NotificationBannerContainer, {
  NotificationBannerContainerProps,
} from '@digigov/react-core/NotificationBannerContainer';
import NotificationBannerContent from '@digigov/react-core/NotificationBannerContent';
import NotificationBannerHeader from '@digigov/react-core/NotificationBannerHeader';
import NotificationBannerHeading from '@digigov/react-core/NotificationBannerHeading';
import NotificationBannerLink from '@digigov/react-core/NotificationBannerLink';

export interface NotificationBannerProps
  extends NotificationBannerContainerProps {
  variant?: 'info' | 'success' | 'error';
  title?: string;
  link?: { href: string; label: string };
  ref?: React.Ref<HTMLDivElement>;
}

export const NotificationBanner: React.FC<NotificationBannerProps> = ({
  variant,
  title,
  link,
  dense,
  children,
  ...props
}) => {
  return (
    <NotificationBannerContainer variant={variant} dense={dense} {...props}>
      {title && <NotificationBannerHeader>{title}</NotificationBannerHeader>}
      <NotificationBannerContent>
        <NotificationBannerHeading>
          {children}
          <br />
          {link && (
            <NotificationBannerLink href={link.href}>
              {link.label}
            </NotificationBannerLink>
          )}
        </NotificationBannerHeading>
      </NotificationBannerContent>
    </NotificationBannerContainer>
  );
};

export {
  NotificationBannerContainer,
  NotificationBannerHeader,
  NotificationBannerContent,
  NotificationBannerHeading,
  NotificationBannerLink,
};
export default NotificationBanner;