/* ============================================================================
 * FORM API — Frontend-Helper für /api/contact und /api/upload
 * ----------------------------------------------------------------------------
 * Alle Formulare nutzen diese Helper, damit Endpoint-Konfiguration zentral ist.
 *
 * In der Vercel-Production läuft die API same-origin unter /api/*.
 * Für lokales Testen kann window.MALITECH_API_BASE überschrieben werden.
 * ========================================================================= */

(function () {
  const API_BASE = (typeof window !== 'undefined' && window.MALITECH_API_BASE) || '';

  const CONTACT_FALLBACK = {
    phone: '+49 521 163913-10',
    email: 'kontakt@malitech-solutions.de'
  };

  /**
   * Sendet ein Formular an /api/contact.
   * @param {string} formType  'potenzialanalyse' | 'lead-config' | 'cyber-report' | 'projekt-portal'
   * @param {object} data      Form-Felder
   * @returns {Promise<{ok: true, id?: string} | {ok: false, error: string}>}
   */
  async function submitForm(formType, data) {
    try {
      const res = await fetch(`${API_BASE}/api/contact`, {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ formType, data })
      });
      if (!res.ok) {
        const json = await res.json().catch(() => ({}));
        return { ok: false, error: json.error || `HTTP ${res.status}` };
      }
      const json = await res.json();
      return { ok: true, id: json.id };
    } catch (err) {
      console.error('[submitForm]', err);
      return { ok: false, error: 'Netzwerk-Fehler — Endpoint nicht erreichbar.' };
    }
  }

  /**
   * Lädt eine Datei nach Vercel Blob hoch.
   * @param {File} file
   * @param {(loaded:number,total:number)=>void} [onProgress]
   * @returns {Promise<{ok: true, url: string} | {ok: false, error: string}>}
   */
  async function uploadFile(file, onProgress) {
    if (!file) return { ok: false, error: 'Keine Datei' };
    if (file.size > 25 * 1024 * 1024) return { ok: false, error: 'Datei zu groß (max. 25 MB)' };

    return new Promise((resolve) => {
      const xhr = new XMLHttpRequest();
      xhr.open('POST', `${API_BASE}/api/upload`);
      xhr.setRequestHeader('X-Filename', file.name);
      xhr.setRequestHeader('Content-Type', file.type || 'application/octet-stream');
      if (onProgress) {
        xhr.upload.onprogress = (e) => {
          if (e.lengthComputable) onProgress(e.loaded, e.total);
        };
      }
      xhr.onload = () => {
        if (xhr.status >= 200 && xhr.status < 300) {
          try {
            const json = JSON.parse(xhr.responseText);
            resolve({ ok: true, url: json.url, pathname: json.pathname });
          } catch (e) {
            resolve({ ok: false, error: 'Ungültige Antwort vom Server' });
          }
        } else {
          let err = 'Upload fehlgeschlagen';
          try { err = JSON.parse(xhr.responseText).error || err; } catch (e) {}
          resolve({ ok: false, error: err });
        }
      };
      xhr.onerror = () => resolve({ ok: false, error: 'Netzwerk-Fehler beim Upload' });
      xhr.send(file);
    });
  }

  /* ── Honeypot-Hook ────────────────────────────────────────────────────
     Jedes Formular ruft `const hp = window.MaliTechFormAPI.useHoneypot()` auf:
     - Rendert {hp.fields} irgendwo im Form-Markup (visuell versteckt, aber für
       Bots befüllbar)
     - Vor submit: payload = { ...data, ...hp.read() }
     Server (/api/_lib.js → isBot) verwirft Submissions mit nicht-leerem
     Honeypot-Feld oder Sub-2s-Submit-Zeit. */
  function useHoneypot() {
    const [openedAt] = React.useState(() => Date.now());
    const ref = React.useRef(null);
    const fields = (
      <div
        aria-hidden="true"
        style={{
          position: 'absolute',
          left: '-9999px',
          top: 'auto',
          width: '1px',
          height: '1px',
          overflow: 'hidden',
          opacity: 0,
          pointerEvents: 'none'
        }}>
        <label htmlFor="mt_hp_website">Webseite (bitte leer lassen)</label>
        <input
          ref={ref}
          id="mt_hp_website"
          type="text"
          name="website"
          tabIndex={-1}
          autoComplete="off"
        />
      </div>
    );
    const read = () => ({
      _hp_website: (ref.current && ref.current.value) || '',
      _hp_ts: openedAt
    });
    return { fields, read };
  }

  window.MaliTechFormAPI = { submitForm, uploadFile, CONTACT_FALLBACK, useHoneypot };
})();