* WIP - started improving handling of sorting for sources index table * WIP - Added UI to table to indicate sort column and direction * Refactored toggle liveview into a livecomponent * Added sorting for all table attrs * Added pagination to the sources table * Added tests for updated liveviews and live components * Add tests for new helper methods * Added fancy new CSS to my sources table * Added size to sources table * Adds relative div to ensure that sorting arrow doesn't run away * Fixed da tests
149 lines
3.7 KiB
Elixir
149 lines
3.7 KiB
Elixir
defmodule PinchflatWeb.CustomComponents.TextComponents do
|
|
@moduledoc false
|
|
use Phoenix.Component
|
|
|
|
alias Pinchflat.Utils.NumberUtils
|
|
alias PinchflatWeb.CoreComponents
|
|
|
|
@doc """
|
|
Renders a code block with the given content.
|
|
"""
|
|
slot :inner_block
|
|
|
|
def inline_code(assigns) do
|
|
~H"""
|
|
<code class="inline-block text-sm font-mono text-gray bg-boxdark rounded-md p-0.5 mx-0.5 text-nowrap">
|
|
{render_slot(@inner_block)}
|
|
</code>
|
|
"""
|
|
end
|
|
|
|
@doc """
|
|
Renders a reference link with the given href and content.
|
|
"""
|
|
attr :href, :string, required: true
|
|
slot :inner_block
|
|
|
|
def inline_link(assigns) do
|
|
~H"""
|
|
<.link href={@href} target="_blank" class="text-blue-500 hover:text-blue-300">
|
|
{render_slot(@inner_block)}
|
|
</.link>
|
|
"""
|
|
end
|
|
|
|
@doc """
|
|
Renders a subtle link with the given href and content.
|
|
"""
|
|
attr :href, :string, required: true
|
|
attr :target, :string, default: "_self"
|
|
slot :inner_block
|
|
|
|
def subtle_link(assigns) do
|
|
~H"""
|
|
<.link href={@href} target={@target} class="underline decoration-bodydark decoration-1 hover:decoration-white">
|
|
{render_slot(@inner_block)}
|
|
</.link>
|
|
"""
|
|
end
|
|
|
|
@doc """
|
|
Renders an icon as a link with the given href.
|
|
"""
|
|
attr :href, :string, required: true
|
|
attr :icon, :string, required: true
|
|
attr :class, :string, default: ""
|
|
|
|
def icon_link(assigns) do
|
|
~H"""
|
|
<.link href={@href} class={["hover:text-secondary duration-200 ease-in-out", @class]}>
|
|
<CoreComponents.icon name={@icon} />
|
|
</.link>
|
|
"""
|
|
end
|
|
|
|
@doc """
|
|
Renders a block of text with each line broken into a separate span and links highlighted.
|
|
"""
|
|
attr :text, :string, required: true
|
|
|
|
def render_description(assigns) do
|
|
formatted_text =
|
|
Regex.split(~r{https?://\S+}, assigns.text, include_captures: true)
|
|
|> Enum.map(fn
|
|
"http" <> _ = url ->
|
|
Phoenix.HTML.Tag.content_tag(:a, url, class: "text-blue-500 hover:text-blue-300", href: url, target: "_blank")
|
|
|
|
text ->
|
|
text
|
|
|> String.split("\n", trim: false)
|
|
|> Enum.intersperse(Phoenix.HTML.Tag.tag(:span, class: "inline-block mt-2"))
|
|
end)
|
|
|
|
assigns = Map.put(assigns, :text, formatted_text)
|
|
|
|
~H"""
|
|
<span>{@text}</span>
|
|
"""
|
|
end
|
|
|
|
@doc """
|
|
Renders a UTC datetime in the specified format and timezone
|
|
"""
|
|
attr :datetime, :any, required: true
|
|
attr :format, :string, default: "%Y-%m-%d %H:%M:%S"
|
|
attr :timezone, :string, default: nil
|
|
|
|
def datetime_in_zone(assigns) do
|
|
timezone = assigns.timezone || Application.get_env(:pinchflat, :timezone)
|
|
assigns = Map.put(assigns, :timezone, timezone)
|
|
|
|
~H"""
|
|
<time>{Calendar.strftime(Timex.Timezone.convert(@datetime, @timezone), @format)}</time>
|
|
"""
|
|
end
|
|
|
|
@doc """
|
|
Renders a localized number using the Intl.NumberFormat API, falling back to the raw number if needed
|
|
"""
|
|
attr :number, :any, required: true
|
|
|
|
def localized_number(assigns) do
|
|
~H"""
|
|
<span x-data x-text={"Intl.NumberFormat().format(#{@number})"}>{@number}</span>
|
|
"""
|
|
end
|
|
|
|
@doc """
|
|
Renders a word with a suffix if the count is not 1
|
|
"""
|
|
attr :word, :string, required: true
|
|
attr :count, :integer, required: true
|
|
attr :suffix, :string, default: "s"
|
|
|
|
def pluralize(assigns) do
|
|
~H"""
|
|
{@word}{if @count == 1, do: "", else: @suffix}
|
|
"""
|
|
end
|
|
|
|
@doc """
|
|
Renders a human-readable byte size
|
|
"""
|
|
|
|
attr :byte_size, :integer, required: true
|
|
|
|
def readable_filesize(assigns) do
|
|
{num, suffix} = NumberUtils.human_byte_size(assigns.byte_size, precision: 2)
|
|
|
|
assigns =
|
|
Map.merge(assigns, %{
|
|
num: num,
|
|
suffix: suffix
|
|
})
|
|
|
|
~H"""
|
|
<.localized_number number={@num} /> {@suffix}
|
|
"""
|
|
end
|
|
end
|