SiimK

SiimK

LiveView - showing the active path

I have layout with a navigation bar and a content view. In my root layout I do the rendering as follows:

<div>
  <%= render("sidebar.html", assigns) %>
  <%= @inner_content %>
</div>

Inside sidebar.html:
<div>
  <%= live_redirect to: Routes.live_path(@conn, MyApp.RouteLive), class: is_active(@conn.path_info) %>
</div>

However when using live_redirect, the sidebar template is not re-rendered when a new LiveView is routed to. I’m wondering how to solve it.

I’ve tried to use live_render inside the root layout to render a SideBar LiveView. Doesn’t work as handle_params can’t be called since this isn’t the “main” liveview.

Any pointers how to separate my side bar that uses live_redirect for the links without tying it up with all my other content LiveViews?

It works if I use a normal redirect (as the page is rerendered), but this will tear down the LiveView socket.

Marked As Solved

sfusato

sfusato

Take a look at how LiveDashboard achieves this: live.html.leex, live_helpers.ex, menu_live.ex

You can assign a menu variable inside your liveviews that you can also pass to the logic holding your menu (be it a live_view, live_component or even a simple template). But you will need to move it from your root layout inside your live layout.

Last Post!

sergio

sergio

Here’s how I did it:

Create a new module to assign “current_uri” to your socket. I only set the path string to the assigns, since I don’t want/need the whole URI enchilada.

defmodule GamedropWeb.SaveRequestUri do
  def on_mount(:save_request_uri, _params, _session, socket),
    do:
      {:cont,
       Phoenix.LiveView.attach_hook(
         socket,
         :save_request_path,
         :handle_params,
         &save_request_path/3
       )}

  defp save_request_path(_params, url, socket),
    do: {:cont, Phoenix.Component.assign(socket, :current_uri, URI.parse(url) |> Map.get(:path))}
end

Call this module from your router.ex:

live_session :current_user,
  on_mount: [
    {GamedropWeb.UserAuth, :mount_current_user},
    {GamedropWeb.SaveRequestUri, :save_request_uri}
  ] do
  live("/users/co.... *snip*
end

And then you can just call this from your liveview templates or layouts.

<p>@current_uri} /></p>

Where Next?

Popular in Questions Top

nobody
Hi! In PHP: $_SERVER[‘SERVER_ADDR’] - in Elixir? Searched the docs for ip address and the web, no good results. Thanks!
New
jononomo
I am trying to figure out how Mix knows whether the environment is test, dev, or prod – where is this set? Thanks.
New
dokuzbir
I want to highlight html closing tags when i click a html tag. That works in .html files but doesnt work for html.eex templates. How can...
New
greenz1
I have a phoenix application from which a user can download multiple(5-6) files of size 1MB. I couldn’t find anything related to sending ...
New
freewebwithme
Using vs code and installed ElixirLS: support and debugger. And I got an error popped up on start up says Failed to run ‘elixir’ comma...
New
vrod
I am using the Starship cross-shell prompt – it seems pretty nice, but I get some errors: [WARN] - (starship::utils): Executing command ...
New
WestKeys
Currently suffering from paralysis by [HTTP client] analysis. This is rather unusual in Elixirland as there tends to be consensus on the ...
New

Other popular topics Top

electic
Hi, I am new to Elixir. I am trying to use the DateTime component to insert a date into MySQL however the there seems to be no way to fo...
New
Qqwy
Original source of discussion: This topic on the Pragmatic Programmers’ Functional Web Development with Elixir, OTP, and Phoenix forum. ...
New
openscript
Hello! Sorry for this astonishing simple question, but I’m really stuck. I try to set up the intellij-elixir plugin, but I don’t know ho...
New
sen
Hi All, I set a environment variables in dev.exs , like below code. when i start server, how can i set the ${enable} value? thanks. d...
New
shijith.k
I am trying to start a new phoenix project with elixir 1.9, but mix phx.new does not work. It says that ** (Mix) The task "phx.new" could...
New
msaraiva
Surface is an experimental library built on top of Phoenix LiveView and its new LiveComponent API that aims to provide a more declarative...
564 44265 214
New

We're in Beta

About us Mission Statement