// cache-bust: 1779468723-8d9735
// =========================================================
// dashboard-button.jsx — floating 'open dashboard' pill for
// signed-in Build Lab members. Self-mounting; renders nothing
// when user isn't a member or is already on the dashboard.
// =========================================================

(function () {
  const ROOT_ID = 'bl-dashboard-cta-root';
  const HASH_TRIGGER = '#dashboard';

  const { useState: useStateDCB, useEffect: useEffectDCB } = React;

  function DashboardCTA() {
    // Poll so we react to login/payment/hash changes from outside our tree.
    const [, setTick] = useStateDCB(0);
    useEffectDCB(() => {
      const id = setInterval(() => setTick(t => t + 1), 500);
      return () => clearInterval(id);
    }, []);

    const auth = window.BL_AUTH;
    const isLoggedIn = !!(auth && auth.isLoggedIn());
    const hasAccess = !!(auth && auth.hasBuildLabAccess());
    const dashboardOpen = window.location.hash === HASH_TRIGGER;

    // Hide unless: signed in, has access, dashboard not already open
    if (!isLoggedIn || !hasAccess || dashboardOpen) return null;

    const open = () => { window.location.hash = HASH_TRIGGER; };

    return (
      <button
        onClick={open}
        title="Open Build Lab dashboard"
        style={{
          position: 'fixed', top: 72, right: 24, zIndex: 7500,
          background: 'var(--accent, #d96846)', color: '#fff',
          border: 'none', borderRadius: 999,
          padding: '10px 18px', cursor: 'pointer',
          fontFamily: 'JetBrains Mono, ui-monospace, monospace',
          fontSize: 12, fontWeight: 600, letterSpacing: '.04em',
          boxShadow: '0 10px 30px rgba(217,104,70,0.35)',
          display: 'flex', alignItems: 'center', gap: 8,
          transition: 'transform 0.15s ease, box-shadow 0.15s ease',
        }}
        onMouseEnter={(e) => {
          e.currentTarget.style.transform = 'translateY(-1px)';
          e.currentTarget.style.boxShadow = '0 14px 36px rgba(217,104,70,0.45)';
        }}
        onMouseLeave={(e) => {
          e.currentTarget.style.transform = 'translateY(0)';
          e.currentTarget.style.boxShadow = '0 10px 30px rgba(217,104,70,0.35)';
        }}
      >
        <span style={{ fontSize: 10, opacity: 0.85 }}>&#9679; MEMBER</span>
        <span style={{ width: 1, height: 12, background: 'rgba(255,255,255,0.4)' }}></span>
        <span>open dashboard &rarr;</span>
      </button>
    );
  }

  // Mount once on script load. Component itself handles visibility.
  function mount() {
    let host = document.getElementById(ROOT_ID);
    if (!host) {
      host = document.createElement('div');
      host.id = ROOT_ID;
      document.body.appendChild(host);
    }
    const root = ReactDOM.createRoot(host);
    root.render(<DashboardCTA />);
  }

  // Small delay so BL_AUTH has a chance to initialize before first paint.
  setTimeout(mount, 80);
})();