cannery/lib/cannery_web/live/live_helpers.ex

76 lines
2.3 KiB
Elixir
Raw Normal View History

2021-09-02 23:31:14 -04:00
defmodule CanneryWeb.LiveHelpers do
2022-01-22 21:40:29 -05:00
@moduledoc """
Contains common helper functions for liveviews
"""
2022-02-14 01:26:51 -05:00
import Phoenix.LiveView
2021-09-02 23:31:14 -04:00
import Phoenix.LiveView.Helpers
2022-01-22 21:40:29 -05:00
alias Cannery.Accounts
2022-02-14 01:26:51 -05:00
alias Phoenix.LiveView.JS
def assign_defaults(socket, %{"user_token" => user_token} = _session) do
socket
|> assign_new(:current_user, fn -> Accounts.get_user_by_session_token(user_token) end)
end
def assign_defaults(socket, _session) do
socket
end
2021-09-02 23:31:14 -04:00
@doc """
2022-02-14 01:26:51 -05:00
Renders a live component inside a modal.
2021-09-02 23:31:14 -04:00
The rendered modal receives a `:return_to` option to properly update
the URL when the modal is closed.
## Examples
2022-02-17 22:31:37 -05:00
<.modal return_to={Routes.<%= schema.singular %>_index_path(Endpoint, :index)}>
2022-02-14 01:26:51 -05:00
<.live_component
module={<%= inspect context.web_module %>.<%= inspect Module.concat(schema.web_namespace, schema.alias) %>Live.FormComponent}
id={@<%= schema.singular %>.id || :new}
title={@page_title}
action={@live_action}
2022-02-17 22:31:37 -05:00
return_to={Routes.<%= schema.singular %>_index_path(Endpoint, :index)}
2022-02-14 01:26:51 -05:00
<%= schema.singular %>: @<%= schema.singular %>
/>
</.modal>
2021-09-02 23:31:14 -04:00
"""
2022-02-14 01:26:51 -05:00
def modal(assigns) do
~H"""
<div
id="modal"
class="fade-in fixed z-10 left-0 top-0
w-full h-full overflow-hidden
p-8 flex flex-col justify-center items-center"
style="opacity: 1 !important; background-color: rgba(0,0,0,0.4);"
>
<div
id="modal-content"
class="fade-in-scale w-full max-w-3xl max-h-128 relative overflow-y-auto
flex flex-col justify-start items-center
bg-white border-2 rounded-lg"
>
<%= live_patch to: @return_to,
2022-02-15 17:30:58 -05:00
id: "close",
class:
"absolute top-8 right-10 text-gray-500 hover:text-gray-800 transition-all duration-500 ease-in-out"
do %>
<i class="fa-fw fa-lg fas fa-times"></i>
2022-02-14 01:26:51 -05:00
<% end %>
<div class="w-full p-8 flex flex-col space-y-4 justify-start items-center">
2022-02-14 01:26:51 -05:00
<%= render_slot(@inner_block) %>
</div>
</div>
</div>
"""
2021-09-02 23:31:14 -04:00
end
2022-01-22 17:21:10 -05:00
2022-02-14 01:26:51 -05:00
def hide_modal(js \\ %JS{}) do
js
|> JS.hide(to: "#modal", transition: "fade-out")
|> JS.hide(to: "#modal-content", transition: "fade-out-scale")
2021-09-02 23:31:14 -04:00
end
end