53e106dac2
* WIP - started improving handling of sorting for sources index table * WIP - Added UI to table to indicate sort column and direction * Refactored toggle liveview into a livecomponent * Added sorting for all table attrs * Added pagination to the sources table * Added tests for updated liveviews and live components * Add tests for new helper methods * Added fancy new CSS to my sources table * Added size to sources table * Adds relative div to ensure that sorting arrow doesn't run away * Fixed da tests
67 lines
2.5 KiB
Text
67 lines
2.5 KiB
Text
<div class="grid grid-cols-1 gap-4 md:grid-cols-4">
|
|
<div class="flex flex-col justify-center rounded-sm border px-7.5 py-6 shadow-default border-strokedark bg-boxdark">
|
|
<a href={~p"/media_profiles"} class="flex flex-col items-center py-2">
|
|
<span class="text-md font-medium">
|
|
Media <.pluralize count={@media_profile_count} word="Profile" />
|
|
</span>
|
|
<h4 class="text-title-md font-bold text-white">
|
|
<.localized_number number={@media_profile_count} />
|
|
</h4>
|
|
</a>
|
|
</div>
|
|
<div class="flex flex-col justify-center rounded-sm border px-7.5 py-6 shadow-default border-strokedark bg-boxdark">
|
|
<a href={~p"/sources"} class="flex flex-col items-center py-2">
|
|
<span class="text-md font-medium">
|
|
<.pluralize count={@source_count} word="Source" />
|
|
</span>
|
|
<h4 class="text-title-md font-bold text-white">
|
|
<.localized_number number={@source_count} />
|
|
</h4>
|
|
</a>
|
|
</div>
|
|
<div class="flex flex-col justify-center rounded-sm border px-7.5 py-6 shadow-default border-strokedark bg-boxdark">
|
|
<span class="flex flex-col items-center py-2">
|
|
<span class="text-md font-medium">
|
|
<.pluralize count={@media_item_count} word="Download" />
|
|
</span>
|
|
<h4 class="text-title-md font-bold text-white">
|
|
<.localized_number number={@media_item_count} />
|
|
</h4>
|
|
</span>
|
|
</div>
|
|
<div class="flex flex-col justify-center rounded-sm border px-7.5 py-6 shadow-default border-strokedark bg-boxdark">
|
|
<span class="flex flex-col items-center py-2">
|
|
<span class="text-md font-medium">Library Size</span>
|
|
<h4 class="text-title-md font-bold text-white">
|
|
<.readable_filesize byte_size={@media_item_size} />
|
|
</h4>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rounded-sm border shadow-default border-strokedark bg-boxdark mt-4 p-5">
|
|
<span class="text-2xl font-medium mb-4">Media History</span>
|
|
<.tabbed_layout>
|
|
<:tab title="Downloaded" id="downloaded">
|
|
{live_render(
|
|
@conn,
|
|
Pinchflat.Pages.HistoryTableLive,
|
|
session: %{"media_state" => "downloaded"}
|
|
)}
|
|
</:tab>
|
|
<:tab title="Pending" id="pending">
|
|
{live_render(
|
|
@conn,
|
|
Pinchflat.Pages.HistoryTableLive,
|
|
session: %{"media_state" => "pending"}
|
|
)}
|
|
</:tab>
|
|
</.tabbed_layout>
|
|
</div>
|
|
|
|
<div class="rounded-sm border shadow-default border-strokedark bg-boxdark mt-4 p-5">
|
|
<span class="text-2xl font-medium mb-4">Active Tasks</span>
|
|
<section class="mt-6 min-h-80">
|
|
{live_render(@conn, Pinchflat.Pages.JobTableLive)}
|
|
</section>
|
|
</div>
|