refactor(decky-plugin, download-group): enhance extraction logging and improve button structure for download actions

refactor(download-group): improve button structure and maintain translations for download actions
feat: implement archive deletion prompt and translations for confirmation messages
2026-01-11 22:06:17 +00:00 · 2025-12-12 17:45:45 +02:00 · 2025-12-12 17:45:18 +02:00 · 2025-12-12 12:44:02 +02:00 · 2025-12-11 15:35:40 +02:00 · 2025-12-11 15:25:44 +02:00
35 changed files with 1297 additions and 415 deletions
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "hydralauncher",
-  "version": "3.7.4",
+  "version": "3.7.6",
  "description": "Hydra",
  "main": "./out/main/index.js",
  "author": "Los Broxas",
@@ -70,6 +70,7 @@
    "jsonwebtoken": "^9.0.2",
    "lodash-es": "^4.17.21",
    "lucide-react": "^0.544.0",
+    "node-7z": "^3.0.0",
    "parse-torrent": "^11.0.18",
    "rc-virtual-list": "^3.18.3",
    "react-dnd": "^16.0.1",
--- a/src/locales/en/translation.json
+++ b/src/locales/en/translation.json
@@ -115,6 +115,7 @@
    "downloading": "Downloading {{title}}… ({{percentage}} complete) - Completion {{eta}} - {{speed}}",
    "calculating_eta": "Downloading {{title}}… ({{percentage}} complete) - Calculating remaining time…",
    "checking_files": "Checking {{title}} files… ({{percentage}} complete)",
+    "extracting": "Extracting {{title}}… ({{percentage}} complete)",
    "installing_common_redist": "{{log}}…",
    "installation_complete": "Installation complete",
    "installation_complete_message": "Common redistributables installed successfully"
@@ -202,6 +203,7 @@
    "danger_zone_section_description": "Remove this game from your library or the files downloaded by Hydra",
    "download_in_progress": "Download in progress",
    "download_paused": "Download paused",
+    "extracting": "Extracting",
    "last_downloaded_option": "Last downloaded option",
    "new_download_option": "New",
    "create_steam_shortcut": "Create Steam shortcut",
@@ -414,7 +416,11 @@
    "resume_seeding": "Resume seeding",
    "options": "Manage",
    "extract": "Extract files",
-    "extracting": "Extracting files…"
+    "extracting": "Extracting files…",
+    "delete_archive_title": "Would you like to delete {{fileName}}?",
+    "delete_archive_description": "The file has been successfully extracted and it's no longer needed.",
+    "yes": "Yes",
+    "no": "No"
  },
  "settings": {
    "downloads_path": "Downloads path",
--- a/src/locales/es/translation.json
+++ b/src/locales/es/translation.json
@@ -458,6 +458,7 @@
    "description_confirmation_delete_all_sources": "Vas a eliminar todas las fuentes de descargas",
    "button_delete_all_sources": "Eliminar todo",
    "added_download_source": "Añadir fuente de descarga",
+    "adding": "Añadiendo…",
    "download_sources_synced": "Todas las fuentes de descarga están sincronizadas",
    "insert_valid_json_url": "Introducí una URL de json válida",
    "found_download_option_zero": "Sin opciones de descargas encontrada",
@@ -563,6 +564,19 @@
    "debrid_description": "Los servicios Debrid son descargadores premium sin restricciones que te dejan descargar más rápido archivos alojados en servicios de alojamiento siendo que la única limitación es tu velocidad de internet.",
    "enable_friend_start_game_notifications": "Cuando un amigo está jugando un juego",
    "autoplay_trailers_on_game_page": "Reproducir trailers automáticamente en la página del juego",
+    "change_achievement_sound": "Cambiar sonido de logro",
+    "download_source_already_exists": "Esta fuente de descarga URL ya existe.",
+    "download_source_failed": "Error",
+    "download_source_matched": "Actualizado",
+    "download_source_matching": "Actualizando",
+    "download_source_no_information": "Sin información disponible",
+    "download_source_pending_matching": "Actualizando pronto",
+    "download_sources_synced_successfully": "Todas las fuentes de descarga están sincronizadas",
+    "failed_add_download_source": "Error al añadir la fuente de descarga. Por favor intentá de nuevo.",
+    "hydra_cloud": "Hydra Cloud",
+    "preview_sound": "Vista previa de sonido",
+    "remove_achievement_sound": "Eliminar sonido de logros",
+    "removed_all_download_sources": "Todas las fuentes de descarga eliminadas",
    "hide_to_tray_on_game_start": "Ocultar Hydra en la bandeja al iniciar un juego"
  },
  "notifications": {
--- a/src/locales/pt-BR/translation.json
+++ b/src/locales/pt-BR/translation.json
@@ -115,6 +115,7 @@
    "downloading": "Baixando {{title}}… ({{percentage}} concluído) - Conclusão {{eta}} - {{speed}}",
    "calculating_eta": "Baixando {{title}}… ({{percentage}} concluído) - Calculando tempo restante…",
    "checking_files": "Verificando arquivos de {{title}}…",
+    "extracting": "Extraindo {{title}}… ({{percentage}} concluído)",
    "installing_common_redist": "{{log}}…",
    "installation_complete": "Instalação concluída",
    "installation_complete_message": "Componentes recomendados instalados com sucesso"
@@ -190,6 +191,7 @@
    "danger_zone_section_description": "Remova o jogo da sua biblioteca ou os arquivos que foram baixados pelo Hydra",
    "download_in_progress": "Download em andamento",
    "download_paused": "Download pausado",
+    "extracting": "Extraindo",
    "last_downloaded_option": "Última opção baixada",
    "new_download_option": "Novo",
    "create_steam_shortcut": "Criar atalho na Steam",
@@ -402,7 +404,11 @@
    "resume_seeding": "Semear",
    "options": "Gerenciar",
    "extract": "Extrair arquivos",
-    "extracting": "Extraindo arquivos…"
+    "extracting": "Extraindo arquivos…",
+    "delete_archive_title": "Deseja deletar {{fileName}}?",
+    "delete_archive_description": "O arquivo foi extraído com sucesso e não é mais necessário.",
+    "yes": "Sim",
+    "no": "Não"
  },
  "settings": {
    "downloads_path": "Diretório dos downloads",
--- a/src/main/events/library/delete-archive.ts
+++ b/src/main/events/library/delete-archive.ts
@@ -0,0 +1,23 @@
+import fs from "node:fs";
+
+import { registerEvent } from "../register-event";
+import { logger } from "@main/services";
+
+const deleteArchive = async (
+  _event: Electron.IpcMainInvokeEvent,
+  filePath: string
+) => {
+  try {
+    if (fs.existsSync(filePath)) {
+      await fs.promises.unlink(filePath);
+      logger.info(`Deleted archive: ${filePath}`);
+      return true;
+    }
+    return true;
+  } catch (err) {
+    logger.error(`Failed to delete archive: ${filePath}`, err);
+    return false;
+  }
+};
+
+registerEvent("deleteArchive", deleteArchive);
--- a/src/main/events/library/extract-game-download.ts
+++ b/src/main/events/library/extract-game-download.ts
@@ -22,6 +22,7 @@ const extractGameDownload = async (
  await downloadsSublevel.put(gameKey, {
    ...download,
    extracting: true,
+    extractionProgress: 0,
  });

  const gameFilesManager = new GameFilesManager(shop, objectId);
--- a/src/main/events/library/index.ts
+++ b/src/main/events/library/index.ts
@@ -8,6 +8,7 @@ import "./close-game";
 import "./copy-custom-game-asset";
 import "./create-game-shortcut";
 import "./create-steam-shortcut";
+import "./delete-archive";
 import "./delete-game-folder";
 import "./extract-game-download";
 import "./get-default-wine-prefix-selection-path";
--- a/src/main/events/torrenting/resume-game-download.ts
+++ b/src/main/events/torrenting/resume-game-download.ts
@@ -13,7 +13,11 @@ const resumeGameDownload = async (

  const download = await downloadsSublevel.get(gameKey);

-  if (download?.status === "paused") {
+  if (
+    download &&
+    (download.status === "paused" || download.status === "active") &&
+    download.progress !== 1
+  ) {
    await DownloadManager.pauseDownload();

    for await (const [key, value] of downloadsSublevel.iterator()) {
--- a/src/main/events/torrenting/start-game-download.ts
+++ b/src/main/events/torrenting/start-game-download.ts
@@ -82,6 +82,7 @@ const startGameDownload = async (
    queued: true,
    extracting: false,
    automaticallyExtract,
+    extractionProgress: 0,
  };

  try {
--- a/src/main/main.ts
+++ b/src/main/main.ts
@@ -1,5 +1,5 @@
 import { downloadsSublevel } from "./level/sublevels/downloads";
-import { sortBy } from "lodash-es";
+import { orderBy } from "lodash-es";
 import { Downloader } from "@shared";
 import { levelKeys, db } from "./level";
 import type { UserPreferences } from "@types";
@@ -33,9 +33,7 @@ export const loadState = async () => {

  await import("./events");

-  if (process.platform !== "darwin") {
-    Aria2.spawn();
-  }
+  Aria2.spawn();

  if (userPreferences?.realDebridApiToken) {
    RealDebridClient.authorize(userPreferences.realDebridApiToken);
@@ -68,7 +66,7 @@ export const loadState = async () => {
    .values()
    .all()
    .then((games) => {
-      return sortBy(games, "timestamp", "DESC");
+      return orderBy(games, "timestamp", "desc");
    });

  downloads.forEach((download) => {
--- a/src/main/services/7zip.ts
+++ b/src/main/services/7zip.ts
@@ -1,5 +1,5 @@
 import { app } from "electron";
-import cp from "node:child_process";
+import Seven, { CommandLineSwitches } from "node-7z";
 import path from "node:path";
 import { logger } from "./logger";

@@ -9,6 +9,17 @@ export const binaryName = {
  win32: "7z.exe",
 };

+export interface ExtractionProgress {
+  percent: number;
+  fileCount: number;
+  file: string;
+}
+
+export interface ExtractionResult {
+  success: boolean;
+  extractedFiles: string[];
+}
+
 export class SevenZip {
  private static readonly binaryPath = app.isPackaged
    ? path.join(process.resourcesPath, binaryName[process.platform])
@@ -32,43 +43,109 @@ export class SevenZip {
      cwd?: string;
      passwords?: string[];
    },
-    successCb: () => void,
-    errorCb: () => void
-  ) {
-    const tryPassword = (index = -1) => {
-      const password = passwords[index] ?? "";
-      logger.info(`Trying password ${password} on ${filePath}`);
+    onProgress?: (progress: ExtractionProgress) => void
+  ): Promise<ExtractionResult> {
+    return new Promise((resolve, reject) => {
+      const tryPassword = (index = -1) => {
+        const password = passwords[index] ?? "";
+        logger.info(
+          `Trying password "${password || "(empty)"}" on ${filePath}`
+        );

-      const args = ["x", filePath, "-y", "-p" + password];
+        const extractedFiles: string[] = [];
+        let fileCount = 0;

-      if (outputPath) {
-        args.push("-o" + outputPath);
-      }
+        const options: CommandLineSwitches = {
+          $bin: this.binaryPath,
+          $progress: true,
+          yes: true,
+          password: password || undefined,
+        };

-      const child = cp.execFile(this.binaryPath, args, {
-        cwd,
-      });
-
-      child.once("exit", (code) => {
-        if (code === 0) {
-          successCb();
-          return;
+        if (outputPath) {
+          options.outputDir = outputPath;
        }

-        if (index < passwords.length - 1) {
+        const stream = Seven.extractFull(filePath, outputPath || cwd || ".", {
+          ...options,
+          $spawnOptions: cwd ? { cwd } : undefined,
+        });
+
+        stream.on("progress", (progress) => {
+          if (onProgress) {
+            onProgress({
+              percent: progress.percent,
+              fileCount: fileCount,
+              file: progress.fileCount?.toString() || "",
+            });
+          }
+        });
+
+        stream.on("data", (data) => {
+          if (data.file) {
+            extractedFiles.push(data.file);
+            fileCount++;
+          }
+        });
+
+        stream.on("end", () => {
          logger.info(
-            `Failed to extract file: ${filePath} with password: ${password}. Trying next password...`
+            `Successfully extracted ${filePath} (${extractedFiles.length} files)`
          );
+          resolve({
+            success: true,
+            extractedFiles,
+          });
+        });

-          tryPassword(index + 1);
-        } else {
-          logger.info(`Failed to extract file: ${filePath}`);
+        stream.on("error", (err) => {
+          logger.error(`Extraction error for ${filePath}:`, err);

-          errorCb();
+          if (index < passwords.length - 1) {
+            logger.info(
+              `Failed to extract file: ${filePath} with password: "${password}". Trying next password...`
+            );
+            tryPassword(index + 1);
+          } else {
+            logger.error(
+              `Failed to extract file: ${filePath} after trying all passwords`
+            );
+            reject(new Error(`Failed to extract file: ${filePath}`));
+          }
+        });
+      };
+
+      tryPassword();
+    });
+  }
+
+  public static listFiles(
+    filePath: string,
+    password?: string
+  ): Promise<string[]> {
+    return new Promise((resolve, reject) => {
+      const files: string[] = [];
+
+      const options: CommandLineSwitches = {
+        $bin: this.binaryPath,
+        password: password || undefined,
+      };
+
+      const stream = Seven.list(filePath, options);
+
+      stream.on("data", (data) => {
+        if (data.file) {
+          files.push(data.file);
        }
      });
-    };

-    tryPassword();
+      stream.on("end", () => {
+        resolve(files);
+      });
+
+      stream.on("error", (err) => {
+        reject(err);
+      });
+    });
  }
 }
--- a/src/main/services/aria2.ts
+++ b/src/main/services/aria2.ts
@@ -7,9 +7,12 @@ export class Aria2 {
  private static process: cp.ChildProcess | null = null;

  public static spawn() {
-    const binaryPath = app.isPackaged
-      ? path.join(process.resourcesPath, "aria2c")
-      : path.join(__dirname, "..", "..", "binaries", "aria2c");
+    const binaryPath =
+      process.platform === "darwin"
+        ? "aria2c"
+        : app.isPackaged
+          ? path.join(process.resourcesPath, "aria2c")
+          : path.join(__dirname, "..", "..", "binaries", "aria2c");

    this.process = cp.spawn(
      binaryPath,
--- a/src/main/services/decky-plugin.ts
+++ b/src/main/services/decky-plugin.ts
@@ -74,21 +74,16 @@ export class DeckyPlugin {

    await fs.promises.mkdir(extractPath, { recursive: true });

-    return new Promise((resolve, reject) => {
-      SevenZip.extractFile(
-        {
-          filePath: zipPath,
-          outputPath: extractPath,
-        },
-        () => {
-          logger.log(`Plugin extracted to: ${extractPath}`);
-          resolve(extractPath);
-        },
-        () => {
-          reject(new Error("Failed to extract plugin"));
-        }
-      );
-    });
+    try {
+      await SevenZip.extractFile({
+        filePath: zipPath,
+        outputPath: extractPath,
+      });
+      logger.log(`Plugin extracted to: ${extractPath}`);
+      return extractPath;
+    } catch {
+      throw new Error("Failed to extract plugin");
+    }
  }

  private static needsSudo(): boolean {
--- a/src/main/services/download/download-manager.ts
+++ b/src/main/services/download/download-manager.ts
@@ -20,7 +20,7 @@ import { RealDebridClient } from "./real-debrid";
 import path from "path";
 import { logger } from "../logger";
 import { db, downloadsSublevel, gamesSublevel, levelKeys } from "@main/level";
-import { sortBy } from "lodash-es";
+import { orderBy } from "lodash-es";
 import { TorBoxClient } from "./torbox";
 import { GameFilesManager } from "../game-files-manager";
 import { HydraDebridClient } from "./hydra-debrid";
@@ -126,21 +126,10 @@ export class DownloadManager {
        }
      );

-      if (WindowManager.mainWindow && download) {
-        WindowManager.mainWindow.setProgressBar(progress === 1 ? -1 : progress);
-        WindowManager.mainWindow.webContents.send(
-          "on-download-progress",
-          JSON.parse(
-            JSON.stringify({
-              ...status,
-              game,
-            })
-          )
-        );
-      }
-
      const shouldExtract = download.automaticallyExtract;

+      // Handle download completion BEFORE sending progress to renderer
+      // This ensures extraction starts and DB is updated before UI reacts
      if (progress === 1 && download) {
        publishDownloadCompleteNotification(game);

@@ -154,6 +143,7 @@ export class DownloadManager {
            shouldSeed: true,
            queued: false,
            extracting: shouldExtract,
+            extractionProgress: shouldExtract ? 0 : download.extractionProgress,
          });
        } else {
          await downloadsSublevel.put(gameId, {
@@ -162,12 +152,22 @@ export class DownloadManager {
            shouldSeed: false,
            queued: false,
            extracting: shouldExtract,
+            extractionProgress: shouldExtract ? 0 : download.extractionProgress,
          });

          this.cancelDownload(gameId);
        }

        if (shouldExtract) {
+          // Send initial extraction progress BEFORE download progress
+          // This ensures the UI shows extraction immediately
+          WindowManager.mainWindow?.webContents.send(
+            "on-extraction-progress",
+            game.shop,
+            game.objectId,
+            0
+          );
+
          const gameFilesManager = new GameFilesManager(
            game.shop,
            game.objectId
@@ -194,10 +194,10 @@ export class DownloadManager {
          .values()
          .all()
          .then((games) => {
-            return sortBy(
+            return orderBy(
              games.filter((game) => game.status === "paused" && game.queued),
              "timestamp",
-              "DESC"
+              "desc"
            );
          });

@@ -209,6 +209,18 @@ export class DownloadManager {
          this.downloadingGameId = null;
        }
      }
+
+      // Send progress to renderer after completion handling
+      if (WindowManager.mainWindow && download) {
+        WindowManager.mainWindow.setProgressBar(progress === 1 ? -1 : progress);
+        WindowManager.mainWindow.webContents.send(
+          "on-download-progress",
+          structuredClone({
+            ...status,
+            game,
+          })
+        );
+      }
    }
  }

--- a/src/main/services/game-files-manager.ts
+++ b/src/main/services/game-files-manager.ts
@@ -3,24 +3,58 @@ import fs from "node:fs";
 import type { GameShop } from "@types";
 import { downloadsSublevel, gamesSublevel, levelKeys } from "@main/level";
 import { FILE_EXTENSIONS_TO_EXTRACT } from "@shared";
-import { SevenZip } from "./7zip";
+import { SevenZip, ExtractionProgress } from "./7zip";
 import { WindowManager } from "./window-manager";
 import { publishExtractionCompleteNotification } from "./notifications";
 import { logger } from "./logger";

+const PROGRESS_THROTTLE_MS = 1000;
+
 export class GameFilesManager {
+  private lastProgressUpdate = 0;
+
  constructor(
    private readonly shop: GameShop,
    private readonly objectId: string
  ) {}

-  private async clearExtractionState() {
-    const gameKey = levelKeys.game(this.shop, this.objectId);
-    const download = await downloadsSublevel.get(gameKey);
+  private get gameKey() {
+    return levelKeys.game(this.shop, this.objectId);
+  }

-    await downloadsSublevel.put(gameKey, {
-      ...download!,
+  private async updateExtractionProgress(progress: number, force = false) {
+    const now = Date.now();
+
+    if (!force && now - this.lastProgressUpdate < PROGRESS_THROTTLE_MS) {
+      return;
+    }
+
+    this.lastProgressUpdate = now;
+
+    const download = await downloadsSublevel.get(this.gameKey);
+    if (!download) return;
+
+    await downloadsSublevel.put(this.gameKey, {
+      ...download,
+      extractionProgress: progress,
+    });
+
+    WindowManager.mainWindow?.webContents.send(
+      "on-extraction-progress",
+      this.shop,
+      this.objectId,
+      progress
+    );
+  }
+
+  private async clearExtractionState() {
+    const download = await downloadsSublevel.get(this.gameKey);
+    if (!download) return;
+
+    await downloadsSublevel.put(this.gameKey, {
+      ...download,
      extracting: false,
+      extractionProgress: 0,
    });

    WindowManager.mainWindow?.webContents.send(
@@ -30,6 +64,10 @@ export class GameFilesManager {
    );
  }

+  private readonly handleProgress = (progress: ExtractionProgress) => {
+    this.updateExtractionProgress(progress.percent / 100);
+  };
+
  async extractFilesInDirectory(directoryPath: string) {
    if (!fs.existsSync(directoryPath)) return;
    const files = await fs.promises.readdir(directoryPath);
@@ -42,53 +80,66 @@ export class GameFilesManager {
      (file) => /part1\.rar$/i.test(file) || !/part\d+\.rar$/i.test(file)
    );

-    await Promise.all(
-      filesToExtract.map((file) => {
-        return new Promise((resolve, reject) => {
-          SevenZip.extractFile(
-            {
-              filePath: path.join(directoryPath, file),
-              cwd: directoryPath,
-              passwords: ["online-fix.me", "steamrip.com"],
-            },
-            () => {
-              resolve(true);
-            },
-            () => {
-              reject(new Error(`Failed to extract file: ${file}`));
-              this.clearExtractionState();
-            }
-          );
-        });
-      })
-    );
+    if (filesToExtract.length === 0) return;

-    compressedFiles.forEach((file) => {
-      const extractionPath = path.join(directoryPath, file);
+    await this.updateExtractionProgress(0, true);

-      if (fs.existsSync(extractionPath)) {
-        fs.unlink(extractionPath, (err) => {
-          if (err) {
-            logger.error(`Failed to delete file: ${file}`, err);
+    const totalFiles = filesToExtract.length;
+    let completedFiles = 0;

-            this.clearExtractionState();
+    for (const file of filesToExtract) {
+      try {
+        const result = await SevenZip.extractFile(
+          {
+            filePath: path.join(directoryPath, file),
+            cwd: directoryPath,
+            passwords: ["online-fix.me", "steamrip.com"],
+          },
+          (progress) => {
+            const overallProgress =
+              (completedFiles + progress.percent / 100) / totalFiles;
+            this.updateExtractionProgress(overallProgress);
          }
-        });
+        );
+
+        if (result.success) {
+          completedFiles++;
+          await this.updateExtractionProgress(
+            completedFiles / totalFiles,
+            true
+          );
+        }
+      } catch (err) {
+        logger.error(`Failed to extract file: ${file}`, err);
+        await this.clearExtractionState();
+        return;
      }
-    });
+    }
+
+    const archivePaths = compressedFiles
+      .map((file) => path.join(directoryPath, file))
+      .filter((archivePath) => fs.existsSync(archivePath));
+
+    if (archivePaths.length > 0) {
+      WindowManager.mainWindow?.webContents.send(
+        "on-archive-deletion-prompt",
+        archivePaths
+      );
+    }
  }

  async setExtractionComplete(publishNotification = true) {
-    const gameKey = levelKeys.game(this.shop, this.objectId);
-
    const [download, game] = await Promise.all([
-      downloadsSublevel.get(gameKey),
-      gamesSublevel.get(gameKey),
+      downloadsSublevel.get(this.gameKey),
+      gamesSublevel.get(this.gameKey),
    ]);

-    await downloadsSublevel.put(gameKey, {
-      ...download!,
+    if (!download) return;
+
+    await downloadsSublevel.put(this.gameKey, {
+      ...download,
      extracting: false,
+      extractionProgress: 0,
    });

    WindowManager.mainWindow?.webContents.send(
@@ -97,17 +148,15 @@ export class GameFilesManager {
      this.objectId
    );

-    if (publishNotification) {
-      publishExtractionCompleteNotification(game!);
+    if (publishNotification && game) {
+      publishExtractionCompleteNotification(game);
    }
  }

  async extractDownloadedFile() {
-    const gameKey = levelKeys.game(this.shop, this.objectId);
-
    const [download, game] = await Promise.all([
-      downloadsSublevel.get(gameKey),
-      gamesSublevel.get(gameKey),
+      downloadsSublevel.get(this.gameKey),
+      gamesSublevel.get(this.gameKey),
    ]);

    if (!download || !game) return false;
@@ -119,39 +168,39 @@ export class GameFilesManager {
      path.parse(download.folderName!).name
    );

-    SevenZip.extractFile(
-      {
-        filePath,
-        outputPath: extractionPath,
-        passwords: ["online-fix.me", "steamrip.com"],
-      },
-      async () => {
+    await this.updateExtractionProgress(0, true);
+
+    try {
+      const result = await SevenZip.extractFile(
+        {
+          filePath,
+          outputPath: extractionPath,
+          passwords: ["online-fix.me", "steamrip.com"],
+        },
+        this.handleProgress
+      );
+
+      if (result.success) {
        await this.extractFilesInDirectory(extractionPath);

        if (fs.existsSync(extractionPath) && fs.existsSync(filePath)) {
-          fs.unlink(filePath, (err) => {
-            if (err) {
-              logger.error(
-                `Failed to delete file: ${download.folderName}`,
-                err
-              );
-
-              this.clearExtractionState();
-            }
-          });
+          WindowManager.mainWindow?.webContents.send(
+            "on-archive-deletion-prompt",
+            [filePath]
+          );
        }

-        await downloadsSublevel.put(gameKey, {
-          ...download!,
+        await downloadsSublevel.put(this.gameKey, {
+          ...download,
          folderName: path.parse(download.folderName!).name,
        });

-        this.setExtractionComplete();
-      },
-      () => {
-        this.clearExtractionState();
+        await this.setExtractionComplete();
      }
-    );
+    } catch (err) {
+      logger.error(`Failed to extract downloaded file: ${filePath}`, err);
+      await this.clearExtractionState();
+    }

    return true;
  }
--- a/src/main/services/hosters/gofile.ts
+++ b/src/main/services/hosters/gofile.ts
@@ -36,16 +36,13 @@ export class GofileApi {
  }

  public static async getDownloadLink(id: string) {
-    const searchParams = new URLSearchParams({
-      wt: WT,
-    });
-
    const response = await axios.get<{
      status: string;
      data: GofileContentsResponse;
-    }>(`https://api.gofile.io/contents/${id}?${searchParams.toString()}`, {
+    }>(`https://api.gofile.io/contents/${id}`, {
      headers: {
        Authorization: `Bearer ${this.token}`,
+        "X-Website-Token": WT,
      },
    });

--- a/src/main/services/hydra-api.ts
+++ b/src/main/services/hydra-api.ts
@@ -58,7 +58,13 @@ export class HydraApi {
    const decodedBase64 = atob(payload as string);
    const jsonData = JSON.parse(decodedBase64);

-    const { accessToken, expiresIn, refreshToken } = jsonData;
+    const {
+      accessToken,
+      expiresIn,
+      refreshToken,
+      featurebaseJwt,
+      workwondersJwt,
+    } = jsonData;

    const now = new Date();

@@ -85,6 +91,8 @@ export class HydraApi {
        accessToken,
        refreshToken,
        tokenExpirationTimestamp,
+        featurebaseJwt,
+        workwondersJwt,
      },
      { valueEncoding: "json" }
    );
--- a/src/main/services/node-7z.d.ts
+++ b/src/main/services/node-7z.d.ts
@@ -0,0 +1,87 @@
+declare module "node-7z" {
+  import { ChildProcess } from "node:child_process";
+  import { EventEmitter } from "node:events";
+
+  export interface CommandLineSwitches {
+    $bin?: string;
+    $progress?: boolean;
+    $spawnOptions?: {
+      cwd?: string;
+    };
+    outputDir?: string;
+    yes?: boolean;
+    password?: string;
+    [key: string]: unknown;
+  }
+
+  export interface ProgressInfo {
+    percent: number;
+    fileCount?: number;
+  }
+
+  export interface FileInfo {
+    file?: string;
+    [key: string]: unknown;
+  }
+
+  export interface ZipStream extends EventEmitter {
+    on(event: "progress", listener: (progress: ProgressInfo) => void): this;
+    on(event: "data", listener: (data: FileInfo) => void): this;
+    on(event: "end", listener: () => void): this;
+    on(event: "error", listener: (err: Error) => void): this;
+    info: Map<string, unknown>;
+    _childProcess?: ChildProcess;
+  }
+
+  export function extractFull(
+    archive: string,
+    output: string,
+    options?: CommandLineSwitches
+  ): ZipStream;
+
+  export function extract(
+    archive: string,
+    output: string,
+    options?: CommandLineSwitches
+  ): ZipStream;
+
+  export function list(
+    archive: string,
+    options?: CommandLineSwitches
+  ): ZipStream;
+
+  export function add(
+    archive: string,
+    files: string | string[],
+    options?: CommandLineSwitches
+  ): ZipStream;
+
+  export function update(
+    archive: string,
+    files: string | string[],
+    options?: CommandLineSwitches
+  ): ZipStream;
+
+  export function deleteFiles(
+    archive: string,
+    files: string | string[],
+    options?: CommandLineSwitches
+  ): ZipStream;
+
+  export function test(
+    archive: string,
+    options?: CommandLineSwitches
+  ): ZipStream;
+
+  const Seven: {
+    extractFull: typeof extractFull;
+    extract: typeof extract;
+    list: typeof list;
+    add: typeof add;
+    update: typeof update;
+    delete: typeof deleteFiles;
+    test: typeof test;
+  };
+
+  export default Seven;
+}
--- a/src/main/services/window-manager.ts
+++ b/src/main/services/window-manager.ts
@@ -138,7 +138,8 @@ export class WindowManager {
      (details, callback) => {
        if (
          details.webContentsId !== this.mainWindow?.webContents.id ||
-          details.url.includes("chatwoot")
+          details.url.includes("chatwoot") ||
+          details.url.includes("workwonders")
        ) {
          return callback(details);
        }
@@ -159,7 +160,8 @@ export class WindowManager {
        if (
          details.webContentsId !== this.mainWindow?.webContents.id ||
          details.url.includes("featurebase") ||
-          details.url.includes("chatwoot")
+          details.url.includes("chatwoot") ||
+          details.url.includes("workwonders")
        ) {
          return callback(details);
        }
--- a/src/preload/index.ts
+++ b/src/preload/index.ts
@@ -267,6 +267,29 @@ contextBridge.exposeInMainWorld("electron", {
    ipcRenderer.on("on-extraction-complete", listener);
    return () => ipcRenderer.removeListener("on-extraction-complete", listener);
  },
+  onExtractionProgress: (
+    cb: (shop: GameShop, objectId: string, progress: number) => void
+  ) => {
+    const listener = (
+      _event: Electron.IpcRendererEvent,
+      shop: GameShop,
+      objectId: string,
+      progress: number
+    ) => cb(shop, objectId, progress);
+    ipcRenderer.on("on-extraction-progress", listener);
+    return () => ipcRenderer.removeListener("on-extraction-progress", listener);
+  },
+  onArchiveDeletionPrompt: (cb: (archivePaths: string[]) => void) => {
+    const listener = (
+      _event: Electron.IpcRendererEvent,
+      archivePaths: string[]
+    ) => cb(archivePaths);
+    ipcRenderer.on("on-archive-deletion-prompt", listener);
+    return () =>
+      ipcRenderer.removeListener("on-archive-deletion-prompt", listener);
+  },
+  deleteArchive: (filePath: string) =>
+    ipcRenderer.invoke("deleteArchive", filePath),

  /* Hardware */
  getDiskFreeSpace: (path: string) =>
--- a/src/renderer/src/app.tsx
+++ b/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 {
@@ -19,11 +19,14 @@ import {
  setUserDetails,
  setProfileBackground,
  setGameRunning,
+  setExtractionProgress,
+  clearExtraction,
 } from "@renderer/features";
 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,
@@ -78,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"),
@@ -184,12 +191,23 @@ export function App() {
        updateLibrary();
      }),
      window.electron.onSignOut(() => clearUserDetails()),
+      window.electron.onExtractionProgress((shop, objectId, progress) => {
+        dispatch(setExtractionProgress({ shop, objectId, progress }));
+      }),
+      window.electron.onExtractionComplete(() => {
+        dispatch(clearExtraction());
+        updateLibrary();
+      }),
+      window.electron.onArchiveDeletionPrompt((paths) => {
+        setArchivePaths(paths);
+        setShowArchiveDeletionModal(true);
+      }),
    ];

    return () => {
      listeners.forEach((unsubscribe) => unsubscribe());
    };
-  }, [onSignIn, updateLibrary, clearUserDetails]);
+  }, [onSignIn, updateLibrary, clearUserDetails, dispatch]);

  useEffect(() => {
    if (contentRef.current) contentRef.current.scrollTop = 0;
@@ -281,6 +299,12 @@ export function App() {
        feature={hydraCloudFeature}
      />

+      <ArchiveDeletionModal
+        visible={showArchiveDeletionModal}
+        archivePaths={archivePaths}
+        onClose={() => setShowArchiveDeletionModal(false)}
+      />
+
      {userDetails && (
        <UserFriendModal
          visible={isFriendsModalVisible}
--- a/src/renderer/src/components/bottom-panel/bottom-panel.tsx
+++ b/src/renderer/src/components/bottom-panel/bottom-panel.tsx
@@ -2,6 +2,7 @@ import { useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";

 import {
+  useAppSelector,
  useDownload,
  useLibrary,
  useToast,
@@ -26,6 +27,8 @@ export function BottomPanel() {

  const { lastPacket, progress, downloadSpeed, eta } = useDownload();

+  const extraction = useAppSelector((state) => state.download.extraction);
+
  const [version, setVersion] = useState("");
  const [sessionHash, setSessionHash] = useState<null | string>("");
  const [commonRedistStatus, setCommonRedistStatus] = useState<string | null>(
@@ -68,6 +71,20 @@ export function BottomPanel() {
      return t("installing_common_redist", { log: commonRedistStatus });
    }

+    if (extraction) {
+      const extractingGame = library.find(
+        (game) => game.id === extraction.visibleId
+      );
+
+      if (extractingGame) {
+        const extractionPercentage = Math.round(extraction.progress * 100);
+        return t("extracting", {
+          title: extractingGame.title,
+          percentage: `${extractionPercentage}%`,
+        });
+      }
+    }
+
    const game = lastPacket
      ? library.find((game) => game.id === lastPacket?.gameId)
      : undefined;
@@ -109,6 +126,7 @@ export function BottomPanel() {
    eta,
    downloadSpeed,
    commonRedistStatus,
+    extraction,
  ]);

  return (
@@ -122,10 +140,10 @@ export function BottomPanel() {
      </button>

      <button
-        data-featurebase-changelog
+        data-open-workwonders-changelog-mini
        className="bottom-panel__version-button"
      >
-        <small data-featurebase-changelog>
+        <small>
          {sessionHash ? `${sessionHash} -` : ""} v{version} &quot;
          {VERSION_CODENAME}&quot;
        </small>
--- a/src/renderer/src/components/dropdown-menu/dropdown-menu.tsx
+++ b/src/renderer/src/components/dropdown-menu/dropdown-menu.tsx
@@ -18,6 +18,7 @@ interface DropdownMenuProps {
  side?: "top" | "bottom" | "left" | "right";
  align?: "start" | "center" | "end";
  alignOffset?: number;
+  collisionPadding?: number;
 }

 export function DropdownMenu({
@@ -29,6 +30,7 @@ export function DropdownMenu({
  loop = true,
  align = "center",
  alignOffset = 0,
+  collisionPadding = 16,
 }: Readonly<DropdownMenuProps>) {
  return (
    <DropdownMenuPrimitive.Root>
@@ -43,6 +45,7 @@ export function DropdownMenu({
          loop={loop}
          align={align}
          alignOffset={alignOffset}
+          collisionPadding={collisionPadding}
          className="dropdown-menu__content"
        >
          {title && (
--- a/src/renderer/src/declaration.d.ts
+++ b/src/renderer/src/declaration.d.ts
@@ -208,6 +208,13 @@ declare global {
    onExtractionComplete: (
      cb: (shop: GameShop, objectId: string) => void
    ) => () => Electron.IpcRenderer;
+    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>;

--- a/src/renderer/src/features/download-slice.ts
+++ b/src/renderer/src/features/download-slice.ts
@@ -1,17 +1,24 @@
 import { createSlice } from "@reduxjs/toolkit";
 import type { PayloadAction } from "@reduxjs/toolkit";
-import type { DownloadProgress } from "@types";
+import type { DownloadProgress, GameShop } from "@types";
+
+export interface ExtractionInfo {
+  visibleId: string;
+  progress: number;
+}

 export interface DownloadState {
  lastPacket: DownloadProgress | null;
  gameId: string | null;
  gamesWithDeletionInProgress: string[];
+  extraction: ExtractionInfo | null;
 }

 const initialState: DownloadState = {
  lastPacket: null,
  gameId: null,
  gamesWithDeletionInProgress: [],
+  extraction: null,
 };

 export const downloadSlice = createSlice({
@@ -38,6 +45,23 @@ export const downloadSlice = createSlice({
      const index = state.gamesWithDeletionInProgress.indexOf(action.payload);
      if (index >= 0) state.gamesWithDeletionInProgress.splice(index, 1);
    },
+    setExtractionProgress: (
+      state,
+      action: PayloadAction<{
+        shop: GameShop;
+        objectId: string;
+        progress: number;
+      }>
+    ) => {
+      const { shop, objectId, progress } = action.payload;
+      state.extraction = {
+        visibleId: `${shop}:${objectId}`,
+        progress,
+      };
+    },
+    clearExtraction: (state) => {
+      state.extraction = null;
+    },
  },
 });

@@ -46,4 +70,6 @@ export const {
  clearDownload,
  setGameDeleting,
  removeGameFromDeleting,
+  setExtractionProgress,
+  clearExtraction,
 } = downloadSlice.actions;
--- a/src/renderer/src/pages/downloads/archive-deletion-error-modal.tsx
+++ b/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}
+    />
+  );
+}
--- a/src/renderer/src/pages/downloads/download-group.scss
+++ b/src/renderer/src/pages/downloads/download-group.scss
@@ -18,17 +18,32 @@
  &__header {
    display: flex;
    align-items: center;
-    justify-content: space-between;
-    gap: calc(globals.$spacing-unit * 2);
+    gap: calc(globals.$spacing-unit);

-    &-divider {
+    &-title-group {
+      display: flex;
+      align-items: center;
+      gap: calc(globals.$spacing-unit);
      flex: 1;
-      background-color: globals.$border-color;
-      height: 1px;
+
+      h2 {
+        margin: 0;
+        font-size: 20px;
+        font-weight: 700;
+        color: rgba(255, 255, 255, 0.95);
+      }
    }

    &-count {
-      font-weight: 400;
+      background-color: rgba(255, 255, 255, 0.1);
+      color: rgba(255, 255, 255, 0.7);
+      padding: 4px 8px;
+      border-radius: 6px;
+      font-size: 12px;
+      font-weight: 600;
+      min-width: 24px;
+      text-align: center;
+      flex-shrink: 0;
    }
  }
  &--hero {
@@ -37,7 +52,7 @@
    overflow: hidden;
    margin: 0;
    padding: 0;
-    padding-bottom: calc(globals.$spacing-unit * 3);
+    padding-bottom: globals.$spacing-unit;
  }

  &__hero-background {
@@ -80,65 +95,161 @@
    gap: calc(globals.$spacing-unit * 2);
  }

-  &__hero-header {
-    display: flex;
-    justify-content: flex-end;
-    margin-bottom: calc(globals.$spacing-unit * 2);
-  }
-
  &__hero-logo {
    flex: 1;
+    min-width: 0;
+    display: flex;
+    align-items: center;
+
+    &-button {
+      background: none;
+      border: none;
+      padding: 0;
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      transition: scale 0.2s ease;
+      outline: none;
+
+      &:hover {
+        scale: 1.05;
+      }
+    }

    img {
-      max-width: 600px;
-      max-height: 200px;
+      max-width: 180px;
+      max-height: 60px;
      object-fit: contain;
+      cursor: pointer;
+      transition: opacity 0.2s ease;
+
+      &:hover {
+        opacity: 0.8;
+      }
+
+      &:focus {
+        outline: 2px solid rgba(255, 255, 255, 0.5);
+        outline-offset: 4px;
+        border-radius: 4px;
+      }
+
+      @container #{globals.$app-container} (min-width: 700px) {
+        max-width: 220px;
+        max-height: 75px;
+      }
+
+      @container #{globals.$app-container} (min-width: 900px) {
+        max-width: 280px;
+        max-height: 95px;
+      }
+
+      @container #{globals.$app-container} (min-width: 1200px) {
+        max-width: 340px;
+        max-height: 115px;
+      }
+
+      @container #{globals.$app-container} (min-width: 1500px) {
+        max-width: 400px;
+        max-height: 130px;
+      }
    }

    h1 {
-      font-size: 64px;
+      font-size: 20px;
      font-weight: 700;
      color: #ffffff;
      text-shadow: 2px 2px 12px rgba(0, 0, 0, 0.9);
      margin: 0;
-    }
-  }
+      cursor: pointer;
+      transition: opacity 0.2s ease;

-  &__hero-actions {
-    display: flex;
-    gap: calc(globals.$spacing-unit);
-    align-items: center;
+      &:hover {
+        opacity: 0.8;
+      }
+
+      &:focus {
+        outline: 2px solid rgba(255, 255, 255, 0.5);
+        outline-offset: 4px;
+        border-radius: 4px;
+      }
+
+      @container #{globals.$app-container} (min-width: 700px) {
+        font-size: 26px;
+      }
+
+      @container #{globals.$app-container} (min-width: 900px) {
+        font-size: 32px;
+      }
+
+      @container #{globals.$app-container} (min-width: 1200px) {
+        font-size: 38px;
+      }
+
+      @container #{globals.$app-container} (min-width: 1500px) {
+        font-size: 44px;
+      }
+    }
  }

  &__hero-action-row {
    display: flex;
    justify-content: space-between;
-    align-items: flex-end;
+    align-items: flex-start;
    gap: calc(globals.$spacing-unit * 3);
-    margin-bottom: calc(globals.$spacing-unit * 3);
+    margin-top: calc(globals.$spacing-unit * 4);
+    margin-bottom: calc(globals.$spacing-unit * 2);
  }

-  &__hero-menu-btn {
-    background-color: rgba(0, 0, 0, 0.4);
-    padding: calc(globals.$spacing-unit * 1);
-    min-height: unset;
+  &__hero-buttons {
+    display: flex;
+    gap: calc(globals.$spacing-unit);
+    align-items: center;
+    flex-shrink: 0;
  }
-  &__hero-menu-btn:hover {
-    background-color: rgba(0, 0, 0, 0.8);
+
+  &__glass-btn {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 10px 16px;
+    border-radius: 8px;
+    background: rgba(255, 255, 255, 0.1);
+    backdrop-filter: blur(12px);
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    box-shadow:
+      0 10px 15px -3px rgba(0, 0, 0, 0.1),
+      0 4px 6px -4px rgba(0, 0, 0, 0.1);
+    color: #fff;
+    font-size: 14px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: background-color 0.2s ease;
+
+    &:hover {
+      background: rgba(255, 255, 255, 0.2);
+    }
  }

  &__hero-progress {
    display: flex;
    flex-direction: column;
-    gap: calc(globals.$spacing-unit);
-    margin-bottom: calc(globals.$spacing-unit * 3);
  }

-  &__progress-header {
+  &__progress-info-row {
+    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
-    margin-bottom: calc(globals.$spacing-unit / 2);
+  }
+
+  &__progress-row {
+    display: flex;
+    align-items: flex-end;
+    gap: calc(globals.$spacing-unit * 2);
+
+    &--bar {
+      margin-top: calc(globals.$spacing-unit);
+    }
  }

  &__progress-status {
@@ -153,22 +264,36 @@
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
-  }
+    align-self: flex-end;
+    display: inline-block;
+    overflow: hidden;
+    line-height: 1.2;

-  &__progress-details {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    font-size: 13px;
-    color: rgba(255, 255, 255, 0.9);
-    margin-top: calc(globals.$spacing-unit / 2);
+    span {
+      display: inline-block;
+    }
  }

  &__progress-size {
+    display: flex;
+    align-items: center;
+    gap: calc(globals.$spacing-unit);
+    font-size: 13px;
    font-weight: 600;
+    color: rgba(255, 255, 255, 0.9);
+  }
+
+  &__progress-status {
+    font-size: 13px;
+    font-weight: 600;
+    color: rgba(255, 255, 255, 0.9);
  }

  &__progress-time {
+    display: flex;
+    align-items: center;
+    gap: calc(globals.$spacing-unit);
+    font-size: 13px;
    color: globals.$muted-color;
  }

@@ -190,6 +315,7 @@
    min-width: 200px;
    padding-right: calc(globals.$spacing-unit * 2);
    border-right: 1px solid rgba(255, 255, 255, 0.1);
+    align-self: flex-start;
  }

  &__speed-chart {
@@ -202,7 +328,7 @@

  &__speed-chart-canvas {
    width: 100%;
-    height: 100px;
+    height: 80px;
    image-rendering: crisp-edges;
  }

@@ -219,7 +345,9 @@

  &__stat-content {
    display: flex;
-    gap: 2px;
+    justify-content: space-between;
+    gap: calc(globals.$spacing-unit / 2);
+    width: 100%;
  }

  &__stat-label {
@@ -251,14 +379,7 @@
    display: flex;
    align-items: center;
    gap: calc(globals.$spacing-unit * 2);
-    padding: calc(globals.$spacing-unit * 2);
    border-radius: 8px;
-    transition: all ease 0.2s;
-
-    &:hover {
-      background-color: rgba(255, 255, 255, 0.02);
-      border-color: rgba(255, 255, 255, 0.1);
-    }
  }

  &__simple-thumbnail {
@@ -268,6 +389,22 @@
    overflow: hidden;
    flex-shrink: 0;
    background-color: rgba(0, 0, 0, 0.3);
+    border: 1px solid globals.$border-color;
+    padding: 0;
+    cursor: pointer;
+    transition:
+      opacity 0.2s ease,
+      transform 0.2s ease;
+
+    &:hover {
+      opacity: 0.9;
+    }
+
+    &:focus,
+    &:focus-visible {
+      outline: 2px solid rgba(255, 255, 255, 0.5);
+      outline-offset: 2px;
+    }

    img {
      width: 100%;
@@ -281,7 +418,22 @@
    min-width: 0;
    display: flex;
    flex-direction: column;
-    gap: calc(globals.$spacing-unit / 2);
+    gap: calc(globals.$spacing-unit / 1);
+  }
+
+  &__simple-title-button {
+    background: none;
+    border: none;
+    padding: 0;
+    cursor: pointer;
+    text-align: left;
+    width: 100%;
+    transition: opacity 0.2s ease;
+
+    &:focus,
+    &:focus-visible {
+      outline: none;
+    }
  }

  &__simple-title {
@@ -295,6 +447,12 @@
  }

  &__simple-meta {
+    display: flex;
+    flex-direction: column;
+    gap: calc(globals.$spacing-unit * 1.5);
+  }
+
+  &__simple-meta-row {
    display: flex;
    align-items: center;
    gap: calc(globals.$spacing-unit * 2);
@@ -303,9 +461,20 @@
  }

  &__simple-size {
+    display: flex;
+    align-items: center;
+    gap: calc(globals.$spacing-unit / 2);
    font-weight: 500;
  }

+  &__simple-extracting {
+    display: flex;
+    align-items: center;
+    gap: calc(globals.$spacing-unit / 2);
+    font-weight: 500;
+    color: globals.$muted-color;
+  }
+
  &__simple-seeding {
    color: #4ade80;
    font-weight: 600;
@@ -342,13 +511,20 @@
    min-height: unset;
  }

+  &__progress-wrapper {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    gap: calc(globals.$spacing-unit / 2);
+  }
+
  &__progress-bar {
    width: 100%;
    height: 8px;
    background-color: rgba(255, 255, 255, 0.08);
    border-radius: 4px;
    overflow: hidden;
-    position: relative;
+    margin-top: calc(globals.$spacing-unit / 2);

    &--small {
      height: 6px;
@@ -357,10 +533,12 @@

  &__progress-fill {
    height: 100%;
-    background-color: globals.$muted-color;
-    transition:
-      width 0.3s ease,
-      background 0.35s ease;
+    background-color: #fff;
+    transition: width 0.3s ease;
    border-radius: 4px;
+
+    &--extraction {
+      background-color: #fff;
+    }
  }
 }
--- a/src/renderer/src/pages/downloads/download-group.tsx
+++ b/src/renderer/src/pages/downloads/download-group.tsx
@@ -1,21 +1,32 @@
 import type { GameShop, LibraryGame, SeedingStatus } from "@types";

 import { Badge, Button } from "@renderer/components";
-import { formatDownloadProgress } from "@renderer/helpers";
+import {
+  formatDownloadProgress,
+  buildGameDetailsPath,
+} from "@renderer/helpers";

 import { Downloader, formatBytes, formatBytesToMbps } from "@shared";
-import { formatDistance, addMilliseconds } from "date-fns";
+import { addMilliseconds } from "date-fns";
 import { DOWNLOADER_NAME } from "@renderer/constants";
-import { useAppSelector, useDownload, useLibrary } from "@renderer/hooks";
+import {
+  useAppSelector,
+  useDownload,
+  useLibrary,
+  useDate,
+} from "@renderer/hooks";

 import "./download-group.scss";
 import { useTranslation } from "react-i18next";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { AnimatePresence, motion } from "framer-motion";
 import {
  DropdownMenu,
  DropdownMenuItem,
 } from "@renderer/components/dropdown-menu/dropdown-menu";
 import {
+  ClockIcon,
  ColumnsIcon,
  DownloadIcon,
  FileDirectoryIcon,
@@ -29,22 +40,46 @@ import {
 } from "@primer/octicons-react";
 import { average } from "color.js";

-const getProgressGradient = (
-  colorHex: string,
-  isPaused = false
-): string | undefined => {
-  const hex = isPaused ? "#ffffff" : colorHex || "#08ea79";
-  if (!hex.startsWith("#")) return undefined;
+interface AnimatedPercentageProps {
+  value: number;
+}

-  try {
-    const r = Number.parseInt(hex.slice(1, 3), 16);
-    const g = Number.parseInt(hex.slice(3, 5), 16);
-    const b = Number.parseInt(hex.slice(5, 7), 16);
-    return `linear-gradient(90deg, rgba(${r},${g},${b},0.95) 0%, rgba(${r},${g},${b},0.65) 100%)`;
-  } catch {
-    return undefined;
-  }
-};
+function AnimatedPercentage({ value }: Readonly<AnimatedPercentageProps>) {
+  const percentageText = formatDownloadProgress(value);
+  const prevTextRef = useRef<string>(percentageText);
+  const chars = percentageText.split("");
+  const prevChars = prevTextRef.current.split("");
+
+  useEffect(() => {
+    prevTextRef.current = percentageText;
+  }, [percentageText]);
+
+  return (
+    <>
+      {chars.map((char, index) => {
+        const prevChar = prevChars[index];
+        const charChanged = prevChar !== char;
+
+        return (
+          <AnimatePresence key={`${index}`} mode="wait" initial={false}>
+            <motion.span
+              key={`${char}-${value}-${index}`}
+              initial={
+                charChanged ? { y: 10, opacity: 0 } : { y: 0, opacity: 1 }
+              }
+              animate={{ y: 0, opacity: 1 }}
+              exit={charChanged ? { y: -10, opacity: 0 } : undefined}
+              transition={{ duration: 0.3, ease: "easeOut" }}
+              style={{ display: "inline-block" }}
+            >
+              {char}
+            </motion.span>
+          </AnimatePresence>
+        );
+      })}
+    </>
+  );
+}

 interface SpeedChartProps {
  speeds: number[];
@@ -67,6 +102,7 @@ function SpeedChart({
    if (!ctx) return;

    let animationFrameId: number;
+    let resizeObserver: ResizeObserver | null = null;

    const draw = () => {
      const clientWidth = canvas.clientWidth;
@@ -78,10 +114,12 @@ function SpeedChart({

      const width = clientWidth;
      const height = 100;
-      const totalBars = 120;
      const barWidth = 4;
      const barGap = 10;
      const barSpacing = barWidth + barGap;
+
+      // Calculate how many bars can fit in the available width
+      const totalBars = Math.max(1, Math.floor((width + barGap) / barSpacing));
      const maxHeight = peakSpeed || Math.max(...speeds, 1);

      ctx.clearRect(0, 0, width, height);
@@ -90,16 +128,20 @@ function SpeedChart({
        g = 255,
        b = 255;
      if (color.startsWith("#")) {
-        const hex = color.replace("#", "");
-        r = Number.parseInt(hex.substring(0, 2), 16);
-        g = Number.parseInt(hex.substring(2, 4), 16);
-        b = Number.parseInt(hex.substring(4, 6), 16);
+        let hex = color.replace("#", "");
+        // Handle shorthand hex colors (e.g., "#fff" -> "#ffffff")
+        if (hex.length === 3) {
+          hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
+        }
+        r = Number.parseInt(hex.substring(0, 2), 16) || 255;
+        g = Number.parseInt(hex.substring(2, 4), 16) || 255;
+        b = Number.parseInt(hex.substring(4, 6), 16) || 255;
      } else if (color.startsWith("rgb")) {
        const matches = color.match(/\d+/g);
        if (matches && matches.length >= 3) {
-          r = Number.parseInt(matches[0]);
-          g = Number.parseInt(matches[1]);
-          b = Number.parseInt(matches[2]);
+          r = Number.parseInt(matches[0]) || 255;
+          g = Number.parseInt(matches[1]) || 255;
+          b = Number.parseInt(matches[2]) || 255;
        }
      }
      const displaySpeeds = speeds.slice(-totalBars);
@@ -138,8 +180,22 @@ function SpeedChart({

    animationFrameId = requestAnimationFrame(draw);

+    // Handle resize - trigger redraw when canvas size changes
+    resizeObserver = new ResizeObserver(() => {
+      // Cancel any pending animation frame to force immediate redraw
+      if (animationFrameId) {
+        cancelAnimationFrame(animationFrameId);
+      }
+      // Trigger a redraw that will recalculate bars based on new width
+      draw();
+    });
+    resizeObserver.observe(canvas);
+
    return () => {
      cancelAnimationFrame(animationFrameId);
+      if (resizeObserver) {
+        resizeObserver.disconnect();
+      }
    };
  }, [speeds, peakSpeed, color]);

@@ -151,6 +207,7 @@ function SpeedChart({
 interface HeroDownloadViewProps {
  game: LibraryGame;
  isGameDownloading: boolean;
+  isGameExtracting?: boolean;
  downloadSpeed: number;
  finalDownloadSize: string;
  peakSpeed: number;
@@ -158,18 +215,18 @@ interface HeroDownloadViewProps {
  dominantColor: string;
  lastPacket: ReturnType<typeof useDownload>["lastPacket"];
  speedHistory: number[];
-  getGameActions: (game: LibraryGame) => DropdownMenuItem[];
-  getStatusText: (game: LibraryGame) => string;
  formatSpeed: (speed: number) => string;
  calculateETA: () => string;
  pauseDownload: (shop: GameShop, objectId: string) => void;
  resumeDownload: (shop: GameShop, objectId: string) => void;
+  cancelDownload: (shop: GameShop, objectId: string) => void;
  t: (key: string) => string;
 }

 function HeroDownloadView({
  game,
  isGameDownloading,
+  isGameExtracting = false,
  downloadSpeed,
  finalDownloadSize,
  peakSpeed,
@@ -177,14 +234,19 @@ function HeroDownloadView({
  dominantColor,
  lastPacket,
  speedHistory,
-  getGameActions,
-  getStatusText,
  formatSpeed,
  calculateETA,
  pauseDownload,
  resumeDownload,
+  cancelDownload,
  t,
 }: Readonly<HeroDownloadViewProps>) {
+  const navigate = useNavigate();
+
+  const handleLogoClick = useCallback(() => {
+    navigate(buildGameDetailsPath(game));
+  }, [navigate, game]);
+
  return (
    <div className="download-group download-group--hero">
      <div className="download-group__hero-background">
@@ -196,88 +258,109 @@ function HeroDownloadView({
      </div>

      <div className="download-group__hero-content">
-        <div className="download-group__hero-header">
-          <div className="download-group__hero-actions">
-            <DropdownMenu align="end" items={getGameActions(game)}>
-              <Button className="download-group__hero-menu-btn" theme="outline">
-                <ThreeBarsIcon />
-              </Button>
-            </DropdownMenu>
-          </div>
-        </div>
-
        <div className="download-group__hero-action-row">
          <div className="download-group__hero-logo">
            {game.logoImageUrl ? (
-              <img src={game.logoImageUrl} alt={game.title} />
+              <button
+                type="button"
+                onClick={handleLogoClick}
+                className="download-group__hero-logo-button"
+              >
+                <img src={game.logoImageUrl} alt={game.title} />
+              </button>
            ) : (
-              <h1>{game.title}</h1>
+              <button
+                type="button"
+                onClick={handleLogoClick}
+                className="download-group__hero-logo-button"
+              >
+                <h1>{game.title}</h1>
+              </button>
            )}
          </div>
-
-          {isGameDownloading ? (
-            <Button
-              theme="primary"
-              onClick={() => pauseDownload(game.shop, game.objectId)}
-              className="download-group__hero-action-btn"
-              style={{
-                backgroundColor: dominantColor,
-                borderColor: dominantColor,
-              }}
-            >
-              <ColumnsIcon size={16} />
-              {t("pause")}
-            </Button>
-          ) : (
-            <Button
-              theme="primary"
-              onClick={() => resumeDownload(game.shop, game.objectId)}
-              className="download-group__hero-action-btn"
-              style={{
-                backgroundColor: dominantColor,
-                borderColor: dominantColor,
-              }}
-            >
-              <PlayIcon size={16} />
-              {t("resume")}
-            </Button>
-          )}
        </div>

        <div className="download-group__hero-progress">
-          <div className="download-group__progress-header">
-            <span className="download-group__progress-status">
-              {getStatusText(game)}
-            </span>
-            <span className="download-group__progress-percentage">
-              {formatDownloadProgress(currentProgress)}
-            </span>
-          </div>
-          <div className="download-group__progress-bar">
-            <div
-              className="download-group__progress-fill"
-              style={{
-                width: `${currentProgress * 100}%`,
-                background: getProgressGradient(
-                  dominantColor,
-                  game.download?.status === "paused"
-                ),
-              }}
-            />
-          </div>
-          <div className="download-group__progress-details">
-            <span className="download-group__progress-size">
-              {isGameDownloading && lastPacket
-                ? `${formatBytes(lastPacket.download.bytesDownloaded)} / ${finalDownloadSize}`
-                : `0 B / ${finalDownloadSize}`}
-            </span>
-            <span className="download-group__progress-time">
-              {isGameDownloading &&
-              lastPacket?.timeRemaining &&
-              lastPacket.timeRemaining > 0
-                ? calculateETA()
-                : ""}
-            </span>
+          <div className="download-group__progress-row download-group__progress-row--bar">
+            <div className="download-group__progress-wrapper">
+              <div className="download-group__progress-info-row">
+                {isGameExtracting && (
+                  <span className="download-group__progress-status">
+                    {t("extracting")}
+                  </span>
+                )}
+                {!isGameExtracting && lastPacket?.isCheckingFiles && (
+                  <span className="download-group__progress-status">
+                    {t("checking_files")}
+                  </span>
+                )}
+                {!isGameExtracting && !lastPacket?.isCheckingFiles && (
+                  <span className="download-group__progress-size">
+                    <DownloadIcon size={14} />
+                    {isGameDownloading && lastPacket
+                      ? `${formatBytes(lastPacket.download.bytesDownloaded)} / ${finalDownloadSize}`
+                      : `0 B / ${finalDownloadSize}`}
+                  </span>
+                )}
+                <span></span>
+              </div>
+              <div className="download-group__progress-info-row">
+                {!lastPacket?.isCheckingFiles && !isGameExtracting && (
+                  <span className="download-group__progress-time">
+                    {isGameDownloading &&
+                      lastPacket?.timeRemaining &&
+                      lastPacket.timeRemaining > 0 && (
+                        <>
+                          <ClockIcon size={14} />
+                          {calculateETA()}
+                        </>
+                      )}
+                  </span>
+                )}
+                <span className="download-group__progress-percentage">
+                  <AnimatedPercentage value={currentProgress} />
+                </span>
+              </div>
+              <div className="download-group__progress-bar">
+                <div
+                  className={`download-group__progress-fill ${isGameExtracting ? "download-group__progress-fill--extraction" : ""}`}
+                  style={{
+                    width: `${currentProgress * 100}%`,
+                  }}
+                />
+              </div>
+            </div>
+            {!isGameExtracting && (
+              <div className="download-group__hero-buttons">
+                {isGameDownloading ? (
+                  <button
+                    type="button"
+                    onClick={() => pauseDownload(game.shop, game.objectId)}
+                    className="download-group__glass-btn"
+                  >
+                    <ColumnsIcon size={14} />
+                    {t("pause")}
+                  </button>
+                ) : (
+                  <button
+                    type="button"
+                    onClick={() => resumeDownload(game.shop, game.objectId)}
+                    className="download-group__glass-btn"
+                  >
+                    <PlayIcon size={14} />
+                    {t("resume")}
+                  </button>
+                )}
+                <button
+                  type="button"
+                  onClick={() => cancelDownload(game.shop, game.objectId)}
+                  className="download-group__glass-btn"
+                >
+                  <XCircleIcon size={14} />
+                  {t("cancel")}
+                </button>
+              </div>
+            )}
          </div>
        </div>

@@ -328,6 +411,14 @@ function HeroDownloadView({
                  </div>
                </div>
              )}
+
+            {game.download?.downloader && (
+              <div className="download-group__stat-item">
+                <div className="download-group__stat-content">
+                  <Badge>{DOWNLOADER_NAME[game.download.downloader]}</Badge>
+                </div>
+              </div>
+            )}
          </div>

          <div className="download-group__speed-chart">
@@ -359,28 +450,76 @@ export function DownloadGroup({
  seedingStatus,
 }: Readonly<DownloadGroupProps>) {
  const { t } = useTranslation("downloads");
+  const navigate = useNavigate();

  const userPreferences = useAppSelector(
    (state) => state.userPreferences.value
  );

+  const extraction = useAppSelector((state) => state.download.extraction);
+
  const { updateLibrary } = useLibrary();

  const {
    lastPacket,
-    pauseDownload,
-    resumeDownload,
+    pauseDownload: pauseDownloadOriginal,
+    resumeDownload: resumeDownloadOriginal,
    cancelDownload,
    isGameDeleting,
    pauseSeeding,
    resumeSeeding,
  } = useDownload();

-  const peakSpeedsRef = useRef<Record<string, number>>({});
+  // Wrap resumeDownload with optimistic update
+  const resumeDownload = useCallback(
+    async (shop: GameShop, objectId: string) => {
+      const gameId = `${shop}:${objectId}`;
+
+      // Optimistically mark as downloading
+      setOptimisticallyResumed((prev) => ({ ...prev, [gameId]: true }));
+
+      try {
+        await resumeDownloadOriginal(shop, objectId);
+      } catch (error) {
+        // If resume fails, remove optimistic state
+        setOptimisticallyResumed((prev) => {
+          const next = { ...prev };
+          delete next[gameId];
+          return next;
+        });
+        throw error;
+      }
+    },
+    [resumeDownloadOriginal]
+  );
+
+  // Wrap pauseDownload to clear optimistic state
+  const pauseDownload = useCallback(
+    async (shop: GameShop, objectId: string) => {
+      const gameId = `${shop}:${objectId}`;
+
+      // Clear optimistic state when pausing
+      setOptimisticallyResumed((prev) => {
+        const next = { ...prev };
+        delete next[gameId];
+        return next;
+      });
+
+      await pauseDownloadOriginal(shop, objectId);
+    },
+    [pauseDownloadOriginal]
+  );
+
+  const { formatDistance } = useDate();
+
+  const [peakSpeeds, setPeakSpeeds] = useState<Record<string, number>>({});
  const speedHistoryRef = useRef<Record<string, number[]>>({});
  const [dominantColors, setDominantColors] = useState<Record<string, string>>(
    {}
  );
+  const [optimisticallyResumed, setOptimisticallyResumed] = useState<
+    Record<string, boolean>
+  >({});

  const extractDominantColor = useCallback(
    async (imageUrl: string, gameId: string) => {
@@ -398,13 +537,55 @@ export function DownloadGroup({
    [dominantColors]
  );

+  // Clear optimistic state when actual download starts or library updates
+  useEffect(() => {
+    if (lastPacket?.gameId) {
+      const gameId = lastPacket.gameId;
+
+      // Clear optimistic state when actual download starts
+      setOptimisticallyResumed((prev) => {
+        const next = { ...prev };
+        delete next[gameId];
+        return next;
+      });
+    }
+  }, [lastPacket?.gameId]);
+
+  // Clear optimistic state for games that are no longer active after library update
+  useEffect(() => {
+    setOptimisticallyResumed((prev) => {
+      const next = { ...prev };
+      let changed = false;
+
+      for (const gameId in next) {
+        if (next[gameId]) {
+          const game = library.find((g) => g.id === gameId);
+          // Clear if game doesn't exist or download status is not active
+          if (
+            !game ||
+            game.download?.status !== "active" ||
+            lastPacket?.gameId === gameId
+          ) {
+            delete next[gameId];
+            changed = true;
+          }
+        }
+      }
+
+      return changed ? next : prev;
+    });
+  }, [library, lastPacket?.gameId]);
+
  useEffect(() => {
    if (lastPacket?.gameId && lastPacket.downloadSpeed !== undefined) {
      const gameId = lastPacket.gameId;

-      const currentPeak = peakSpeedsRef.current[gameId] || 0;
+      const currentPeak = peakSpeeds[gameId] || 0;
      if (lastPacket.downloadSpeed > currentPeak) {
-        peakSpeedsRef.current[gameId] = lastPacket.downloadSpeed;
+        setPeakSpeeds((prev) => ({
+          ...prev,
+          [gameId]: lastPacket.downloadSpeed,
+        }));
      }

      if (!speedHistoryRef.current[gameId]) {
@@ -417,7 +598,7 @@ export function DownloadGroup({
        speedHistoryRef.current[gameId].shift();
      }
    }
-  }, [lastPacket?.gameId, lastPacket?.downloadSpeed]);
+  }, [lastPacket?.gameId, lastPacket?.downloadSpeed, peakSpeeds]);

  useEffect(() => {
    for (const game of library) {
@@ -429,7 +610,7 @@ export function DownloadGroup({
        // Fresh download - clear any old data
        if (speedHistoryRef.current[game.id]?.length > 0) {
          speedHistoryRef.current[game.id] = [];
-          peakSpeedsRef.current[game.id] = 0;
+          setPeakSpeeds((prev) => ({ ...prev, [game.id]: 0 }));
        }
      }
    }
@@ -445,7 +626,7 @@ export function DownloadGroup({
      ) {
        const timeout = setTimeout(() => {
          speedHistoryRef.current[game.id] = [];
-          peakSpeedsRef.current[game.id] = 0;
+          setPeakSpeeds((prev) => ({ ...prev, [game.id]: 0 }));
        }, 10_000);
        timeouts.push(timeout);
      }
@@ -478,10 +659,12 @@ export function DownloadGroup({
  const isGameDownloadingMap = useMemo(() => {
    const map: Record<string, boolean> = {};
    for (const game of library) {
-      map[game.id] = lastPacket?.gameId === game.id;
+      map[game.id] =
+        lastPacket?.gameId === game.id ||
+        optimisticallyResumed[game.id] === true;
    }
    return map;
-  }, [library, lastPacket?.gameId]);
+  }, [library, lastPacket?.gameId, optimisticallyResumed]);

  const getFinalDownloadSize = (game: LibraryGame) => {
    const download = game.download!;
@@ -517,53 +700,6 @@ export function DownloadGroup({
    );
  };

-  const getCompletedStatusText = (game: LibraryGame) => {
-    const isTorrent = game.download?.downloader === Downloader.Torrent;
-    if (isTorrent) {
-      return isGameSeeding(game)
-        ? `${t("completed")} (${t("seeding")})`
-        : `${t("completed")} (${t("paused")})`;
-    }
-    return t("completed");
-  };
-
-  const getStatusText = (game: LibraryGame) => {
-    const isGameDownloading = isGameDownloadingMap[game.id];
-    const status = game.download?.status;
-
-    if (game.download?.extracting) {
-      return t("extracting");
-    }
-
-    if (isGameDeleting(game.id)) {
-      return t("deleting");
-    }
-
-    if (game.download?.progress === 1) {
-      return getCompletedStatusText(game);
-    }
-
-    if (isGameDownloading && lastPacket) {
-      if (lastPacket.isDownloadingMetadata) {
-        return t("downloading_metadata");
-      }
-      if (lastPacket.isCheckingFiles) {
-        return t("checking_files");
-      }
-      return t("download_in_progress");
-    }
-
-    switch (status) {
-      case "paused":
-      case "error":
-        return t("paused");
-      case "waiting":
-        return t("calculating_eta");
-      default:
-        return t("paused");
-    }
-  };
-
  const extractGameDownload = useCallback(
    async (shop: GameShop, objectId: string) => {
      await window.electron.extractGameDownload(shop, objectId);
@@ -682,7 +818,13 @@ export function DownloadGroup({
        progress: game.download?.progress || 0,
        isSeeding: isGameSeeding(game),
      })),
-    [library, lastPacket?.gameId]
+    [
+      library,
+      lastPacket?.gameId,
+      lastPacket?.download.fileSize,
+      isGameDownloadingMap,
+      seedingStatus,
+    ]
  );

  if (!library.length) return null;
@@ -693,16 +835,21 @@ export function DownloadGroup({

  if (isDownloadingGroup && library.length > 0) {
    const game = library[0];
-    const isGameDownloading = isGameDownloadingMap[game.id];
+    const isGameExtracting = extraction?.visibleId === game.id;
+    const isGameDownloading =
+      isGameDownloadingMap[game.id] && !isGameExtracting;
    const downloadSpeed = isGameDownloading
      ? (lastPacket?.downloadSpeed ?? 0)
      : 0;
    const finalDownloadSize = getFinalDownloadSize(game);
-    const peakSpeed = peakSpeedsRef.current[game.id] || 0;
-    const currentProgress =
-      isGameDownloading && lastPacket
-        ? lastPacket.progress
-        : game.download?.progress || 0;
+    const peakSpeed = peakSpeeds[game.id] || 0;
+
+    let currentProgress = game.download?.progress || 0;
+    if (isGameExtracting) {
+      currentProgress = extraction.progress;
+    } else if (isGameDownloading && lastPacket) {
+      currentProgress = lastPacket.progress;
+    }

    const dominantColor = dominantColors[game.id] || "#fff";

@@ -710,6 +857,7 @@ export function DownloadGroup({
      <HeroDownloadView
        game={game}
        isGameDownloading={isGameDownloading}
+        isGameExtracting={isGameExtracting}
        downloadSpeed={downloadSpeed}
        finalDownloadSize={finalDownloadSize}
        peakSpeed={peakSpeed}
@@ -717,12 +865,11 @@ export function DownloadGroup({
        dominantColor={dominantColor}
        lastPacket={lastPacket}
        speedHistory={speedHistoryRef.current[game.id] || []}
-        getGameActions={getGameActions}
-        getStatusText={getStatusText}
        formatSpeed={formatSpeed}
        calculateETA={calculateETA}
        pauseDownload={pauseDownload}
        resumeDownload={resumeDownload}
+        cancelDownload={cancelDownload}
        t={t}
      />
    );
@@ -733,29 +880,54 @@ export function DownloadGroup({
      className={`download-group ${isQueuedGroup ? "download-group--queued" : ""} ${isCompletedGroup ? "download-group--completed" : ""}`}
    >
      <div className="download-group__header">
-        <h2>{title}</h2>
-        <div className="download-group__header-divider" />
-        <h3 className="download-group__header-count">{library.length}</h3>
+        <div className="download-group__header-title-group">
+          <h2>{title}</h2>
+          <h3 className="download-group__header-count">{library.length}</h3>
+        </div>
      </div>

      <ul className="download-group__simple-list">
        {downloadInfo.map(({ game, size, progress, isSeeding: seeding }) => {
          return (
            <li key={game.id} className="download-group__simple-card">
-              <div className="download-group__simple-thumbnail">
+              <button
+                type="button"
+                onClick={() => navigate(buildGameDetailsPath(game))}
+                className="download-group__simple-thumbnail"
+              >
                <img src={game.libraryImageUrl || ""} alt={game.title} />
-              </div>
+              </button>

              <div className="download-group__simple-info">
-                <h3 className="download-group__simple-title">{game.title}</h3>
+                <button
+                  type="button"
+                  onClick={() => navigate(buildGameDetailsPath(game))}
+                  className="download-group__simple-title-button"
+                >
+                  <h3 className="download-group__simple-title">{game.title}</h3>
+                </button>
                <div className="download-group__simple-meta">
-                  <Badge>{DOWNLOADER_NAME[game.download!.downloader]}</Badge>
-                  <span className="download-group__simple-size">{size}</span>
-                  {game.download?.progress === 1 && seeding && (
-                    <span className="download-group__simple-seeding">
-                      {t("seeding")}
-                    </span>
-                  )}
+                  <div className="download-group__simple-meta-row">
+                    <Badge>{DOWNLOADER_NAME[game.download!.downloader]}</Badge>
+                  </div>
+                  <div className="download-group__simple-meta-row">
+                    {extraction?.visibleId === game.id ? (
+                      <span className="download-group__simple-extracting">
+                        {t("extracting")} (
+                        {Math.round(extraction.progress * 100)}%)
+                      </span>
+                    ) : (
+                      <span className="download-group__simple-size">
+                        <DownloadIcon size={14} />
+                        {size}
+                      </span>
+                    )}
+                    {game.download?.progress === 1 && seeding && (
+                      <span className="download-group__simple-seeding">
+                        {t("seeding")}
+                      </span>
+                    )}
+                  </div>
                </div>
              </div>

@@ -784,7 +956,7 @@ export function DownloadGroup({
                    disabled={isGameDeleting(game.id)}
                    className="download-group__simple-menu-btn"
                  >
-                    <DownloadIcon size={16} />
+                    <PlayIcon size={16} />
                  </Button>
                )}
                {isQueuedGroup && game.download?.progress !== 1 && (
@@ -792,8 +964,9 @@ export function DownloadGroup({
                    theme="primary"
                    onClick={() => resumeDownload(game.shop, game.objectId)}
                    className="download-group__simple-menu-btn"
+                    tooltip={t("resume")}
                  >
-                    <PlayIcon size={16} />
+                    <DownloadIcon size={16} />
                  </Button>
                )}
                <DropdownMenu align="end" items={getGameActions(game)}>
--- a/src/renderer/src/pages/downloads/downloads.tsx
+++ b/src/renderer/src/pages/downloads/downloads.tsx
@@ -1,6 +1,6 @@
 import { useTranslation } from "react-i18next";

-import { useDownload, useLibrary } from "@renderer/hooks";
+import { useAppSelector, useDownload, useLibrary } from "@renderer/hooks";

 import { useEffect, useMemo, useRef, useState } from "react";
 import { BinaryNotFoundModal } from "../shared-modals/binary-not-found-modal";
@@ -13,6 +13,7 @@ import { ArrowDownIcon } from "@primer/octicons-react";

 export default function Downloads() {
  const { library, updateLibrary } = useLibrary();
+  const extraction = useAppSelector((state) => state.download.extraction);

  const { t } = useTranslation("downloads");

@@ -39,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) =>
@@ -72,8 +75,10 @@ export default function Downloads() {
      /* Game has been manually added to the library */
      if (!next.download) return prev;

-      /* Is downloading */
-      if (lastPacket?.gameId === next.id || next.download.extracting)
+      /* Is downloading or extracting */
+      const isExtracting =
+        next.download.extracting || extraction?.visibleId === next.id;
+      if (lastPacket?.gameId === next.id || isExtracting)
        return { ...prev, downloading: [...prev.downloading, next] };

      /* Is either queued or paused */
@@ -96,7 +101,7 @@ export default function Downloads() {
      queued,
      complete,
    };
-  }, [library, lastPacket?.gameId]);
+  }, [library, lastPacket?.gameId, extraction?.visibleId]);

  const downloadGroups = [
    {
--- a/src/renderer/src/pages/game-details/hero/hero-panel-playtime.tsx
+++ b/src/renderer/src/pages/game-details/hero/hero-panel-playtime.tsx
@@ -1,7 +1,12 @@
 import { useContext, useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { formatDownloadProgress } from "@renderer/helpers";
-import { useDate, useDownload, useFormat } from "@renderer/hooks";
+import {
+  useAppSelector,
+  useDate,
+  useDownload,
+  useFormat,
+} from "@renderer/hooks";
 import { Link } from "@renderer/components";
 import { gameDetailsContext } from "@renderer/context";
 import { MAX_MINUTES_TO_SHOW_IN_PLAYTIME } from "@renderer/constants";
@@ -17,6 +22,9 @@ export function HeroPanelPlaytime() {
  const { numberFormatter } = useFormat();
  const { progress, lastPacket } = useDownload();
  const { formatDistance } = useDate();
+  const extraction = useAppSelector((state) => state.download.extraction);
+
+  const isExtracting = extraction?.visibleId === game?.id;

  useEffect(() => {
    if (game?.lastTimePlayed) {
@@ -52,6 +60,16 @@ export function HeroPanelPlaytime() {
  const isGameDownloading =
    game.download?.status === "active" && lastPacket?.gameId === game.id;

+  const extractionInProgressInfo = (
+    <div className="hero-panel-playtime__download-details">
+      <Link to="/downloads" className="hero-panel-playtime__downloads-link">
+        {t("extracting")}
+      </Link>
+
+      <small>{formatDownloadProgress(extraction?.progress ?? 0)}</small>
+    </div>
+  );
+
  const downloadInProgressInfo = (
    <div className="hero-panel-playtime__download-details">
      <Link to="/downloads" className="hero-panel-playtime__downloads-link">
@@ -72,7 +90,8 @@ export function HeroPanelPlaytime() {
    return (
      <>
        <p>{t("not_played_yet", { title: game?.title })}</p>
-        {hasDownload && downloadInProgressInfo}
+        {isExtracting && extractionInProgressInfo}
+        {!isExtracting && hasDownload && downloadInProgressInfo}
      </>
    );
  }
@@ -81,7 +100,8 @@ export function HeroPanelPlaytime() {
    return (
      <>
        <p>{t("playing_now")}</p>
-        {hasDownload && downloadInProgressInfo}
+        {isExtracting && extractionInProgressInfo}
+        {!isExtracting && hasDownload && downloadInProgressInfo}
      </>
    );
  }
@@ -113,9 +133,9 @@ export function HeroPanelPlaytime() {
        })}
      </p>

-      {hasDownload ? (
-        downloadInProgressInfo
-      ) : (
+      {isExtracting && extractionInProgressInfo}
+      {!isExtracting && hasDownload && downloadInProgressInfo}
+      {!isExtracting && !hasDownload && (
        <p>
          {t("last_time_played", {
            period: lastTimePlayed,
--- a/src/renderer/src/pages/game-details/hero/hero-panel.scss
+++ b/src/renderer/src/pages/game-details/hero/hero-panel.scss
@@ -80,5 +80,11 @@
    &--disabled {
      opacity: globals.$disabled-opacity;
    }
+
+    &--extraction {
+      &::-webkit-progress-value {
+        background-color: #fff;
+      }
+    }
  }
 }
--- a/src/renderer/src/pages/game-details/hero/hero-panel.tsx
+++ b/src/renderer/src/pages/game-details/hero/hero-panel.tsx
@@ -1,7 +1,7 @@
 import { useContext } from "react";
 import { useTranslation } from "react-i18next";

-import { useDate, useDownload } from "@renderer/hooks";
+import { useAppSelector, useDate, useDownload } from "@renderer/hooks";

 import { HeroPanelActions } from "./hero-panel-actions";
 import { HeroPanelPlaytime } from "./hero-panel-playtime";
@@ -18,9 +18,13 @@ export function HeroPanel() {

  const { lastPacket } = useDownload();

+  const extraction = useAppSelector((state) => state.download.extraction);
+
  const isGameDownloading =
    game?.download?.status === "active" && lastPacket?.gameId === game?.id;

+  const isExtracting = extraction?.visibleId === game?.id;
+
  const getInfo = () => {
    if (!game) {
      const [latestRepack] = repacks;
@@ -49,6 +53,8 @@ export function HeroPanel() {
    (game?.download?.status === "active" && game?.download?.progress < 1) ||
    game?.download?.status === "paused";

+  const showExtractionProgressBar = isExtracting;
+
  return (
    <div className="hero-panel__container">
      <div className="hero-panel">
@@ -72,6 +78,14 @@ export function HeroPanel() {
            }`}
          />
        )}
+
+        {showExtractionProgressBar && (
+          <progress
+            max={1}
+            value={extraction?.progress ?? 0}
+            className="hero-panel__progress-bar hero-panel__progress-bar--extraction"
+          />
+        )}
      </div>
    </div>
  );
--- a/src/renderer/src/pages/game-details/modals/repacks-modal.tsx
+++ b/src/renderer/src/pages/game-details/modals/repacks-modal.tsx
@@ -231,9 +231,19 @@ export function RepacksModal({
      return false;
    }

-    const lastCheckUtc = new Date(lastCheckTimestamp).toISOString();
+    try {
+      const lastCheckDate = new Date(lastCheckTimestamp);

-    return repack.createdAt > lastCheckUtc;
+      if (isNaN(lastCheckDate.getTime())) {
+        return false;
+      }
+
+      const lastCheckUtc = lastCheckDate.toISOString();
+
+      return repack.createdAt > lastCheckUtc;
+    } catch {
+      return false;
+    }
  };

  const [isFilterDrawerOpen, setIsFilterDrawerOpen] = useState(false);
--- a/src/types/level.types.ts
+++ b/src/types/level.types.ts
@@ -20,6 +20,8 @@ export interface Auth {
  accessToken: string;
  refreshToken: string;
  tokenExpirationTimestamp: number;
+  featurebaseJwt: string;
+  workwondersJwt: string;
 }

 export interface User {
@@ -80,6 +82,7 @@ export interface Download {
  timestamp: number;
  extracting: boolean;
  automaticallyExtract: boolean;
+  extractionProgress: number;
 }

 export interface GameAchievement {
--- a/yarn.lock
+++ b/yarn.lock
@@ -6330,7 +6330,7 @@ jsonwebtoken@^9.0.2:
    object.assign "^4.1.4"
    object.values "^1.1.6"

-jwa@^1.4.1:
+jwa@^1.4.2:
  version "1.4.2"
  resolved "https://registry.yarnpkg.com/jwa/-/jwa-1.4.2.tgz#16011ac6db48de7b102777e57897901520eec7b9"
  integrity sha512-eeH5JO+21J78qMvTIDdBXidBd6nG2kZjg5Ohz/1fpa28Z4CcsWUzJ1ZZyFq/3z3N17aZy+ZuBoHljASbL1WfOw==
@@ -6340,11 +6340,11 @@ jwa@^1.4.1:
    safe-buffer "^5.0.1"

 jws@^3.2.2:
-  version "3.2.2"
-  resolved "https://registry.yarnpkg.com/jws/-/jws-3.2.2.tgz#001099f3639468c9414000e99995fa52fb478304"
-  integrity sha512-YHlZCB6lMTllWDtSPHz/ZXTsi8S00usEV6v1tjq8tOUZzw7DpSDWVXjXDre6ed1w/pd495ODpHZYSdkRTsa0HA==
+  version "3.2.3"
+  resolved "https://registry.yarnpkg.com/jws/-/jws-3.2.3.tgz#5ac0690b460900a27265de24520526853c0b8ca1"
+  integrity sha512-byiJ0FLRdLdSVSReO/U4E7RoEyOCKnEnEPMjq3HxWtvzLsV08/i5RQKsFVNkCldrCaPr2vDNAOMsfs8T/Hze7g==
  dependencies:
-    jwa "^1.4.1"
+    jwa "^1.4.2"
    safe-buffer "^5.0.1"

 keyv@^4.0.0, keyv@^4.5.3:
@@ -6438,11 +6438,26 @@ lodash.clonedeep@^4.5.0:
  resolved "https://registry.yarnpkg.com/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz#e23f3f9c4f8fbdde872529c1071857a086e5ccef"
  integrity sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ==

+lodash.defaultsdeep@^4.6.1:
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/lodash.defaultsdeep/-/lodash.defaultsdeep-4.6.1.tgz#512e9bd721d272d94e3d3a63653fa17516741ca6"
+  integrity sha512-3j8wdDzYuWO3lM3Reg03MuQR957t287Rpcxp1njpEa8oDrikb+FwGdW3n+FELh/A6qib6yPit0j/pv9G/yeAqA==
+
+lodash.defaultto@^4.14.0:
+  version "4.14.0"
+  resolved "https://registry.yarnpkg.com/lodash.defaultto/-/lodash.defaultto-4.14.0.tgz#38bd3d425acee733e0e2bbbd4e4b29711cc2ee11"
+  integrity sha512-G6tizqH6rg4P5j32Wy4Z3ZIip7OfG8YWWlPFzUFGcYStH1Ld0l1tWs6NevEQNEDnO1M3NZYjuHuraaFSN5WqeQ==
+
 lodash.escaperegexp@^4.1.2:
  version "4.1.2"
  resolved "https://registry.yarnpkg.com/lodash.escaperegexp/-/lodash.escaperegexp-4.1.2.tgz#64762c48618082518ac3df4ccf5d5886dae20347"
  integrity sha512-TM9YBvyC84ZxE3rgfefxUWiQKLilstD6k7PTGt6wfbtXF8ixIJLOL3VYyV/z+ZiPLsVxAsKAFVwWlWeb2Y8Yyw==

+lodash.flattendeep@^4.4.0:
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/lodash.flattendeep/-/lodash.flattendeep-4.4.0.tgz#fb030917f86a3134e5bc9bec0d69e0013ddfedb2"
+  integrity sha512-uHaJFihxmJcEX3kT4I23ABqKKalJ/zDrDg0lsFtc1h+3uw49SIJ5beyhx5ExVRti3AvKoOJngIj7xz3oylPdWQ==
+
 lodash.includes@^4.3.0:
  version "4.3.0"
  resolved "https://registry.yarnpkg.com/lodash.includes/-/lodash.includes-4.3.0.tgz#60bb98a87cb923c68ca1e51325483314849f553f"
@@ -6453,6 +6468,11 @@ lodash.isboolean@^3.0.3:
  resolved "https://registry.yarnpkg.com/lodash.isboolean/-/lodash.isboolean-3.0.3.tgz#6c2e171db2a257cd96802fd43b01b20d5f5870f6"
  integrity sha512-Bz5mupy2SVbPHURB98VAcw+aHh4vRV5IPNhILUCsOzRmsTmSQ17jIuqopAentWoehktxGd9e/hbIXq980/1QJg==

+lodash.isempty@^4.4.0:
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/lodash.isempty/-/lodash.isempty-4.4.0.tgz#6f86cbedd8be4ec987be9aaf33c9684db1b31e7e"
+  integrity sha512-oKMuF3xEeqDltrGMfDxAPGIVMSSRv8tbRSODbrs4KGsRRLEhrW8N8Rd4DRgB2+621hY8A8XwwrTVhXWpxFvMzg==
+
 lodash.isequal@^4.5.0:
  version "4.5.0"
  resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
@@ -6493,6 +6513,11 @@ lodash.mergewith@^4.6.2:
  resolved "https://registry.yarnpkg.com/lodash.mergewith/-/lodash.mergewith-4.6.2.tgz#617121f89ac55f59047c7aec1ccd6654c6590f55"
  integrity sha512-GK3g5RPZWTRSeLSpgP8Xhra+pnjBC56q9FZYe1d5RN3TJ35dbkGy3YqBSMbyCrlbi+CM9Z3Jk5yTL7RCsqboyQ==

+lodash.negate@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/lodash.negate/-/lodash.negate-3.0.2.tgz#9c897b0bf610019e0b43b8ff3f0afef3d7b66f34"
+  integrity sha512-JGJYYVslKYC0tRMm/7igfdHulCjoXjoganRNWM8AgS+RXfOvFnPkOveDhPI65F9aAypCX9QEEQoBqWf7Q6uAeA==
+
 lodash.once@^4.0.0:
  version "4.1.1"
  resolved "https://registry.yarnpkg.com/lodash.once/-/lodash.once-4.1.1.tgz#0dd3971213c7c56df880977d504c88fb471a97ac"
@@ -6872,6 +6897,19 @@ no-case@^3.0.4:
    lower-case "^2.0.2"
    tslib "^2.0.3"

+node-7z@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/node-7z/-/node-7z-3.0.0.tgz#42f71c5a43b00028749f7c88291a7abf2e2623e3"
+  integrity sha512-KIznWSxIkOYO/vOgKQfJEaXd7rgoFYKZbaurainCEdMhYc7V7mRHX+qdf2HgbpQFcdJL/Q6/XOPrDLoBeTfuZA==
+  dependencies:
+    debug "^4.3.2"
+    lodash.defaultsdeep "^4.6.1"
+    lodash.defaultto "^4.14.0"
+    lodash.flattendeep "^4.4.0"
+    lodash.isempty "^4.4.0"
+    lodash.negate "^3.0.2"
+    normalize-path "^3.0.0"
+
 node-abi@^3.45.0:
  version "3.78.0"
  resolved "https://registry.yarnpkg.com/node-abi/-/node-abi-3.78.0.tgz#fd0ecbd0aa89857b98da06bd3909194abb0821ba"
@@ -6927,6 +6965,11 @@ nopt@^6.0.0:
  dependencies:
    abbrev "^1.0.0"

+normalize-path@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/normalize-path/-/normalize-path-3.0.0.tgz#0dcd69ff23a1c9b11fd0978316644a0388216a65"
+  integrity sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==
+
 normalize-url@^6.0.1:
  version "6.1.0"
  resolved "https://registry.yarnpkg.com/normalize-url/-/normalize-url-6.1.0.tgz#40d0885b535deffe3f3147bec877d05fe4c5668a"
Author	SHA1	Message	Date
Moyasee	9445d05db0	refactor(decky-plugin, download-group): enhance extraction logging and improve button structure for download actions	2025-12-12 17:45:45 +02:00
Moyasee	fc764af05f	refactor(download-group): improve button structure and maintain translations for download actions	2025-12-12 17:45:18 +02:00
Moyasee	63f8289d0a	feat: implement archive deletion prompt and translations for confirmation messages	2025-12-12 12:44:02 +02:00
Moyasee	0470958629	refactor(decky-plugin): simplify plugin extraction logic using async/await	2025-12-11 15:35:40 +02:00
Moyasee	3b574e6578	feat: add extraction progress tracking and UI updates	2025-12-11 15:25:44 +02:00
Chubby Granny Chaser	7f28fc8ca1	Merge pull request #1893 from hydralauncher/fix/downloads-ui Some checks failed Build / build (ubuntu-latest) (push) Has been cancelled Details Build / build (windows-2022) (push) Has been cancelled Details Build Renderer / build (push) Has been cancelled Details Release / build (ubuntu-latest) (push) Has been cancelled Details Release / build (windows-2022) (push) Has been cancelled Details fix: navigation on game image click not working	2025-12-11 00:53:38 +00:00
Moyase	d1eb174429	Merge branch 'main' into fix/downloads-ui	2025-12-10 20:38:07 +02:00
Moyasee	82a125237b	fix: navigation on game image click not working	2025-12-10 20:36:24 +02:00
Chubby Granny Chaser	19e312d31e	Merge pull request #1891 from hydralauncher/fix/LBX-298 Some checks failed Build / build (ubuntu-latest) (push) Has been cancelled Details Build / build (windows-2022) (push) Has been cancelled Details refactor: simplify Aria2 spawn logic and update GofileApi download li…	2025-12-10 18:12:33 +00:00
Chubby Granny Chaser	79b1f05cde	Merge branch 'main' into fix/LBX-298	2025-12-10 18:12:17 +00:00
Chubby Granny Chaser	cc9ac9dc0f	Merge pull request #1892 from hydralauncher/fix/downloads-ui Fix: navigation and styles in download page	2025-12-10 18:12:05 +00:00
Moyasee	19406dd051	style(download-group): remove unnecessary blank line for cleaner SCSS	2025-12-10 19:54:22 +02:00
Moyasee	8aa6e113e7	refactor(download-group): update button interaction and styles	2025-12-10 19:53:53 +02:00
Chubby Granny Chaser	91ad4a68f7	Merge branch 'main' into fix/LBX-298	2025-12-10 17:18:49 +00:00
Chubby Granny Chaser	a69a6ec510	Merge pull request #1889 from Lianela/main feat: new strings	2025-12-10 17:15:45 +00:00
Chubby Granny Chaser	fada6507c3	Merge branch 'main' into main	2025-12-10 17:15:21 +00:00
Chubby Granny Chaser	0479f1347b	Merge pull request #1887 from hydralauncher/dependabot/npm_and_yarn/npm_and_yarn-a3f223628e chore(deps): bump jws from 3.2.2 to 3.2.3 in the npm_and_yarn group across 1 directory	2025-12-10 17:14:44 +00:00
Chubby Granny Chaser	817870cdbb	refactor: simplify Aria2 spawn logic and update GofileApi download link request	2025-12-10 17:11:10 +00:00
dependabot[bot]	f44d5c8b49	chore(deps): bump jws in the npm_and_yarn group across 1 directory Bumps the npm_and_yarn group with 1 update in the / directory: [jws](https://github.com/brianloveswords/node-jws). Updates `jws` from 3.2.2 to 3.2.3 - [Release notes](https://github.com/brianloveswords/node-jws/releases) - [Changelog](https://github.com/auth0/node-jws/blob/master/CHANGELOG.md) - [Commits](https://github.com/brianloveswords/node-jws/compare/v3.2.2...v3.2.3) --- updated-dependencies: - dependency-name: jws dependency-version: 3.2.3 dependency-type: indirect dependency-group: npm_and_yarn ... Signed-off-by: dependabot[bot] <support@github.com>	2025-12-08 01:04:55 +00:00
Zamitto	c36109c092	chore: bump version Some checks failed Build / build (ubuntu-latest) (push) Has been cancelled Details Build / build (windows-2022) (push) Has been cancelled Details	2025-12-07 22:03:02 -03:00
Zamitto	b59fb7dc36	feat: support workwonders	2025-12-07 20:38:53 -03:00
Kyatto	214a7af408	Fix JSON formatting in translation file	2025-12-07 13:14:50 -06:00
Kyatto	14679fc31e	Add new translation strings in Spanish	2025-12-07 13:05:59 -06:00
Chubby Granny Chaser	e872b2ea8a	chore: bump version to 3.7.5 Some checks failed Build / build (ubuntu-latest) (push) Has been cancelled Details Build / build (windows-2022) (push) Has been cancelled Details	2025-11-30 06:26:43 +00:00
Chubby Granny Chaser	dd7c84b433	Merge pull request #1881 from hydralauncher/fix/downloads-ui fix: auto-resuming download isnt working after restart	2025-11-30 06:26:08 +00:00
Chubby Granny Chaser	1546da29cf	Merge branch 'fix/downloads-ui' of https://github.com/hydralauncher/hydra into fix/downloads-ui	2025-11-30 06:25:39 +00:00
Chubby Granny Chaser	a89b0bb2a8	style: refactor download group component to optimize download state management and improve UI responsiveness	2025-11-30 06:25:17 +00:00
Moyasee	9bdb216e0f	fix: deleted comment	2025-11-30 08:23:49 +02:00
Moyasee	9779aed8c1	fix: auto-resuming download isnt working after restart	2025-11-30 08:05:45 +02:00
Chubby Granny Chaser	058a148c7f	style: add button styling and refactor logo click handling in download group for improved accessibility and user experience	2025-11-30 05:44:18 +00:00
Chubby Granny Chaser	16e3d52508	style: enhance download group styling for improved layout, responsiveness, and user interaction	2025-11-30 05:39:01 +00:00
Chubby Granny Chaser	7e0002cf95	style: format imports in download-group.tsx for improved readability	2025-11-30 05:14:48 +00:00
Chubby Granny Chaser	bf8b3ca836	style: update download group layout and styling for improved responsiveness	2025-11-30 05:14:26 +00:00
Moyasee	77e376e742	fix: peak spead not working	2025-11-30 07:13:12 +02:00
Chubby Granny Chaser	bd28b202c4	Merge branch 'fix/downloads-ui' of https://github.com/hydralauncher/hydra	2025-11-30 05:06:59 +00:00
Moyasee	153b954e78	fix: progress bar, context menu, repacks modal, responsiveness and styling fix	2025-11-30 07:05:19 +02:00
Chubby Granny Chaser	a9e63730be	Merge pull request #1880 from hydralauncher/fix/fixing-hls-videos Some checks failed Build / build (ubuntu-latest) (push) Has been cancelled Details Build / build (windows-2022) (push) Has been cancelled Details Fix/fixing hls videos	2025-11-30 03:45:10 +00:00