marcin

marcin

Phoenix 1.7 and inversion of control to render a sidebar

Hi!
I’m trying to have a layout in Phoenix 1.7, where besides @inner_content I also have a dynamic sidebar.

The content of the sidebar should depend on the view. How should I approach this? The last place where I can affect the sidebar is a controller I guess - i can set the assigns[:sidebar_content] and then read this in sidebar component.

However, it seems more elegant to set the sidebar content in the view – the controller assigns data, and the view decides how it is displayed in @inner_content and in the sidebar.
Is such inversion of control flow possible?

Most Liked

josevalim

josevalim

Creator of Elixir

Another approach is to have two app layouts. One for regular users and another for admin. Any logic or markup shared between the layouts can be moved to the root layout or into function components. So the layouts are very similar, except for the sidebar.

mssantosdev

mssantosdev

You can send a Phoenix Component in the controller assigns instead of sending the sidebar content.

In your controller:

defmodule NewPhoenixWeb.PageController do
  use NewPhoenixWeb, :controller

  def home(conn, _params) do
    render(conn, :home, sidebar_content: apply(NewPhoenixWeb.Layouts, :default_sidebar, [[]]))
  end

  def test(conn, _params) do
    render(conn, :test, sidebar_content: apply(NewPhoenixWeb.Layouts, :admin_sidebar, [[]]))
  end
end

In your layouts.ex:

defmodule NewPhoenixWeb.Layouts do
  use NewPhoenixWeb, :html

  embed_templates "layouts/*"

  def default_sidebar(assigns) do
    ~H"""
    <p>default sidebar</p>
    """
  end

  def admin_sidebar(assigns) do
    ~H"""
    <p>admin sidebar</p>
    """
  end
end

(There’s probably a better place for the above code, but layouts.ex exists in all Phoenix 1.7 apps.)

Finally, in your root.html.heex (or any other layout file you want to use):

<aside class="sidebar">
  <%= @sidebar_content %>
</aside>

If your sidebar is a component, you can use slots instead.

defmodule NewPhoenixWeb.Layouts do
  slot :inner_block

  def sidebar(assigns) do
    ~H"""
    <aside>
      <%= render_slot(@inner_block) %>
    </aside>
    """
  end
end
<.sidebar>
  <%= @sidebar_content %>
</.sidebar>



Things can get complicated depending on the number of sidebar variations, but it can be a good start.

Where Next?

Popular in Questions Top

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
nobody
How to bind a phoenix app to a specific ip address? could not find anything about that, nowhere, unfortunately, but for me this is quite...
New
beno
I will often find my self writing things similar to: case some_value do nil -&gt; something() "" -&gt; something() _ -&gt; somethi...
New
Darmani72
If I have a post route which an argument: post /my_post_route/:my_param1, MyController.my_post_handler How would get the post params ...
New
baxterw3b
Hi guys, i’m new in the Elixir world, and i have to say, that i love it! i’m having some problem to understand anonymous functions with ...
New
stefanluptak
Hello everybody, usually, I use a 29" ultra-wide monitor for VSCode which can easily accomodate explorer (files panel) + file with code ...
New
sergio_101
I am VERY much an elixir newbie. I have taken one elixir course and one phoenix course on Udemy. During that course, I saw the instructor...
New
komlanvi
Hi everyone, I was playing with phoenix liveView but I run into an issue. I have a form and want to validate each input text when the te...
New
yawaramin
In the Dialyzer docs ( dialyzer — OTP 29.0.2 (dialyzer 6.0.1) ), there is a way to turn off a specific warning for a function: -dialyzer...
New
jaysoifer
Is there a way to rollback a specific migration and only that one (“skipping” all the other ones)? Would mix ecto.rollback -v 200809061...
New

Other popular topics Top

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
danschultzer
None of the current solutions worked well for me, so I went ahead and built a user management system from scratch. This project took far...
548 29603 241
New
baxterw3b
Hi guys, i’m new in the Elixir world, and i have to say, that i love it! i’m having some problem to understand anonymous functions with ...
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
jononomo
I am trying to figure out how Mix knows whether the environment is test, dev, or prod – where is this set? Thanks.
New
belgoros
I’m not a pro in using Regex and can’t figure out why the following behaviour happens, especially if we take into account the difference ...
New
Qqwy
Original source of discussion: This topic on the Pragmatic Programmers’ Functional Web Development with Elixir, OTP, and Phoenix forum. ...
New
alice
Hey, Just curious what are the main benefits of Elixir compared to Clojure? When is Elixir more useful than Clojure and vice versa? Th...
New
boundedvariable
I am going through the kafka architecture. All the features what the kafka is providing are already in Erlang. I would like hear your opi...
New
joaquinalcerro
Hi there, I am working with Ecto-Postgresql and I need to call all of the records from a specific table but the table has 40,000 records...
New

Latest on Elixir Forum

Elixir Forum

We're in Beta

About us Mission Statement