I have some components that will be used in multiple routes, these components need to generate link to other routes, but these links change depending on the liveview they were loaded.

For example, if my liveview route is “/myroute”, then the component would generate a route like “/myroute/something”.

To achieve this, what I tried to do was pass a prefix_url field to the component with the “/myroute” part of the route, and then the component itself would concat with the “/something” part.

This works fine, but if I try to use verified routes with it, it will start generating warnings.

This is a small example of what I’m trying to do:

defmodule CoreWeb.Components.MyComponent do
  use CoreWeb, :html

  attr :prefix_url, :string

  def render(assigns) do
    ~H"""
    <button phx-click={~p"#{@prefix_url}/something"}></button>
    """
  end
end

defmodule CoreWeb.Live.Trash.Blibs do
  use CoreWeb, :live_view

  def mount(_, _, socket), do: {:ok, socket}

  def render(assigns) do
    ~H"""
    <div>
      <CoreWeb.Components.MyComponent.render prefix_url={~p"/blibs"} />
    </div>
    """
  end
end

This will generate the following compilation error:

== Compilation error in file lib/core_web/live/trash/blibs.ex ==
** (ArgumentError) paths must begin with /, got: "#{assigns.prefix_url}/something"
    (phoenix 1.7.7) lib/phoenix/verified_routes.ex:548: Phoenix.VerifiedRoutes.verify_segment/2
    (phoenix 1.7.7) lib/phoenix/verified_routes.ex:734: Phoenix.VerifiedRoutes.rewrite_path/4
    (phoenix 1.7.7) lib/phoenix/verified_routes.ex:720: Phoenix.VerifiedRoutes.build_route/5
    (phoenix 1.7.7) expanding macro: Phoenix.VerifiedRoutes.sigil_p/2
    lib/core_web/live/trash/blibs.ex:8: CoreWeb.Components.MyComponent.render/1
    (phoenix_live_view 0.20.0) expanding macro: Phoenix.Component.sigil_H/2
    lib/core_web/live/trash/blibs.ex:7: CoreWeb.Components.MyComponent.render/1

If I change the button link to this:

<button phx-click={~p"/#{@prefix_url}/something"}></button>

Now it returns the following warning:

warning: no route path for CoreWeb.Router matches "/#{assigns.prefix_url}/something"
  lib/core_web/live/trash/blibs.ex:8: CoreWeb.Components.MyComponent.render/1

Of course, I can just remove the ~p and it will work fine, but I would prefer to keep using verified routes in this case.

Is there any workaround to make this work?