How to use the Heroicons in elixir(.ex) file

Phoenix Forum Questions / Help
, ,
1

I am trying to use the Heroicons in a private function of the liveview.
How can I use on those .ex files? It will work just for .html.hexx or ~h sigil?
sample:

  defp sort_indicator(column, %{sort_by: sort_by, sort_order: sort_order})
       when column == sort_by do
    case sort_order do
      :asc -> chevron_up(assigns)
      :desc -> chevron_down(assigns)
    end
  end

  defp chevron_up(assigns) do
    ~H"""
    <Heroicons.chevron_up />
    """
  end

  defp chevron_down(assigns) do
    ~H"""
    <Heroicons.chevron_down() />
    """
  end

errors:

(CompileError) undefined function assigns/0 (expected RldLiveViewStudioWeb.PizzaOrdersLive to define such a function or for it to be imported, but none are available)

I was trying before to use like this:

    case sort_order do
      :asc -> Heroicons.chevron_up()
      :desc -> Heroicons.chevron_down()
    end

But needs to alias or import the Heroicons.
It’s possible to do that?

2

The compiler is complaining about this part - inside the case, you’re referencing a name assigns that hasn’t been bound in this function. Maybe this is what you intended?

  defp sort_indicator(column, %{sort_by: sort_by, sort_order: sort_order} = assigns)
       when column == sort_by do
    case sort_order do
      :asc -> chevron_up(assigns)

This binds assigns in the function head and passes it along to the chevrons.

3

it complains to this:

no function clause matching in RldLiveViewStudioWeb.PizzaOrdersLive.sort_indicator/2

It worked doing this:

def sort_link(assigns) do
    ~H"""
    <.link patch={
      ~p"/pizza-orders?#{%{sort_by: @sort_by, sort_order: next_sort_order(@options.sort_order)}}"
    }>
      <%= render_slot(@inner_block) %>
      <%= sort_indicator(@sort_by, @options, assigns) %>
    </.link>
    """
  end

defp sort_indicator(column, %{sort_by: sort_by, sort_order: sort_order}, assigns)
       when column == sort_by do
    case sort_order do
      :asc -> chevron_up(assigns)
      :desc -> chevron_down(assigns)
    end
  end

  defp sort_indicator(_, _, _), do: ""

 defp chevron_up(assigns) do
    ~H"""
    <Heroicons.chevron_up solid class="w-4 h-4" />
    """
  end

  defp chevron_down(assigns) do
    ~H"""
    <Heroicons.chevron_down solid class="w-4 h-4" />
    """
  end
4 
defp sort_indicator(column, %{sort_by: sort_by, sort_order: sort_order}, assigns)
                                                   this should be an = ^
5

I would like to know how to put this:

      <%= render_slot(@inner_block) %>
      <%= sort_indicator(@sort_by, @options, assigns) %>

using like inline-block together.
it is possible?

6

thank you for your help @al2o3cr

7

sorry, but I tried using pattern match there with assigns and this is the params and it complains to no function clause matching.
So the correct is to put the assigns with the comma(,).