freedive/lib/liliform/icon.ex

defmodule Liliform.Icon do
  @moduledoc """
  Bulma icon element.

  The icon element is a container for any type of icon font.
  Because the icons can take a few seconds to load,
  and because you want control over the space
  the icons will take, you can use the icon class
  as a reliable square container that will prevent
  the page to "jump" on page load.

  By default, the icon container will take up
  exactly 1.5rem x 1.5rem.

  The icon itself is sized accordingly to the icon library you're using.
  For example, Font Awesome 5 icons will inherit the font size.
  """
  use Liliform.Component
  alias Liliform.Colorhash
  alias Freedive.Features

  @doc """
  Renders an icon.

  ## For

  The icon name is set using the `for` attribute.

  ## Color

  Set color to `auto` to automatically choose/generate color
  based on the icon name.

  You can also set the color to any valid CSS color value.

  ## Size

  The icon size can be set using the `size` attribute.
  By default, the size is set to `1.5rem`.

  Example:

      <.icon for="home" />

      <.icon for="info" color="auto" />
      <.icon for="alert" color="#f44" />
      <.icon for="settings" color="blue" />
      <.icon for="error" color="hsl(0, 100%, 50%)" />

      <.icon for="info" size="2rem" />
  """
  attr :for, :string, required: true, doc: "icon name"
  attr :size, :string, default: nil, doc: "size of icon"
  attr :color, :string, default: nil, doc: "color of icon"
  attr :class, :string, default: "", doc: "additional classes"
  attr :rest, :global

  slot :inner_block, required: false

  def icon(assigns) do
    assigns =
      assigns
      |> set_bulma_classes()

    assigns =
      if assigns.size != nil do
        Map.put(assigns, :style, "width: #{assigns.size}; height: #{assigns.size};")
      else
        assigns
      end

    ~H"""
    <span class="icon-text">
      <span class={["icon", @class]} {@rest}>
        <.icon_svg for={@for} height={@size} width={@size} {icon_color(assigns)} />
      </span>
      <%= if @inner_block != [] do %>
        <span>
          <%= render_slot(@inner_block) %>
        </span>
      <% end %>
    </span>
    """
  end

  @doc """
  Renders an icon without the icon-text wrapper.
  """
  attr :for, :string, required: true, doc: "icon name"
  attr :size, :string, default: nil, doc: "size of icon"
  attr :color, :string, default: nil, doc: "color of icon"
  attr :rest, :global

  def icon_raw(assigns) do
    assigns =
      assigns
      |> set_bulma_classes()

    ~H"""
    <.icon_svg for={@for} height={@size} width={@size} {icon_color(assigns)} {@rest} />
    """
  end

  defp icon_svg(assigns) do
    base_assigns =
      assigns
      |> Map.reject(fn {k, _} -> k in [:for, :size, :rest] end)
      |> Map.reject(fn {k, v} -> k in [:color] and v == "" end)

    apply(Lucideicons, icon_name(assigns), [base_assigns])
  end

  defp icon_color(assigns) do
    if Features.enabled?(:colorhash) do
      color =
        case assigns.color do
          nil -> ""
          "auto" -> Colorhash.hsl(assigns.for)
          color -> color
        end

      auto_color =
        case assigns.for do
          "alert" -> [class: "has-text-danger"]
          "info" -> [class: "has-text-info"]
          "success" -> [class: "has-text-success"]
          "warning" -> [class: "has-text-warning"]
          "error" -> [class: "has-text-danger"]
          "all" -> [color: "magenta"]
          "compute" -> [color: "blue"]
          "storage" -> [color: "green"]
          "network" -> [color: "orange"]
          "system" -> [color: "purple"]
          "account" -> [color: "darkblue"]
          _ -> [color: color]
        end

      case color do
        "auto" ->
          auto_color

        "" ->
          []

        _ ->
          [color: color]
      end
    else
      [class: "has-text-dark"]
    end
  end

  defp icon_name(assigns) do
    name =
      assigns.for
      |> String.trim()
      |> String.downcase()
      |> String.replace("-", "_")

    case name do
      "alert" -> :triangle_alert
      "compute" -> :binary
      "storage" -> :hard_drive
      "network" -> :earth
      "system" -> :bot
      "account" -> :user
      "all" -> :infinity
      "pf" -> :shield
      "sshd" -> :lock
      "ntpdate" -> :clock
      "httpd" -> :globe
      "running" -> :circle_play
      "enabled" -> :circle_check
      lucide_name -> String.to_atom(lucide_name)
    end
  end
end