diff --git a/lib/music_library_web/components/chart_components.ex b/lib/music_library_web/components/chart_components.ex
index 6d9ada16..883a90a0 100644
--- a/lib/music_library_web/components/chart_components.ex
+++ b/lib/music_library_web/components/chart_components.ex
@@ -14,7 +14,7 @@ defmodule MusicLibraryWeb.ChartComponents do
## Examples
- <.vertical_bar_chart
+ <.horizontal_bar_chart
data={[{"Artist 1", 5}, {"Artist 2", 3}]}
label_fn={&elem(&1, 0)}
value_fn={&elem(&1, 1)}
@@ -28,7 +28,7 @@ defmodule MusicLibraryWeb.ChartComponents do
attr :class, :string, default: ""
attr :datum_click, :any, default: nil, doc: "the function for handling phx-click on each datum"
- def vertical_bar_chart(assigns) when assigns.data != [] do
+ def horizontal_bar_chart(assigns) when assigns.data != [] do
assigns =
assigns
|> assign(:max_value, max_value(assigns.data, assigns.value_fn))
@@ -67,7 +67,7 @@ defmodule MusicLibraryWeb.ChartComponents do
"""
end
- def vertical_bar_chart(assigns) do
+ def horizontal_bar_chart(assigns) do
~H"""
{gettext("No data available")}
diff --git a/lib/music_library_web/live/stats_live/index.ex b/lib/music_library_web/live/stats_live/index.ex
index 647700df..a27e86ac 100644
--- a/lib/music_library_web/live/stats_live/index.ex
+++ b/lib/music_library_web/live/stats_live/index.ex
@@ -307,7 +307,7 @@ defmodule MusicLibraryWeb.StatsLive.Index do
<.section>
<:title>{gettext("Top 20 Release Years")}
- <.vertical_bar_chart
+ <.horizontal_bar_chart
data={@records_by_release_year}
color_class="bg-zinc-800 dark:bg-zinc-300"
label_fn={fn {year, _count} -> year end}
@@ -331,7 +331,7 @@ defmodule MusicLibraryWeb.StatsLive.Index do
<.section>
<:title>{gettext("Top %{n} Collection Genres", %{n: length(@records_by_genre)})}
- <.vertical_bar_chart
+ <.horizontal_bar_chart
data={@records_by_genre}
color_class="bg-zinc-500"
label_fn={fn {genre, _count} -> genre end}
@@ -355,7 +355,7 @@ defmodule MusicLibraryWeb.StatsLive.Index do
<.section>
<:title>{gettext("Top %{n} Collection Artists", %{n: length(@records_by_artist)})}
- <.vertical_bar_chart
+ <.horizontal_bar_chart
data={@records_by_artist}
color_class="bg-red-500"
label_fn={fn datum -> datum.name end}