diff --git a/plugins/decky-vault/src/components/settings-panel.tsx b/plugins/decky-vault/src/components/settings-panel.tsx new file mode 100644 index 0000000..180e1d2 --- /dev/null +++ b/plugins/decky-vault/src/components/settings-panel.tsx @@ -0,0 +1,266 @@ +import { useState } from "react" +import { + ButtonItem, + PanelSection, + PanelSectionRow, + Field, + DropdownItem, + staticClasses, +} from "@decky/ui" +import { + FaCheck, + FaTimes, + FaDownload, + FaCog, +} from "react-icons/fa" +import type { PluginSettings } from "../lib/store" +import { KNOWN_HARDWARE_SLUGS } from "@deckyvault/shared" +import { testApiKey, checkMangohud, writeMangohudConfig, getMangohudConfig } from "../lib/api" + +interface SettingsPanelProps { + settings: PluginSettings + onUpdateSetting: ( + key: K, + value: string | null + ) => void +} + +const HARDWARE_OPTIONS = [ + { label: "Auto-detect", value: "" }, + ...KNOWN_HARDWARE_SLUGS.map((slug) => ({ label: slug, value: slug })), +] + +export default function SettingsPanel({ + settings, + onUpdateSetting, +}: SettingsPanelProps) { + const [keyTestStatus, setKeyTestStatus] = useState<"idle" | "testing" | "valid" | "invalid">("idle") + const [keyTestMessage, setKeyTestMessage] = useState("") + const [mangohudStatus, setMangohudStatus] = useState<{ + checked: boolean + installed: boolean + path: string + version: string + }>({ checked: false, installed: false, path: "", version: "" }) + const [showMangohudGuide, setShowMangohudGuide] = useState(false) + const [configWritten, setConfigWritten] = useState(false) + + async function handleTestKey() { + if (!settings.apiKey) { + setKeyTestStatus("invalid") + setKeyTestMessage("Enter an API key first") + return + } + setKeyTestStatus("testing") + setKeyTestMessage("") + const result = await testApiKey(settings.apiKey, settings.baseUrl) + if (result.valid) { + setKeyTestStatus("valid") + setKeyTestMessage("API key is valid") + } else { + setKeyTestStatus("invalid") + setKeyTestMessage(result.error || "Invalid API key") + } + } + + async function handleCheckMangohud() { + const result = await checkMangohud() + setMangohudStatus({ + checked: true, + installed: result.installed, + path: result.path, + version: result.version, + }) + } + + async function handleWriteConfig() { + const result = await writeMangohudConfig() + setConfigWritten(result.success) + } + + return ( + <> + {/* ── API Key ─────────────────────────────────────────────── */} + + + + onUpdateSetting("apiKey", e.target.value)} + placeholder="dv_..." + style={{ width: "100%", padding: "4px 8px" }} + /> + + + + + + {keyTestStatus === "testing" ? "Testing..." : "Test Key"} + {keyTestStatus === "valid" && } + {keyTestStatus === "invalid" && } + + + + {keyTestMessage && ( + +
+ {keyTestMessage} +
+ + )} + + +
+ Get your API key from DeckyVault → Profile → Settings → API Keys +
+ + + + {/* ── Export Path ─────────────────────────────────────────── */} + + + + onUpdateSetting("exportPath", e.target.value)} + placeholder="/home/deck/Downloads" + style={{ width: "100%", padding: "4px 8px" }} + /> + + + + + + onUpdateSetting("baseUrl", e.target.value)} + placeholder="https://deckyvault.xyz" + style={{ width: "100%", padding: "4px 8px" }} + /> + + + + + onUpdateSetting("hardwareSlug", opt.data as string || null)} + /> + + + + {/* ── MangoHud Setup ──────────────────────────────────────── */} + + + +
+ + Check MangoHud Status +
+ + + + {mangohudStatus.checked && ( + +
+ {mangohudStatus.installed ? ( + <> + MangoHud installed +
+ + Path: {mangohudStatus.path} +
+ Version: {mangohudStatus.version} + + + ) : ( + <> + MangoHud not found +
+ See installation guide below + + )} +
+ + )} + + + +
+ + Write MangoHud Config +
+ + + + {configWritten && ( + +
+ Config written to ~/.config/MangoHud/MangoHud.conf +
+ + )} + + + setShowMangohudGuide(!showMangohudGuide)}> + {showMangohudGuide ? "Hide Guide" : "Show Installation Guide"} + + + + {showMangohudGuide && ( + +
+ Steam Deck (SteamOS): +
+ MangoHud is pre-installed. Enable it per-game by adding + + mangohud %command% + + to the game's Steam launch options (right-click game → Properties → Launch Options). + +

+ Other Linux handhelds (ROG Ally, Legion Go): +
+ Install via package manager: + + sudo apt install mangohud + + or Flatpak: + + flatpak install flathub org.freedesktop.Platform.VulkanLayer.MangoHud + + +

+ Manual build: +
+ See{" "} + + github.com/flightlessmango/MangoHud + + +

+ Troubleshooting: +
+ • Log file empty? Check MangoHud is enabled for the game and the config was written. +
+ • Wrong path? Ensure the plugin can write to /tmp/. +
+ • Not attaching? Try adding mangohud %command% to Steam launch options explicitly. +
+ + )} + + + ) +} \ No newline at end of file