finish update dialog

electron/updateCheck.js

@@ -1,13 +1,16 @@
 const semver = require("semver");
 const { appVersion } = require("./appInfo");
 
-const repoUrl =
+const repoApiUrl =
   "https://git.ez-pp.farm/api/v1/repos/EZPPFarm/EZPPLauncher/releases?limit=1";
 
+const releasesUrl =
+  "https://git.ez-pp.farm/EZPPFarm/EZPPLauncher/releases/latest";
+
 module.exports = {
   updateAvailable: async () => {
     try {
-      const latestRelease = await fetch(repoUrl);
+      const latestRelease = await fetch(repoApiUrl);
       const json = await latestRelease.json();
       if (json.length <= 0) return false;
       return {
@@ -18,4 +21,5 @@ module.exports = {
       return { update: false };
     }
   },
+  releasesUrl,
 };

main.js

@@ -1,5 +1,7 @@
 // Modules to control application life and create native browser window
-const { app, BrowserWindow, Menu, ipcMain, dialog } = require("electron");
+const { app, BrowserWindow, Menu, ipcMain, dialog, shell } = require(
+  "electron",
+);
 const path = require("path");
 const serve = require("electron-serve");
 const loadURL = serve({ directory: "public" });
@@ -31,7 +33,7 @@ const richPresence = require("./electron/richPresence");
 const cryptUtil = require("./electron/cryptoUtil");
 const { getHwId } = require("./electron/hwidUtil");
 const { appName, appVersion } = require("./electron/appInfo");
-const { updateAvailable } = require("./electron/updateCheck");
+const { updateAvailable, releasesUrl } = require("./electron/updateCheck");
 
 // Keep a global reference of the window object, if you don't, the window will
 // be closed automatically when the JavaScript object is garbage collected.
@@ -319,6 +321,11 @@ function registerIPCPipes() {
     return config.all();
   });
 
+  ipcMain.handle("ezpplauncher:exitAndUpdate", async (e) => {
+    await shell.openExternal(releasesUrl);
+    app.exit();
+  });
+
   ipcMain.handle("ezpplauncher:launch", async (e) => {
     const configPatch = config.get("patch");
     patch = configPatch != undefined ? configPatch == "true" : true;
@@ -580,7 +587,7 @@ function createWindow() {
   // Open the DevTools and also disable Electron Security Warning.
   if (isDev()) {
     process.env["ELECTRON_DISABLE_SECURITY_WARNINGS"] = true;
-    // mainWindow.webContents.openDevTools({ mode: "detach" });
+    mainWindow.webContents.openDevTools({ mode: "detach" });
   }
 
   // Emitted when the window is closed.
@@ -595,7 +602,7 @@ function createWindow() {
   // This helps in showing the window gracefully.
   mainWindow.once("ready-to-show", async () => {
     const updateInfo = await updateAvailable();
-    if (!updateInfo.update) {
+    if (updateInfo.update) {
       mainWindow.webContents.send("ezpplauncher:update", updateInfo.release);
     }
     mainWindow.show();

package-lock.json

@@ -22,6 +22,7 @@
         "regedit-rs": "^1.0.2",
         "semver": "^7.5.4",
         "svelte-french-toast": "^1.2.0",
+        "sweetalert2": "^11.10.3",
         "systeminformation": "^5.21.22"
       },
       "devDependencies": {
@@ -8484,6 +8485,15 @@
       "integrity": "sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==",
       "dev": true
     },
+    "node_modules/sweetalert2": {
+      "version": "11.10.3",
+      "resolved": "https://registry.npmjs.org/sweetalert2/-/sweetalert2-11.10.3.tgz",
+      "integrity": "sha512-mZYtQR7v+khyEruq0SsVUa6XIdI9Aue8s2XAIpAwdlLN1T0w7mxKEjyubiBZ3/bLbHC/wGS4wNABvXWubCizvA==",
+      "funding": {
+        "type": "individual",
+        "url": "https://github.com/sponsors/limonte"
+      }
+    },
     "node_modules/systeminformation": {
       "version": "5.21.22",
       "resolved": "https://registry.npmjs.org/systeminformation/-/systeminformation-5.21.22.tgz",

package.json

@@ -49,6 +49,7 @@
     "regedit-rs": "^1.0.2",
     "semver": "^7.5.4",
     "svelte-french-toast": "^1.2.0",
+    "sweetalert2": "^11.10.3",
     "systeminformation": "^5.21.22"
   },
   "devDependencies": {

preload.js

@@ -82,6 +82,10 @@ window.addEventListener("settings-set", async (e) => {
   await ipcRenderer.invoke("ezpplauncher:settings-set", e.detail);
 });
 
+window.addEventListener("updateExit", async () => {
+  await ipcRenderer.invoke("ezpplauncher:exitAndUpdate");
+});
+
 ipcRenderer.addListener("ezpplauncher:launchabort", (e, args) => {
   window.dispatchEvent(
     new CustomEvent("launch-abort"),

src/App.svelte

@@ -6,7 +6,6 @@
     DropdownHeader,
     DropdownDivider,
     Button,
-    Modal,
     Indicator,
   } from "flowbite-svelte";
   import {
@@ -30,11 +29,11 @@
   import toast, { Toaster } from "svelte-french-toast";
   import type { User } from "./types/user";
   import Settings from "./pages/Settings.svelte";
+  import Swal from "sweetalert2";
 
   let user: User | undefined = undefined;
   let loggedIn = false;
 
-  let showUpdateDialog = false;
   let updateInfo: Record<string, unknown>;
 
   currentUser.subscribe((newUser) => {
@@ -54,14 +53,17 @@
     });
   };
 
-  window.addEventListener("update", (e) => {
+  window.addEventListener("update", async (e) => {
     const update = (e as CustomEvent).detail;
-    setTimeout(() => {
+    await Swal.fire({
-      showUpdateDialog = true;
+      html: `EZPPLauncher ${update.tag_name} is now available!<br>Click the Button bellow to download the latest release!`,
-      updateInfo = update;
+      title: "It's your lucky day!",
-
+      allowOutsideClick: false,
-      document.getElementById("updateDialog")?.blur();
+      allowEscapeKey: false,
-    }, 2000);
+      allowEnterKey: false,
+      confirmButtonText: "Thanks!",
+    });
+    window.dispatchEvent(new CustomEvent("updateExit"));
   });
 
   window.addEventListener("launchStatusUpdate", (e) => {
@@ -117,8 +119,7 @@
 
 <Toaster></Toaster>
 
-<!-- TODO: Update dialog-->
+{#if !updateInfo}
-
   <div class="p-2 flex flex-row justify-between items-center">
     <div class="flex flex-row items-center animate-fadeIn opacity-0">
       {#if $currentPage == Page.Settings}
@@ -218,3 +219,4 @@
   {:else}
     <Launch />
   {/if}
+{/if}

src/app.pcss

@@ -58,6 +58,15 @@ html .cet-titlebar .cet-control-icon svg {
     background-color: #202020 !important;
     color: #ececec !important;
   }
+
+  .swal2-container {
+    background: #202020 !important;
+  }
+
+  .swal2-container .swal2-popup {
+    background: #323232 !important;
+    color: #fff !important;
+  }
 }
 
 .animatedProgress div {