function initializeVersionCheck() {
  // Dummy data for the remote version (as if fetched from a server)
  const updateStrTemplate =
    "New version %VERSION% available, consider pulling the latest image";

  const checkVersion = (versionData, currentVersion) => {
    const fetchedVersionNumber =
      versionData?.amd64?.name.match(/\d+\.\d+\.\d+/)?.[0];

    if (currentVersion !== fetchedVersionNumber) {
      const updateStr = updateStrTemplate.replace(
        "%VERSION%",
        fetchedVersionNumber,
      );
      console.log(updateStr);
      const updateElement = document.getElementById("update-available");
      updateElement.title = updateStr;
      updateElement.toggleAttribute("hidden", false);
      updateElement.classList.remove("hidden"); // Remove the Tailwind `hidden` class
      updateElement.classList.add("block"); // Add the Tailwind `block` class
    } else {
      console.log(
        "No new version. Current version is up-to-date:",
        currentVersion,
      );
    }
  };

  const fetchVersionInfo = (currentVersion) => {
    fetch(`https://gordon-proxy.bamen.dev/version`)
      .then((response) => response.json())
      .then((versionData) => checkVersion(versionData, currentVersion))
      .catch((error) => console.error("Error fetching version:", error));
  };

  const init = () => {
    const currentVersionElement = document.getElementById("actual-version");
    if (!currentVersionElement) {
      console.log("Error: #actual-version element not found.");
      return;
    }
    const currentVersion = currentVersionElement.textContent.trim();
    if (!currentVersion) {
      console.log("Dev mode detected, skipping version check.");
      return;
    }
    fetchVersionInfo(currentVersion);
  };

  init();
}

document.addEventListener("DOMContentLoaded", initializeVersionCheck);