(() => {
  function render(island) {
    const count = island.getAttribute("data-project-count") || "0";
    const readout = island.querySelector("[data-island-readout]");
    if (readout) readout.textContent = `${count} persisted project${count === "1" ? "" : "s"}`;
  }

  function boot() {
    for (const island of document.querySelectorAll('[data-hemx-island="metrics"]')) render(island);
  }

  document.addEventListener("DOMContentLoaded", boot);
  document.addEventListener("hemx:after-settle", boot);
})();