check the version in about menu

themes/browser/base/content/aboutDialog.css

@@ -43,13 +43,39 @@
 }
 
 #version {
-  font-weight: bold;
+  display: flex;
+  align-items: center;
   margin-bottom: 4px;
+}
+
+#versionNumber {
+  font-weight: bold;
   user-select: text;
   -moz-user-focus: normal;
   cursor: text;
+  margin-right: 4px;
 }
 
 #aboutText {
   margin-top: 4px;
 }
+
+.loader {
+  width: 0.9em;
+  height: 0.9em;
+  border: 1.5px solid #fff;
+  border-bottom-color: transparent;
+  border-radius: 50%;
+  display: inline-block;
+  box-sizing: border-box;
+  animation: rotate 0.6s linear infinite;
+}
+
+@keyframes rotate {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}

themes/browser/base/content/aboutDialog.js

@@ -4,19 +4,11 @@
 
 "use strict";
 
-/* import-globals-from aboutDialog-appUpdater.js */
-
 // Services = object with smart getters for common XPCOM services
 var { Services } = ChromeUtils.import("resource://gre/modules/Services.jsm");
 var { AppConstants } = ChromeUtils.import(
   "resource://gre/modules/AppConstants.jsm"
 );
-if (AppConstants.MOZ_UPDATER) {
-  Services.scriptloader.loadSubScript(
-    "chrome://browser/content/aboutDialog-appUpdater.js",
-    this
-  );
-}
 
 async function init(aEvent) {
   if (aEvent.target != document) {
@@ -49,33 +41,64 @@ async function init(aEvent) {
     }
   }
 
-  // Include the build ID and display warning if this is an "a#" (nightly or aurora) build
+  // Display current version number
-  let versionId = "aboutDialog-version";
+  let versionField = document.getElementById("versionNumber");
-  let versionAttributes = {
+  versionField.innerHTML = AppConstants.MOZ_APP_VERSION_DISPLAY;
-    version: AppConstants.MOZ_APP_VERSION_DISPLAY,
-    bits: Services.appinfo.is64Bit ? 64 : 32,
-  };
 
-  let version = Services.appinfo.version;
+  // If pref "librewolf.aboutMenu.checkVersion" is set to true,
-  if (/a\d+$/.test(version)) {
+  // check for new version with the link given in "librewolf.aboutMenu.versionCheckGitlabUrl"
-    versionId = "aboutDialog-version-nightly";
+  if (Services.prefs.getBoolPref("librewolf.aboutMenu.checkVersion", false)) {
-    let buildID = Services.appinfo.appBuildID;
+    let versionDiv = document.getElementById("version");
-    let year = buildID.slice(0, 4);
+    const loader = document.createElement("div");
-    let month = buildID.slice(4, 6);
+    loader.classList.add("loader");
-    let day = buildID.slice(6, 8);
+    versionDiv.appendChild(loader);
-    versionAttributes.isodate = `${year}-${month}-${day}`;
 
-    document.getElementById("experimental").hidden = false;
+    function isNewerVersion(newVersionString, oldVersionString) {
-    document.getElementById("communityDesc").hidden = true;
+      let [oldVersion, oldRelease] = oldVersionString.replace(/^v/, "").split("-");
+      let [newVersion, newRelease] = newVersionString.replace(/^v/, "").split("-");
+      console.log(oldVersionString, newVersionString)
+      if (oldVersion && newVersion) {
+        if (!oldRelease) oldRelease = "0";
+        if (!newRelease) newRelease = "0";
+
+        // Check version
+        for (let i = 0; i < newVersion.split(".").length; i++) {
+          if (Number(newVersion.split(".")[i]) > Number(oldVersion?.split(".")[i] || "0")) return true;
+        }
+
+        // Check release
+        if (Number(newRelease) > Number(oldRelease)) return true;
+      }
+      return false;
+    }
+
+    fetch(
+      Services.prefs.getStringPref(
+        "librewolf.aboutMenu.versionCheckGitlabUrl",
+        "https://gitlab.com/api/v4/projects/32320088/releases"
+      )
+    )
+      .then(response => response.json())
+      .then(data => {
+        if (data.length > 0) {
+          const latestVersion = data[0].tag_name;
+          if (isNewerVersion(latestVersion, AppConstants.MOZ_APP_VERSION_DISPLAY)) {
+            const updateNotice = document.createElement("a");
+            updateNotice.classList.add("text-link");
+            updateNotice.href = data[0]._links.self;
+            updateNotice.onclick = () => window.openWebLinkIn(data[0]._links.self, "tab")
+            updateNotice.innerText = "(Update available)";
+            versionDiv.appendChild(updateNotice);
+          } else {
+            const upToDateNotice = document.createElement("div")
+            upToDateNotice.innerText = "(Up to date)";
+            versionDiv.appendChild(upToDateNotice);
+          }
+        }
+        loader.remove();
+      })
   }
 
-  // Use Fluent arguments for append version and the architecture of the build
-  let versionField = document.getElementById("version");
-
-  document.l10n.setAttributes(versionField, versionId, versionAttributes);
-
-  await document.l10n.translateElements([versionField]);
-
   window.sizeToContent();
 
   if (AppConstants.platform == "macosx") {
@@ -85,3 +108,4 @@ async function init(aEvent) {
     );
   }
 }
+ 

themes/browser/base/content/aboutDialog.xhtml

@@ -37,7 +37,9 @@
     <div id="left" />
     <div id="right">
       <label id="wordmark">LibreWolf</label>
-      <label id="version" />
+      <div id="version">
+        <label id="versionNumber" />
+      </div >
       <label id="distribution" />
       <label id="distributionId" />
       <label id="aboutText">