'use client';

import { useState } from 'react';

function wait(milliseconds) {
  return new Promise((resolve) => {
    setTimeout(resolve, milliseconds);
  });
}

export function CopyLinkButton({ path, label }) {
  const [copied, setCopied] = useState(false);

  async function onCopy() {
    const url = `${window.location.origin}${path}`;

    try {
      const html = `<a href="${url}">${label || 'Download'}</a>`;
      const clipboardItem = new ClipboardItem({
        'text/html': new Blob([html], { type: 'text/html' }),
        'text/plain': new Blob([url], { type: 'text/plain' }),
      });
      await navigator.clipboard.write([clipboardItem]);
    } catch {
      try {
        await navigator.clipboard.writeText(url);
      } catch {
        const helper = document.createElement('textarea');
        helper.value = url;
        document.body.appendChild(helper);
        helper.select();
        document.execCommand('copy');
        document.body.removeChild(helper);
      }
    }

    setCopied(true);
    await wait(1800);
    setCopied(false);
  }

  return (
    <button type="button" className="btn secondary" onClick={onCopy}>
      {copied ? 'Kopiert' : 'Link kopieren'}
    </button>
  );
}