(function() {
  const dot = document.getElementById('sse-dot');
  let es;

  function connect() {
    es = new EventSource('/events');
    es.addEventListener('hello', () => {
      dot.classList.remove('disconnected');
    });
    es.addEventListener('host.state_changed', (e) => {
      // Reload the page to reflect state changes
      // Future: HTMX swap individual tiles
      window.location.reload();
    });
    es.onerror = () => {
      dot.classList.add('disconnected');
      es.close();
      setTimeout(connect, 3000);
    };
  }

  connect();
})();