Phoenix component does not accept || operator?

Hi, I have a statless component in LiveView like this:

  attr :block_id, :string, required: true
  attr :custom_class, :string, required: false, default: "layout-icons"
  attr :on_click, JS, default: %JS{}

  @spec block_settings(map) :: Phoenix.LiveView.Rendered.t()
  defp block_settings(assigns) do
    ~H"""
    <Heroicons.wrench_screwdriver class={@custom_class} />
    """
  end

If I do this like the above code, it works.

But if I want to change it like this, it does not work, and I get key :custom_class not found in::

  attr :block_id, :string, required: true
  attr :custom_class, :string, required: false
  attr :on_click, JS, default: %JS{}

  @spec block_settings(map) :: Phoenix.LiveView.Rendered.t()
  defp block_settings(assigns) do
    ~H"""
    <Heroicons.wrench_screwdriver class={@custom_class || "layout-icons"} />
    """
  end

Am I in a wrong way, or it has the bug?

Update

It is phoenix component, I always make this mistake, sorry for title

You probably want to add default: nil to the second one

1 Like

When I IO.inspect this in my component, it prints nil by default

@mayel is correct. You either need to initiailize the assign with assign_new or set a default value before accessing it.

1 Like