settings: make update information actually work

resources/js/settings.js

@@ -1,15 +1,20 @@
-const {ipcRenderer, remote} = require('electron');
+const {ipcRenderer, remote, shell} = require('electron');
 
 let currentVersion;
 let updateStatus;
+let updateInfo;
+let updateButton;
 
 ipcRenderer.on('current-version', (e, version) => {
     currentVersion.innerText = `Version: ${version.version}`;
 });
 
 ipcRenderer.on('updateStatus', (e, available, version) => {
+    console.log(available, version);
+    updateInfo = version;
     if (available) {
-        updateStatus.innerHTML = `A new update is available! <a href="https://github.com/ArisuOngaku/tabs/releases/v${version}">Click here to download manually</a>.`;
+        updateStatus.innerHTML = 'A new update is available!';
+        updateButton.classList.remove('hidden');
     } else {
         updateStatus.innerText = 'Tabs is up to date.';
     }
@@ -23,6 +28,11 @@ function save() {
 document.addEventListener('DOMContentLoaded', () => {
     currentVersion = document.getElementById('current-version');
     updateStatus = document.getElementById('update-status');
+    updateButton = document.getElementById('download-button');
+    updateButton.addEventListener('click', () => {
+        shell.openExternal(`https://github.com/ArisuOngaku/tabs/releases/tag/v${updateInfo.version}`)
+            .catch(console.error);
+    });
 
     ipcRenderer.send('syncSettings');
     ipcRenderer.send('checkForUpdates');

resources/settings.html

@@ -26,6 +26,7 @@
         <div class="updates">
             <p id="current-version"></p>
             <p id="update-status">Loading...</p>
+            <button id="download-button" type="button" class="hidden">Download</button>
         </div>
     </div>
 

src/Updater.js

@@ -1,20 +1,18 @@
 import {autoUpdater} from "electron-updater";
 
 export default class Updater {
-    #callback = (available, data) => {
-        console.log('Update:', available, data);
-    };
+    #updateInfo;
 
     constructor() {
         autoUpdater.autoDownload = false;
         autoUpdater.on('error', err => {
-            this.#callback(false, err);
+            this.notifyUpdate(false, err);
         });
         autoUpdater.on('update-available', v => {
-            this.#callback(true, v);
+            this.notifyUpdate(true, v);
         });
         autoUpdater.on('update-not-available', () => {
-            this.#callback(false);
+            this.notifyUpdate(false);
         });
     }
 
@@ -22,15 +20,24 @@ export default class Updater {
      * @param {Function} callback
      */
     checkForUpdates(callback) {
-        this.#callback = callback;
+        if (this.#updateInfo) {
+            callback(this.#updateInfo.version !== this.getCurrentVersion().raw, this.#updateInfo);
+            return;
+        }
+
         autoUpdater.checkForUpdates().then(r => {
-            this.#callback(false, r.updateInfo);
+            this.#updateInfo = r.updateInfo;
+            callback(r.updateInfo.version !== this.getCurrentVersion().raw, r.updateInfo);
         }).catch(err => {
-            this.#callback(false, err);
+            callback(false, err);
         });
     }
 
     getCurrentVersion() {
         return autoUpdater.currentVersion;
     }
+
+    notifyUpdate(available, data) {
+        console.log('Update:', available, data);
+    }
 }

src/main.js

@@ -234,7 +234,7 @@ async function createWindow() {
             let checkForUpdatesListener;
             ipcMain.on('checkForUpdates', checkForUpdatesListener = (e) => {
                 updater.checkForUpdates((available, version) => {
-                    ipcMain.emit('updateStatus', available, version);
+                    settingsWindow.webContents.send('updateStatus', available, version);
                 });
             });
             settingsWindow.on('close', () => {