From 70ca75ba355aca5c2e6db4b28cb6a80a70c42403 Mon Sep 17 00:00:00 2001
From: WandererXII <43043181+WandererXII@users.noreply.github.com>
Date: Sat, 13 Jan 2024 03:48:20 +0100
Subject: [PATCH] Oops

Update puzzle radar chart.js like it is in lichess, test later
---
 .../src/test/VariationValidationTest.scala    |  2 +-
 ui/puzzle/package.json                        |  2 +-
 ui/puzzle/src/dashboard.ts                    | 39 +++++++++++--------
 3 files changed, 24 insertions(+), 19 deletions(-)

diff --git a/modules/fishnet/src/test/VariationValidationTest.scala b/modules/fishnet/src/test/VariationValidationTest.scala
index 8d0fb71a8583..47ff04afff64 100644
--- a/modules/fishnet/src/test/VariationValidationTest.scala
+++ b/modules/fishnet/src/test/VariationValidationTest.scala
@@ -14,7 +14,7 @@ final class VariationValidationTest extends Specification {
 
   private def evenIncomplete(result: Reader.Result): Replay =
     result match {
-      case Reader.Result.Complete(_, replay)   => replay
+      case Reader.Result.Complete(replay)   => replay
       case Reader.Result.Incomplete(replay, _) => replay
     }
 
diff --git a/ui/puzzle/package.json b/ui/puzzle/package.json
index c7eadd0b32d9..f06b8698e0aa 100644
--- a/ui/puzzle/package.json
+++ b/ui/puzzle/package.json
@@ -13,7 +13,7 @@
   "license": "AGPL-3.0-or-later",
   "devDependencies": {
     "@build/rollupProject": "2.0.0",
-    "@types/chart.js": "^2.9.29",
+    "@types/chart.js": "^4.4",
     "@types/lishogi": "2.0.0",
     "rollup": "^2",
     "typescript": "^5"
diff --git a/ui/puzzle/src/dashboard.ts b/ui/puzzle/src/dashboard.ts
index 8d3da4d8d8d9..5aa9dbfef342 100644
--- a/ui/puzzle/src/dashboard.ts
+++ b/ui/puzzle/src/dashboard.ts
@@ -20,25 +20,30 @@ export function renderRadar(data: any) {
     type: 'radar',
     data: d,
     options: {
-      legend: {
-        display: false,
-      },
-      scale: {
-        ticks: {
+      aspectRatio: 2,
+      scales: {
+        r: {
           beginAtZero: false,
           suggestedMin: Math.min(...d.datasets[0].data) - 100,
-          fontColor,
-          showLabelBackdrop: false, // hide square behind text
-        },
-        pointLabels: {
-          fontSize: 16,
-          fontColor,
-        },
-        gridLines: {
-          color: lineColor,
-        },
-        angleLines: {
-          color: lineColor,
+          ticks: {
+            color: fontColor,
+            showLabelBackdrop: false, // hide square behind text
+            format: {
+              useGrouping: false,
+            },
+          },
+          pointLabels: {
+            color: fontColor,
+            font: {
+              size: window.innerWidth < 500 ? 11 : 16,
+            },
+          },
+          grid: {
+            color: lineColor,
+          },
+          angleLines: {
+            color: lineColor,
+          },
         },
       },
     },