add settings button to game cards with smokeapi installed #67

src/components/games/GameItem.tsx

@@ -8,13 +8,14 @@ interface GameItemProps {
   game: Game
   onAction: (gameId: string, action: ActionType) => Promise<void>
   onEdit?: (gameId: string) => void
+  onSmokeAPISettings?: (gameId: string) => void
 }
 
 /**
  * Individual game card component
  * Displays game information and action buttons
  */
-const GameItem = ({ game, onAction, onEdit }: GameItemProps) => {
+const GameItem = ({ game, onAction, onEdit, onSmokeAPISettings }: GameItemProps) => {
   const [imageUrl, setImageUrl] = useState<string | null>(null)
   const [isLoading, setIsLoading] = useState(true)
   const [hasError, setHasError] = useState(false)
@@ -77,6 +78,13 @@ const GameItem = ({ game, onAction, onEdit }: GameItemProps) => {
     }
   }
 
+  // SmokeAPI settings handler
+  const handleSmokeAPISettings = () => {
+    if (onSmokeAPISettings && game.smoke_installed) {
+      onSmokeAPISettings(game.id)
+    }
+  }
+
   // Determine background image
   const backgroundImage =
     !isLoading && imageUrl
@@ -156,6 +164,20 @@ const GameItem = ({ game, onAction, onEdit }: GameItemProps) => {
               iconOnly
             />
           )}
+
+          {/* Edit button - only enabled if SmokeAPI is installed */}
+          {game.smoke_installed && (
+            <Button
+              variant="secondary"
+              size="small"
+              onClick={handleSmokeAPISettings}
+              disabled={!game.smoke_installed || !!game.installing}
+              title="Configure SmokeAPI"
+              className="edit-button settings-icon-button"
+              leftIcon={<Icon name="Settings" variant="solid" size="md" />}
+              iconOnly
+            />
+          )}
         </div>
       </div>
     </div>