avo 2.48.0 → 3.0.0.beta1

data/app/components/avo/index/resource_controls_component.html.erb

@@ -1,83 +1,5 @@
-<div class="space-x-2 flex flex-row justify-around w-full">
-  <% button_classes = "text-gray-600 h-6 hover:text-gray-600" %>
-
-  <% if can_reorder? %>
-    <%= render Avo::Index::Ordering::ButtonsComponent.new resource: @resource, reflection: @reflection, view_type: @view_type %>
-  <% end %>
-
-  <% if can_view? %>
-    <%= link_to helpers.svg('eye', class: button_classes),
-      show_path,
-      class: 'flex items-center',
-      title: t('avo.view_item', item: singular_resource_name).humanize,
-      data: {
-        target: 'control:view',
-        control: :show,
-        'tippy': 'tooltip',
-      }
-    %>
-  <% end %>
-
-  <% if can_edit? %>
-    <%= link_to helpers.svg('edit', class: button_classes),
-      edit_path,
-      class: 'flex items-center',
-      title: t('avo.edit_item', item: singular_resource_name).humanize,
-      data: {
-        target: 'control:edit',
-        control: :edit,
-        'resource-id': @resource.model.id,
-        'tippy': 'tooltip',
-      }
-      %>
-  <% end %>
-
-  <% if can_detach? %>
-    <%= form_with url: helpers.resource_detach_path(params[:resource_name], params[:id], params[:related_name], @resource.model.id),
-      method: :delete,
-      local: true,
-      class: 'flex items-center',
-      html: {
-        'data-turbo-frame': params[:turbo_frame]
-      } do |form| %>
-      <%= form.button helpers.svg('detach', class: button_classes),
-        title: t('avo.detach_item', item: singular_resource_name).humanize,
-        type: :submit,
-        data: {
-          target: 'control:detach',
-          turbo_confirm: t('avo.are_you_sure_detach_item', item: singular_resource_name),
-          control: :detach,
-          'resource-id': @resource.model.id,
-          'tippy': 'tooltip',
-        }
-      %>
-      <%= hidden_field_tag :turbo_frame, params[:turbo_frame], id: "turbo_frame_detach_#{@resource.model.id}" if params[:turbo_frame] %>
-      <%= hidden_field_tag :referrer, referrer_path, id: "referrer_detach_#{@resource.model.id}" if params[:turbo_frame] %>
-    <% end %>
-  <% end %>
-
-  <% if can_delete? %>
-    <%= form_with url: helpers.resource_path(model: @resource.model, resource: @resource),
-      method: :delete,
-      class: 'flex items-center',
-      local: true,
-      html: {
-        'data-turbo-frame': params[:turbo_frame]
-      } do |form| %>
-      <%= form.button helpers.svg('trash', class: button_classes),
-        title: t('avo.delete_item',  item: singular_resource_name).humanize,
-        type: :submit,
-        data: {
-          target: 'control:destroy',
-          turbo_confirm: t('avo.are_you_sure',  item: singular_resource_name),
-          control: :destroy,
-          'resource-id': @resource.model.id,
-          'tippy': 'tooltip',
-        }
-      %>
-      <%= form.hidden_field :view_type, value: params[:view_type], id: "turbo_view_type_#{@resource.model.id}" if params[:view_type] %>
-      <%= form.hidden_field :turbo_frame, value: params[:turbo_frame], id: "turbo_frame_destroy_#{@resource.model.id}" if params[:turbo_frame] %>
-      <%= form.hidden_field :referrer, value: referrer_path, id: "referrer_destroy_#{@resource.model.id}" if params[:turbo_frame] %>
-    <% end %>
+<div class="space-x-2 flex flex-row justify-end w-full">
+  <% @resource.render_row_controls(item: singular_resource_name).each do |control| %>
+    <%= render_control control %>
   <% end %>
 </div>

data/app/components/avo/index/resource_controls_component.rb

@@ -1,12 +1,15 @@
 # frozen_string_literal: true
 
 class Avo::Index::ResourceControlsComponent < Avo::ResourceComponent
-  def initialize(resource: nil, reflection: nil, parent_model: nil, parent_resource: nil, view_type: :table)
+  include Avo::ApplicationHelper
+
+  def initialize(resource: nil, reflection: nil, parent_record: nil, parent_resource: nil, view_type: :table, actions: nil)
     @resource = resource
     @reflection = reflection
-    @parent_model = parent_model
+    @parent_record = parent_record
     @parent_resource = parent_resource
     @view_type = view_type
+    @actions = actions
   end
 
   def can_detach?
@@ -28,37 +31,31 @@ class Avo::Index::ResourceControlsComponent < Avo::ResourceComponent
     @resource.authorization.authorize_action(:show, raise_exception: false)
   end
 
-  def can_reorder?
-    return authorize_association_for(:reorder) if @reflection.present?
-
-    @resource.authorization.authorize_action(:reorder, raise_exception: false)
-  end
-
   def show_path
     args = {}
 
-    if @parent_model.present?
+    if @parent_record.present?
       args = {
         via_resource_class: parent_resource.class.to_s,
-        via_resource_id: @parent_model.to_param
+        via_record_id: @parent_record.to_param
       }
     end
 
-    helpers.resource_path(model: @resource.model, resource: parent_or_child_resource , **args)
+    helpers.resource_path(record: @resource.record, resource: parent_or_child_resource, **args)
   end
 
   def edit_path
     # Add the `view` param to let Avo know where to redirect back when the user clicks the `Cancel` button.
     args = {via_view: "index"}
 
-    if @parent_model.present?
+    if @parent_record.present?
       args = {
         via_resource_class: parent_resource.class.to_s,
-        via_resource_id: @parent_model.to_param
+        via_record_id: @parent_record.to_param
       }
     end
 
-    helpers.edit_resource_path(model: @resource.model, resource: parent_or_child_resource, **args)
+    helpers.edit_resource_path(record: @resource.record, resource: parent_or_child_resource, **args)
   end
 
   def singular_resource_name
@@ -71,9 +68,9 @@ class Avo::Index::ResourceControlsComponent < Avo::ResourceComponent
 
   def parent_resource
     return @parent_resource if @parent_resource.present?
-    return nil if @parent_model.blank?
+    return nil if @parent_record.blank?
 
-    ::Avo::App.get_resource_by_model_name @parent_model.class
+    Avo.resource_manager.get_resource_by_model_class @parent_record.class
   end
 
   def is_has_many_association?
@@ -81,6 +78,116 @@ class Avo::Index::ResourceControlsComponent < Avo::ResourceComponent
   end
 
   def referrer_path
-    Avo::App.root_path(paths: ["resources", params[:resource_name], params[:id], params[:related_name]], query: request.query_parameters.to_h)
+    Avo.root_path(paths: ["resources", params[:resource_name], params[:id], params[:related_name]], query: request.query_parameters.to_h)
+  end
+
+  def can_reorder?
+    return false unless Object.const_defined? "Avo::Pro::Ordering"
+
+    return authorize_association_for(:reorder) if @reflection.present?
+
+    @resource.authorization.authorize_action(:reorder, raise_exception: false)
+  end
+
+  private
+
+  def render_edit_button(control)
+    return unless can_edit?
+
+    link_to helpers.svg("edit", class: svg_classes),
+      edit_path,
+      class: "flex items-center",
+      title: control.title,
+      data: {
+        target: "control:edit",
+        control: :edit,
+        "resource-id": @resource.record.id,
+        tippy: "tooltip",
+      }
+  end
+
+  def render_show_button(control)
+    return unless can_view?
+
+    link_to helpers.svg("eye", class: svg_classes),
+      show_path,
+      class: "flex items-center",
+      title: control.title,
+      data: {
+        target: "control:view",
+        control: :show,
+        tippy: "tooltip",
+      }
+  end
+
+  def render_delete_button(control)
+    # If the resource is a related resource, we use the can_delete? policy method because it uses
+    # authorize_association_for(:destroy).
+    # Otherwise we use the can_see_the_destroy_button? policy method becuse it do no check for assiciation
+    # only for authorize_action .
+    policy_method = is_a_related_resource? ? :can_delete? : :can_see_the_destroy_button?
+    return unless send policy_method
+
+    a_button url: helpers.resource_path(record: @resource.record, resource: @resource),
+      style: :icon,
+      color: :gray,
+      icon: "trash",
+      form_class: "flex flex-col sm:flex-row sm:inline-flex",
+      title: control.title,
+      method: :delete,
+      params: hidden_params,
+      data: {
+        turbo_frame: params[:turbo_frame],
+        turbo_confirm: control.confirmation_message,
+        turbo_method: :delete,
+        target: "control:destroy",
+        control: :destroy,
+        tippy: control.title ? :tooltip : nil,
+        "resource-id": @resource.record.id,
+      }
+  end
+
+  def render_detach_button(control)
+    return unless can_detach?
+
+    a_button url: helpers.resource_detach_path(params[:resource_name], params[:id], params[:related_name], @resource.record.id),
+      style: :icon,
+      color: :gray,
+      icon: "detach",
+      form_class: "flex items-center",
+      title: control.title,
+      method: :delete,
+      params: hidden_params,
+      data: {
+        turbo_frame: params[:turbo_frame],
+        turbo_confirm: control.confirmation_message,
+        target: "control:detach",
+        control: :detach,
+        "resource-id": @resource.record.id,
+        tippy: :tooltip,
+      }
+  end
+
+  def render_order_controls(control)
+    if can_reorder?
+      render Avo::Pro::Ordering::ButtonsComponent.new resource: @resource, reflection: @reflection, view_type: @view_type
+    end
+  end
+
+  def svg_classes
+    "text-gray-600 h-6 hover:text-gray-600"
+  end
+
+  def hidden_params
+    hidden = {}
+
+    hidden[:view_type] = params[:view_type] if params[:view_type]
+
+    if params[:turbo_frame]
+      hidden[:turbo_frame] = params[:turbo_frame]
+      hidden[:referrer] = referrer_path
+    end
+
+    hidden
   end
 end

data/app/components/avo/index/resource_grid_component.html.erb

@@ -1,14 +1,16 @@
 <% if @resources.present?%>
   <div class="w-full grid grid-cols-1 xs:grid-cols-2 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-6 gap-6 mt-8"
+  data-component-name="<%= self.class.to_s.underscore %>"
   data-selected-resources-name="<%= @resource.model_key %>" data-selected-resources="[]">
     <% @resources.each_with_index do |resource, index| %>
-      <% cache_if Avo.configuration.cache_resources_on_index_view, resource.cache_hash(@parent_model) do %>
-        <%= render(Avo::Index::GridItemComponent.new(resource: resource, reflection: @reflection, parent_model: @parent_model, parent_resource: @parent_resource)) %>
+      <% cache_if Avo.configuration.cache_resources_on_index_view, resource.cache_hash(@parent_record) do %>
+        <%= render(Avo::Index::GridItemComponent.new(resource: resource, reflection: @reflection, parent_record: @parent_record, parent_resource: @parent_resource, actions: actions)) %>
       <% end %>
     <% end %>
   </div>
 <% else %>
-  <div class="bg-white rounded shadow-panel">
+  <div class="bg-white rounded shadow-panel"
+    data-component-name="<%= self.class.to_s.underscore %>">
     <%= helpers.empty_state by_association: params[:related_name].present?, view_type: :grid %>
   </div>
 <% end %>

data/app/components/avo/index/resource_grid_component.rb

@@ -1,11 +1,14 @@
 # frozen_string_literal: true
 
 class Avo::Index::ResourceGridComponent < ViewComponent::Base
-  def initialize(resources: nil, resource: nil, reflection: nil, parent_model: nil, parent_resource: nil)
+  attr_reader :actions
+
+  def initialize(resources: nil, resource: nil, reflection: nil, parent_record: nil, parent_resource: nil, actions: nil)
     @resources = resources
     @resource = resource
     @reflection = reflection
-    @parent_model = parent_model
+    @parent_record = parent_record
     @parent_resource = parent_resource
+    @actions = actions
   end
 end

data/app/components/avo/index/resource_map_component.html.erb

@@ -5,7 +5,7 @@
     </div>
     <% if render_table? %>
       <div class="overflow-auto <%= table_component_order_class %>">
-        <%= render(Avo::Index::ResourceTableComponent.new(resources: @resources, resource: @resource, reflection: @reflection, parent_model: @parent_model, parent_resource: @parent_resource, pagy: @pagy, query: @query)) %>
+        <%= render(Avo::Index::ResourceTableComponent.new(resources: @resources, resource: @resource, reflection: @reflection, parent_record: @parent_record, parent_resource: @parent_resource, pagy: @pagy, query: @query)) %>
       </div>
     <% end %>
   </div>

data/app/components/avo/index/resource_map_component.rb

@@ -7,12 +7,12 @@ module Avo
     class ResourceMapComponent < ViewComponent::Base
       attr_reader :resources
 
-      def initialize(resources: nil, resource: nil, reflection: nil, parent_model: nil, parent_resource: nil, pagy: nil, query: nil)
+      def initialize(resources: nil, resource: nil, reflection: nil, parent_record: nil, parent_resource: nil, pagy: nil, query: nil)
         super
         @resources = resources
         @resource = resource
         @reflection = reflection
-        @parent_model = parent_model
+        @parent_record = parent_record
         @parent_resource = parent_resource
         @pagy = pagy
         @query = query
@@ -66,7 +66,7 @@ module Avo
 
         resources
           .map do |resource|
-            Avo::Hosts::ResourceRecordHost.new(block: marker_proc, resource: resource, record: resource.record).handle
+            Avo::ExecutionContext.new(target: marker_proc, record: resource.record).handle
           end
           .compact
           .filter do |coordinates|

data/app/components/avo/index/resource_table_component.html.erb

@@ -1,4 +1,5 @@
 <div class="w-full relative overflow-auto mac-styled-scrollbar"
+  data-component-name="<%= self.class.to_s.underscore %>"
   data-controller="item-select-all"
   data-resource-name="<%= @resource.model_key %>"
   data-item-select-all-selected-all-value="false"
@@ -11,7 +12,7 @@
     <div class="absolute z-30 w-full ml-10 pt-px hidden" data-item-select-all-target="selectAllOverlay">
       <div class="bg-white flex items-center h-9 mt-0.5">
         <div class="mt-1.5" data-item-select-all-target="unselectedMessage">
-          <%= selected_page_label %>
+          <%= t "avo.x_records_selected_from_a_total_of_x_html", selected: pagy.in, count: pagy.count %>
           <%= a_link request.url,
             size: :xs,
             color: :primary,
@@ -22,7 +23,7 @@
           <% end %>
         </div>
         <div class="mt-1.5" data-item-select-all-target="selectedMessage" class="hidden">
-          <%= selected_all_label %>
+          <%= t "avo.x_records_selected_from_all_pages_html", count: pagy.count %>
           <%= a_link request.url,
             size: :xs,
             color: :primary,
@@ -39,8 +40,8 @@
     <%= render partial: 'avo/partials/table_header', locals: {fields: @resource.get_fields(reflection: @reflection, only_root: true)} %>
     <tbody class="divide-y">
       <% @resources.each_with_index do |resource, index| %>
-        <% cache_if Avo.configuration.cache_resources_on_index_view, resource.cache_hash(@parent_model), expires_in: 1.day do %>
-          <%= render Avo::Index::TableRowComponent.new(resource: resource, reflection: @reflection, parent_model: @parent_model, parent_resource: @parent_resource) %>
+        <% cache_if Avo.configuration.cache_resources_on_index_view, resource.cache_hash(@parent_record), expires_in: 1.day do %>
+          <%= render Avo::Index::TableRowComponent.new(resource: resource, reflection: @reflection, parent_record: @parent_record, parent_resource: @parent_resource, actions: @actions) %>
         <% end %>
       <% end %>
     </tbody>

data/app/components/avo/index/resource_table_component.rb

@@ -4,38 +4,32 @@ class Avo::Index::ResourceTableComponent < ViewComponent::Base
   include Avo::ApplicationHelper
   attr_reader :pagy, :query
 
-  def initialize(resources: nil, resource: nil, reflection: nil, parent_model: nil, parent_resource: nil, pagy: nil, query: nil)
+  def initialize(resources: nil, resource: nil, reflection: nil, parent_record: nil, parent_resource: nil, pagy: nil, query: nil, actions: nil)
     @resources = resources
     @resource = resource
     @reflection = reflection
-    @parent_model = parent_model
+    @parent_record = parent_record
     @parent_resource = parent_resource
     @pagy = pagy
     @query = query
+    @actions = actions
   end
 
   def encrypted_query
-    return :select_all_disabled if query.nil? || !query.respond_to?(:all) || !query.all.respond_to?(:to_sql)
+    # TODO: move this to the resource where we can apply the adapter pattern
+    serialized_query = if Module.const_defined?("Ransack::Search") && query.instance_of?(Ransack::Search)
+      query.context.object.to_sql
+    else
+      return :select_all_disabled if query.nil? || !query.respond_to?(:all) || !query.all.respond_to?(:to_sql)
+
+      query.all.to_sql
+    end
+
+    return if serialized_query.nil?
 
     Avo::Services::EncryptionService.encrypt(
-      message: query.all.to_sql,
+      message: serialized_query,
       purpose: :select_all
     )
   end
-
-  def selected_page_label
-    if @resource.pagination_type.countless?
-      t "avo.x_records_selected_from_page_html", selected: pagy.in
-    else
-      t "avo.x_records_selected_from_a_total_of_x_html", selected: pagy.in, count: pagy.count
-    end
-  end
-
-  def selected_all_label
-    if @resource.pagination_type.countless?
-      t "avo.records_selected_from_all_pages_html"
-    else
-      t "avo.x_records_selected_from_all_pages_html", count: pagy.count
-    end
-  end
 end

data/app/components/avo/index/table_row_component.html.erb

@@ -1,6 +1,10 @@
+<%# hover:z-[21] removed from tr class to solve flickering actions component on row controls and z-20 changed to z-21%>
 <tr
-  class="bg-white hover:bg-gray-50 hover:shadow-row hover:z-[21] relative z-20 border-b"
+  class="bg-white hover:bg-gray-50 hover:shadow-row relative z-21 border-b"
+  data-component-name="<%= self.class.to_s.underscore %>"
   <%== item_selector_init @resource %>
+  data-resource-name="<%= @resource.class.to_s %>"
+  data-record-id="<%= @resource.record.id %>"
 >
   <% if @resource.record_selector %>
     <td class="w-10">
@@ -12,17 +16,17 @@
   <% if Avo.configuration.resource_controls_on_the_left? %>
     <td class="text-right whitespace-nowrap px-2" data-control="resource-controls">
       <div class="flex items-center justify-end flex-grow-0 h-full w-full">
-        <%= render(Avo::Index::ResourceControlsComponent.new(resource: @resource, reflection: @reflection, parent_model: @parent_model, parent_resource: @parent_resource, view_type: :table)) %>
+        <%= render(Avo::Index::ResourceControlsComponent.new(resource: @resource, reflection: @reflection, parent_record: @parent_record, parent_resource: @parent_resource, view_type: :table, actions: @actions)) %>
       </div>
     </td>
   <% end %>
   <% @resource.get_fields(reflection: @reflection, only_root: true).each_with_index do |field, index| %>
-    <%= render field.component_for_view(:index).new(field: field, resource: @resource, reflection: @reflection, index: index, parent_model: @parent_model, parent_resource: @parent_resource) %>
+    <%= render field.component_for_view(:index).new(field: field, resource: @resource, reflection: @reflection, index: index, parent_record: @parent_record, parent_resource: @parent_resource) %>
   <% end %>
   <% if Avo.configuration.resource_controls_on_the_right? %>
     <td class="text-right whitespace-nowrap px-2" data-control="resource-controls">
       <div class="flex items-center justify-end flex-grow-0 h-full w-full">
-        <%= render(Avo::Index::ResourceControlsComponent.new(resource: @resource, reflection: @reflection, parent_model: @parent_model, parent_resource: @parent_resource, view_type: :table)) %>
+        <%= render(Avo::Index::ResourceControlsComponent.new(resource: @resource, reflection: @reflection, parent_record: @parent_record, parent_resource: @parent_resource, view_type: :table, actions: @actions)) %>
       </div>
     </td>
   <% end %>

data/app/components/avo/index/table_row_component.rb

@@ -3,10 +3,11 @@
 class Avo::Index::TableRowComponent < ViewComponent::Base
   include Avo::ResourcesHelper
 
-  def initialize(resource: nil, reflection: nil, parent_model: nil, parent_resource: nil)
+  def initialize(resource: nil, reflection: nil, parent_record: nil, parent_resource: nil, actions: nil)
     @resource = resource
     @reflection = reflection
-    @parent_model = parent_model
+    @parent_record = parent_record
     @parent_resource = parent_resource
+    @actions = actions
   end
 end

data/app/components/avo/item_switcher_component.rb

@@ -38,11 +38,11 @@ class Avo::ItemSwitcherComponent < Avo::BaseComponent
   end
 
   def tab_group_component
-    Avo::TabGroupComponent.new resource: @resource, group: item.hydrate(view: view), index: index, params: params, form: form, view: view, tabs_style: item.style
+    Avo::TabGroupComponent.new resource: @resource, group: item.hydrate(view: view), index: index, params: params, form: form, view: view
   end
 
   def field_component
-    final_item = item.dup.hydrate(resource: @resource, model: @resource.model, user: resource.user, view: view)
+    final_item = item.dup.hydrate(resource: @resource, record: @resource.record, user: resource.user, view: view)
     final_item.component_for_view(@view).new(field: final_item, resource: @resource, index: index, form: form)
   end
 end

data/app/components/avo/modal_component.html.erb

@@ -3,20 +3,15 @@
   data-modal-target="modal"
 >
   <div aria-expanded="true" class="modal-overlay absolute w-full h-full bg-opacity-25 bg-gray-800 flex justify-center items-center" data-action="click->modal#close"></div>
-  <div aria-expanded="true" role="dialog" aria-modal="true" class="modal-body rounded-lg inset-auto bg-white flex z-50 relative shadow-modal overflow-auto  <%= width_classes %> <%= height_classes %>">
+  <div aria-expanded="true" role="dialog" aria-modal="true" class="modal-body rounded-lg inset-auto w-11/12 lg:w-1/2 sm:max-w-168 min-h-1/4 bg-white flex z-50 relative shadow-modal overflow-auto max-h-full">
     <div class="flex-1 flex flex-col justify-between">
       <div>
-        <% if heading? %>
-          <div class="p-6 text-2xl tracking-normal font-semibold text-black">
-            <%= heading %>
-          </div>
-        <% end %>
-
-        <% if content? %>
-          <div class="px-6 text-base text-gray-500 <%= body_class %>">
-            <%= content %>
-          </div>
-        <% end %>
+        <div class="p-6 text-2xl tracking-normal font-semibold text-black">
+          <%= heading %>
+        </div>
+        <div class="px-6 text-base text-gray-500">
+          <%= content %>
+        </div>
       </div>
       <% if controls? %>
         <div class="flex justify-end items-baseline space-x-4 p-4 bg-gray-100">

data/app/components/avo/modal_component.rb

@@ -3,25 +3,4 @@
 class Avo::ModalComponent < ViewComponent::Base
   renders_one :heading
   renders_one :controls
-
-  attr_reader :width
-  attr_reader :body_class
-
-  def initialize(width: :md, body_class: nil)
-    @width = width
-    @body_class = body_class
-  end
-
-  def width_classes
-    case width.to_sym
-    when :md
-      "w-11/12 lg:w-1/2 sm:max-w-168"
-    when :xl
-      "w-11/12 lg:w-3/4"
-    end
-  end
-
-  def height_classes
-    "max-h-full min-h-1/4 max-h-11/12"
-  end
 end

data/app/components/avo/paginator_component.html.erb

@@ -1,36 +1,47 @@
-<div class="flex flex-col sm:flex-row items-center justify-between aborder-t aborder-slate-200 rounded-xl space-y-2 sm:space-y-0">
-  <div class="flex-2 sm:flex sm:items-center sm:justify-between">
-    <div>
-      <div class="text-sm leading-5 text-slate-600 flex items-center">
-        <div data-controller="per-page">
-          <div class="flex items-center">
-            <%= select_tag 'per_page',
-              options_for_select(per_page_options, index_params[:per_page]),
-              class: 'appearance-none inline-flex bg-white-100 disabled:bg-white-400 disabled:cursor-not-allowed focus:bg-white text-slate-700 disabled:text-slate-600 rounded-md py-1 px-2 leading-tight border border-slate-300 outline-none focus:border-slate-400 outline w-16 mr-1 text-sm',
-              data: {
-                'turbo-frame': turbo_frame,
-                'per-page-target': 'selector',
-                action: 'change->per-page#reload'
-              }
-            %> <%= t('avo.per_page').downcase %>
+<%
+  per_page_options = [*Avo.configuration.per_page_steps, Avo.configuration.per_page.to_i, index_params[:per_page].to_i]
+
+  if parent_record.present?
+    per_page_options.prepend Avo.configuration.via_per_page
+  end
+
+  per_page_options = per_page_options.sort.uniq
+%>
+<% unless @pagy.pages <= 1 && discreet_pagination %>
+  <div class="flex flex-col sm:flex-row items-center justify-between aborder-t aborder-slate-200 rounded-xl space-y-2 sm:space-y-0">
+    <div class="flex-2 sm:flex sm:items-center sm:justify-between">
+      <div>
+        <div class="text-sm leading-5 text-slate-600 flex items-center">
+          <div data-controller="per-page">
+            <div class="flex items-center">
+              <%= select_tag 'per_page',
+                options_for_select(per_page_options, index_params[:per_page]),
+                class: 'appearance-none inline-flex bg-white-100 disabled:bg-white-400 disabled:cursor-not-allowed focus:bg-white text-slate-700 disabled:text-slate-600 rounded-md py-1 px-2 leading-tight border border-slate-300 outline-none focus:border-slate-400 outline w-16 mr-1 text-sm',
+                data: {
+                  'turbo-frame': turbo_frame,
+                  'per-page-target': 'selector',
+                  action: 'change->per-page#reload'
+                }
+              %> <%= t('avo.per_page').downcase %>
+            </div>
+            <% per_page_options.each do |option| %>
+              <%= link_to "Change to #{option} items per page", change_items_per_page_url(option), class: 'hidden', 'data-per-page-option': option, 'data-turbo-frame': turbo_frame %>
+            <% end %>
           </div>
-          <% per_page_options.each do |option| %>
-            <%= link_to "Change to #{option} items per page", change_items_per_page_url(option), class: 'hidden', 'data-per-page-option': option, 'data-turbo-frame': turbo_frame %>
-          <% end %>
         </div>
       </div>
     </div>
-  </div>
-  <div class="flex">
-    <div class="flex-2 sm:flex sm:items-center sm:justify-between space-y-2 sm:space-y-0 text-center sm:text-left">
-      <% if @resource.pagination_type.default? %>
-        <div class="text-sm text-slate-600 mr-4"><%== helpers.pagy_info @pagy %></div>
-      <% end %>
+    <div class="flex">
+      <div class="flex-2 sm:flex sm:items-center sm:justify-between space-y-2 sm:space-y-0 text-center sm:text-left">
+        <% if @pagy.count > 0 %>
+          <div class="text-sm text-slate-600 mr-4"><%== helpers.pagy_info @pagy %></div>
+        <% end %>
 
-      <% if pagy.pages > 1 %>
-        <%# @todo: add first & last page. make the first and last buttons rounded %>
-        <%== helpers.pagy_nav @pagy %>
-      <% end %>
+        <% if @pagy.pages > 1 %>
+          <%# @todo: add first & last page. make the first and last buttons rounded %>
+          <%== helpers.pagy_nav @pagy %>
+        <% end %>
+      </div>
     </div>
   </div>
-</div>
+<% end %>