<%= if @live_action in [:new, :edit] do %> <.live_component module={Shift73kWeb.ModalComponent} id="modal" component={Shift73kWeb.UserManagement.FormComponent} opts={[ id: @user.id || :new, title: @page_title, action: @live_action, user: @user, current_user: @current_user ]} /> <% end %> <%= if @delete_user do %> <.live_component module={Shift73kWeb.ModalComponent} id="modal" component={Shift73kWeb.UserManagement.DeleteComponent} opts={[ id: @delete_user.id, title: "Delete User", delete_user: @delete_user ]} /> <% end %>

Listing Users

<%# filtering and new item creation %>
<%= live_patch to: Routes.user_management_index_path(@socket, :new, Enum.into(@query, [])), class: "btn btn-primary mb-3 mb-md-0" do %> New User <% end %>
<%= form_for :sort, "#", [phx_change: "sort-by-change"], fn srt -> %> <%= label srt, :sort_by, class: "visually-hidden" %>
<%= Phoenix.HTML.Form.select srt, :sort_by, ["Email": "email", "Role": "role", "Created at": "inserted_at"], value: @query.sort_by, class: "form-select rounded-start" %>
<% end %>
<%= form_for :filter, "#", [phx_change: "filter-change"], fn flt -> %> <%= label flt, :filter, class: "visually-hidden" %>
<%= if @query.filter != "" do %> <% end %> <%= text_input flt, :filter, name: "filter", value: @query.filter, class: "form-control", placeholder: "Filter users", aria_label: "Filter users" %>
<% end %>
<%# mobile data cards %>
<%= if !@page do %>
Loading...
<% else %> <%= for user <- @page.entries do %>
Email
<%= user.email %>
Role
<%= user.role |> Atom.to_string() |> String.capitalize() %>
Created at
<%= dt_out(user.inserted_at) %>
Confirmed?
<%= user.confirmed_at && "Yes" || "No" %>
<%= if Roles.can?(@current_user, user, :edit) do %> <%= live_patch to: Routes.user_management_index_path(@socket, :edit, user.id, Enum.into(@query, [])), class: "btn btn-primary btn-sm text-nowrap" do %> Edit <% end %> <% end %> <%= if Roles.can?(@current_user, user, :delete) do %> <% end %>
<% end %> <% end %>
<%# non-mobile main data table %>
<%= if !@page do %> <% else %> <%= for user <- @page.entries do %> <% end %> <% end %>
Email <%= if @query.sort_by == "email" do %> <% end %> Role <%= if @query.sort_by == "role" do %> <% end %> Created at <%= if @query.sort_by == "inserted_at" do %> <% end %> Confirmed?
Loading...
<%= user.email %> <%= user.role |> Atom.to_string() |> String.capitalize() %> <%= dt_out(user.inserted_at) %> <%= user.confirmed_at && "Confirmed" || "Not confirmed" %> <%= if Roles.can?(@current_user, user, :edit) do %> <%= live_patch to: Routes.user_management_index_path(@socket, :edit, user.id, Enum.into(@query, [])), class: "btn btn-outline-primary btn-sm text-nowrap" do %> Edit <% end %> <% end %> <%= if Roles.can?(@current_user, user, :delete) do %> <% end %>
<%# pagination interface %> <%= if @page do %>
<%#
%> <%# items per page selector %>
<%= form_for :page_size, "#", [phx_change: "page-size-change"], fn pgsz -> %> <%= select pgsz, :page_size, [10, 15, 20, 30, 50, 100] |> Enum.map(fn n -> {"#{n} per page", n} end), value: @query.page_size, id: "table_page_size_page_size", name: "page_size", class: "form-select" %> <% end %> <%= @page.total_entries %> total
<%# main pagination %>
<% end %>