globz

globz

Migrate live_patch to .link patch

Hi,

I am trying to migrate my project to live_view 0.18.3 and I am having problems with live_patch…here’s my current code:

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

How can I rewrite my live_patch into the new Phoenix.Component.link/1 ? I tried various ways but I keep getting this error:

== Compilation error in file lib/primordial_web/live/live_helpers.ex ==
** (SyntaxError) lib/primordial_web/live/live_helpers.ex:40:8: syntax error before: to
|
40 | to: @return_to,

This is what I tried:

      <.link patch={
       to: @return_to,
       id: "close",
       class: "phx-modal-close",
       phx_click: hide_modal()}>✖</.link>

Anyone can help explain the new syntax? Thank you

Marked As Solved

t0t0

t0t0

Hi,

your syntax is incorrect, it should be:

<.link
  patch={@return_to}
  id="close"
  class="phx-modal-close"
  phx-click={hide_modal()}
>✖</.link>

And to include and merge your if/else condition:

<.link
  {if @return_to, do: [patch: @return_to], else: [href: "#"]},
  id="close"
  class="phx-modal-close"
  phx-click={hide_modal()}
>✖</.link>

Last Post!

globz

globz

Thank you so much, the merged if/else is also much better than before.
I haven’t touched this project/Elixir for many months, need to get a refresher on the syntax!

Thank again and happy near year!

Where Next?

Popular in Questions Top

hariharasudhan94
lets say i have a sample like a = 20; b = 10; if (a &gt; b) do {:ok, "a"} end if (a &lt; b) do {:ok, b} end if (a == b) do {:ok, "equa...
New
ovidiubadita
Hey all, I discovered Elixir and I love it. I always wanted to learn a functional programming and I intended to go for Haskell, but afte...
New
skosch
To my knowledge, put_in, Map.update etc. all have the one limitation of not automatically creating intermediate keys when needed (for exa...
New
Lily
In templates/appointment/index.html.eex: &lt;%= for appointment &lt;- @appointments do %&gt; &lt;tr&gt; &lt;td&gt;&lt;%= appoi...
New
jerry
Good day to you all. I have been struggling to get a query involving like and ilike to work. Can anyone assist me on this, please? pro...
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
svb
Hi! Currently I want to submit a form by pressing the Enter key. However, since my input field is of type “textarea” this is just adds a...
New

Other popular topics Top

JeremM34
Hello, how can I check the Phoenix version ? Thanks !
New
vertexbuffer
Hello, can anybody help here..? I have a list of players and I what to delete an element, but every for loop the list is reverting to ori...
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
stefanchrobot
What’s the safe way to decode a JSON string into a struct? I want to avoid calling String.to_atom. Jason.decode can give me a map with st...
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
chrismccord
Phoenix 1.4.0 released Phoenix 1.4 is out! This release ships with exciting new features, most notably with HTTP2 support, improved deve...
688 31525 112
New

We're in Beta

About us Mission Statement