Inline templates inside LV modules
This commit is contained in:
Claudio Ortolina
@@ -17,6 +17,176 @@ defmodule MusicLibraryWeb.CollectionLive.Index do
|
||||
order: :purchase
|
||||
}
|
||||
|
||||
@impl true
|
||||
def render(assigns) do
|
||||
~H"""
|
||||
<Layouts.app flash={@flash} current_section={@current_section} socket={@socket}>
|
||||
<header class="gap-6 mb-2">
|
||||
<div class="flex items-center justify-between gap-6 mb-2 mt-2">
|
||||
<.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>
|
||||
<.button
|
||||
variant="solid"
|
||||
size="sm"
|
||||
patch={~p"/collection/scan"}
|
||||
>
|
||||
<.barcode_icon class="icon fill-current" />
|
||||
{gettext("Scan")}
|
||||
</.button>
|
||||
</.button_group>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="flex items-end justify-between gap-6 mt-8">
|
||||
<.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"
|
||||
/>
|
||||
<span class="sr-only sm:not-sr-only">{gettext("Purchase")}</span>
|
||||
</.button>
|
||||
<.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" />
|
||||
<span class="sr-only sm:not-sr-only">{gettext("A->Z")}</span>
|
||||
</.button>
|
||||
<.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" />
|
||||
<span class="sr-only sm:not-sr-only">{gettext("Release")}</span>
|
||||
</.button>
|
||||
</.button_group>
|
||||
|
||||
<.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"
|
||||
/>
|
||||
<span class="sr-only sm:not-sr-only">
|
||||
{gettext("Grid")}
|
||||
</span>
|
||||
</.button>
|
||||
<.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" />
|
||||
<span class="sr-only sm:not-sr-only">
|
||||
{gettext("List")}
|
||||
</span>
|
||||
</.button>
|
||||
</.button_group>
|
||||
</div>
|
||||
|
||||
<.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>
|
||||
|
||||
<.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>
|
||||
|
||||
<.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)}
|
||||
/>
|
||||
</.structured_modal>
|
||||
|
||||
<.pagination id={:bottom_pagination} pagination_params={@record_list_params} />
|
||||
</Layouts.app>
|
||||
"""
|
||||
end
|
||||
|
||||
@impl true
|
||||
def mount(_params, _session, socket) do
|
||||
{:ok,
|
||||
|
||||
Reference in New Issue
Block a user