import { useEffect, useState } from "preact/hooks";
// import "../styles/cookie.css";

export default function Cookie({ config }) {
  const [visible, setVisible] = useState(false);

  useEffect(() => {
    const consent = localStorage.getItem("cookie-consent");

    // Jeśli brak zgody – pokaż po 150ms (animacja)
    if (!consent) {
      setTimeout(() => setVisible(true), 150);
    }
  }, []);

  const handle = (value) => {
    localStorage.setItem("cookie-consent", value);
    setVisible(false);
  };

  if (!config?.enabled) return null;

  return (
    <div
      id="cookie-banner"
      style={{
        transform: visible ? "translateY(0)" : "translateY(100%)",
      }}
    >
      <div class="f-cookie-panel-inner">

        <p class="f-cookie-text">
          {config.text.message}
          <a href={config.links.privacy} rel="noopener noreferrer">
            {config.text.more}
          </a>
        </p>

        <div class="flex gap-3 shrink-0">
          <button onClick={() => handle("accepted")} class="f-cookie-accept">
            {config.text.accept}
          </button>
          <button onClick={() => handle("rejected")} class="f-cookie-reject">
            {config.text.reject}
          </button>
        </div>

      </div>
    </div>
  );
}
