Migrating to LiveView v0.18

LiveView 0.18 is here, bringing new and exciting features to try! In this post we’ll talk about errors that may appear when migrating your project from LiveView v0.17 to v0.18, and how to deal with them.

Migrated Functions

Some of the errors that you will probably find are of the type:

** (CompileError) ... undefined function assign/3

** (CompileError) ... undefined function sigil_H/2

The above messages refer to functions that have been moved into the Phoenix.Component module. This includes some functions previously found in the Phoenix.LiveView module (including assign/3 and assign_new/3), and all non-deprecated functions (like sigil_H/2) from the Phoenix.LiveView.Helpers module, which has been removed.

Solution

The solution in both cases is simple. Import the Phoenix.Component module and remove the Phoenix.LiveView.Helpers import. You may be able to remove the Phoenix.LiveView import as well.

 #add
import Phoenix.Component

#remove
import Phoenix.LiveView
import Phoenix.LiveView.Helpers

Deprecated functions

You may get other errors related to undefined functions:

** (CompileError) ... undefined function live_patch/2

** (CompileError) ... undefined function live_redirect/2

These errors appear since the live_patch/2 and live_redirect/2 functions have been deprecated in favor of the new :link function component.

Solution

Change the live_patch/2 calls and adjust them to use the new function component, for example:

#from
<%= live_patch [to: @patch, class: "..."] do %>
  Link Text
<% end %>

#to
<.link patch={@patch} class="...">
  Link Text
</.link>

Change live_redirect/2 calls too:

#from
<%= live_redirect(to: @target, class: "...") do %>
  Link Text
<% end %>

#to
<.link navigate={@target} class="...">
  Link Text
</.link>

Closing

With these few changes, we’ve cleaned up our warnings and now we’re enjoying the new LiveView v0.18 goodness! We’ll have more to talk about as we take advantage of some of the new LiveView features.