Sergio Tapia
Sergio Tapia's Blog

Follow

Sergio Tapia's Blog

Follow

Integrating AppSignal with Phoenix Liveview tutorial

Sergio Tapia's photo
Sergio Tapia
·Nov 11, 2021

Right, you want to use Appsignal to monitor your Phoenix Liveview application? Here's how you do it.

Note: This guide assumes you're on Liveview 0.17.5 or newer because we depend on the new liveview event hooks.

First install the appsignal_phoenix package. Because this package already depends on the appsignal package, there's no need for you to manually add it.

defp deps do
  [
    {:appsignal_phoenix, "~> 2.0"},

Then we're going to hook into the lifecycle in two spots. One for the mount event, and one for the handle_event.

In your myproject_web.ex add two on_mount handlers.

  def live_view do
    quote do
      use Phoenix.LiveView,
        layout: {GamingWeb.LayoutView, "live.html"}

      on_mount(GamingWeb.InitAssigns)
      on_mount(GamingWeb.Appsignal)

      unquote(view_helpers())
    end
  end

Tracking mount events

Let's start by creating the InitAssigns module.

defmodule GamingWeb.InitAssigns do
  @moduledoc false
  import Phoenix.LiveView
  import Appsignal.Phoenix.LiveView, only: [live_view_action: 5]

  def on_mount(:default, params, session, socket) do
    # here's where we're calling appsignal instrumentation
    live_view_action(socket.view, "mount", params, socket, fn ->
      socket =
        socket
        |> assign_new(:current_user, fn ->
          get_user(session["user_token"])
        end)

      {:cont, socket}
    end)
  end
end

We're done, every mount will be tracked properly on Appsignal.

image.png

Tracking handle_event events

We're going to track the handle_event lifecycle event. If you want you can track others like:

defmodule GamingWeb.Appsignal do
  @moduledoc false
  import Phoenix.LiveView
  import Appsignal.Phoenix.LiveView, only: [live_view_action: 5]

  def on_mount(:default, _params, _session, socket) do
    socket =
      attach_hook(socket, :mount_hook, :handle_event, fn
        event, params, socket ->
          live_view_action(socket.view, event, params, socket, fn ->
            {:cont, socket}
          end)
      end)

    {:cont, socket}
  end
end

And we're done. Here I'm tracking a simple form event named submit.

def handle_event("submit", %{"waitlist" => params}, socket) do
  {:noreply, socket}
end

image.png

 
Share this