From e603c154b94def58709084fb8df6e3e5a669407e Mon Sep 17 00:00:00 2001
From: Vinzenz Schroeter <vinzenz.f.s@gmail.com>
Date: Fri, 19 Apr 2024 13:50:06 +0200
Subject: [PATCH] show walls destroyed in player info

---
 tank-frontend/src/PlayerInfo.tsx | 21 +++++++++++++--------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/tank-frontend/src/PlayerInfo.tsx b/tank-frontend/src/PlayerInfo.tsx
index a14cb3d..348503e 100644
--- a/tank-frontend/src/PlayerInfo.tsx
+++ b/tank-frontend/src/PlayerInfo.tsx
@@ -3,6 +3,16 @@ import {Player} from './serverCalls';
 import {Guid} from "./Guid.ts";
 import Column from "./components/Column.tsx";
 
+function ScoreRow({name, value}: {
+    name: string;
+    value?: any;
+}) {
+    return <tr>
+        <td>{name}</td>
+        <td>{value ?? '?'}</td>
+    </tr>;
+}
+
 export default function PlayerInfo({playerId}: { playerId: Guid }) {
     const query = useQuery({
         queryKey: ['player'],
@@ -26,14 +36,9 @@ export default function PlayerInfo({playerId}: { playerId: Guid }) {
         {query.isError && <p>{query.error.message}</p>}
         {query.isSuccess && <table>
             <tbody>
-            <tr>
-                <td>kills:</td>
-                <td>{query.data?.scores?.kills ?? '?'}</td>
-            </tr>
-            <tr>
-                <td>deaths:</td>
-                <td>{query.data?.scores?.deaths ?? '?'}</td>
-            </tr>
+            <ScoreRow name='kills' value={query.data?.scores?.kills}/>
+            <ScoreRow name='deaths' value={query.data?.scores?.deaths}/>
+            <ScoreRow name='walls' value={query.data?.scores?.wallsDestroyed}/>
             </tbody>
         </table>}
     </Column>;