feat: visual feedback when checking for updates

closes #242
blib-la · Apr 30, 2024 · 2f206d5 · 2f206d5
1 parent 80be4c9
commit 2f206d5
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 3 deletions.
diff --git a/src/client/pages/[locale]/core/settings.tsx b/src/client/pages/[locale]/core/settings.tsx
@@ -1,7 +1,10 @@
 import { CustomScrollbars } from "@captn/joy/custom-scrollbars";
+import RestartAltIcon from "@mui/icons-material/RestartAlt";
+import UpdateIcon from "@mui/icons-material/Update";
 import Button from "@mui/joy/Button";
 import Card from "@mui/joy/Card";
 import CardContent from "@mui/joy/CardContent";
+import CircularProgress from "@mui/joy/CircularProgress";
 import Container from "@mui/joy/Container";
 import List from "@mui/joy/List";
 import ListItem from "@mui/joy/ListItem";
@@ -121,23 +124,34 @@ export function AutoUpdate() {
 	const { t } = useTranslation(["labels", "texts"]);
 	const [available, setAvailable] = useState(false);
 	const [downloaded, setDownloaded] = useState(false);
+	const [loading, setLoading] = useState(false);
 
 	useEffect(() => {
 		const unsubscribeAvailable = window.ipc.on(
 			buildKey([ID.UPDATE], { suffix: ":available" }),
 			() => {
+				setLoading(false);
 				setAvailable(true);
 			}
 		);
 
+		const unsubscribeNotAvailable = window.ipc.on(
+			buildKey([ID.UPDATE], { suffix: ":not-available" }),
+			() => {
+				setLoading(false);
+			}
+		);
+
 		const unsubscribeDownloaded = window.ipc.on(
 			buildKey([ID.UPDATE], { suffix: ":downloaded" }),
 			() => {
+				setLoading(false);
 				setDownloaded(true);
 			}
 		);
 
 		return () => {
+			unsubscribeNotAvailable();
 			unsubscribeAvailable();
 			unsubscribeDownloaded();
 		};
@@ -155,10 +169,15 @@ export function AutoUpdate() {
 								{t("texts:keepCaptainUpToDate")}
 							</Typography>
 						</ListItemContent>
-						<ListItemDecorator sx={{ width: 172, flexShrink: 0 }}>
+						<ListItemDecorator sx={{ width: 200, flexShrink: 0 }}>
 							{available && !downloaded && (
 								<Button
+									fullWidth
+									disabled={loading}
+									startDecorator={loading ? <CircularProgress /> : <UpdateIcon />}
+									sx={{ whiteSpace: "nowrap" }}
 									onClick={() => {
+										setLoading(true);
 										window.ipc.send(
 											buildKey([ID.UPDATE], { suffix: ":download" }),
 											true
@@ -171,6 +190,9 @@ export function AutoUpdate() {
 
 							{downloaded && (
 								<Button
+									fullWidth
+									startDecorator={<RestartAltIcon />}
+									sx={{ whiteSpace: "nowrap" }}
 									onClick={() => {
 										window.ipc.send(
 											buildKey([ID.UPDATE], { suffix: ":install" }),
@@ -184,7 +206,12 @@ export function AutoUpdate() {
 
 							{!available && !downloaded && (
 								<Button
+									fullWidth
+									disabled={loading}
+									startDecorator={loading ? <CircularProgress /> : <UpdateIcon />}
+									sx={{ whiteSpace: "nowrap" }}
 									onClick={() => {
+										setLoading(true);
 										window.ipc.send(
 											buildKey([ID.UPDATE], { suffix: ":check" }),
 											true

diff --git a/src/electron/helpers/ipc/update.ts b/src/electron/helpers/ipc/update.ts
@@ -2,16 +2,20 @@ import { ipcMain } from "electron";
 
 import { buildKey } from "#/build-key";
 import { ID } from "#/enums";
+import { logger } from "@/services/logger";
 import { checkCoreUpdates, downloadCoreUpdate, restartAndInstall } from "@/utils/update";
 
 ipcMain.on(buildKey([ID.UPDATE], { suffix: ":check" }), async () => {
+	logger.info("checking for Captain update");
 	await checkCoreUpdates();
 });
 
 ipcMain.on(buildKey([ID.UPDATE], { suffix: ":download" }), async () => {
+	logger.info("downloading Captain update");
 	await downloadCoreUpdate();
 });
 
 ipcMain.on(buildKey([ID.UPDATE], { suffix: ":install" }), () => {
+	logger.info("installing Captain update");
 	restartAndInstall();
 });
diff --git a/src/electron/helpers/utils/update.ts b/src/electron/helpers/utils/update.ts
@@ -3,7 +3,6 @@ import { autoUpdater } from "electron-updater";
 
 import { buildKey } from "#/build-key";
 import { ID } from "#/enums";
-import { isDevelopment } from "#/flags";
 import type { Resource } from "#/types/install";
 import type { Manifest, OS } from "#/types/manifest";
 import { logger } from "@/services/logger";
@@ -45,7 +44,7 @@ export function listenForUpdates() {
 	autoUpdater.autoDownload = false;
 
 	// For local development without the need to pack the application
-	autoUpdater.forceDevUpdateConfig = isDevelopment;
+	// autoUpdater.forceDevUpdateConfig = isDevelopment;
 
 	autoUpdater.on("update-available", data => {
 		logger.info(`auto-update: update available`);
@@ -73,6 +72,8 @@ export function listenForUpdates() {
 	// TODO adjust implementation
 	autoUpdater.on("update-not-available", data => {
 		logger.info("auto-update: on -> update-not-available", data);
+		const window_ = BrowserWindow.getFocusedWindow();
+		window_!.webContents.send(buildKey([ID.UPDATE], { suffix: ":not-available" }), data);
 	});
 
 	// TODO adjust implementation