1 files changed, 9 insertions, 42 deletions

diff --git a/src/components/NowPlayingTab.tsx b/src/components/NowPlayingTab.tsx
index 57858db..69e72d7 100644
--- a/src/components/NowPlayingTab.tsx
+++ b/src/components/NowPlayingTab.tsx
@@ -1,8 +1,9 @@
-import { ButtonItem, Field, Focusable, PanelSection, PanelSectionRow } from "@decky/ui";
-import { useState } from "react";
+import { Focusable } from "@decky/ui";
 import { ConfigurationData } from "../config/configSchema";
-import { GameTarget } from "../hooks/useGameConfiguration";
+import type { GameTarget } from "../utils/gameTargets";
+import { sourceLabel } from "../utils/gameTargets";
 import { GameConfigurationControls } from "./GameConfigurationControls";
+import { NowPlayingSummary } from "./NowPlayingSummary";
 
 interface Props {
   game: GameTarget;
@@ -11,57 +12,23 @@ interface Props {
     fieldName: keyof ConfigurationData,
     value: boolean | number | string | string[],
   ) => Promise<void>;
-  onRepair: (appid: string) => Promise<boolean>;
 }
 
 function targetDescription(game: GameTarget): string {
-  if (game.transport.kind === "flatpak") return "Non-Steam · Flatpak";
-  return game.nonSteam ? "Non-Steam" : "Steam";
+  return sourceLabel(game.source);
 }
 
 export function NowPlayingTab({
   game,
   config,
   onConfigChange,
-  onRepair,
 }: Props) {
-  const [busy, setBusy] = useState(false);
-  const supportNeedsRepair =
-    game.transport.kind === "flatpak" &&
-    game.flatpakSupport?.support_status !== "ready";
-
-  const handleRepair = async () => {
-    if (busy) return;
-    setBusy(true);
-    try {
-      await onRepair(game.appid);
-    } finally {
-      setBusy(false);
-    }
-  };
-
   return (
     <Focusable>
-      <PanelSection title="Now Playing">
-        <PanelSectionRow>
-          <Field label={game.name} description={targetDescription(game)} />
-        </PanelSectionRow>
-      </PanelSection>
-      {supportNeedsRepair && (
-        <PanelSection>
-          <PanelSectionRow>
-            <Field
-              label="Flatpak support needs repair"
-              description={game.flatpakSupport?.error || "The target runtime extension is not ready."}
-            />
-          </PanelSectionRow>
-          <PanelSectionRow>
-            <ButtonItem layout="below" disabled={busy} onClick={() => void handleRepair()}>
-              {busy ? "Repairing..." : "Repair Flatpak support"}
-            </ButtonItem>
-          </PanelSectionRow>
-        </PanelSection>
-      )}
+      <NowPlayingSummary
+        title={game.name}
+        details={[targetDescription(game), `Controls: ${game.name} profile`]}
+      />
       <GameConfigurationControls
         config={config}
         onConfigChange={onConfigChange}