1 files changed, 32 insertions, 0 deletions
diff --git a/src/components/NowPlayingTab.tsx b/src/components/NowPlayingTab.tsx
new file mode 100644
index 0000000..956db4a
--- /dev/null
+++ b/src/components/NowPlayingTab.tsx
@@ -0,0 +1,32 @@
+import { ButtonItem, Field, Focusable, PanelSection, PanelSectionRow } from "@decky/ui";
+import { ConfigurationData } from "../config/configSchema";
+import { GameTarget } from "../hooks/useGameConfiguration";
+import { GameConfigurationControls } from "./GameConfigurationControls";
+
+interface Props {
+  game: GameTarget;
+  config: ConfigurationData;
+  onConfigChange: (fieldName: keyof ConfigurationData, value: boolean | number | string | string[]) => Promise<void>;
+  onRemove: () => Promise<void>;
+}
+
+export function NowPlayingTab({ game, config, onConfigChange, onRemove }: Props) {
+  return (
+    <Focusable>
+      <PanelSection title="Now Playing">
+        <PanelSectionRow>
+          <Field
+            label={game.name}
+            description={`${game.nonSteam ? "Non-Steam" : "Steam"} · App ID ${game.appid} · Profile active`}
+          />
+        </PanelSectionRow>
+      </PanelSection>
+      <GameConfigurationControls config={config} onConfigChange={onConfigChange} />
+      <PanelSectionRow>
+        <ButtonItem layout="below" onClick={() => void onRemove()}>
+          Remove profile
+        </ButtonItem>
+      </PanelSectionRow>
+    </Focusable>
+  );
+}