function cookiesPolicyWidget({ id, url }) {
  if (!id || window.getCookie('acceptCookies')) {
    return;
  }

  const div = document.createElement('div');
  div.classList.add('center-bottom-fixed', 'flex', 'flex-row', 'center-xs', 'padding-medium');
  div.style.zIndex = 100;
  div.style.width = '100%';
  div.style.maxWidth = 'calc(1140px + 2rem)';

  const template = `
    <div class="container-fluid padding-large background-white rounded-small shadow-large">
      <div class="row small-space-xs">
        <div class="col-xs-12 col-sm">
          <span class="text-medium text-dark">
            Utilizamos cookies e outras tecnologias semelhantes para melhorar sua experiência em nosso site, ao continuar navegando você aceita nossa
            <a href="${url}" target="_blank">Política de cookies</a>.
          </span>
        </div>
        <div class="col-xs-12 col-sm-width-auto">
          <button type="button" class="btn-default btn-medium">
            <span>Continuar e fechar</span>
          </button>
        </div>
      </div>
    </div>
  `;

  div.innerHTML = template;

  const button = div.querySelector('button');
  button.addEventListener('click', () => {
    window.setCookie('acceptCookies', 1, 365);
    div.remove();
  });

  document.body.append(div);
}

export default cookiesPolicyWidget;
