From 8c64e0a53d63a511ff40a391b9ce21ac49ab3ba3 Mon Sep 17 00:00:00 2001
From: Etaash Mathamsetty <etaash.mathamsetty@gmail.com>
Date: Mon, 30 Dec 2024 10:51:49 -0500
Subject: [PATCH] Introduce Enable Gamescope toggle

---
 public/locales/en/translation.json            |   1 +
 src/backend/launcher.ts                       |   6 +-
 src/common/types.ts                           |   1 +
 .../screens/Settings/components/Gamescope.tsx | 111 +++++++++++-------
 4 files changed, 69 insertions(+), 50 deletions(-)

diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json
index bdcac18ef2..6602a941ef 100644
--- a/public/locales/en/translation.json
+++ b/public/locales/en/translation.json
@@ -649,6 +649,7 @@
         "fsync": "Enable Fsync",
         "gamemode": "Use GameMode (Feral Game Mode needs to be installed)",
         "gamescope": {
+            "enableGamescope": "Enable Gamescope",
             "enableLimiter": "Enable FPS Limiter",
             "enableUpscaling": "Enables Upscaling",
             "missingMsg": "We could not found gamescope on the PATH. Install it or add it to the PATH."
diff --git a/src/backend/launcher.ts b/src/backend/launcher.ts
index 5fb450f191..9ec1979d8b 100644
--- a/src/backend/launcher.ts
+++ b/src/backend/launcher.ts
@@ -143,11 +143,7 @@ async function prepareLaunch(
     }
   }
 
-  if (
-    (gameSettings.gamescope?.enableLimiter ||
-      gameSettings.gamescope?.enableUpscaling) &&
-    !isSteamDeckGameMode
-  ) {
+  if (gameSettings.gamescope?.enableGamescope && !isSteamDeckGameMode) {
     const gameScopeBin = await searchForExecutableOnPath('gamescope')
     if (!gameScopeBin) {
       logWarning(
diff --git a/src/common/types.ts b/src/common/types.ts
index 36bcb0f216..f660e0e35c 100644
--- a/src/common/types.ts
+++ b/src/common/types.ts
@@ -743,6 +743,7 @@ export interface WindowProps extends Electron.Rectangle {
 }
 
 interface GameScopeSettings {
+  enableGamescope: boolean
   enableUpscaling: boolean
   enableLimiter: boolean
   windowType: string
diff --git a/src/frontend/screens/Settings/components/Gamescope.tsx b/src/frontend/screens/Settings/components/Gamescope.tsx
index 295b25a8a8..cb9c125286 100644
--- a/src/frontend/screens/Settings/components/Gamescope.tsx
+++ b/src/frontend/screens/Settings/components/Gamescope.tsx
@@ -16,6 +16,7 @@ const Gamescope = () => {
   const { platform } = useContext(ContextProvider)
   const isLinux = platform === 'linux'
   const [gamescope, setGamescope] = useSetting('gamescope', {
+    enableGamescope: false,
     enableUpscaling: false,
     enableLimiter: false,
     windowType: 'fullscreen',
@@ -115,22 +116,38 @@ const Gamescope = () => {
 
   return (
     <div className="gamescopeSettings">
-      {/* Enable Upscale */}
+      {/* Enable Gamescope */}
       <div className="toggleRow">
         <ToggleSwitch
-          htmlId="gamescopeUpscaleToggle"
-          value={gamescope.enableUpscaling || false}
+          htmlId="gamescopeEnableToggle"
+          value={gamescope.enableGamescope || false}
           handleChange={() =>
             setGamescope({
               ...gamescope,
-              enableUpscaling: !gamescope.enableUpscaling
+              enableGamescope: !gamescope.enableGamescope
             })
           }
-          title={t('setting.gamescope.enableUpscaling', 'Enables Upscaling')}
+          title={t('setting.gamescope.enableGamescope', 'Enable Gamescope')}
         />
       </div>
+      {/* Enable Upscale */}
+      {gamescope.enableGamescope && (
+        <div className="toggleRow">
+          <ToggleSwitch
+            htmlId="gamescopeUpscaleToggle"
+            value={gamescope.enableUpscaling || false}
+            handleChange={() =>
+              setGamescope({
+                ...gamescope,
+                enableUpscaling: !gamescope.enableUpscaling
+              })
+            }
+            title={t('setting.gamescope.enableUpscaling', 'Enables Upscaling')}
+          />
+        </div>
+      )}
       {/* Upscale Settings */}
-      {gamescope.enableUpscaling && (
+      {gamescope.enableUpscaling && gamescope.enableGamescope && (
         <>
           {/* Upscale Method */}
           <SelectField
@@ -289,21 +306,23 @@ const Gamescope = () => {
         </>
       )}
       {/* Enable Limiter*/}
-      <div className="toggleRow">
-        <ToggleSwitch
-          htmlId="gamescopeLimiterToggle"
-          value={gamescope.enableLimiter || false}
-          handleChange={() =>
-            setGamescope({
-              ...gamescope,
-              enableLimiter: !gamescope.enableLimiter
-            })
-          }
-          title={t('setting.gamescope.enableLimiter', 'Enable FPS Limiter')}
-        />
-      </div>
+      {gamescope.enableGamescope && (
+        <div className="toggleRow">
+          <ToggleSwitch
+            htmlId="gamescopeLimiterToggle"
+            value={gamescope.enableLimiter || false}
+            handleChange={() =>
+              setGamescope({
+                ...gamescope,
+                enableLimiter: !gamescope.enableLimiter
+              })
+            }
+            title={t('setting.gamescope.enableLimiter', 'Enable FPS Limiter')}
+          />
+        </div>
+      )}
       {/* FPS Limiter Settings */}
-      {gamescope.enableLimiter && (
+      {gamescope.enableLimiter && gamescope.enableGamescope && (
         <div className="row">
           <TextInputField
             label={t('options.gamescope.fpsLimiter', 'FPS Limiter')}
@@ -362,31 +381,33 @@ const Gamescope = () => {
         </div>
       )}
       {/* Additional Options */}
-      <TextInputField
-        label={t('options.gamescope.additionalOptions', 'Additional Options')}
-        htmlId="additionalOptions"
-        placeholder=""
-        value={additionalOptions}
-        afterInput={
-          <FontAwesomeIcon
-            className="helpIcon"
-            icon={faCircleInfo}
-            title={t(
-              'help.gamescope.additionalOptions',
-              'Additional commandline flags to pass into gamescope.'
-            )}
-          />
-        }
-        onChange={(event: ChangeEvent<HTMLInputElement>) => {
-          setAdditionalOptions(event.currentTarget.value)
-        }}
-        onBlur={(event: ChangeEvent<HTMLInputElement>) =>
-          setGamescope({
-            ...gamescope,
-            additionalOptions: event.currentTarget.value
-          })
-        }
-      />
+      {gamescope.enableGamescope && (
+        <TextInputField
+          label={t('options.gamescope.additionalOptions', 'Additional Options')}
+          htmlId="additionalOptions"
+          placeholder=""
+          value={additionalOptions}
+          afterInput={
+            <FontAwesomeIcon
+              className="helpIcon"
+              icon={faCircleInfo}
+              title={t(
+                'help.gamescope.additionalOptions',
+                'Additional commandline flags to pass into gamescope.'
+              )}
+            />
+          }
+          onChange={(event: ChangeEvent<HTMLInputElement>) => {
+            setAdditionalOptions(event.currentTarget.value)
+          }}
+          onBlur={(event: ChangeEvent<HTMLInputElement>) =>
+            setGamescope({
+              ...gamescope,
+              additionalOptions: event.currentTarget.value
+            })
+          }
+        />
+      )}
     </div>
   )
 }