style: update repacks modal styles for improved layout and positioning

sync main

.github/workflows/build-renderer.yml

@@ -42,6 +42,7 @@ jobs:
         run: yarn build
         env:
           RENDERER_VITE_EXTERNAL_RESOURCES_URL: ${{ vars.EXTERNAL_RESOURCES_URL }}
+          RENDERER_VITE_SENTRY_DSN: ${{ vars.SENTRY_DSN }}
 
       - name: Deploy to Cloudflare Pages
         env:

package.json

@@ -40,6 +40,7 @@
     "@primer/octicons-react": "^19.9.0",
     "@radix-ui/react-dropdown-menu": "^2.1.16",
     "@reduxjs/toolkit": "^2.2.3",
+    "@sentry/react": "^10.33.0",
     "@tiptap/extension-bold": "^3.6.2",
     "@tiptap/extension-italic": "^3.6.2",
     "@tiptap/extension-link": "^3.6.2",

src/locales/en/translation.json

@@ -372,6 +372,9 @@
     "audio": "Audio",
     "filter_by_source": "Filter by source",
     "no_repacks_found": "No sources found for this game",
+    "source_online": "Source is online",
+    "source_partial": "Some links are offline",
+    "source_offline": "Source is offline",
     "delete_review": "Delete review",
     "remove_review": "Remove Review",
     "delete_review_modal_title": "Are you sure you want to delete your review?",

src/main/events/library/get-library.ts

@@ -25,7 +25,7 @@ const getLibrary = async (): Promise<LibraryGame[]> => {
               const achievements = await gameAchievementsSublevel.get(key);
 
               unlockedAchievementCount =
-                achievements?.unlockedAchievements.length ?? 0;
+                achievements?.unlockedAchievements?.length ?? 0;
             }
 
             return {

src/main/services/window-manager.ts

@@ -138,12 +138,21 @@ export class WindowManager {
       (details, callback) => {
         if (
           details.webContentsId !== this.mainWindow?.webContents.id ||
-          details.url.includes("chatwoot") ||
-          details.url.includes("workwonders")
+          details.url.includes("chatwoot")
         ) {
           return callback(details);
         }
 
+        if (details.url.includes("workwonders")) {
+          return callback({
+            ...details,
+            requestHeaders: {
+              Origin: "https://workwonders.app",
+              ...details.requestHeaders,
+            },
+          });
+        }
+
         const userAgent = new UserAgent();
 
         callback({

src/renderer/src/app.tsx

@@ -134,7 +134,10 @@ export function App() {
 
       await workwondersRef.current.initChangelogWidget();
       workwondersRef.current.initChangelogWidgetMini();
-      workwondersRef.current.initFeedbackWidget();
+
+      if (token) {
+        workwondersRef.current.initFeedbackWidget();
+      }
     },
     [workwondersRef]
   );

src/renderer/src/main.tsx

@@ -21,6 +21,7 @@ import resources from "@locales";
 
 import { logger } from "./logger";
 import { addCookieInterceptor } from "./cookies";
+import * as Sentry from "@sentry/react";
 import { levelDBService } from "./services/leveldb.service";
 import Catalogue from "./pages/catalogue/catalogue";
 import Home from "./pages/home/home";
@@ -36,6 +37,18 @@ import { AchievementNotification } from "./pages/achievements/notification/achie
 
 console.log = logger.log;
 
+Sentry.init({
+  dsn: import.meta.env.RENDERER_VITE_SENTRY_DSN,
+  integrations: [
+    Sentry.browserTracingIntegration(),
+    Sentry.replayIntegration(),
+  ],
+  tracesSampleRate: 0.5,
+  replaysSessionSampleRate: 0,
+  replaysOnErrorSampleRate: 0,
+  release: "hydra-launcher@" + (await window.electron.getVersion()),
+});
+
 const isStaging = await window.electron.isStaging();
 addCookieInterceptor(isStaging);
 

src/renderer/src/pages/game-details/modals/repacks-modal.scss

@@ -40,6 +40,34 @@
     gap: calc(globals.$spacing-unit * 1);
     color: globals.$body-color;
     padding: calc(globals.$spacing-unit * 2);
+    padding-right: calc(globals.$spacing-unit * 4);
+    position: relative;
+  }
+
+  &__availability-orb {
+    position: absolute;
+    top: calc(globals.$spacing-unit * 1.5);
+    right: calc(globals.$spacing-unit * 1.5);
+    width: 8px;
+    height: 8px;
+    border-radius: 50%;
+    flex-shrink: 0;
+
+    &--online {
+      background-color: #22c55e;
+      box-shadow: 0 0 6px rgba(34, 197, 94, 0.5);
+    }
+
+    &--partial {
+      background-color: #eab308;
+      box-shadow: 0 0 6px rgba(234, 179, 8, 0.5);
+    }
+
+    &--offline {
+      background-color: #ef4444;
+      opacity: 0.7;
+      box-shadow: 0 0 6px rgba(239, 68, 68, 0.4);
+    }
   }
 
   &__repack-title {

src/renderer/src/pages/game-details/modals/repacks-modal.tsx

@@ -6,6 +6,7 @@ import {
   ChevronDownIcon,
   ChevronUpIcon,
 } from "@primer/octicons-react";
+import { Tooltip } from "react-tooltip";
 
 import {
   Badge,
@@ -185,6 +186,20 @@ export function RepacksModal({
     );
   }, [repacks, hashesInDebrid]);
 
+  const getRepackAvailabilityStatus = (
+    repack: GameRepack
+  ): "online" | "partial" | "offline" => {
+    const unavailableSet = new Set(repack.unavailableUris ?? []);
+    const availableCount = repack.uris.filter(
+      (uri) => !unavailableSet.has(uri)
+    ).length;
+    const unavailableCount = repack.uris.length - availableCount;
+
+    if (unavailableCount === 0) return "online";
+    if (availableCount === 0) return "offline";
+    return "partial";
+  };
+
   useEffect(() => {
     const term = filterTerm.trim().toLowerCase();
 
@@ -363,6 +378,8 @@ export function RepacksModal({
             filteredRepacks.map((repack) => {
               const isLastDownloadedOption =
                 checkIfLastDownloadedOption(repack);
+              const availabilityStatus = getRepackAvailabilityStatus(repack);
+              const tooltipId = `availability-orb-${repack.id}`;
 
               return (
                 <Button
@@ -371,6 +388,13 @@ export function RepacksModal({
                   onClick={() => handleRepackClick(repack)}
                   className="repacks-modal__repack-button"
                 >
+                  <span
+                    className={`repacks-modal__availability-orb repacks-modal__availability-orb--${availabilityStatus}`}
+                    data-tooltip-id={tooltipId}
+                    data-tooltip-content={t(`source_${availabilityStatus}`)}
+                  />
+                  <Tooltip id={tooltipId} />
+
                   <p className="repacks-modal__repack-title">
                     {repack.title}
                     {userPreferences?.enableNewDownloadOptionsBadges !==

yarn.lock

@@ -2174,6 +2174,60 @@
   resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.52.4.tgz#5b2dd648a960b8fa00d76f2cc4eea2f03daa80f4"
   integrity sha512-bf9PtUa0u8IXDVxzRToFQKsNCRz9qLYfR/MpECxl4mRoWYjAeFjgxj1XdZr2M/GNVpT05p+LgQOHopYDlUu6/w==
 
+"@sentry-internal/browser-utils@10.33.0":
+  version "10.33.0"
+  resolved "https://registry.yarnpkg.com/@sentry-internal/browser-utils/-/browser-utils-10.33.0.tgz#4a5d98352267b63fcc449efe14627c0fc082089e"
+  integrity sha512-nDJFHAfiFifBfJB0OF6DV6BIsIV5uah4lDsV4UBAgPBf+YAHclO10y1gi2U/JMh58c+s4lXi9p+PI1TFXZ0c6w==
+  dependencies:
+    "@sentry/core" "10.33.0"
+
+"@sentry-internal/feedback@10.33.0":
+  version "10.33.0"
+  resolved "https://registry.yarnpkg.com/@sentry-internal/feedback/-/feedback-10.33.0.tgz#5865b4a68d607bb48d8159a100464ae640a638e7"
+  integrity sha512-sN/VLWtEf0BeV6w6wldIpTxUQxNVc9o9tjLRQa8je1ZV2FCgXA124Iff/zsowsz82dLqtg7qp6GA5zYXVq+JMA==
+  dependencies:
+    "@sentry/core" "10.33.0"
+
+"@sentry-internal/replay-canvas@10.33.0":
+  version "10.33.0"
+  resolved "https://registry.yarnpkg.com/@sentry-internal/replay-canvas/-/replay-canvas-10.33.0.tgz#9ea15b320618ad220e5d8f7c804a0d9ca55b04af"
+  integrity sha512-MTmP6uoAVzw4CCPeqCgCLsRSiOfGLxgyMFjGTCW3E7t62MJ9S0H5sLsQ34sHxXUa1gFU9UNAjEvRRpZ0JvWrPw==
+  dependencies:
+    "@sentry-internal/replay" "10.33.0"
+    "@sentry/core" "10.33.0"
+
+"@sentry-internal/replay@10.33.0":
+  version "10.33.0"
+  resolved "https://registry.yarnpkg.com/@sentry-internal/replay/-/replay-10.33.0.tgz#8cfe3a353731fcd81e7afb646b6befeb0f9feb0f"
+  integrity sha512-UOU9PYxuXnPop3HoQ3l4Q7SZUXJC3Vmfm0Adgad8U03UcrThWIHYc5CxECSrVzfDFNOT7w9o7HQgRAgWxBPMXg==
+  dependencies:
+    "@sentry-internal/browser-utils" "10.33.0"
+    "@sentry/core" "10.33.0"
+
+"@sentry/browser@10.33.0":
+  version "10.33.0"
+  resolved "https://registry.yarnpkg.com/@sentry/browser/-/browser-10.33.0.tgz#33284952a1cdf43cdac15ac144c85e81e7cbaa93"
+  integrity sha512-iWiPjik9zetM84jKfk01UveW1J0+X7w8XmJ8+IrhTyNDBVUWCRJWD8FrksiN1dRSg5mFWgfMRzKMz27hAScRwg==
+  dependencies:
+    "@sentry-internal/browser-utils" "10.33.0"
+    "@sentry-internal/feedback" "10.33.0"
+    "@sentry-internal/replay" "10.33.0"
+    "@sentry-internal/replay-canvas" "10.33.0"
+    "@sentry/core" "10.33.0"
+
+"@sentry/core@10.33.0":
+  version "10.33.0"
+  resolved "https://registry.yarnpkg.com/@sentry/core/-/core-10.33.0.tgz#ea4964fbec290503b419ccaf1a313924d30ad1c8"
+  integrity sha512-ehH1VSUclIHZKEZVdv+klofsFIh8FFzqA6AAV23RtLepptzA8wqQzUGraEuSN25sYcNmYJ0jti5U0Ys+WZv5Dw==
+
+"@sentry/react@^10.33.0":
+  version "10.33.0"
+  resolved "https://registry.yarnpkg.com/@sentry/react/-/react-10.33.0.tgz#89a3be88d43e49de90943ad2ac86ee1664048097"
+  integrity sha512-iMdC2Iw54ibAccatJ5TjoLlIy3VotFteied7JFvOudgj1/2eBBeWthRobZ5p6/nAOpj4p9vJk0DeLrc012sd2g==
+  dependencies:
+    "@sentry/browser" "10.33.0"
+    "@sentry/core" "10.33.0"
+
 "@sindresorhus/is@^4.0.0":
   version "4.6.0"
   resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-4.6.0.tgz#3c7c9c46e678feefe7a2e5bb609d3dbd665ffb3f"