src/components/GameConfigurationSelector.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

import { Dropdown, DropdownOption, PanelSectionRow, ButtonItem } from "@decky/ui";
import { GameTarget } from "../hooks/useGameConfiguration";

interface Props {
  targets: GameTarget[];
  runningGame: GameTarget | null;
  selectedAppId: string;
  onSelect: (appid: string) => void;
  onReset: () => Promise<void>;
  onResetAll: () => Promise<void>;
}

export function GameConfigurationSelector({ targets, runningGame, selectedAppId, onSelect, onReset, onResetAll }: Props) {
  const options: DropdownOption[] = [
    { data: "", label: runningGame ? `Default (editing template) · ${runningGame.name}` : "Default" },
    ...targets.map((target) => ({ data: target.appid, label: `${target.name} · ${target.appid}` })),
  ];
  return <>
    <PanelSectionRow>
      <Dropdown rgOptions={options} selectedOption={selectedAppId} onChange={(option) => onSelect(String(option.data))} />
    </PanelSectionRow>
    <PanelSectionRow>
      <ButtonItem layout="below" onClick={() => void onReset()} disabled={!selectedAppId}>Reset selected game</ButtonItem>
    </PanelSectionRow>
    <PanelSectionRow>
      <ButtonItem layout="below" onClick={() => void onResetAll()} disabled={!targets.some((target) => target.configured)}>Reset all game profiles</ButtonItem>
    </PanelSectionRow>
  </>;
}