feat: handle auto update for macos

package.json

@@ -1,6 +1,6 @@
 {
   "name": "hydralauncher",
-  "version": "1.2.4",
+  "version": "1.2.3",
   "description": "Hydra",
   "main": "./out/main/index.js",
   "author": "Los Broxas",

src/locales/en/translation.json

@@ -29,7 +29,8 @@
     "downloads": "Downloads",
     "search_results": "Search results",
     "settings": "Settings",
-    "version_available": "Version {{version}} available. Click here to restart and install."
+    "version_available_install": "Version {{version}} available. Click here to restart and install.",
+    "version_available_download": "Version {{version}} available. Click here to download."
   },
   "bottom_panel": {
     "no_downloads_in_progress": "No downloads in progress",

src/locales/es/translation.json

@@ -29,7 +29,8 @@
     "downloads": "Descargas",
     "search_results": "Resultados de búsqueda",
     "settings": "Ajustes",
-    "version_available": "Version {{version}} disponible. Haz clic aquí para reiniciar e instalar."
+    "version_available_install": "Version {{version}} disponible. Haz clic aquí para reiniciar e instalar.",
+    "version_available_download": "Version {{version}} disponible. Haz clic aquí para descargar."
   },
   "bottom_panel": {
     "no_downloads_in_progress": "Sin descargas en progreso",

src/locales/pt/translation.json

@@ -29,7 +29,8 @@
     "search_results": "Resultados da busca",
     "settings": "Ajustes",
     "home": "Início",
-    "version_available": "Versão {{version}} disponível. Clique aqui para reiniciar e instalar."
+    "version_available_install": "Versão {{version}} disponível. Clique aqui para reiniciar e instalar.",
+    "version_available_download": "Versão {{version}} disponível. Clique aqui para fazer o download."
   },
   "bottom_panel": {
     "no_downloads_in_progress": "Sem downloads em andamento",

src/main/constants.ts

@@ -28,6 +28,8 @@ export const databasePath = path.join(
 
 export const logsPath = path.join(app.getPath("appData"), "hydra", "logs");
 
+export const releasesPageUrl = "https://github.com/hydralauncher/hydra";
+
 export const seedsPath = app.isPackaged
   ? path.join(process.resourcesPath, "seeds")
   : path.join(__dirname, "..", "..", "seeds");

src/main/events/autoupdater/check-for-updates.ts

@@ -15,13 +15,15 @@ const mockValuesForDebug = () => {
 };
 
 const checkForUpdates = async (_event: Electron.IpcMainInvokeEvent) => {
-  autoUpdater
-    .once("update-available", (info: UpdateInfo) => {
-      sendEvent({ type: "update-available", info });
-    })
-    .once("update-downloaded", () => {
+  autoUpdater.once("update-available", (info: UpdateInfo) => {
+    sendEvent({ type: "update-available", info });
+  });
+
+  if (process.platform !== "darwin") {
+    autoUpdater.once("update-downloaded", () => {
       sendEvent({ type: "update-downloaded" });
     });
+  }
 
   if (app.isPackaged) {
     autoUpdater.checkForUpdates();

src/main/events/autoupdater/restart-and-install-update.ts

@@ -1,13 +1,18 @@
 import { app } from "electron";
 import { registerEvent } from "../register-event";
 import updater from "electron-updater";
+import { releasesPageUrl } from "@main/constants";
 
 const { autoUpdater } = updater;
 
 const restartAndInstallUpdate = async (_event: Electron.IpcMainInvokeEvent) => {
   autoUpdater.removeAllListeners();
   if (app.isPackaged) {
-    autoUpdater.quitAndInstall(true, true);
+    if (process.platform === "darwin") {
+      open(`${releasesPageUrl}`);
+    } else {
+      autoUpdater.quitAndInstall(true, true);
+    }
   }
 };
 

src/renderer/src/components/header/auto-update-sub-header.tsx

@@ -0,0 +1,67 @@
+import { useTranslation } from "react-i18next";
+import { useEffect, useState } from "react";
+import { SyncIcon } from "@primer/octicons-react";
+
+import * as styles from "./header.css";
+import { AppUpdaterEvents } from "@types";
+
+export function AutoUpdateSubHeader() {
+  const [showUpdateSubheader, setShowUpdateSubheader] = useState(false);
+  const [newVersion, setNewVersion] = useState("");
+  const [newVersionText, setNewVersionText] = useState("");
+
+  const { t } = useTranslation("header");
+
+  const handleClickNewUpdate = () => {
+    window.electron.restartAndInstallUpdate();
+  };
+
+  useEffect(() => {
+    if (window.electron.platform == "darwin") {
+      setNewVersionText(
+        t("version_available_download", { version: newVersion })
+      );
+    } else {
+      setNewVersionText(
+        t("version_available_install", { version: newVersion })
+      );
+    }
+  }, [t, newVersion]);
+
+  useEffect(() => {
+    const unsubscribe = window.electron.onAutoUpdaterEvent(
+      (event: AppUpdaterEvents) => {
+        if (event.type == "update-available") {
+          setNewVersion(event.info.version || "");
+        }
+
+        if (event.type == "update-downloaded") {
+          setShowUpdateSubheader(true);
+        }
+      }
+    );
+
+    window.electron.checkForUpdates();
+
+    return () => {
+      unsubscribe();
+    };
+  }, []);
+
+  return (
+    <>
+      {showUpdateSubheader && (
+        <header className={styles.subheader}>
+          <button
+            type="button"
+            className={styles.newVersionButton}
+            onClick={handleClickNewUpdate}
+          >
+            <SyncIcon size={12} />
+            <small>{newVersionText}</small>
+          </button>
+        </header>
+      )}
+    </>
+  );
+}

src/renderer/src/components/header/header.tsx

@@ -1,18 +1,13 @@
 import { useTranslation } from "react-i18next";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { useLocation, useNavigate } from "react-router-dom";
-import {
-  ArrowLeftIcon,
-  SearchIcon,
-  SyncIcon,
-  XIcon,
-} from "@primer/octicons-react";
+import { ArrowLeftIcon, SearchIcon, XIcon } from "@primer/octicons-react";
 
 import { useAppDispatch, useAppSelector } from "@renderer/hooks";
 
 import * as styles from "./header.css";
 import { clearSearch } from "@renderer/features";
-import { AppUpdaterEvents } from "@types";
+import { AutoUpdateSubHeader } from "./auto-update-sub-header";
 
 export interface HeaderProps {
   onSearch: (query: string) => void;
@@ -40,9 +35,6 @@ export function Header({ onSearch, onClear, search }: HeaderProps) {
 
   const [isFocused, setIsFocused] = useState(false);
 
-  const [showUpdateSubheader, setShowUpdateSubheader] = useState(false);
-  const [newVersion, setNewVersion] = useState("");
-
   const { t } = useTranslation("header");
 
   const title = useMemo(() => {
@@ -58,30 +50,6 @@ export function Header({ onSearch, onClear, search }: HeaderProps) {
     }
   }, [location.pathname, search, dispatch]);
 
-  const handleClickRestartAndUpdate = () => {
-    window.electron.restartAndInstallUpdate();
-  };
-
-  useEffect(() => {
-    const unsubscribe = window.electron.onAutoUpdaterEvent(
-      (event: AppUpdaterEvents) => {
-        if (event.type == "update-available") {
-          setNewVersion(event.info.version || "");
-        }
-
-        if (event.type == "update-downloaded") {
-          setShowUpdateSubheader(true);
-        }
-      }
-    );
-
-    window.electron.checkForUpdates();
-
-    return () => {
-      unsubscribe();
-    };
-  }, []);
-
   const focusInput = () => {
     setIsFocused(true);
     inputRef.current?.focus();
@@ -158,18 +126,7 @@ export function Header({ onSearch, onClear, search }: HeaderProps) {
           </div>
         </section>
       </header>
-      {showUpdateSubheader && (
-        <header className={styles.subheader}>
-          <button
-            type="button"
-            className={styles.newVersionButton}
-            onClick={handleClickRestartAndUpdate}
-          >
-            <SyncIcon size={12} />
-            <small>{t("version_available", { version: newVersion })}</small>
-          </button>
-        </header>
-      )}
+      <AutoUpdateSubHeader />
     </>
   );
 }