From c3b18583d5e36b29f9142a048c71094a4c3fe167 Mon Sep 17 00:00:00 2001
From: Francisco Salgueiro
 <92053465+franciscoBSalgueiro@users.noreply.github.com>
Date: Mon, 9 Oct 2023 23:18:48 +0100
Subject: [PATCH] add color to game report (#38)

---
 .../panels/analysis/AnalysisPanel.tsx         | 23 +++++++++++++++----
 1 file changed, 18 insertions(+), 5 deletions(-)

diff --git a/src/components/panels/analysis/AnalysisPanel.tsx b/src/components/panels/analysis/AnalysisPanel.tsx
index a8d9b90e..12397210 100644
--- a/src/components/panels/analysis/AnalysisPanel.tsx
+++ b/src/components/panels/analysis/AnalysisPanel.tsx
@@ -137,14 +137,27 @@ const GameStats = memo(
             .filter((a) => a !== "")
             .map((annotation) => {
               const s = annotation as "??" | "?" | "?!" | "!!" | "!" | "!?";
+              const { name, color } = ANNOTATION_INFO[s];
+              const w = whiteAnnotations[s];
+              const b = blackAnnotations[s];
               return (
                 <React.Fragment key={annotation}>
-                  <Grid.Col span={4} sx={{ textAlign: "center" }}>
-                    {whiteAnnotations[s]}
+                  <Grid.Col
+                    span={4}
+                    sx={{ textAlign: "center" }}
+                    c={w > 0 ? color : undefined}
+                  >
+                    {w}
+                  </Grid.Col>
+                  <Grid.Col span={1} c={w + b > 0 ? color : undefined}>
+                    {annotation}
+                  </Grid.Col>
+                  <Grid.Col span={4} c={w + b > 0 ? color : undefined}>
+                    {name}
+                  </Grid.Col>
+                  <Grid.Col span={2} c={b > 0 ? color : undefined}>
+                    {b}
                   </Grid.Col>
-                  <Grid.Col span={1}>{annotation}</Grid.Col>
-                  <Grid.Col span={4}>{ANNOTATION_INFO[s].name}</Grid.Col>
-                  <Grid.Col span={2}>{blackAnnotations[s]}</Grid.Col>
                 </React.Fragment>
               );
             })}