/*
  trademark banner

  TODOs
    - try github.com/segmentio/inbound to parse referrer
*/
import Cookies from 'js-cookie';
import React, { useEffect, useState } from 'react';
import { Link } from 'app/link';

import * as css from './trademark-banner.module.scss';

const COOKIE_NAME = 'hasSeenTrademarkBanner';
const COOKIE_EXPIRY_DAYS = 60;
const SEARCH_ENGINES = [
  'google',
  'bing',
  'yandex',
  'duckduckgo',
  'startpage',
  'searchencrypt',
  'gibiru',
  'onesearch',
  'ekoru',
  'ecosia',
];

const engineRE = new RegExp(`https?:\/\/(www\.)?(${SEARCH_ENGINES.map((eng) => `${eng}\.`).join('|')})`);

export function TrademarkBanner({ isForSearchers = true, href, force, ...restProps }, ref) {
  const [showBanner, setShowBanner] = useState(false);

  useEffect(() => {
    const isHomePage = !!(window && window.location.pathname === '/');
    const isSearchVisit = !!document?.referrer?.match(engineRE)?.length;
    const hasSeenBanner = !!Cookies.get(COOKIE_NAME);
    if (isHomePage && isSearchVisit === isForSearchers && !hasSeenBanner) {
      setShowBanner(true);
      Cookies.set(COOKIE_NAME, 'true', { expires: COOKIE_EXPIRY_DAYS });
    }
  }, []);

  const handleClick = () => setShowBanner(false);

  return !showBanner && !force ? null : (
    <aside className={css.banner}>
      <div className={css.bannerText}>
        Looking for the rasa.io that makes your newsletter smarter? Thats a different company! Go to{' '}
        <Link className={css.bannerLink} {...{ href }}>
          rasa.io
        </Link>
      </div>
      <button className={css.bannerCloseBtn} onClick={handleClick}></button>
    </aside>
  );
}