<%
# Social Sharing Component
#
# Usage:
#   render 'pwb/shared/social_sharing', url: request.original_url, title: @property_details.title
#
# Options:
#   url:        (required) The URL to share
#   title:      (required) The title/text to share
#   style:      :default (centered, border-top) or :bologna (left-aligned, no border)
#   networks:   Array of networks to show (default: [:facebook, :linkedin, :twitter, :whatsapp])
%>
<% url ||= request.original_url %>
<% title ||= '' %>
<% style ||= :default %>
<% networks ||= [:facebook, :linkedin, :twitter, :whatsapp] %>

<% encoded_url = ERB::Util.url_encode(url) %>
<% encoded_title = ERB::Util.url_encode(title) %>
<% encoded_both = ERB::Util.url_encode(title + ' ' + url) %>

<%
  # Define share URLs
  share_urls = {
    facebook: "https://www.facebook.com/sharer/sharer.php?u=#{encoded_url}&quote=#{encoded_title}",
    linkedin: "https://www.linkedin.com/shareArticle?mini=true&url=#{encoded_url}&title=#{encoded_title}",
    twitter: "https://twitter.com/intent/tweet?url=#{encoded_url}&text=#{encoded_title}",
    whatsapp: "https://wa.me/?text=#{encoded_both}"
  }

  # Map network to brand name (for X/Twitter)
  brand_names = {
    facebook: :facebook,
    linkedin: :linkedin,
    twitter: :x,
    whatsapp: :whatsapp
  }

  # Define link classes based on style
  if style == :bologna
    link_classes = {
      facebook: 'w-10 h-10 flex items-center justify-center bg-blue-100 text-blue-600 rounded-full hover:bg-blue-600 hover:text-white transition-all duration-300',
      linkedin: 'w-10 h-10 flex items-center justify-center bg-blue-100 text-blue-700 rounded-full hover:bg-blue-700 hover:text-white transition-all duration-300',
      twitter: 'w-10 h-10 flex items-center justify-center bg-sky-100 text-sky-500 rounded-full hover:bg-sky-500 hover:text-white transition-all duration-300',
      whatsapp: 'w-10 h-10 flex items-center justify-center bg-green-100 text-green-600 rounded-full hover:bg-green-600 hover:text-white transition-all duration-300'
    }
  else
    link_classes = {
      facebook: 'w-8 h-8 flex items-center justify-center text-blue-600 hover:text-blue-800',
      linkedin: 'w-8 h-8 flex items-center justify-center text-blue-700 hover:text-blue-900',
      twitter: 'w-8 h-8 flex items-center justify-center text-blue-400 hover:text-blue-600',
      whatsapp: 'w-8 h-8 flex items-center justify-center text-green-600 hover:text-green-800'
    }
  end

  # Define titles
  titles = {
    facebook: 'Share on Facebook',
    linkedin: 'Share on LinkedIn',
    twitter: 'Share on Twitter',
    whatsapp: 'Share on WhatsApp'
  }
%>

<% container_class = style == :bologna ? 'flex items-center gap-3' : 'flex justify-center gap-4 py-6 border-t border-gray-100' %>

<div class="<%= container_class %>">
  <% networks.each do |network| %>
    <a href="<%= share_urls[network] %>"
       target="_blank"
       rel="noopener noreferrer"
       title="<%= titles[network] %>"
       class="<%= link_classes[network] %>">
      <%= brand_icon(brand_names[network], size: style == :bologna ? 20 : 24) %>
    </a>
  <% end %>
</div>
