diff options
author | Logan Hunt <loganhunt@simponic.xyz> | 2022-04-06 12:55:12 -0600 |
---|---|---|
committer | Logan Hunt <loganhunt@simponic.xyz> | 2022-04-06 12:55:12 -0600 |
commit | 4067339e8cf9dbd624a8fa0183d7a29c73b2e762 (patch) | |
tree | 4f995e706c10bf5b9a58c078cfb843c76e31c8a0 /lib/aggiedit_web/live/live_helpers.ex | |
parent | 66d871e5461814dad58872eb832a58f2c3c5111b (diff) | |
download | aggiedit-4067339e8cf9dbd624a8fa0183d7a29c73b2e762.tar.gz aggiedit-4067339e8cf9dbd624a8fa0183d7a29c73b2e762.zip |
Models for upload and post; generated liveview controller for posts
Diffstat (limited to 'lib/aggiedit_web/live/live_helpers.ex')
-rw-r--r-- | lib/aggiedit_web/live/live_helpers.ex | 60 |
1 files changed, 60 insertions, 0 deletions
diff --git a/lib/aggiedit_web/live/live_helpers.ex b/lib/aggiedit_web/live/live_helpers.ex new file mode 100644 index 0000000..aa6b28a --- /dev/null +++ b/lib/aggiedit_web/live/live_helpers.ex @@ -0,0 +1,60 @@ +defmodule AggieditWeb.LiveHelpers do + import Phoenix.LiveView + import Phoenix.LiveView.Helpers + + alias Phoenix.LiveView.JS + + @doc """ + Renders a live component inside a modal. + + The rendered modal receives a `:return_to` option to properly update + the URL when the modal is closed. + + ## Examples + + <.modal return_to={Routes.post_index_path(@socket, :index)}> + <.live_component + module={AggieditWeb.PostLive.FormComponent} + id={@post.id || :new} + title={@page_title} + action={@live_action} + return_to={Routes.post_index_path(@socket, :index)} + post: @post + /> + </.modal> + """ + def modal(assigns) do + assigns = assign_new(assigns, :return_to, fn -> nil end) + + ~H""" + <div id="modal" class="phx-modal fade-in" phx-remove={hide_modal()}> + <div + id="modal-content" + class="phx-modal-content fade-in-scale" + phx-click-away={JS.dispatch("click", to: "#close")} + phx-window-keydown={JS.dispatch("click", to: "#close")} + phx-key="escape" + > + <%= if @return_to do %> + <%= live_patch "✖", + to: @return_to, + id: "close", + class: "phx-modal-close", + phx_click: hide_modal() + %> + <% else %> + <a id="close" href="#" class="phx-modal-close" phx-click={hide_modal()}>✖</a> + <% end %> + + <%= render_slot(@inner_block) %> + </div> + </div> + """ + end + + defp hide_modal(js \\ %JS{}) do + js + |> JS.hide(to: "#modal", transition: "fade-out") + |> JS.hide(to: "#modal-content", transition: "fade-out-scale") + end +end |