Merge branch 'main' of https://github.com/hydralauncher/hydra

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

@@ -1,5 +1,5 @@
 import { format } from "date-fns";
-import { useCallback, useEffect, useMemo, useState } from "react";
+import { useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 
 import { useDownload } from "@renderer/hooks";
@@ -23,6 +23,8 @@ export interface HeroPanelProps {
   getGame: () => void;
 }
 
+const MAX_MINUTES_TO_SHOW_IN_PLAYTIME = 120;
+
 export function HeroPanel({
   game,
   gameDetails,
@@ -31,7 +33,7 @@ export function HeroPanel({
   getGame,
   isGamePlaying,
 }: HeroPanelProps) {
-  const { t } = useTranslation("game_details");
+  const { t, i18n } = useTranslation("game_details");
 
   const [showBinaryNotFoundModal, setShowBinaryNotFoundModal] = useState(false);
   const [lastTimePlayed, setLastTimePlayed] = useState("");
@@ -49,29 +51,36 @@ export function HeroPanel({
   } = useDownload();
   const isGameDownloading = isDownloading && gameDownloading?.id === game?.id;
 
-  const updateLastTimePlayed = useCallback(() => {
-    setLastTimePlayed(
-      formatDistance(game.lastTimePlayed, new Date(), {
-        addSuffix: true,
-      })
-    );
-  }, [game?.lastTimePlayed, formatDistance]);
-
   useEffect(() => {
     if (game?.lastTimePlayed) {
-      updateLastTimePlayed();
+      setLastTimePlayed(
+        formatDistance(game.lastTimePlayed, new Date(), {
+          addSuffix: true,
+        })
+      );
+    }
+  }, [game?.lastTimePlayed, formatDistance]);
 
-      const interval = setInterval(() => {
-        updateLastTimePlayed();
-      }, 1000);
+  const numberFormatter = useMemo(() => {
+    return new Intl.NumberFormat(i18n.language, {
+      maximumFractionDigits: 1,
+    });
+  }, [i18n]);
 
-      return () => {
-        clearInterval(interval);
-      };
+  const formatPlayTime = () => {
+    const milliseconds = game?.playTimeInMilliseconds || 0;
+    const seconds = milliseconds / 1000;
+    const minutes = seconds / 60;
+
+    if (minutes < MAX_MINUTES_TO_SHOW_IN_PLAYTIME) {
+      return t("amount_minutes", {
+        amount: minutes.toFixed(0),
+      });
     }
 
-    return () => {};
-  }, [game?.lastTimePlayed, updateLastTimePlayed]);
+    const hours = minutes / 60;
+    return t("amount_hours", { amount: numberFormatter.format(hours) });
+  };
 
   const finalDownloadSize = useMemo(() => {
     if (!game) return "N/A";
@@ -140,7 +149,7 @@ export function HeroPanel({
         <>
           <p>
             {t("play_time", {
-              amount: formatDistance(0, game.playTimeInMilliseconds),
+              amount: formatPlayTime(game.playTimeInMilliseconds),
             })}
           </p>
 

src/renderer/src/pages/settings/settings.tsx

@@ -11,7 +11,8 @@ export function Settings() {
     downloadNotificationsEnabled: false,
     repackUpdatesNotificationsEnabled: false,
     telemetryEnabled: false,
-    realDebridApiToken: null,
+    realDebridApiToken: null as string | null,
+    preferQuitInsteadOfHiding: false,
   });
 
   const { t } = useTranslation("settings");
@@ -28,7 +29,9 @@ export function Settings() {
         repackUpdatesNotificationsEnabled:
           userPreferences?.repackUpdatesNotificationsEnabled ?? false,
         telemetryEnabled: userPreferences?.telemetryEnabled ?? false,
-        realDebridApiToken: userPreferences.realDebridApiToken,
+        realDebridApiToken: userPreferences?.realDebridApiToken ?? null,
+        preferQuitInsteadOfHiding:
+          userPreferences?.preferQuitInsteadOfHiding ?? false,
       });
     });
   }, []);
@@ -110,13 +113,25 @@ export function Settings() {
           }
         />
 
+        <h3>{t("behavior")}</h3>
+
+        <CheckboxField
+          label={t("quit_app_instead_hiding")}
+          checked={form.preferQuitInsteadOfHiding}
+          onChange={() =>
+            updateUserPreferences(
+              "preferQuitInsteadOfHiding",
+              !form.preferQuitInsteadOfHiding
+            )
+          }
+        />
+
         <TextField
           label={t("real_debrid_api_token_description")}
           value={form.realDebridApiToken ?? ""}
           onChange={(event) => {
             updateUserPreferences("realDebridApiToken", event.target.value);
-          }}
-        />
+          }} />
       </div>
     </section>
   );