feat: implement archive deletion prompt and translations for confirmation messages

src/renderer/src/app.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import { Sidebar, BottomPanel, Header, Toast } from "@renderer/components";
 
 import {
@@ -26,6 +26,7 @@ import { useTranslation } from "react-i18next";
 import { UserFriendModal } from "./pages/shared-modals/user-friend-modal";
 import { useSubscription } from "./hooks/use-subscription";
 import { HydraCloudModal } from "./pages/shared-modals/hydra-cloud/hydra-cloud-modal";
+import { ArchiveDeletionModal } from "./pages/downloads/archive-deletion-error-modal";
 
 import {
   injectCustomCss,
@@ -80,6 +81,10 @@ export function App() {
 
   const { showSuccessToast } = useToast();
 
+  const [showArchiveDeletionModal, setShowArchiveDeletionModal] =
+    useState(false);
+  const [archivePaths, setArchivePaths] = useState<string[]>([]);
+
   useEffect(() => {
     Promise.all([
       levelDBService.get("userPreferences", null, "json"),
@@ -193,6 +198,10 @@ export function App() {
         dispatch(clearExtraction());
         updateLibrary();
       }),
+      window.electron.onArchiveDeletionPrompt((paths) => {
+        setArchivePaths(paths);
+        setShowArchiveDeletionModal(true);
+      }),
     ];
 
     return () => {
@@ -290,6 +299,12 @@ export function App() {
         feature={hydraCloudFeature}
       />
 
+      <ArchiveDeletionModal
+        visible={showArchiveDeletionModal}
+        archivePaths={archivePaths}
+        onClose={() => setShowArchiveDeletionModal(false)}
+      />
+
       {userDetails && (
         <UserFriendModal
           visible={isFriendsModalVisible}

src/renderer/src/declaration.d.ts

@@ -211,6 +211,10 @@ declare global {
     onExtractionProgress: (
       cb: (shop: GameShop, objectId: string, progress: number) => void
     ) => () => Electron.IpcRenderer;
+    onArchiveDeletionPrompt: (
+      cb: (archivePaths: string[]) => void
+    ) => () => Electron.IpcRenderer;
+    deleteArchive: (filePath: string) => Promise<boolean>;
     getDefaultWinePrefixSelectionPath: () => Promise<string | null>;
     createSteamShortcut: (shop: GameShop, objectId: string) => Promise<void>;
 

src/renderer/src/pages/downloads/archive-deletion-error-modal.tsx

@@ -0,0 +1,44 @@
+import { useTranslation } from "react-i18next";
+import { ConfirmationModal } from "@renderer/components";
+
+interface ArchiveDeletionModalProps {
+  visible: boolean;
+  archivePaths: string[];
+  onClose: () => void;
+}
+
+export function ArchiveDeletionModal({
+  visible,
+  archivePaths,
+  onClose,
+}: Readonly<ArchiveDeletionModalProps>) {
+  const { t } = useTranslation("downloads");
+
+  const fullFileName =
+    archivePaths.length > 0 ? (archivePaths[0].split(/[/\\]/).pop() ?? "") : "";
+
+  const maxLength = 40;
+  const fileName =
+    fullFileName.length > maxLength
+      ? `${fullFileName.slice(0, maxLength)}…`
+      : fullFileName;
+
+  const handleConfirm = async () => {
+    for (const archivePath of archivePaths) {
+      await window.electron.deleteArchive(archivePath);
+    }
+    onClose();
+  };
+
+  return (
+    <ConfirmationModal
+      visible={visible}
+      title={t("delete_archive_title", { fileName })}
+      descriptionText={t("delete_archive_description")}
+      confirmButtonLabel={t("yes")}
+      cancelButtonLabel={t("no")}
+      onConfirm={handleConfirm}
+      onClose={onClose}
+    />
+  );
+}

src/renderer/src/pages/downloads/download-group.scss

@@ -538,7 +538,7 @@
     border-radius: 4px;
 
     &--extraction {
-      background-color: #4caf50;
+      background-color: #fff;
     }
   }
 }

src/renderer/src/pages/downloads/downloads.tsx

@@ -40,11 +40,13 @@ export default function Downloads() {
   useEffect(() => {
     window.electron.onSeedingStatus((value) => setSeedingStatus(value));
 
-    const unsubscribe = window.electron.onExtractionComplete(() => {
+    const unsubscribeExtraction = window.electron.onExtractionComplete(() => {
       updateLibrary();
     });
 
-    return () => unsubscribe();
+    return () => {
+      unsubscribeExtraction();
+    };
   }, [updateLibrary]);
 
   const handleOpenGameInstaller = (shop: GameShop, objectId: string) =>

src/renderer/src/pages/game-details/hero/hero-panel.scss

@@ -83,7 +83,7 @@
 
     &--extraction {
       &::-webkit-progress-value {
-        background-color: #4caf50;
+        background-color: #fff;
       }
     }
   }