chrisdel101

chrisdel101

Using the default liveView setup via the generator, the flash messages are in live.html.heex. These appear to be included in all true LV’s via MyAppWeb module. But they are not in any of the child components. Not sure why. I’ve been copy/pasting so far but that is not sustainable.

How can I import this live.html into the child components too? I can’t find any docs on that layout keyword used below, if this might be the key.

This is the default code that imports the flashes into the main liveViews.

#live.html.heex
<main class="container">
  <p class="alert alert-info" role="alert"
    phx-click="lv:clear-flash"
    phx-value-key="info"><%= live_flash(@flash, :info) %></p>
  # other flashes

  <%= @inner_content %>
</main>

# myapp_web.ex
defmodule MyAppWeb do
    def controller do ...
    def view do ...
 def live_view do
    quote do
      use Phoenix.LiveView,
     # this imports the flashes live.html
        layout: {MyApp.LayoutView, "live.html"}

      unquote(view_helpers())
    end
  end

  def live_component do
    quote do
      use Phoenix.LiveComponent,
   #  but this does not work - has no effect (I added this)
      layout: {MyApp.LayoutView, "live.html"}
      unquote(view_helpers())
    end
  end
...

Showing Posts 1 to 3

100phlecs

100phlecs

Phoenix.LiveComponent doesn’t take layout: as an option.

I’m not sure of the structure of your app, but what you could do in order to not copy paste the flash html code around would be to wrap your livecomponents in a function that takes a slot.

Using the embed_templates macro, you can then call live.html.heex as a HEEx tag, i.e.

<.live>

</.live>

Otherwise I would just copy paste it into a HEEx function within a module that is accessible within your live components:

slot :inner_block
def container(assigns) do
~H"""
<main class="container">
  <p class="alert alert-info" role="alert"
    phx-click="lv:clear-flash"
    phx-value-key="info"><%= live_flash(@flash, :info) %></p>
  # other flashes

  <%= render_slot(@inner_block) %>
</main>
"""
end
chrisdel101

chrisdel101 OP

Even thought I just used the live view generator around 3 months ago it gave me version 17.5. Or maybe it was some online tutorial where I copy pasted the wrong version into my mix file.

I’ve just tried to upgrade but I get error error: undefined variable "f" in a million places. No idea how to fix that. So looks like I’m stuck with the old version.

embed_templates doesn’t appear to be supported.
Will give the slots way a try and reply if I fail.

Thx!

gerrit

gerrit

You probably updated to LiveView 0.19.0 which removes the previously deprecated let. You now have to use :let instead.

E.g. <.form let={f} for={@changeset}> is replaced by <.form :let={f} for={@changeset}>

— All posts loaded —

Where Next? Top

Trending in Questions Top

Blokh
Hey guys, I’ve got a huge CSV ( around 10 GB ) that needs to be processed hourly Do you guys have any suggestions what is the best prac...
New
kszambelanczyk
Hello! Could someone please give me a help/sample code, how to delete a file from s3 using waffle/waffle_ecto from Phoenix app. I creat...
New
Onor.io
I have what I’ve heard referred to as a “lookup table” in my database. This is a way of assigning codes to common values. One common lo...
New
Trolleger
What approach to take when sending live updates to “random” users Hi! I have a question, I have a little chat app, and when I create a DM...
New
RemyXRenard
I’m seeing that a list inside a Kino.DataTable will be interpreted as a charlist, even if the Kino.configure() is set to charlists: :as_l...
New
matt-savvy
Anyone here using Honeybadger? My Honeybadger account is being overwhelmed with noise from some bots. Seeing a lot of Bandit.HTTPError...
New
samoloth
Hi, I’ve just set up an application with ash_authentication. There is only magic link strategy for now, so there is no confirmation add o...
New

Other Trending Topics Top

mudasobwa
I am happy to introduce the very α version of the new programming language compiled to BEAM. Welcome Cure. It has literally three kille...
New
garrison
Hobbes is a low-level distributed database for the Elixir programming language. Hobbes provides a simple, safe, and scalable storage lay...
New
mcass19
ExRatatui lets you cook up rich terminal UIs in Elixir, powered by Rust’s ratatui via Rustler NIFs. Build interactive terminal applicatio...
New
Damirados
Hello everyone. After busy few months I am happy to announce v0.1.0 of Emerge &amp; Solve. They are GUI (Emerge) and State management (S...
New
netoum
Corex is an accessible, unstyled UI component library for Phoenix that integrates Zag.js state machines using Vanilla JavaScript and Live...
New
wintermeyer
There are three potential reasons for members of this forum to have a look at https://vutuv.de You are tired or annoyed of LinkedIn. Yo...
New

We're in Beta

About us Mission Statement

Options

Thread Display Mode




Thread Preview

Skip Thread Previews