import React, { useState } from 'react';
import { CloseIcon } from '@orchard/frontend-react-components';
import cx from 'classnames';

const CLASS_NAME = 'Advertising-banner';

interface BannerProps {
    cookieName: string;
    dismissBanner: (cookieName: string) => void;
    bannerDismissed?: boolean;
    className?: string;
    canClose?: boolean;
    children?: React.ReactNode;
}

const Banner: React.FC<BannerProps> = ({
    className,
    cookieName,
    dismissBanner,
    bannerDismissed,
    canClose = true,
    children,
}) => {
    const [hideBanner] = useState(
        document.cookie.includes(`${cookieName}=false`)
    );

    if (hideBanner || bannerDismissed) return null;

    return (
        <div className={cx(CLASS_NAME, className)}>
            {children}
            {canClose && (
                <div
                    className={`${CLASS_NAME}-closeBannerButton`}
                    data-testid="close-banner-button"
                    onClick={() => dismissBanner(cookieName)}
                >
                    <CloseIcon />
                </div>
            )}
        </div>
    );
};

export default Banner;
