Merge branch 'hydralauncher:main' into main

.github/workflows/build.yml

@@ -11,7 +11,7 @@ jobs:
   build:
     strategy:
       matrix:
-        os: [windows-latest, ubuntu-latest]
+        os: [windows-2022, ubuntu-latest]
       fail-fast: false
 
     runs-on: ${{ matrix.os }}
@@ -59,7 +59,7 @@ jobs:
           RENDERER_VITE_TORBOX_REFERRAL_CODE: ${{ vars.RENDERER_VITE_TORBOX_REFERRAL_CODE }}
 
       - name: Build Windows
-        if: matrix.os == 'windows-latest'
+        if: matrix.os == 'windows-2022'
         run: yarn build:win
         env:
           MAIN_VITE_API_URL: ${{ vars.MAIN_VITE_STAGING_API_URL }}

.github/workflows/release.yml

@@ -12,7 +12,7 @@ jobs:
   build:
     strategy:
       matrix:
-        os: [windows-latest, ubuntu-latest]
+        os: [windows-2022, ubuntu-latest]
 
     runs-on: ${{ matrix.os }}
 
@@ -59,7 +59,7 @@ jobs:
           RENDERER_VITE_TORBOX_REFERRAL_CODE: ${{ vars.RENDERER_VITE_TORBOX_REFERRAL_CODE }}
 
       - name: Build Windows
-        if: matrix.os == 'windows-latest'
+        if: matrix.os == 'windows-2022'
         run: yarn build:win
         env:
           MAIN_VITE_API_URL: ${{ vars.MAIN_VITE_API_URL }}

src/locales/pt-BR/translation.json

@@ -555,7 +555,7 @@
     "playtime": "Tempo de jogo",
     "played_recently": "Jogado recentemente",
     "pinned": "Fixado",
-    "amount_minutes_short": "{{amount}}h",
+    "amount_minutes_short": "{{amount}}m",
     "amount_hours_short": "{{amount}}h",
     "game_added_to_pinned": "Jogo adicionado aos fixados",
     "achievements_earned": "Conquistas recebidas"

src/main/services/steam-250.ts

@@ -10,7 +10,7 @@ export const requestSteam250 = async (path: string) => {
       const { window } = new JSDOM(response.data);
       const { document } = window;
 
-      return Array.from(document.querySelectorAll(".appline .title a"))
+      return Array.from(document.querySelectorAll("a[data-title]"))
         .map(($title) => {
           const steamGameUrl = ($title as HTMLAnchorElement).href;
           if (!steamGameUrl) return null;

src/renderer/src/pages/game-details/description-header/description-header.scss

@@ -1,8 +1,7 @@
 @use "../../../scss/globals.scss";
 
 .description-header {
-  width: calc(100% - calc(globals.$spacing-unit * 2));
+  width: 100%;
-  margin: calc(globals.$spacing-unit * 1) calc(globals.$spacing-unit * 1);
   padding: calc(globals.$spacing-unit * 1.5);
   display: flex;
   justify-content: space-between;
@@ -12,6 +11,7 @@
   border-radius: 12px;
   border: 1px solid rgba(255, 255, 255, 0.05);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+  margin-bottom: calc(globals.$spacing-unit * 1);
 
   &__info {
     display: flex;

src/renderer/src/pages/game-details/game-details-content.tsx

@@ -191,14 +191,16 @@ export function GameDetailsContent() {
               {renderGameLogo()}
 
               <div className="game-details__hero-buttons game-details__hero-buttons--right">
-                <button
+                {game && (
-                  type="button"
+                  <button
-                  className="game-details__edit-custom-game-button"
+                    type="button"
-                  onClick={handleEditGameClick}
+                    className="game-details__edit-custom-game-button"
-                  title={t("edit_game_modal_button")}
+                    onClick={handleEditGameClick}
-                >
+                    title={t("edit_game_modal_button")}
-                  <PencilIcon size={16} />
+                  >
-                </button>
+                    <PencilIcon size={16} />
+                  </button>
+                )}
 
                 {game?.shop !== "custom" && (
                   <button
@@ -240,13 +242,15 @@ export function GameDetailsContent() {
         </div>
       </section>
 
-      <EditGameModal
+      {game && (
-        visible={showEditGameModal}
+        <EditGameModal
-        onClose={() => setShowEditGameModal(false)}
+          visible={showEditGameModal}
-        game={game}
+          onClose={() => setShowEditGameModal(false)}
-        shopDetails={shopDetails}
+          game={game}
-        onGameUpdated={handleGameUpdated}
+          shopDetails={shopDetails}
-      />
+          onGameUpdated={handleGameUpdated}
+        />
+      )}
     </div>
   );
 }

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

@@ -182,6 +182,8 @@ $hero-height: 300px;
       globals.$background-color 50%,
       globals.$dark-background-color 100%
     );
+    padding: calc(globals.$spacing-unit * 1.5);
+    gap: calc(globals.$spacing-unit * 1.5);
   }
 
   &__description-content {
@@ -196,22 +198,12 @@ $hero-height: 300px;
     user-select: text;
     line-height: 22px;
     font-size: globals.$body-font-size;
-    padding: calc(globals.$spacing-unit * 2) calc(globals.$spacing-unit * 1.5);
     width: 100%;
     margin-left: auto;
     margin-right: auto;
     overflow-x: auto;
     min-height: auto;
 
-    @media (min-width: 768px) {
-      padding: calc(globals.$spacing-unit * 2.5) calc(globals.$spacing-unit * 2);
-    }
-
-    @media (min-width: 1024px) {
-      padding: calc(globals.$spacing-unit * 3) calc(globals.$spacing-unit * 2);
-      width: 80%;
-    }
-
     @media (min-width: 1280px) {
       width: 60%;
     }

src/renderer/src/pages/game-details/sidebar-section/sidebar-section.scss

@@ -1,7 +1,7 @@
 @use "../../../scss/globals.scss";
 
 .sidebar-section {
-  background-color: globals.$dark-background-color;
+  background-color: globals.$background-color;
   border-radius: 12px;
   border: 1px solid rgba(255, 255, 255, 0.05);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
@@ -21,7 +21,7 @@
     font-weight: bold;
 
     &:hover {
-      background-color: rgba(255, 255, 255, 0.05);
+      background-color: rgba(255, 255, 255, 0.1);
     }
 
     &:active {
@@ -40,6 +40,7 @@
   &__content {
     overflow: hidden;
     transition: max-height 0.4s cubic-bezier(0, 1, 0, 1);
+    background-color: globals.$dark-background-color;
     position: relative;
   }
 }

src/renderer/src/pages/game-details/sidebar/sidebar.scss

@@ -1,11 +1,12 @@
 @use "../../../scss/globals.scss";
 
 .content-sidebar {
-  border-left: solid 1px globals.$border-color;
-  background-color: globals.$dark-background-color;
   height: 100%;
   flex-shrink: 0;
   width: 280px;
+  display: flex;
+  flex-direction: column;
+  gap: calc(globals.$spacing-unit * 1.5);
 
   @media (min-width: 1024px) {
     width: 320px;

src/renderer/src/pages/profile/profile-content/profile-content.tsx

@@ -177,6 +177,7 @@ export function ProfileContent() {
                                 statIndex={statsIndex}
                                 onMouseEnter={handleOnMouseEnterGameCard}
                                 onMouseLeave={handleOnMouseLeaveGameCard}
+                                sortBy={sortBy}
                               />
                             </li>
                           ))}
@@ -208,6 +209,7 @@ export function ProfileContent() {
                           statIndex={statsIndex}
                           onMouseEnter={handleOnMouseEnterGameCard}
                           onMouseLeave={handleOnMouseLeaveGameCard}
+                          sortBy={sortBy}
                         />
                       </li>
                     ))}

src/renderer/src/pages/profile/profile-content/user-library-game-card.tsx

@@ -26,6 +26,7 @@ interface UserLibraryGameCardProps {
   statIndex: number;
   onMouseEnter: () => void;
   onMouseLeave: () => void;
+  sortBy?: string;
 }
 
 export function UserLibraryGameCard({
@@ -33,6 +34,7 @@ export function UserLibraryGameCard({
   statIndex,
   onMouseEnter,
   onMouseLeave,
+  sortBy,
 }: UserLibraryGameCardProps) {
   const { userProfile, isMe, getUserLibraryGames } =
     useContext(userProfileContext);
@@ -108,7 +110,7 @@ export function UserLibraryGameCard({
         !game.isPinned
       );
 
-      await getUserLibraryGames();
+      await getUserLibraryGames(sortBy);
 
       if (game.isPinned) {
         showSuccessToast(t("game_removed_from_pinned"));