feat: select Lossless Scaling lsfg-vk branch

4 files changed, 163 insertions, 39 deletions

diff --git a/src/api/lsfgApi.ts b/src/api/lsfgApi.ts
index 68cf6bf..64d43cb 100644
--- a/src/api/lsfgApi.ts
+++ b/src/api/lsfgApi.ts
@@ -16,6 +16,23 @@ export interface InstallationStatus {
   error?: string;
 }
 
+export interface SteamBranchStatus {
+  success: boolean;
+  message: string;
+  error?: string;
+  installed: boolean;
+  manifest_path?: string;
+  selected_branch?: string;
+  current_branch?: string;
+  target_branch: string;
+  needs_switch: boolean;
+  restart_required: boolean;
+}
+
+export interface SteamBranchOperationResult extends SteamBranchStatus {
+  changed: boolean;
+}
+
 // Use centralized configuration data type
 export type LsfgConfig = ConfigurationData;
 
@@ -112,6 +129,8 @@ export interface ProfileResult {
 export const installLsfgVk = callable<[], InstallationResult>("install_lsfg_vk");
 export const uninstallLsfgVk = callable<[], InstallationResult>("uninstall_lsfg_vk");
 export const checkLsfgVkInstalled = callable<[], InstallationStatus>("check_lsfg_vk_installed");
+export const getLosslessScalingBranchStatus = callable<[], SteamBranchStatus>("get_lossless_scaling_branch_status");
+export const selectLosslessScalingBranch = callable<[], SteamBranchOperationResult>("select_lossless_scaling_branch");
 export const getLsfgConfig = callable<[], ConfigResult>("get_lsfg_config");
 export const getConfigSchema = callable<[], ConfigSchemaResult>("get_config_schema");
 export const getLaunchOption = callable<[], LaunchOptionResult>("get_launch_option");
diff --git a/src/components/Content.tsx b/src/components/Content.tsx
index aab2fb8..4e4e33a 100644
--- a/src/components/Content.tsx
+++ b/src/components/Content.tsx
@@ -15,6 +15,7 @@ import { NerdStuffModal } from "./NerdStuffModal";
 import { FlatpaksModal } from "./FlatpaksModal";
 import { ConfigurationData } from "../config/configSchema";
 import t from '../i18n/i18n';
+import { showErrorToast, showSuccessToast } from "../utils/toastUtils";
 
 export function Content() {
   const {
@@ -24,6 +25,9 @@ export function Content() {
     setInstallationStatus,
     losslessScalingInstalled,
     losslessScalingStatus,
+    steamBranchStatus,
+    isSwitchingSteamBranch,
+    selectLosslessScalingBranch,
     checkInstallation
   } = useInstallationStatus();
 
@@ -67,6 +71,18 @@ export function Content() {
     handleUninstall(setIsInstalled, setInstallationStatus, checkInstallation);
   };
 
+  const onSelectLosslessScalingBranch = async () => {
+    const result = await selectLosslessScalingBranch();
+    if (result.success) {
+      showSuccessToast("Steam branch selected", result.message);
+    } else {
+      showErrorToast(
+        "Steam branch selection failed",
+        result.error || "Unable to select the lsfg-vk Steam branch"
+      );
+    }
+  };
+
   const handleShowNerdStuff = () => {
     showModal(<NerdStuffModal />);
   };
@@ -92,6 +108,9 @@ export function Content() {
             installationStatus={installationStatus}
             losslessScalingInstalled={losslessScalingInstalled}
             losslessScalingStatus={losslessScalingStatus}
+            steamBranchStatus={steamBranchStatus}
+            isSwitchingSteamBranch={isSwitchingSteamBranch}
+            onSelectLosslessScalingBranch={onSelectLosslessScalingBranch}
           />
         </>
       )}
@@ -172,6 +191,9 @@ export function Content() {
             installationStatus={installationStatus}
             losslessScalingInstalled={losslessScalingInstalled}
             losslessScalingStatus={losslessScalingStatus}
+            steamBranchStatus={steamBranchStatus}
+            isSwitchingSteamBranch={isSwitchingSteamBranch}
+            onSelectLosslessScalingBranch={onSelectLosslessScalingBranch}
           />
 
           <InstallationButton
diff --git a/src/components/StatusDisplay.tsx b/src/components/StatusDisplay.tsx
index 31584eb..b6290b0 100644
--- a/src/components/StatusDisplay.tsx
+++ b/src/components/StatusDisplay.tsx
@@ -1,56 +1,95 @@
-import { PanelSectionRow } from "@decky/ui";
+import { ButtonItem, PanelSectionRow } from "@decky/ui";
+import type { SteamBranchStatus } from "../api/lsfgApi";
 
 interface StatusDisplayProps {
   isInstalled: boolean;
   installationStatus: string;
   losslessScalingInstalled: boolean;
   losslessScalingStatus: string;
+  steamBranchStatus: SteamBranchStatus | null;
+  isSwitchingSteamBranch: boolean;
+  onSelectLosslessScalingBranch: () => void;
 }
 
 export function StatusDisplay({
   isInstalled,
   installationStatus,
   losslessScalingInstalled,
-  losslessScalingStatus
+  losslessScalingStatus,
+  steamBranchStatus,
+  isSwitchingSteamBranch,
+  onSelectLosslessScalingBranch
 }: StatusDisplayProps) {
   return (
-    <PanelSectionRow>
-      <div style={{ marginBottom: "8px", fontSize: "14px" }}>
-        <div
-          style={{
-            color: losslessScalingInstalled ? "#4CAF50" : "#F44336",
-            fontWeight: "600",
-            marginBottom: "6px",
-            display: "flex",
-            alignItems: "center",
-            gap: "6px"
-          }}
-        >
-          <span style={{ fontSize: "16px" }}>
-            {losslessScalingInstalled ? "✅" : "❌"}
-          </span>
-          {losslessScalingInstalled ? "Lossless Scaling Installed" : "Lossless Scaling Not Installed"}
-        </div>
-        {!losslessScalingInstalled && losslessScalingStatus && (
-          <div style={{ color: "#B8B8B8", fontSize: "12px", margin: "0 0 6px 22px" }}>
-            {losslessScalingStatus}
+    <>
+      <PanelSectionRow>
+        <div style={{ marginBottom: "8px", fontSize: "14px" }}>
+          <div
+            style={{
+              color: losslessScalingInstalled ? "#4CAF50" : "#F44336",
+              fontWeight: "600",
+              marginBottom: "6px",
+              display: "flex",
+              alignItems: "center",
+              gap: "6px"
+            }}
+          >
+            <span style={{ fontSize: "16px" }}>
+              {losslessScalingInstalled ? "✅" : "❌"}
+            </span>
+            {losslessScalingInstalled ? "Lossless Scaling Installed" : "Lossless Scaling Not Installed"}
+          </div>
+          {!losslessScalingInstalled && losslessScalingStatus && (
+            <div style={{ color: "#B8B8B8", fontSize: "12px", margin: "0 0 6px 22px" }}>
+              {losslessScalingStatus}
+            </div>
+          )}
+          <div
+            style={{
+              color: isInstalled ? "#4CAF50" : "#FF9800",
+              fontWeight: "600",
+              display: "flex",
+              alignItems: "center",
+              gap: "6px"
+            }}
+          >
+            <span style={{ fontSize: "16px" }}>
+              {isInstalled ? "✅" : "❌"}
+            </span>
+            {installationStatus}
           </div>
-        )}
-        <div
-          style={{
-            color: isInstalled ? "#4CAF50" : "#FF9800",
-            fontWeight: "600",
-            display: "flex",
-            alignItems: "center",
-            gap: "6px"
-          }}
-        >
-          <span style={{ fontSize: "16px" }}>
-            {isInstalled ? "✅" : "❌"}
-          </span>
-          {installationStatus}
         </div>
-      </div>
-    </PanelSectionRow>
+      </PanelSectionRow>
+
+      {losslessScalingInstalled && steamBranchStatus?.installed && (
+        <PanelSectionRow>
+          <div style={{ width: "100%" }}>
+            <div
+              style={{
+                color: steamBranchStatus.needs_switch ? "#FF9800" : "#4CAF50",
+                fontSize: "12px",
+                margin: "0 0 6px 22px"
+              }}
+            >
+              Steam branch: {steamBranchStatus.current_branch || "public"}
+              {steamBranchStatus.needs_switch && (
+                <div style={{ color: "#B8B8B8", marginTop: "3px" }}>
+                  {steamBranchStatus.message}
+                </div>
+              )}
+            </div>
+            {steamBranchStatus.needs_switch && (
+              <ButtonItem
+                layout="below"
+                onClick={onSelectLosslessScalingBranch}
+                disabled={isSwitchingSteamBranch}
+              >
+                {isSwitchingSteamBranch ? "Selecting lsfg-vk..." : "Use lsfg-vk Steam branch"}
+              </ButtonItem>
+            )}
+          </div>
+        </PanelSectionRow>
+      )}
+    </>
   );
 }
diff --git a/src/hooks/useLsfgHooks.ts b/src/hooks/useLsfgHooks.ts
index 597110e..dfbf2cd 100644
--- a/src/hooks/useLsfgHooks.ts
+++ b/src/hooks/useLsfgHooks.ts
@@ -2,8 +2,12 @@ import { useState, useEffect, useCallback } from "react";
 import {
   checkLsfgVkInstalled,
   getLsfgConfig,
+  getLosslessScalingBranchStatus,
+  selectLosslessScalingBranch,
   updateLsfgConfigFromObject,
-  type ConfigUpdateResult
+  type ConfigUpdateResult,
+  type SteamBranchOperationResult,
+  type SteamBranchStatus
 } from "../api/lsfgApi";
 import { ConfigurationData, getDefaults } from "../config/configSchema";
 import { showErrorToast, ToastMessages } from "../utils/toastUtils";
@@ -13,9 +17,18 @@ export function useInstallationStatus() {
   const [installationStatus, setInstallationStatus] = useState<string>("");
   const [losslessScalingInstalled, setLosslessScalingInstalled] = useState<boolean>(false);
   const [losslessScalingStatus, setLosslessScalingStatus] = useState<string>("");
+  const [steamBranchStatus, setSteamBranchStatus] = useState<SteamBranchStatus | null>(null);
+  const [isSwitchingSteamBranch, setIsSwitchingSteamBranch] = useState<boolean>(false);
 
   const checkInstallation = async () => {
     try {
+      setSteamBranchStatus(await getLosslessScalingBranchStatus());
+    } catch (error) {
+      console.error("Error checking Lossless Scaling Steam branch:", error);
+      setSteamBranchStatus(null);
+    }
+
+    try {
       const status = await checkLsfgVkInstalled();
       setIsInstalled(status.installed);
       setLosslessScalingInstalled(status.lossless_scaling_installed);
@@ -27,6 +40,7 @@ export function useInstallationStatus() {
       }
       return status.installed;
     } catch (error) {
+      setSteamBranchStatus(null);
       setLosslessScalingInstalled(false);
       setLosslessScalingStatus("Lossless Scaling Not Installed");
       setInstallationStatus("lsfg-vk Not Installed");
@@ -34,6 +48,33 @@ export function useInstallationStatus() {
     }
   };
 
+  const selectLosslessScalingBranchForUser = async (): Promise<SteamBranchOperationResult> => {
+    setIsSwitchingSteamBranch(true);
+    try {
+      const result = await selectLosslessScalingBranch();
+      setSteamBranchStatus(result);
+      return result;
+    } catch (error) {
+      const result: SteamBranchOperationResult = {
+        success: false,
+        message: "",
+        error: String(error),
+        installed: false,
+        manifest_path: undefined,
+        selected_branch: undefined,
+        current_branch: undefined,
+        target_branch: "lsfg-vk",
+        needs_switch: false,
+        restart_required: false,
+        changed: false
+      };
+      setSteamBranchStatus(result);
+      return result;
+    } finally {
+      setIsSwitchingSteamBranch(false);
+    }
+  };
+
   useEffect(() => {
     checkInstallation();
   }, []);
@@ -45,6 +86,9 @@ export function useInstallationStatus() {
     setInstallationStatus,
     losslessScalingInstalled,
     losslessScalingStatus,
+    steamBranchStatus,
+    isSwitchingSteamBranch,
+    selectLosslessScalingBranch: selectLosslessScalingBranchForUser,
     checkInstallation
   };
 }