fix/add-context-menu: resolve conflicts

hydralauncher · May 23, 2024 · aa6be6b · aa6be6b
1 parent 440cf70
commit aa6be6b
Show file tree

Hide file tree

Showing 10 changed files with 110 additions and 124 deletions.
diff --git a/src/locales/pl/translation.json b/src/locales/pl/translation.json
@@ -21,8 +21,7 @@
     "delete_installation_files": "Usuń pliki instalacyjne",
     "change_exe_path": "Zmień ścieżkę wykonywalną",
     "open_archive_path": "Otwórz lokalizację pliku",
-    "game_executable": "Plik wykonywalny gry"
-    "home": "Główna",
+    "game_executable": "Plik wykonywalny gry",
     "discord": "Dołącz nasz Discord",
     "telegram": "Dołącz nasz Telegram",
     "x": "Śledź na X",
@@ -92,7 +91,6 @@
     "change": "Zmień",
     "repacks_modal_description": "Wybierz repack, który chcesz pobrać",
     "select_folder_hint": "Aby zmienić domyślny folder, przejdź do",
-    "download_now": "Pobierz teraz",
     "installation_instructions": "Instrukcja instalacji",
     "installation_instructions_description": "Do zainstalowania tej gry wymagane są dodatkowe kroki",
     "online_fix_instruction": "Gry OnlineFix wymagają hasła do wyodrębnienia. W razie potrzeby użyj następującego hasła:",
@@ -107,7 +105,7 @@
     "previous_screenshot": "Poprzedni zrzut ekranu",
     "next_screenshot": "Następny zrzut ekranu",
     "screenshot": "Zrzut ekranu {{number}}",
-    "open_screenshot": "Otwórz zrzut ekranu {{number}}"
+    "open_screenshot": "Otwórz zrzut ekranu {{number}}",
     "settings": "Ustawienia Hydra",
     "download_now": "Pobierz teraz",
     "game_executable": "Plik wykonywalny gry"

diff --git a/src/locales/ru/translation.json b/src/locales/ru/translation.json
@@ -155,7 +155,7 @@
     "behavior": "Поведение",
     "enable_real_debrid": "Включить Real Debrid",
     "real_debrid": "Real Debrid",
-    "real_debrid_api_token_hint": "API ключ можно получить <0>здесь</0>.",,
+    "real_debrid_api_token_hint": "API ключ можно получить <0>здесь</0>.",
     "save_changes": "Сохранить изменения"
   },
   "notifications": {

diff --git a/src/main/events/library/change-executable-path.ts b/src/main/events/library/change-executable-path.ts
@@ -17,6 +17,4 @@ const changeExecutablePath = async (
   );
 };
 
-registerEvent(changeExecutablePath, {
-  name: "changeExecutablePath",
-});
+registerEvent("changeExecutablePath", changeExecutablePath);
diff --git a/src/main/events/library/open-game-folder.ts b/src/main/events/library/open-game-folder.ts
@@ -26,6 +26,4 @@ const openGameFolder = async (
   shell.openPath(gamePath);
 };
 
-registerEvent(openGameFolder, {
-  name: "openGameFolder",
-});
+registerEvent("openGameFolder", openGameFolder);
diff --git a/src/renderer/src/assets/discord-icon.svg b/src/renderer/src/assets/discord-icon.svg
diff --git a/src/renderer/src/components/sidebar/sidebar.css.ts b/src/renderer/src/components/sidebar/sidebar.css.ts
@@ -176,3 +176,36 @@ export const contextMenuItemIcon = style({
   width: "14px",
   height: "14px",
 });
+
+export const sidebarFooter = style({
+  marginTop: "auto",
+  padding: `${SPACING_UNIT * 2}px`,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "space-between",
+});
+
+export const footerSocialsContainer = style({
+  display: "flex",
+  alignItems: "center",
+  gap: `${SPACING_UNIT * 1.5}px`,
+});
+
+export const footerSocialsItem = style({
+  color: vars.color.bodyText,
+  backgroundColor: vars.color.darkBackground,
+  width: "16px",
+  height: "16px",
+  display: "flex",
+  alignItems: "center",
+  transition: "all ease 0.2s",
+  cursor: "pointer",
+  ":hover": {
+    opacity: "0.75",
+  },
+});
+
+export const footerText = style({
+  color: vars.color.bodyText,
+  fontSize: "12px",
+});
diff --git a/src/renderer/src/components/sidebar/sidebar.tsx b/src/renderer/src/components/sidebar/sidebar.tsx
@@ -9,49 +9,71 @@ import { useDownload, useLibrary } from "@renderer/hooks";
 
 import { routes } from "./routes";
 
-
+import {
+  FileDirectoryIcon,
+  FileDirectorySymlinkIcon,
+  MarkGithubIcon,
+  TrashIcon,
+} from "@primer/octicons-react";
+import { GameStatus, GameStatusHelper } from "@shared";
 import { DeleteModal } from "./delete-modal";
 import * as styles from "./sidebar.css";
 
+import DiscordLogo from "@renderer/assets/discord-icon.svg?react";
+import SteamLogo from "@renderer/assets/steam-logo.svg?react";
+import XLogo from "@renderer/assets/x-icon.svg?react";
+
 const SIDEBAR_MIN_WIDTH = 200;
 const SIDEBAR_INITIAL_WIDTH = 250;
 const SIDEBAR_MAX_WIDTH = 450;
 
 const initialSidebarWidth = window.localStorage.getItem("sidebarWidth");
 
 export function Sidebar() {
+  const navigate = useNavigate();
+  const location = useLocation();
   const { t } = useTranslation("sidebar");
   const { library, updateLibrary } = useLibrary();
-  const navigate = useNavigate();
+  const { game: gameDownloading, progress } = useDownload();
 
   const [filteredLibrary, setFilteredLibrary] = useState<Game[]>([]);
-
   const [isResizing, setIsResizing] = useState(false);
   const [sidebarWidth, setSidebarWidth] = useState(
     initialSidebarWidth ? Number(initialSidebarWidth) : SIDEBAR_INITIAL_WIDTH
   );
-
   const [isContextMenuOpen, setIsContextMenuOpen] = useState(false);
   const [axisCoordinates, setAxisCoordinates] = useState({
     x: 0,
     y: 0,
   });
-
   const [showDeleteModal, setShowDeleteModal] = useState(false);
   const [currentGame, setCurrentGame] = useState<Game>();
 
-  const location = useLocation();
-
-  const { game: gameDownloading, progress } = useDownload();
+  const sidebarRef = useRef<HTMLElement>(null);
+  const cursorPos = useRef({ x: 0 });
+  const sidebarInitialWidth = useRef(0);
 
   const isDownloading = library.some((game) =>
     GameStatusHelper.isDownloading(game.status)
   );
 
-  const sidebarRef = useRef<HTMLElement>(null);
-
-  const cursorPos = useRef({ x: 0 });
-  const sidebarInitialWidth = useRef(0);
+  const socials = [
+    {
+      url: "https://discord.gg/hydralauncher",
+      icon: <DiscordLogo />,
+      label: t("discord"),
+    },
+    {
+      url: "https://twitter.com/hydralauncher",
+      icon: <XLogo />,
+      label: t("x"),
+    },
+    {
+      url: "https://github.com/hydralauncher/hydra",
+      icon: <MarkGithubIcon size={16} />,
+      label: t("github"),
+    },
+  ];
 
   const selectGameExecutable = async () => {
     const { filePaths } = await window.electron.showOpenDialog({
@@ -97,6 +119,28 @@ export function Sidebar() {
       updateLibrary();
     });
 
+  const getGameTitle = (game: Game) => {
+    if (game.status === GameStatus.Paused)
+      return t("paused", { title: game.title });
+
+    if (gameDownloading?.id === game.id) {
+      const isVerifying = GameStatusHelper.isVerifying(gameDownloading.status);
+
+      if (isVerifying)
+        return t(gameDownloading.status!, {
+          title: game.title,
+          percentage: progress,
+        });
+
+      return t("downloading", {
+        title: game.title,
+        percentage: progress,
+      });
+    }
+
+    return game.title;
+  };
+
   const handleMouseDown: React.MouseEventHandler<HTMLButtonElement> = (
     event
   ) => {
@@ -121,29 +165,6 @@ export function Sidebar() {
     setIsContextMenuOpen(false);
   };
 
-  const getGameTitle = (game: Game) => {
-    if (game.status === "paused") return t("paused", { title: game.title });
-
-    if (gameDownloading?.id === game.id) {
-      const isVerifying = ["downloading_metadata", "checking_files"].includes(
-        gameDownloading?.status
-      );
-
-      if (isVerifying)
-        return t(gameDownloading.status, {
-          title: game.title,
-          percentage: progress,
-        });
-
-      return t("downloading", {
-        title: game.title,
-        percentage: progress,
-      });
-    }
-
-    return game.title;
-  };
-
   const handleSidebarItemClick = (path: string) => {
     if (path !== location.pathname) {
       navigate(path);
@@ -193,33 +214,6 @@ export function Sidebar() {
       window.removeEventListener("click", handleClick);
     };
   }, []);
-  const getGameTitle = (game: Game) => {
-    if (game.status === GameStatus.Paused)
-      return t("paused", { title: game.title });
-
-    if (gameDownloading?.id === game.id) {
-      const isVerifying = GameStatusHelper.isVerifying(gameDownloading.status);
-
-      if (isVerifying)
-        return t(gameDownloading.status!, {
-          title: game.title,
-          percentage: progress,
-        });
-
-      return t("downloading", {
-        title: game.title,
-        percentage: progress,
-      });
-    }
-
-    return game.title;
-  };
-
-  const handleSidebarItemClick = (path: string) => {
-    if (path !== location.pathname) {
-      navigate(path);
-    }
-  };
 
   return (
     <>
@@ -300,11 +294,16 @@ export function Sidebar() {
                           )
                         }
                       >
-                        <img
-                          className={styles.gameIcon}
-                          src={game.iconUrl}
-                          alt={game.title}
-                        />
+                        {game.iconUrl ? (
+                          <img
+                            className={styles.gameIcon}
+                            src={game.iconUrl}
+                            alt={game.title}
+                          />
+                        ) : (
+                          <SteamLogo className={styles.gameIcon} />
+                        )}
+
                         <span className={styles.menuItemButtonLabel}>
                           {getGameTitle(game)}
                         </span>
@@ -384,42 +383,6 @@ export function Sidebar() {
             />
           </section>
         </div>
-          <ul className={styles.menu}>
-            {filteredLibrary.map((game) => (
-              <li
-                key={game.id}
-                className={styles.menuItem({
-                  active:
-                    location.pathname === `/game/${game.shop}/${game.objectID}`,
-                  muted: game.status === GameStatus.Cancelled,
-                })}
-              >
-                <button
-                  type="button"
-                  className={styles.menuItemButton}
-                  onClick={() =>
-                    handleSidebarItemClick(buildGameDetailsPath(game))
-                  }
-                >
-                  {game.iconUrl ? (
-                    <img
-                      className={styles.gameIcon}
-                      src={game.iconUrl}
-                      alt={game.title}
-                    />
-                  ) : (
-                    <SteamLogo className={styles.gameIcon} />
-                  )}
-
-                  <span className={styles.menuItemButtonLabel}>
-                    {getGameTitle(game)}
-                  </span>
-                </button>
-              </li>
-            ))}
-          </ul>
-        </section>
-      </div>
 
         <button
           type="button"
@@ -447,12 +410,12 @@ export function Sidebar() {
           </span>
         </footer>
       </aside>
-    </>
+
       <button
         type="button"
         className={styles.handle}
         onMouseDown={handleMouseDown}
       />
-    </aside>
+    </>
   );
 }
diff --git a/src/renderer/src/declaration.d.ts b/src/renderer/src/declaration.d.ts
@@ -63,7 +63,7 @@ declare global {
       executablePath: string | null
     ) => Promise<void>;
     getLibrary: () => Promise<Game[]>;
-    openGameFolder: (gameId: number) => Promise<boolean>;
+    openGameFolder: (gameId: number) => Promise<void | boolean>;
     openGameInstaller: (gameId: number) => Promise<boolean>;
     openGame: (gameId: number, executablePath: string) => Promise<void>;
     changeExecutablePath: (

diff --git a/src/renderer/src/hooks/use-download.ts b/src/renderer/src/hooks/use-download.ts
@@ -7,10 +7,11 @@ import {
   setLastPacket,
 } from "@renderer/features";
 import { formatDownloadProgress } from "@renderer/helpers";
-import { formatBytes } from "@renderer/utils";
+import { GameStatus, GameStatusHelper, formatBytes } from "@shared";
 import type { GameShop, TorrentProgress } from "@types";
 import { useAppDispatch, useAppSelector } from "./redux";
 import { useDate } from "./use-date";
+import { useLibrary } from "./use-library";
 
 export function useDownload() {
   const { updateLibrary } = useLibrary();

diff --git a/src/renderer/src/pages/game-details/hero/hero-panel-actions.tsx b/src/renderer/src/pages/game-details/hero/hero-panel-actions.tsx
@@ -47,12 +47,6 @@ export function HeroPanelActions({
 
   const { t } = useTranslation("game_details");
 
-  const getDownloadsPath = async () => {
-    const userPreferences = await window.electron.getUserPreferences();
-    if (userPreferences?.downloadsPath) return userPreferences.downloadsPath;
-    return window.electron.getDefaultDownloadsPath();
-  };
-
   const selectGameExecutable = async () => {
     const { filePaths } = await window.electron.showOpenDialog({
       properties: ["openFile"],