forked from shibao/cannery
add liveview helpers
This commit is contained in:
parent
81a250206e
commit
66cc11e9eb
@ -45,7 +45,7 @@ let socket = new Socket("/socket", {params: {token: window.userToken}})
|
||||
// # max_age: 1209600 is equivalent to two weeks in seconds
|
||||
// case Phoenix.Token.verify(socket, "user socket", token, max_age: 1209600) do
|
||||
// {:ok, user_id} ->
|
||||
// {:ok, assign(socket, :user, user_id)}
|
||||
// {:ok, socket |> assign(:user, user_id)}
|
||||
// {:error, reason} ->
|
||||
// :error
|
||||
// end
|
||||
|
@ -83,6 +83,7 @@ defmodule LokalWeb do
|
||||
|
||||
# Import LiveView helpers (live_render, live_component, live_patch, etc)
|
||||
import Phoenix.LiveView.Helpers
|
||||
import LokalWeb.LiveHelpers
|
||||
|
||||
# Import basic rendering functionality (render, render_layout, etc)
|
||||
import Phoenix.View
|
||||
|
@ -9,7 +9,7 @@ defmodule LokalWeb.UserSocket do
|
||||
# verification, you can put default assigns into
|
||||
# the socket that will be set for all channels, ie
|
||||
#
|
||||
# {:ok, assign(socket, :user_id, verified_user_id)}
|
||||
# {:ok, socket |> assign(:user_id, verified_user_id)}
|
||||
#
|
||||
# To deny connection, return `:error`.
|
||||
#
|
||||
|
@ -41,7 +41,7 @@ defmodule LokalWeb.Live.Component.Topbar do
|
||||
</form>
|
||||
|
||||
<%# user settings %>
|
||||
<%= if assigns |> Map.has_key?(:current_user) do %>
|
||||
<%= if @current_user do %>
|
||||
<li>
|
||||
<%= @current_user.email %></li>
|
||||
<li>
|
||||
|
36
lib/lokal_web/live/live_helpers.ex
Normal file
36
lib/lokal_web/live/live_helpers.ex
Normal file
@ -0,0 +1,36 @@
|
||||
defmodule LokalWeb.LiveHelpers do
|
||||
import Phoenix.LiveView.Helpers
|
||||
import Phoenix.LiveView, only: [assign_new: 3]
|
||||
alias Lokal.{Accounts}
|
||||
|
||||
@doc """
|
||||
Renders a component inside the `LokalWeb.ModalComponent` component.
|
||||
|
||||
The rendered modal receives a `:return_to` option to properly update
|
||||
the URL when the modal is closed.
|
||||
|
||||
## Examples
|
||||
|
||||
<%= live_modal LokalWeb.TagLive.FormComponent,
|
||||
id: @tag.id || :new,
|
||||
action: @live_action,
|
||||
tag: @tag,
|
||||
return_to: Routes.tag_index_path(@socket, :index) %>
|
||||
"""
|
||||
def live_modal(component, opts) do
|
||||
path = Keyword.fetch!(opts, :return_to)
|
||||
modal_opts = [id: :modal, return_to: path, component: component, opts: opts]
|
||||
live_component(LokalWeb.ModalComponent, modal_opts)
|
||||
end
|
||||
|
||||
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
|
||||
end
|
26
lib/lokal_web/live/modal_component.ex
Normal file
26
lib/lokal_web/live/modal_component.ex
Normal file
@ -0,0 +1,26 @@
|
||||
defmodule LokalWeb.ModalComponent do
|
||||
use LokalWeb, :live_component
|
||||
|
||||
@impl true
|
||||
def render(assigns) do
|
||||
~L"""
|
||||
<div id="<%= @id %>" class="phx-modal"
|
||||
phx-capture-click="close"
|
||||
phx-window-keydown="close"
|
||||
phx-key="escape"
|
||||
phx-target="#<%= @id %>"
|
||||
phx-page-loading>
|
||||
|
||||
<div class="phx-modal-content">
|
||||
<%= live_patch raw("×"), to: @return_to, class: "phx-modal-close" %>
|
||||
<%= live_component @socket, @component, @opts %>
|
||||
</div>
|
||||
</div>
|
||||
"""
|
||||
end
|
||||
|
||||
@impl true
|
||||
def handle_event("close", _, socket) do
|
||||
{:noreply, push_patch(socket, to: socket.assigns.return_to)}
|
||||
end
|
||||
end
|
@ -2,20 +2,20 @@ defmodule LokalWeb.PageLive do
|
||||
use LokalWeb, :live_view
|
||||
|
||||
@impl true
|
||||
def mount(_params, _session, socket) do
|
||||
{:ok, assign(socket, query: "", results: %{})}
|
||||
def mount(_params, session, socket) do
|
||||
{:ok, socket |> assign_defaults(session) |> assign(query: "", results: %{})}
|
||||
end
|
||||
|
||||
@impl true
|
||||
def handle_event("suggest", %{"q" => query}, socket) do
|
||||
{:noreply, assign(socket, results: search(query), query: query)}
|
||||
{:noreply, socket |> assign(results: search(query), query: query)}
|
||||
end
|
||||
|
||||
@impl true
|
||||
def handle_event("search", %{"q" => query}, socket) do
|
||||
case search(query) do
|
||||
%{^query => vsn} ->
|
||||
{:noreply, redirect(socket, external: "https://hexdocs.pm/#{query}/#{vsn}")}
|
||||
{:noreply, socket |> redirect(external: "https://hexdocs.pm/#{query}/#{vsn}")}
|
||||
|
||||
_ ->
|
||||
{:noreply,
|
||||
|
@ -1,5 +1,5 @@
|
||||
<main role="main" class="container min-w-full min-h-full">
|
||||
<%= live_component LokalWeb.Live.Component.Topbar %>
|
||||
<%= live_component LokalWeb.Live.Component.Topbar, current_user: assigns[:current_user] %>
|
||||
|
||||
<%= @inner_content %>
|
||||
</main>
|
||||
|
Loading…
Reference in New Issue
Block a user