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
30
31
32
33
34
35
36
37
38
39
|
import { Field, Focusable, PanelSection, PanelSectionRow } from "@decky/ui";
import type { FlatpakApp, LsfgConfig, WorkaroundState } from "../api/lsfgApi";
import { ConfigurationSection } from "./ConfigurationSection";
import { FlatpakWorkaroundsSection } from "./FlatpakWorkaroundsSection";
import { FpsMultiplierControl } from "./FpsMultiplierControl";
interface Props {
app: FlatpakApp;
busy: boolean;
onConfigChange: (appId: string, config: LsfgConfig) => Promise<boolean>;
onWorkaroundChange: (appId: string, state: WorkaroundState) => Promise<boolean>;
}
export function FlatpakNowPlayingTab({ app, busy, onConfigChange, onWorkaroundChange }: Props) {
if (!app.config) return null;
const changeConfig = async (
field: keyof LsfgConfig,
value: boolean | number | string | string[],
) => {
await onConfigChange(app.app_id, { ...app.config!, [field]: value });
};
return (
<Focusable>
<PanelSection title="Now Playing">
<PanelSectionRow>
<Field label={app.app_name} description={`Flatpak · ${app.app_id}`} />
</PanelSectionRow>
</PanelSection>
<FpsMultiplierControl config={app.config} onConfigChange={changeConfig} />
<ConfigurationSection config={app.config} onConfigChange={changeConfig} />
<FlatpakWorkaroundsSection
state={app.workarounds}
disabled={busy}
onChange={(state) => onWorkaroundChange(app.app_id, state)}
/>
</Focusable>
);
}
|
