<.search_form query={@record_list_params.query} />
<.button_group>
<.button
variant="solid"
size="sm"
patch={~p"/collection/import"}
>
<.icon name="hero-plus" class="icon" aria-hidden="true" data-slot="icon" />
{gettext("Add")}
<.button
variant="solid"
size="sm"
patch={~p"/collection/scan"}
>
<.barcode_icon class="icon fill-current" />
{gettext("Scan")}
<.button_group>
<.button
patch={order_path(@record_list_params, :purchase)}
size="sm"
class={[
@record_list_params.order == :purchase && "bg-zinc-100! dark:bg-zinc-700!"
]}
>
<.icon
name="hero-banknotes-solid"
class="icon"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Purchase")}
<.button
patch={order_path(@record_list_params, :alphabetical)}
size="sm"
class={[
@record_list_params.order == :alphabetical && "bg-zinc-100! dark:bg-zinc-700!"
]}
>
<.icon name="hero-user-solid" class="icon" aria-hidden="true" data-slot="icon" />
{gettext("A->Z")}
<.button
patch={order_path(@record_list_params, :release)}
size="sm"
class={[
@record_list_params.order == :release && "bg-zinc-100! dark:bg-zinc-700!"
]}
>
<.icon name="hero-calendar-days" class="icon" aria-hidden="true" data-slot="icon" />
{gettext("Release")}
<.button_group>
<.button
phx-click="set_display"
phx-value-mode="grid"
size="sm"
class={[
@display == :grid && "bg-zinc-100! dark:bg-zinc-700!"
]}
>
<.icon
name="hero-squares-2x2"
class="icon"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Grid")}
<.button
phx-click="set_display"
phx-value-mode="list"
size="sm"
class={[
@display == :list && "bg-zinc-100! dark:bg-zinc-700!"
]}
>
<.icon name="hero-list-bullet" class="icon" aria-hidden="true" data-slot="icon" />
{gettext("List")}
<.record_grid
:if={@display == :grid}
id="collection"
records={@streams.records}
record_show_path={fn record -> ~p"/collection/#{record}" end}
record_edit_path={fn record -> ~p"/collection/#{record}/edit" end}
display_artist_names
density={:high}
/>
<.record_list
:if={@display == :list}
records={@streams.records}
record_show_path={fn record -> ~p"/collection/#{record}" end}
record_edit_path={fn record -> ~p"/collection/#{record}/edit" end}
/>
<.structured_modal
:if={@live_action == :edit}
id="record-modal"
on_close={JS.patch(back_path(@record_list_params))}
>
<.live_component
module={MusicLibraryWeb.Components.RecordForm}
id={@record.id}
action={@live_action}
show_purchased_at={true}
record={@record}
patch={back_path(@record_list_params)}
/>
<.structured_modal
:if={@live_action == :import}
id="record-modal"
on_close={JS.patch(back_path(@record_list_params))}
>
<.live_component
module={MusicLibraryWeb.Components.AddRecord}
id={:search}
title={@page_title}
action={@live_action}
record={@record}
patch={back_path(@record_list_params)}
initial_query=""
icon_name="hero-plus"
/>
<.structured_modal
:if={@live_action == :barcode_scan}
id="barcode-scanner-modal"
on_close={JS.patch(back_path(@record_list_params))}
>
<.live_component
module={MusicLibraryWeb.Components.BarcodeScanner}
id={:barcode_scanner}
title={@page_title}
action={@live_action}
patch={back_path(@record_list_params)}
/>
<.pagination id={:bottom_pagination} pagination_params={@record_list_params} />