From c09c4a06641d19e907dd546ac7dc02d1cca12d17 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=81lvaro?= <alvaro.girona@gmail.com>
Date: Mon, 17 Jun 2024 00:58:46 +0200
Subject: [PATCH] remove win rate plot legendsmoother loading of champion
 detail

---
 .../assets/js/hooks/champion_win_rate_patch.js      | 13 +++++++++++--
 .../lol_analytics_web/live/champion_live/show.ex    |  3 +++
 .../live/champion_live/show.html.heex               |  9 ++++++++-
 3 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/apps/lol_analytics_web/assets/js/hooks/champion_win_rate_patch.js b/apps/lol_analytics_web/assets/js/hooks/champion_win_rate_patch.js
index 497e5d8..95e5c35 100644
--- a/apps/lol_analytics_web/assets/js/hooks/champion_win_rate_patch.js
+++ b/apps/lol_analytics_web/assets/js/hooks/champion_win_rate_patch.js
@@ -11,7 +11,6 @@ const ChampionWinRate = {
                 const data = {
                     labels: patches,
                     datasets: [{
-                        label: 'Win rate',
                         data: winRateValues,
                         fill: false,
                         borderColor: 'rgb(75, 192, 192)',
@@ -20,10 +19,20 @@ const ChampionWinRate = {
                 };
                 this.chart = new Chart(document.getElementById("win-rate"), {
                     type: 'line',
-                    data: data
+                    data: data,
+                    options: {
+                        plugins: {
+                            legend: {
+                                display: false
+                            }
+                        }
+                    }
                 })
                 this.chart.canvas.parentNode.style.height = '250px';
                 this.chart.canvas.parentNode.style.width = '400px';
+                this.chart.labels.display = false;
+                this.chart.options.legend.display = false
+                this.chart.options.legend.display = false
             }, 1000)
         });
     }
diff --git a/apps/lol_analytics_web/lib/lol_analytics_web/live/champion_live/show.ex b/apps/lol_analytics_web/lib/lol_analytics_web/live/champion_live/show.ex
index c779b81..7e45142 100644
--- a/apps/lol_analytics_web/lib/lol_analytics_web/live/champion_live/show.ex
+++ b/apps/lol_analytics_web/lib/lol_analytics_web/live/champion_live/show.ex
@@ -75,6 +75,9 @@ defmodule LoLAnalyticsWeb.ChampionLive.Show do
     )
   end
 
+  @impl true
+  @spec handle_async(:get_items | :get_summoners | :get_win_rates, {:ok, any()}, map()) ::
+          {:noreply, map()}
   def handle_async(:get_win_rates, {:ok, result}, socket) do
     {:noreply, push_event(socket, "win-rate", %{winRates: result})}
   end
diff --git a/apps/lol_analytics_web/lib/lol_analytics_web/live/champion_live/show.html.heex b/apps/lol_analytics_web/lib/lol_analytics_web/live/champion_live/show.html.heex
index ba017ba..11fb414 100644
--- a/apps/lol_analytics_web/lib/lol_analytics_web/live/champion_live/show.html.heex
+++ b/apps/lol_analytics_web/lib/lol_analytics_web/live/champion_live/show.html.heex
@@ -2,6 +2,11 @@
   .win-rate {
     height: 250px;
   }
+
+  .win-rate-container {
+    width: 100%;
+    height: 250px;
+  }
 </style>
 
 <.header>
@@ -15,7 +20,9 @@
 <div class="flex flex-row gap-4">
   <.champion_avatar class="w-20" id={@champion.id} name={@champion.name}
     image={"https://ddragon.leagueoflegends.com/cdn/14.11.1/img/champion/#{@champion.image}"} />
-  <canvas class="w-full win-rate" height="250" class="win-rate" id="win-rate" phx-hook="ChampionWinRate" />
+  <div class="win-rate-container">
+    <canvas class="w-full win-rate" height="250" class="win-rate" id="win-rate" phx-hook="ChampionWinRate" />
+  </div>
 </div>
 <div class="my-4" />