improvements/simplification to the update check

src/public/app/widgets/buttons/global_menu.js

@@ -1,7 +1,6 @@
 import BasicWidget from "../basic_widget.js";
 import utils from "../../services/utils.js";
 import UpdateAvailableWidget from "./update_available.js";
-const axios = require("axios");
 
 const TPL = `
 <div class="dropdown global-menu dropright">
@@ -12,7 +11,7 @@ const TPL = `
     }
     
     .global-menu .dropdown-menu {
-        width: 20em;
+        min-width: 20em;
     }
     
     .global-menu-button {
@@ -105,9 +104,10 @@ const TPL = `
             About Trilium Notes
         </a>
 
-        <a class="dropdown-item show-about-dialog-button">
+        <a class="dropdown-item update-to-latest-version-button" data-trigger-command="downloadLatestVersion">
             <span class="bx bx-sync"></span>
-            Update to newest version
+
+            <span class="version-text"></span>
         </a>
 
         <a class="dropdown-item logout-button" data-trigger-command="logout">
@@ -117,21 +117,12 @@ const TPL = `
     </div>
 </div>
 `;
-const RELEASES_API_URL = "https://api.github.com/repos/zadam/trilium/releases/latest";
-const CURRENT_VERSION = process.env.npm_package_version;
 
 export default class GlobalMenuWidget extends BasicWidget {
-    static getVersionChange(oldVersion, newVersion) {
+    constructor() {
-        const [oldMajor, oldMinor, oldPatch] = oldVersion.split(".").map(Number);
+        super();
-        const [newMajor, newMinor, newPatch] = newVersion.split(".").map(Number);
 
-        if (newMajor !== oldMajor) {
+        this.updateAvailableWidget = new UpdateAvailableWidget();
-            return "major";
-        } else if (newMinor !== oldMinor) {
-            return "minor";
-        } else if (newPatch !== oldPatch) {
-            return "patch";
-        }
     }
 
     doRender() {
@@ -154,28 +145,36 @@ export default class GlobalMenuWidget extends BasicWidget {
         this.$widget.on('click', '.dropdown-item',
             () => this.$widget.find("[data-toggle='dropdown']").dropdown('toggle'));
 
-        this.loadUpdateAvailable();
-    }
-
-    async loadUpdateAvailable() {
-        const newVersion = await this.fetchNewVersion();
-
-        if (!newVersion) {
-            return;
-        }
-
-        const versionChange = "major";
-
         this.$widget.find(".global-menu-button-update-available").append(
-            new UpdateAvailableWidget()
+            this.updateAvailableWidget.render()
-                .withVersionChange(versionChange)
+        );
-                .render()
+
-        )
+        this.$updateToLatestVersionButton = this.$widget.find(".update-to-latest-version-button");
+
+        this.updateVersionStatus();
+
+        setInterval(() => this.updateVersionStatus(), 8 * 60 * 60 * 1000);
     }
 
-    async fetchNewVersion() {
+    async updateVersionStatus() {
-        const {data} = await axios.get(RELEASES_API_URL);
+        const latestVersion = await this.fetchLatestVersion();
+
+        this.updateAvailableWidget.updateVersionStatus(latestVersion);
+
+        this.$updateToLatestVersionButton.toggle(latestVersion > glob.triliumVersion);
+        this.$updateToLatestVersionButton.find(".version-text").text(`Version ${latestVersion} is available, click to download.`);
+    }
+
+    async fetchLatestVersion() {
+        const RELEASES_API_URL = "https://api.github.com/repos/zadam/trilium/releases/latest";
+
+        const resp = await fetch(RELEASES_API_URL);
+        const data = await resp.json();
 
         return data.tag_name.substring(1);
     }
+
+    downloadLatestVersionCommand() {
+        window.open("https://github.com/zadam/trilium/releases/latest");
+    }
 }

src/public/app/widgets/buttons/update_available.js

@@ -1,7 +1,7 @@
 import BasicWidget from "../basic_widget.js";
 
 const TPL = `
-    <span class="bx bx-sync global-menu-button-update-available-button" title="Update available"></span>
+<div style="display: none;">
     <style>
         .global-menu-button-update-available-button {
             width: 21px !important;
@@ -22,49 +22,17 @@ const TPL = `
             opacity: 1;
         }
     </style>
-`
+    
-const VERSION_CHANGE_COLOR_MAP = {
+    <span class="bx bx-sync global-menu-button-update-available-button" title="Update available"></span>
-    patch: "#666666",
+</div>
-    minor: "#5bc625",
+`;
-    major: "#ec2f2f"
-}
-const VERSION_CHANGE_BACKGROUND_COLOR_MAP = Object.fromEntries(
-    Object.entries(
-        VERSION_CHANGE_COLOR_MAP).map(([key, value]) => [
-            key,
-            `${value}40`
-        ]
-    )
-)
 
 export default class UpdateAvailableWidget extends BasicWidget {
-    versionChange = undefined
-
     doRender() {
         this.$widget = $(TPL);
-
-        this.setButton();
     }
 
-    setButton() {
+    updateVersionStatus(latestVersion) {
-        switch (this.versionChange) {
+        this.$widget.toggle(latestVersion > glob.triliumVersion);
-            case "major":
-            case "minor":
-            case "patch":
-                this.$widget.show();
-                this.$widget.css({
-                    color: VERSION_CHANGE_COLOR_MAP[this.versionChange],
-                    backgroundColor: VERSION_CHANGE_BACKGROUND_COLOR_MAP[this.versionChange]
-                });
-                break;
-            default:
-                this.$widget.hide();
-        }
-    }
-
-    withVersionChange(versionChange) {
-        this.versionChange = versionChange;
-
-        return this;
     }
 }

src/routes/index.js

@@ -36,7 +36,8 @@ function index(req, res) {
         isMainWindow: !req.query.extra,
         extraHoistedNoteId: req.query.extraHoistedNoteId,
         isProtectedSessionAvailable: protectedSessionService.isProtectedSessionAvailable(),
-        maxContentWidth: parseInt(options.maxContentWidth)
+        maxContentWidth: parseInt(options.maxContentWidth),
+        triliumVersion: process.env.npm_package_version
     });
 }
 

src/views/desktop.ejs

@@ -55,6 +55,7 @@
         isMainWindow: <%= isMainWindow %>,
         extraHoistedNoteId: '<%= extraHoistedNoteId %>',
         isProtectedSessionAvailable: <%= isProtectedSessionAvailable %>,
+        triliumVersion: "<%= triliumVersion %>"
     };
 </script>