From 2571d1dfd30fe26f86d20caf71385935c1b6095b Mon Sep 17 00:00:00 2001
From: Claudio Ortolina <cloud8421@gmail.com>
Date: Tue, 24 Dec 2024 14:42:58 +0000
Subject: [PATCH] Use link+navigate instead of a+href

Makes application more performant as it avoids re-establishing a
connection.
---
 .../live/stats_live/data_components.ex               |  6 +++---
 .../live/stats_live/index.html.heex                  | 12 ++++++------
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/lib/music_library_web/live/stats_live/data_components.ex b/lib/music_library_web/live/stats_live/data_components.ex
index ff1d3281..5aae9624 100644
--- a/lib/music_library_web/live/stats_live/data_components.ex
+++ b/lib/music_library_web/live/stats_live/data_components.ex
@@ -55,12 +55,12 @@ defmodule MusicLibraryWeb.StatsLive.DataComponents do
         </p>
       </dt>
       <dd class="mt-1">
-        <a
-          href={@path}
+        <.link
+          navigate={@path}
           class="block text-2xl sm:text-3xl font-semibold text-center text-zinc-900 hover:text-zinc-500 dark:text-zinc-300 dark:hover:text-zinc-200"
         >
           {@count}
-        </a>
+        </.link>
       </dd>
     </div>
     """
diff --git a/lib/music_library_web/live/stats_live/index.html.heex b/lib/music_library_web/live/stats_live/index.html.heex
index d488e474..6115f347 100644
--- a/lib/music_library_web/live/stats_live/index.html.heex
+++ b/lib/music_library_web/live/stats_live/index.html.heex
@@ -32,12 +32,12 @@
         {Record.format_long_label(format)}
       </dt>
       <dd class="mt-1 text-center">
-        <a
+        <.link
           class="text-xl lg:text-2xl font-semibold hover:text-zinc-500 dark:text-zinc-300 dark:hover:text-zinc-200"
-          href={~p"/collection?query=format:#{format}"}
+          navigate={~p"/collection?query=format:#{format}"}
         >
           {count}
-        </a>
+        </.link>
       </dd>
     </div>
   </dl>
@@ -57,12 +57,12 @@
         {Record.type_long_label(type)}
       </dt>
       <dd class="mt-1 text-center">
-        <a
+        <.link
           class="text-xl lg:text-2xl font-semibold hover:text-zinc-500 dark:text-zinc-300 dark:hover:text-zinc-200"
-          href={~p"/collection?query=type:#{type}"}
+          navigate={~p"/collection?query=type:#{type}"}
         >
           {count}
-        </a>
+        </.link>
       </dd>
     </div>
   </dl>