Class: Railsboot::AvatarComponent

Inherits:
Component
  • Object
show all
Defined in:
app/components/railsboot/avatar_component.rb

Overview

ViewComponent: renders the avatar block.

Constant Summary collapse

SHAPES =

Shapes.

%w[circle rounded square].freeze
DEFAULT_SHAPE =

Default shape.

"circle".freeze
DEFAULT_SIZE =

Default size.

32
COLORS =

Colors.

%w[primary secondary light dark].freeze
DEFAULT_COLOR =

Default color.

"primary".freeze

Instance Method Summary collapse

Constructor Details

#initialize(src: "", letter: "", alt: "", shape: DEFAULT_SHAPE, size: DEFAULT_SIZE, color: DEFAULT_COLOR, href: "", **html_attributes) ⇒ AvatarComponent

Returns a new instance of AvatarComponent.



17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
 
# File 'app/components/railsboot/avatar_component.rb', line 17

def initialize(src: "", letter: "", alt: "", shape: DEFAULT_SHAPE, size: DEFAULT_SIZE, color: DEFAULT_COLOR, href: "", **html_attributes)
  @alt = alt
  @shape = fetch_or_raise(shape, SHAPES)
  @size = size
  @color = fetch_or_raise(color, COLORS)
  @letter = letter
  @src = src.presence || letter_to_svg_base64(letter)
  # When src and letter are both supplied, keep the letter SVG as a
  # client-side fallback so a broken remote image (e.g. ImageKit 404)
  # degrades to initials instead of overflowing alt text.
  @fallback_src = src.present? && letter.present? ? letter_to_svg_base64(letter) : nil
  @href = href
  @html_attributes = html_attributes

  @html_attributes[:class] = class_names(
    "position-relative",
    "d-inline-block",
    "bg-#{@color}",
    radius_class,
    html_attributes.delete(:class)
  )

  @html_attributes[:style] = [
    html_attributes[:style],
    "width: #{@size}px; height: #{@size}px; box-sizing: content-box; overflow: hidden; vertical-align: middle;"
  ].compact.join(" ")
end

Instance Method Details

#image_data_attributes ⇒ Object 



45
46
47
48
49
 
# File 'app/components/railsboot/avatar_component.rb', line 45

def image_data_attributes
  return {} unless @fallback_src

  { controller: "avatar-fallback", avatar_fallback_src_value: @fallback_src }
end

#letter_to_svg_base64(letter = "") ⇒ Object (protected) 



66
67
68
69
70
71
72
73
74
75
76
77
 
# File 'app/components/railsboot/avatar_component.rb', line 66

def letter_to_svg_base64(letter = "")
  font_color = @color === "light" ? "black" : "white"
  svg_content = <<~SVG
    <svg width="100" height="100" xmlns="http://www.w3.org/2000/svg">
      <text x="50%" y="50%" alignment-baseline="middle" text-anchor="middle" font-family="Arial" font-size="40" dy=".1em" dominant-baseline="middle" fill="#{font_color}">
        #{letter}
      </text>
    </svg>
  SVG

  "data:image/svg+xml;base64,#{Base64.strict_encode64(svg_content)}"
end

#link? ⇒ Boolean

Returns:

  • (Boolean) 


60
61
62
 
# File 'app/components/railsboot/avatar_component.rb', line 60

def link?
  @href.present?
end

#radius_class ⇒ Object 



51
52
53
54
55
56
57
58
 
# File 'app/components/railsboot/avatar_component.rb', line 51

def radius_class
  shape_classes = {
    "circle" => "rounded-circle",
    "rounded" => "rounded-4",
    "square" => "rounded-0"
  }
  shape_classes[@shape]
end