Sections

module Spree
  module PageSections
    class Testimonials < Spree::PageSection
      # Override default padding if needed
      TOP_PADDING_DEFAULT = 60
      BOTTOM_PADDING_DEFAULT = 60

      # Define section-specific preferences
      preference :heading, :string, default: 'What Our Customers Say'
      preference :heading_size, :string, default: 'large'
      preference :heading_alignment, :string, default: 'center'
      preference :max_testimonials, :integer, default: 3
      preference :show_rating, :boolean, default: true

      # Validation for preferences
      before_validation :ensure_valid_heading_size
      before_validation :ensure_valid_alignment

      # Icon displayed in the Page Builder sidebar
      def icon_name
        'quote'
      end

      # Define default blocks that are created with this section
      def default_blocks
        @default_blocks.presence || [
          Spree::PageBlocks::Heading.new(
            text: preferred_heading,
            preferred_text_alignment: preferred_heading_alignment
          )
        ]
      end

      # Which block types can be added to this section
      def available_blocks_to_add
        [
          Spree::PageBlocks::Heading,
          Spree::PageBlocks::Text
        ]
      end

      # Enable block management in admin
      def blocks_available?
        true
      end

      # Allow reordering blocks
      def can_sort_blocks?
        true
      end

      private

      def ensure_valid_heading_size
        self.preferred_heading_size = 'medium' unless %w[small medium large].include?(preferred_heading_size)
      end

      def ensure_valid_alignment
        self.preferred_heading_alignment = 'center' unless %w[left center right].include?(preferred_heading_alignment)
      end
    end
  end
end

Rails.application.config.after_initialize do
  Spree.page_builder.page_sections += [
    Spree::PageSections::Testimonials
  ]
end

<div class="form-group">
  <%= f.label :preferred_heading, Spree.t(:heading) %>
  <%= f.text_field :preferred_heading,
      class: 'form-control',
      data: { action: 'auto-submit#submit' } %>
</div>

<div class="form-group">
  <%= f.label :preferred_heading_size, Spree.t(:heading_size) %>
  <%= f.select :preferred_heading_size,
      options_for_select([
        [Spree.t(:small), 'small'],
        [Spree.t(:medium), 'medium'],
        [Spree.t(:large), 'large']
      ], @page_section.preferred_heading_size),
      {},
      { class: 'custom-select', data: { action: 'auto-submit#submit' } } %>
</div>

<div class="form-group">
  <%= f.label :preferred_heading_alignment, Spree.t(:alignment) %>
  <%= f.select :preferred_heading_alignment,
      options_for_select([
        [Spree.t(:left), 'left'],
        [Spree.t(:center), 'center'],
        [Spree.t(:right), 'right']
      ], @page_section.preferred_heading_alignment),
      {},
      { class: 'custom-select', data: { action: 'auto-submit#submit' } } %>
</div>

<div class="form-group">
  <%= f.label :preferred_max_testimonials, Spree.t(:max_items) %>
  <%= f.number_field :preferred_max_testimonials,
      class: 'form-control',
      min: 1,
      max: 10,
      data: { action: 'auto-submit#submit' } %>
</div>

<div class="custom-control custom-checkbox mb-3">
  <%= f.check_box :preferred_show_rating,
      class: 'custom-control-input',
      data: { action: 'auto-submit#submit' } %>
  <%= f.label :preferred_show_rating, Spree.t(:show_rating), class: 'custom-control-label' %>
</div>

<%# Add design settings to the Design tab %>
<% content_for(:design_tab) do %>
  <hr />
<% end %>

<% cache_unless page_builder_enabled?, spree_storefront_base_cache_scope.call(section) do %>
  <div style="<%= section_styles(section) %>" class="testimonials-section">
    <div class="page-container">
      <%# Heading %>
      <% if section.preferred_heading.present? %>
        <%
          heading_class = case section.preferred_heading_size
                          when 'small' then 'text-lg'
                          when 'medium' then 'text-xl lg:text-2xl'
                          when 'large' then 'text-2xl lg:text-3xl'
                          end
        %>
        <h2 class="<%= heading_class %> font-medium mb-8 text-<%= section.preferred_heading_alignment %>">
          <%= section.preferred_heading %>
        </h2>
      <% end %>

      <%# Render blocks %>
      <% section.blocks.includes(:rich_text_text).each do |block| %>
        <% case block.type %>
        <% when 'Spree::PageBlocks::Heading' %>
          <h3 class="text-xl font-medium" <%= block_attributes(block) %>>
            <%= block.text %>
          </h3>
        <% when 'Spree::PageBlocks::Text' %>
          <div class="prose" <%= block_attributes(block) %>>
            <%= block.text %>
          </div>
        <% end %>
      <% end %>

      <%# Your custom testimonials content %>
      <div class="grid grid-cols-1 md:grid-cols-<%= section.preferred_max_testimonials %> gap-6">
        <%# Add your testimonials rendering logic here %>
      </div>
    </div>
  </div>
<% end %>

module Spree
  module PageSections
    class HeroBanner < Spree::PageSection
      include Spree::HasImageAltText

      preference :image_alt, :string

      def icon_name
        'photo'
      end
    end
  end
end

<%= render 'spree/admin/shared/page_section_image', f: f %>

<div class="form-group">
  <%= f.label :preferred_image_alt, Spree.t(:alt_text) %>
  <%= f.text_field :preferred_image_alt,
      class: 'form-control',
      data: { action: 'auto-submit#submit' } %>
</div>

en:
  spree:
    page_sections:
      testimonials:
        heading_default: "What Our Customers Say"
        text_default: "Read reviews from our happy customers"