From 3f7dd8ce0a0f11f894332a3b4351ecd7a9abd141 Mon Sep 17 00:00:00 2001
From: xXJSONDeruloXx <danielhimebauch@gmail.com>
Date: Tue, 15 Jul 2025 21:45:20 -0400
Subject: add clipboard web launch button

---
 src/components/ClipboardButton.tsx   | 22 ++++++++++++++++++++++
 src/components/Content.tsx           |  5 +++++
 src/components/UsageInstructions.tsx |  3 ---
 src/components/index.ts              |  1 +
 4 files changed, 28 insertions(+), 3 deletions(-)
 create mode 100644 src/components/ClipboardButton.tsx

(limited to 'src')

diff --git a/src/components/ClipboardButton.tsx b/src/components/ClipboardButton.tsx
new file mode 100644
index 0000000..3760e81
--- /dev/null
+++ b/src/components/ClipboardButton.tsx
@@ -0,0 +1,22 @@
+import { PanelSectionRow, ButtonItem } from "@decky/ui";
+import { FaExternalLinkAlt } from "react-icons/fa";
+
+export function ClipboardButton() {
+  const handleClipboardClick = () => {
+    window.open("https://github.com/xXJSONDeruloXx/decky-lossless-scaling-vk/wiki/Clipboard", "_blank");
+  };
+
+  return (
+    <PanelSectionRow>
+      <ButtonItem
+        layout="below"
+        onClick={handleClipboardClick}
+      >
+        <div style={{ display: "flex", alignItems: "center", gap: "8px" }}>
+          <FaExternalLinkAlt />
+          <div>Launch Option Clipboard</div>
+        </div>
+      </ButtonItem>
+    </PanelSectionRow>
+  );
+}
diff --git a/src/components/Content.tsx b/src/components/Content.tsx
index 16c8f2f..c7c52a5 100644
--- a/src/components/Content.tsx
+++ b/src/components/Content.tsx
@@ -6,6 +6,8 @@ import { StatusDisplay } from "./StatusDisplay";
 import { InstallationButton } from "./InstallationButton";
 import { ConfigurationSection } from "./ConfigurationSection";
 import { UsageInstructions } from "./UsageInstructions";
+import { WikiButton } from "./WikiButton";
+import { ClipboardButton } from "./ClipboardButton";
 
 export function Content() {
   const {
@@ -109,6 +111,9 @@ export function Content() {
       )}
 
       <UsageInstructions config={config} />
+      
+      <WikiButton />
+      <ClipboardButton />
     </PanelSection>
   );
 }
diff --git a/src/components/UsageInstructions.tsx b/src/components/UsageInstructions.tsx
index ca9ddd2..bf80630 100644
--- a/src/components/UsageInstructions.tsx
+++ b/src/components/UsageInstructions.tsx
@@ -1,5 +1,4 @@
 import { PanelSectionRow } from "@decky/ui";
-import { WikiButton } from "./WikiButton";
 
 interface ConfigType {
   enableLsfg: boolean;
@@ -96,8 +95,6 @@ export function UsageInstructions({ config }: UsageInstructionsProps) {
           </div>
         </div>
       </PanelSectionRow>
-
-      <WikiButton />
     </>
   );
 }
diff --git a/src/components/index.ts b/src/components/index.ts
index 26eb2fb..7304ca9 100644
--- a/src/components/index.ts
+++ b/src/components/index.ts
@@ -4,3 +4,4 @@ export { InstallationButton } from "./InstallationButton";
 export { ConfigurationSection } from "./ConfigurationSection";
 export { UsageInstructions } from "./UsageInstructions";
 export { WikiButton } from "./WikiButton";
+export { ClipboardButton } from "./ClipboardButton";
-- 
cgit v1.2.3


From ea6185179fb6d8eedaf90236baf8b7779a9da716 Mon Sep 17 00:00:00 2001
From: xXJSONDeruloXx <danielhimebauch@gmail.com>
Date: Tue, 15 Jul 2025 22:01:48 -0400
Subject: better install status ui

---
 src/components/Content.tsx       | 14 +++++++-------
 src/components/StatusDisplay.tsx | 21 +++++++++++++++++----
 src/hooks/useLsfgHooks.ts        | 12 ++++++------
 3 files changed, 30 insertions(+), 17 deletions(-)

(limited to 'src')

diff --git a/src/components/Content.tsx b/src/components/Content.tsx
index c7c52a5..39de01b 100644
--- a/src/components/Content.tsx
+++ b/src/components/Content.tsx
@@ -81,13 +81,6 @@ export function Content() {
 
   return (
     <PanelSection>
-      <StatusDisplay
-        dllDetected={dllDetected}
-        dllDetectionStatus={dllDetectionStatus}
-        isInstalled={isInstalled}
-        installationStatus={installationStatus}
-      />
-
       <InstallationButton
         isInstalled={isInstalled}
         isInstalling={isInstalling}
@@ -96,6 +89,13 @@ export function Content() {
         onUninstall={onUninstall}
       />
 
+      <StatusDisplay
+        dllDetected={dllDetected}
+        dllDetectionStatus={dllDetectionStatus}
+        isInstalled={isInstalled}
+        installationStatus={installationStatus}
+      />
+
       {/* Configuration Section - only show if installed */}
       {isInstalled && (
         <ConfigurationSection
diff --git a/src/components/StatusDisplay.tsx b/src/components/StatusDisplay.tsx
index 8eecd42..3a48a15 100644
--- a/src/components/StatusDisplay.tsx
+++ b/src/components/StatusDisplay.tsx
@@ -19,18 +19,31 @@ export function StatusDisplay({
         <div
           style={{
             color: dllDetected ? "#4CAF50" : "#F44336",
-            fontWeight: "bold",
-            marginBottom: "4px"
+            fontWeight: "600",
+            marginBottom: "6px",
+            display: "flex",
+            alignItems: "center",
+            gap: "6px"
           }}
         >
+          <span style={{ fontSize: "16px" }}>
+            {dllDetected ? "✅" : "❌"}
+          </span>
           {dllDetectionStatus}
         </div>
         <div
           style={{
-            color: isInstalled ? "#4CAF50" : "#FF9800"
+            color: isInstalled ? "#4CAF50" : "#FF9800",
+            fontWeight: "600",
+            display: "flex",
+            alignItems: "center",
+            gap: "6px"
           }}
         >
-          Status: {installationStatus}
+          <span style={{ fontSize: "16px" }}>
+            {isInstalled ? "✅" : "❌"}
+          </span>
+          {installationStatus}
         </div>
       </div>
     </PanelSectionRow>
diff --git a/src/hooks/useLsfgHooks.ts b/src/hooks/useLsfgHooks.ts
index c0bd8e8..ad04305 100644
--- a/src/hooks/useLsfgHooks.ts
+++ b/src/hooks/useLsfgHooks.ts
@@ -17,13 +17,13 @@ export function useInstallationStatus() {
       const status = await checkLsfgVkInstalled();
       setIsInstalled(status.installed);
       if (status.installed) {
-        setInstallationStatus("lsfg-vk is installed");
+        setInstallationStatus("lsfg-vk Installed");
       } else {
-        setInstallationStatus("lsfg-vk is not installed");
+        setInstallationStatus("lsfg-vk Not Installed");
       }
       return status.installed;
     } catch (error) {
-      setInstallationStatus("Error checking installation status");
+      setInstallationStatus("lsfg-vk Not Installed");
       return false;
     }
   };
@@ -50,12 +50,12 @@ export function useDllDetection() {
       const result = await checkLosslessScalingDll();
       setDllDetected(result.detected);
       if (result.detected) {
-        setDllDetectionStatus(`Lossless Scaling App detected (${result.source})`);
+        setDllDetectionStatus("Lossless Scaling Installed");
       } else {
-        setDllDetectionStatus(result.message || "Lossless Scaling App not detected");
+        setDllDetectionStatus("Lossless Scaling Not Installed");
       }
     } catch (error) {
-      setDllDetectionStatus("Error checking Lossless Scaling App");
+      setDllDetectionStatus("Lossless Scaling Not Installed");
     }
   };
 
-- 
cgit v1.2.3