/* Abo-Feld der englischen Fassung: Substacks eigene Abo-Box (germanautopreneur.com/embed).
   Der englische Newsletter lebt auf Substack, nicht auf beehiiv, also geht er nicht ueber
   /api/subscribe. Nur die eingebettete Box traegt mit einem Klick ein, ohne Seitenwechsel.
   Gemessen 26.10.2026: ein eigenes Feld, das die Adresse an Substack schickt, scheitert. Aus
   dem Browser blockt CORS, vom Server antwortet /api/v1/free mit prompt_to_login statt einer
   Anmeldung, und die Abo-Seite traegt eine Bot-Abfrage. Der fruehere Weg ueber
   /subscribe?email= kostete den Leser einen zweiten Klick auf Substack.
   Die Box laeuft schmal: bei 150 px Hoehe laesst Substack Foto, Titel, Beschreibung und
   Abonnentenzahl weg, uebrig bleiben Feld, Knopf und Kleingedrucktes (Vorbild
   dunneinsights.com, Philipps Wahl 26.10.2026). Die volle Box hat er wegen des Designs verworfen.
   Klicks in der Box sind fremd und nicht messbar. Gezaehlt wird deshalb der Moment, in dem
   der Leser in die Box klickt: das Fenster verliert den Fokus an genau diesen iframe. */
function SubstackEmbed({ source = 'hub_en', lazy = false }) {
  const ref = React.useRef(null);
  React.useEffect(() => {
    let sent = false;
    function onBlur() {
      if (sent || document.activeElement !== ref.current) return;
      sent = true;
      if (typeof window.va === 'function') window.va('event', { name: 'substack_embed_focus', source });
      if (window.umami) { try { window.umami.track('substack_embed_focus', { source }); } catch (_) {} }
    }
    window.addEventListener('blur', onBlur);
    return () => window.removeEventListener('blur', onBlur);
  }, [source]);
  return (
    <div className="substack-embed">
      <iframe
        ref={ref}
        src="https://germanautopreneur.com/embed"
        title="Subscribe to The German Autopreneur"
        loading={lazy ? 'lazy' : undefined}
        scrolling="no"
        frameBorder="0"
      />
    </div>
  );
}
window.SubstackEmbed = SubstackEmbed;