avo 2.44.0 → 3.0.2

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

@@ -25,26 +25,32 @@
       # On edit screens we want to load each tab because we wnst the DOM to have the fields present on form submission.
       # If you have a field which is in the second tab and it's required, the form submission will fail because the required field is not in view, and we don't want that.
       # We also want to load the current tab
-      should_lazy_load = if @view.to_s.in?(['edit', 'new', 'update', 'create'])
+      should_lazy_load = if @view.in?(%w[edit new update create])
         false
       else
         !is_current_tab
       end
 
       if should_lazy_load
-        args[:src] = helpers.resource_path(resource: resource, model: resource.model, keep_query_params: true, active_tab_name: tab.name, tab_turbo_frame: group.turbo_frame_id)
+        args[:src] = helpers.resource_path(resource: resource, record: resource.record, keep_query_params: true, active_tab_name: tab.name, tab_turbo_frame: group.turbo_frame_id)
         args[:loading] = :lazy
       end
     %>
     <%= turbo_frame_tag tab.turbo_frame_id(parent: @group), **args do %>
       <div class="border rounded-lg p-2 -mx-2 -my-2 lg:p-4 lg:-mx-4 lg:-my-4 space-y-4">
-        <%= render Avo::TabSwitcherComponent.new resource: resource, current_tab: tab, group: group, active_tab_name: active_tab_name, view: view, style: tabs_style %>
-        <% if !should_lazy_load && !tab.empty? %>
-          <div class="space-y-12">
-            <% tab.visible_items.each do |item| %>
-              <%= render Avo::ItemSwitcherComponent.new resource: resource, item: item, index: index, form: form, view: @view %>
-            <% end %>
+        <%= render Avo::TabSwitcherComponent.new resource: resource, current_tab: tab, group: group, active_tab_name: active_tab_name, view: view %>
+        <% if should_lazy_load %>
+          <div class="block w-full">
+            <%= render Avo::LoadingComponent.new title: "#{tab.name}" %>
           </div>
+        <% else %>
+          <% if !tab.is_empty? %>
+            <div class="space-y-12">
+              <% tab.visible_items.each do |item| %>
+                <%= render Avo::Items::SwitcherComponent.new resource: resource, item: item, index: index, form: form, view: @view %>
+              <% end %>
+            </div>
+          <% end %>
         <% end %>
       </div>
     <% end %>

data/app/components/avo/tab_group_component.rb

@@ -7,14 +7,13 @@ class Avo::TabGroupComponent < Avo::BaseComponent
   attr_reader :form
   attr_reader :resource
 
-  def initialize(resource:, group:, index:, form:, params:, view:, tabs_style:)
+  def initialize(resource:, group:, index:, form:, params:, view:)
     @resource = resource
     @group = group
     @index = index
     @form = form
     @params = params
     @view = view
-    @tabs_style = tabs_style
 
     @group.index = index
   end
@@ -50,8 +49,4 @@ class Avo::TabGroupComponent < Avo::BaseComponent
       tab.name.to_s == active_tab_name.to_s
     end
   end
-
-  def tabs_style
-    @tabs_style || Avo.configuration.tabs_style
-  end
 end

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

@@ -1,41 +1,18 @@
-<% if style == :tabs %>
-  <div class="flex overflow-auto mac-styled-scrollbar" data-target="tab-switcher" data-style="tabs">
-    <div class="button-group">
-      <% visible_items.each do |tab| %>
-        <%= a_link tab_path(tab),
-          color: selected?(tab) ? :primary : :gray ,
-          rounded: false,
-          size: :sm,
-          class: "active:outline-0 #{selected?(tab) ? "z-20" : "bg-gray-100 border-gray-300"}",
-          title: tab.description,
-          data: {
-            tippy: tab.description.present? ? 'tooltip' : '',
-            selected: selected?(tab),
-            action: 'click->tabs#changeTab',
-            tabs_id_param: tab.name
-          } do %>
-          <%= tab.name %>
-        <% end %>
-      <% end %>
-    </div>
-  </div>
-<% else %>
-  <div class="flex flex-wrap gap-2 p-2 <%= white_panel_classes %>" data-target="tab-switcher" data-style="pills">
-    <% visible_items.each do |tab| %>
-      <%= a_link tab_path(tab),
-      color: selected?(tab) ? :primary : :gray,
-      style: selected?(tab) ? :outline : :text,
-      size: :sm,
-      class: selected?(tab) ? "z-20 bg-primary-100" : "",
-      title: tab.description,
-      data: {
-        tippy: tab.description.present? ? 'tooltip' : '',
-        selected: selected?(tab),
-        action: 'click->tabs#changeTab',
-        tabs_id_param: tab.name
-      } do %>
-        <%= tab.name %>
-      <% end %>
+<div class="flex flex-wrap gap-2 p-2 <%= white_panel_classes %>" data-target="tab-switcher">
+  <% group.visible_items.each do |tab| %>
+    <%= a_link tab_path(tab),
+    color: selected?(tab) ? :primary : :gray,
+    style: selected?(tab) ? :outline : :text,
+    size: :sm,
+    class: selected?(tab) ? "z-20 bg-primary-100" : "",
+    title: tab.description,
+    data: {
+      tippy: tab.description.present? ? 'tooltip' : '',
+      selected: selected?(tab),
+      action: 'click->tabs#changeTab',
+      tabs_id_param: tab.name
+    } do %>
+      <%= tab.name %>
     <% end %>
-  </div>
-<% end %>
+  <% end %>
+</div>

data/app/components/avo/tab_switcher_component.rb

@@ -9,36 +9,35 @@ class Avo::TabSwitcherComponent < Avo::BaseComponent
   attr_reader :current_tab
   attr_reader :tabs
   attr_reader :view
-  attr_reader :style
 
   delegate :white_panel_classes, to: :helpers
 
-  def initialize(resource:, group:, current_tab:, active_tab_name:, view:, style:)
+  def initialize(resource:, group:, current_tab:, active_tab_name:, view:)
     @active_tab_name = active_tab_name
     @resource = resource
     @group = group
     @current_tab = current_tab
     @tabs = group.items
     @view = view
-    @style = style
   end
 
+  #TOD: helper to record:
   def tab_path(tab)
     if is_edit?
-      helpers.edit_resource_path(resource: @resource, model: @resource.model, keep_query_params: true, active_tab_name: tab.name, tab_turbo_frame: group.turbo_frame_id)
+      helpers.edit_resource_path(resource: @resource, record: @resource.record, keep_query_params: true, active_tab_name: tab.name, tab_turbo_frame: group.turbo_frame_id)
     elsif is_new?
       helpers.new_resource_path(resource: @resource, keep_query_params: true, active_tab_name: tab.name, tab_turbo_frame: group.turbo_frame_id)
     else
-      helpers.resource_path(resource: @resource, model: @resource.model, keep_query_params: true, active_tab_name: tab.name, tab_turbo_frame: group.turbo_frame_id)
+      helpers.resource_path(resource: @resource, record: @resource.record, keep_query_params: true, active_tab_name: tab.name, tab_turbo_frame: group.turbo_frame_id)
     end
   end
 
   def is_edit?
-    @view.in?([:edit, :update])
+    @view.in?(%w[edit update])
   end
 
   def is_new?
-    @view.in?([:new, :create])
+    @view.in?(%w[new create])
   end
 
   def is_initial_load?
@@ -54,38 +53,4 @@ class Avo::TabSwitcherComponent < Avo::BaseComponent
       tab.name.to_s == active_tab_name.to_s
     end
   end
-
-  # Goes through all items and removes the ones that are not supposed to be visible.
-  # Example below:
-  # tabs do
-  #   field :comments, as: :has_many
-  # end
-  # Because the developer hasn't specified that it should be visible on edit views (with the show_on: :edit option),
-  # the field should not be visible in the item switcher either.
-  def visible_items
-    tabs.select do |tab|
-      next false if tab.items.blank?
-      next false if tab.is_field? && !tab.authorized?
-      next false if tab.has_a_single_item? && !single_item_visible?(tab.items.first)
-      next false if !tab.visible?
-      next false if !tab.visible_on?(view)
-
-      true
-    end
-  end
-
-  private
-
-  def single_item_visible?(item)
-    # Item is visible if is not a field or don't have its own panel
-    return true if !item.is_field?
-    return true if !item.has_own_panel?
-
-    return false if !item.visible_on?(view)
-
-    # If item is hydrated with the correct resource and is not authorized, it's not visible
-    return false if item.resource.present? && !item.authorized?
-
-    true
-  end
 end

data/app/components/avo/views/resource_edit_component.html.erb

@@ -3,11 +3,12 @@
   data: {
     model_name: @resource.model_name.to_s,
     resource_name: @resource.class.to_s,
-    model_id: @resource.model.id,
+    record_id: @resource.record.id,
     selected_resources_name: @resource.model_key,
-    selected_resources: [@resource.model.id],
+    selected_resources: [@resource.record.id],
     **@resource.stimulus_data_attributes
   } do %>
+  <%= render_cards_component %>
   <%= form_with model: @resource.record,
     scope: @resource.form_scope,
     url: form_url,
@@ -19,92 +20,30 @@
     multipart: true do |form| %>
     <%= render Avo::ReferrerParamsComponent.new back_path: back_path %>
     <%= content_tag :div, class: 'space-y-12' do %>
-      <%= render Avo::PanelComponent.new(name: title, description: @resource.resource_description,
-                                         display_breadcrumbs: display_breadcrumbs?,
-                                         index: 0, data: { panel_id: "main" }) do |c| %>
-        <% c.with_tools do %>
-          <% if back_path.present? %>
-            <%= a_link back_path,
-              style: :text,
-              icon: 'arrow-left' do %>
-              <%= t('avo.cancel').capitalize %>
-            <% end %>
-          <% end %>
-          <% if can_see_the_destroy_button? %>
-            <%= a_link destroy_path,
-              style: :text,
-              color: :red,
-              icon: 'trash',
-              form_class: 'flex flex-col sm:flex-row sm:inline-flex',
-              data: {
-                turbo_confirm: t('avo.are_you_sure', item: @resource.model.model_name.name.downcase),
-                turbo_method: :delete,
-                control: :destroy,
-                'resource-id': @resource.model.id,
-              } do %>
-              <%= t('avo.delete').capitalize %>
-            <% end %>
-          <% end %>
-          <% if can_act_on? %>
-            <%= render Avo::ActionsComponent.new actions: @actions, resource: @resource, view: @view %>
-          <% end %>
-          <% if can_see_the_save_button? %>
-            <%= a_button color: :primary,
-            style: :primary,
-            loading: true,
-            type: :submit,
-            icon: 'save' do %>
-              <%= t('avo.save').capitalize %>
-            <% end %>
-          <% end %>
-        <% end %>
-        <%# Extract the main panel and display the fields here. %>
-        <%# This way we'll be able to render the footer buttons under the main fields. %>
-        <% if main_panel.present? %>
-          <% c.with_body do %>
-            <div class="divide-y">
-              <% main_panel.items.each_with_index do |field, index| %>
-                <%= render field
-                  .hydrate(resource: @resource, model: @resource.model, user: @resource.user, view: view_for(field))
-                  .component_for_view(view_for field)
-                  .new(field: field, resource: @resource, index: index, form: form, compact: sidebar.present?)
-                %>
-              <% end %>
-            </div>
-          <% end %>
-        <% end %>
-        <% if sidebar.present? && sidebar.visible_items.present? %>
-          <% c.with_sidebar do %>
-            <%= render sidebar_component form: form %>
-          <% end %>
-        <% end %>
-        <% if Avo.configuration.buttons_on_form_footers %>
+      <% @resource.get_items.each_with_index do |item, index| %>
+        <%= render Avo::Items::SwitcherComponent.new(
+          resource: @resource,
+          reflection: @reflection,
+          item: item,
+          index: index + 1,
+          view: @view,
+          parent_resource: @parent_resource,
+          parent_record: @parent_record,
+          form: form,
+          parent_component: self,
+          actions: @actions
+        )%>
+      <% end %>
+
+      <% if Avo.configuration.buttons_on_form_footers %>
+        <%= render Avo::PanelComponent.new do |c| %>
           <% c.with_footer_tools do %>
-            <div class="mt-4">
-              <%= a_link back_path,
-              style: :text,
-              icon: 'arrow-left' do %>
-                <%= t('avo.cancel').capitalize %>
-              <% end %>
-              <% if can_see_the_save_button? %>
-                <%= a_button color: :primary,
-                style: :primary,
-                loading: true,
-                type: :submit,
-                icon: 'save' do %>
-                  <%= t('avo.save').capitalize %>
-                <% end %>
-              <% end %>
-            </div>
+            <% @resource.render_edit_controls.each do |control| %>
+              <%= render_control control %>
+            <% end %>
           <% end %>
         <% end %>
       <% end %>
-      <%= content_tag :div, class: 'space-y-12' do %>
-        <% @resource.get_items.each_with_index do |item, index| %>
-          <% next if item.nil? %>
-          <%= render Avo::ItemSwitcherComponent.new resource: @resource, item: item, index: index + 1, view: @view, form: form %>
-        <% end %>
-      <% end %>
     <% end %>
   <% end %>
 <% end %>

data/app/components/avo/views/resource_edit_component.rb

@@ -1,15 +1,16 @@
 # frozen_string_literal: true
 
 class Avo::Views::ResourceEditComponent < Avo::ResourceComponent
-  include Avo::ResourcesHelper
   include Avo::ApplicationHelper
 
-  def initialize(resource: nil, model: nil, actions: [], view: :edit, display_breadcrumbs: true)
+  attr_reader :actions, :display_breadcrumbs
+
+  def initialize(resource: nil, record: nil, actions: [], view: "edit", display_breadcrumbs: true)
     @resource = resource
-    @model = model
+    @record = record
     @actions = actions
-    @view = view
-    @display_breadcrumbs = display_breadcrumbs
+    @view = Avo::ViewInquirer.new(view)
+    @display_breadcrumbs = @reflection.blank? && display_breadcrumbs
   end
 
   def title
@@ -21,8 +22,8 @@ class Avo::Views::ResourceEditComponent < Avo::ResourceComponent
     return resource_view_path if via_resource?
     return resources_path if via_index?
 
-    if is_edit? && Avo.configuration.resource_default_view == :show # via resource show or edit page
-      return helpers.resource_path(model: @resource.model, resource: @resource)
+    if is_edit? && Avo.configuration.resource_default_view.show? # via resource show or edit page
+      return helpers.resource_path(record: @resource.record, resource: @resource)
     end
 
     resources_path
@@ -33,11 +34,11 @@ class Avo::Views::ResourceEditComponent < Avo::ResourceComponent
   end
 
   def resource_view_path
-    helpers.resource_view_path(model: association_resource.model, resource: association_resource)
+    helpers.resource_view_path(record: association_resource.record, resource: association_resource)
   end
 
   def can_see_the_destroy_button?
-    return super if is_edit? && Avo.configuration.resource_default_view == :edit
+    return super if is_edit? && Avo.configuration.resource_default_view.edit?
 
     false
   end
@@ -48,8 +49,13 @@ class Avo::Views::ResourceEditComponent < Avo::ResourceComponent
     @resource.authorization.authorize_action @view, raise_exception: false
   end
 
-  def display_breadcrumbs?
-    @reflection.blank? && @display_breadcrumbs
+  def controls
+    @resource.render_edit_controls
+  end
+
+  # Render :show view for read only trix fields
+  def view_for(field)
+    field.is_a?(Avo::Fields::TrixField) && field.is_disabled? ? :show : view
   end
 
   private
@@ -63,7 +69,7 @@ class Avo::Views::ResourceEditComponent < Avo::ResourceComponent
   end
 
   def is_edit?
-    view.in?([:edit, :update])
+    view.in?(%w[edit update])
   end
 
   def form_method
@@ -75,7 +81,7 @@ class Avo::Views::ResourceEditComponent < Avo::ResourceComponent
   def form_url
     if is_edit?
       helpers.resource_path(
-        model: @resource.model,
+        record: @resource.record,
         resource: @resource
       )
     else
@@ -83,13 +89,8 @@ class Avo::Views::ResourceEditComponent < Avo::ResourceComponent
         resource: @resource,
         via_relation_class: params[:via_relation_class],
         via_relation: params[:via_relation],
-        via_resource_id: params[:via_resource_id]
+        via_record_id: params[:via_record_id]
       )
     end
   end
-
-  # Render :show view for read only trix fields
-  def view_for(field)
-    (field.is_a?(Avo::Fields::TrixField) && field.is_readonly?) ? :show : view
-  end
 end

data/app/components/avo/views/resource_index_component.html.erb

@@ -1,82 +1,77 @@
 <%= content_tag :div,
   data: {
+    component_name: self.class.to_s.underscore,
     model_name: @resource.model_name.to_s,
     resource_name: @resource.class.to_s,
     **@resource.stimulus_data_attributes
   } do %>
+  <%= render_cards_component %>
   <%= render Avo::PanelComponent.new(name: title, description: description, data: { component: 'resources-index' }, display_breadcrumbs: @reflection.blank?) do |c| %>
     <% c.with_tools do %>
-      <% if can_attach? %>
-        <%= a_link attach_path,
-          icon: 'heroicons/outline/link',
-          color: :primary,
-          style: :text,
-          'data-turbo-frame': 'attach_modal',
-          'data-target': 'attach' do %>
-          <%= t('avo.attach_item', item: singular_resource_name).humanize %>
-        <% end %>
-      <% end %>
-      <% if can_act_on? %>
-        <%= render Avo::ActionsComponent.new actions: @actions, resource: @resource, view: @view %>
-      <% end %>
-      <% if can_see_the_create_button? %>
-        <%= a_link create_path,
-          icon: 'heroicons/outline/plus',
-          'data-target': 'create',
-          style: :primary,
-          color: :primary do %>
-          <%= t('avo.create_new_item', item: singular_resource_name.humanize(capitalize: false) ) %>
-        <% end %>
+      <% @resource.render_index_controls(item: singular_resource_name.downcase).each do |control| %>
+        <%= render_control control %>
       <% end %>
     <% end %>
     <% c.with_body do %>
-      <div class="flex flex-col xs:flex-row xs:justify-between space-y-2 xs:space-y-0 py-4 <%= 'hidden' if @resource.search_query.nil? && @filters.empty? && available_view_types.count <= 1 %>">
-        <% if show_search_input %>
-          <div class="flex items-center px-4 w-64">
-            <%= render partial: 'avo/partials/resource_search', locals: {resource: @resource.route_key, via_reflection: via_reflection} %>
-          </div>
-        <% else %>
-          <%# Offset for the space-y-2 property when the search is missing %>
-          <div class="-mb-2"></div>
-        <% end %>
-        <% if @filters.present? || available_view_types.count > 1 %>
-          <div class="justify-self-end flex justify-start xs:justify-end items-center px-4 space-x-3">
-            <%= render Avo::FiltersComponent.new filters: @filters, resource: @resource, applied_filters: @applied_filters, parent_model: @parent_model %>
-            <%= render partial: 'avo/partials/view_toggle_button', locals: { available_view_types: available_view_types, view_type: view_type, turbo_frame: @turbo_frame } if available_view_types.count > 1 %>
+      <div class="flex flex-col">
+        <%= render scopes_list if can_render_scopes? %>
+        <div class="flex flex-col">
+          <div class="flex flex-col xs:flex-row xs:justify-between space-y-2 xs:space-y-0 py-4 <%= 'hidden' unless header_visible? %>">
+            <div class="flex items-center px-4 w-64">
+              <% if show_search_input %>
+                <%= render partial: 'avo/partials/resource_search', locals: {resource: @resource.route_key, via_reflection: via_reflection} %>
+              <% else %>
+                <%# Offset for the space-y-2 property when the search is missing %>
+                <div class="-mb-2"></div>
+              <% end %>
+            </div>
+
+            <div class="justify-self-end flex justify-start xs:justify-end items-center px-4 space-x-3">
+              <%= render_dynamic_filters_button %>
+
+              <%= render Avo::FiltersComponent.new filters: @filters, resource: @resource, applied_filters: @applied_filters, parent_record: parent_record %>
+
+              <%= render partial: 'avo/partials/view_toggle_button', locals: { available_view_types: available_view_types, view_type: view_type, turbo_frame: turbo_frame } %>
+            </div>
           </div>
-        <% end %>
+          <% if has_dynamic_filters? %>
+            <%= render Avo::DynamicFilters::FiltersComponent.new resource: resource, turbo_frame: turbo_frame, dynamic_filters_component_id: dynamic_filters_component_id %>
+          <% end %>
+        </div>
       </div>
-      <% if view_type.to_sym == :map %>
+      <% if view_type.to_sym == :table %>
         <% if @resources.present? %>
-          <div>
-            <%= render(Avo::Index::ResourceMapComponent.new(resources: @resources, resource: @resource, reflection: @reflection, parent_model: @parent_model, parent_resource: @parent_resource, pagy: @pagy, query: @query)) %>
+          <div class="w-full relative flex-1 flex mt-0">
+            <%= render(Avo::Index::ResourceTableComponent.new(resources: @resources, resource: @resource, reflection: @reflection, parent_record: parent_record, parent_resource: parent_resource, pagy: @pagy, query: query, actions: actions)) %>
           </div>
         <% else %>
           <%= helpers.empty_state by_association: params[:related_name].present?, view_type: view_type, add_background: true %>
         <% end %>
       <% end %>
-      <% if view_type.to_sym == :table %>
+    <% end %>
+    <% c.with_bare_content do %>
+     <% if view_type.to_sym == :map %>
         <% if @resources.present? %>
-          <div class="w-full relative flex-1 flex mt-0">
-            <%= render(Avo::Index::ResourceTableComponent.new(resources: @resources, resource: @resource, reflection: @reflection, parent_model: @parent_model, parent_resource: @parent_resource, pagy: @pagy, query: @query)) %>
+          <div>
+            <%= render(Avo::Index::ResourceMapComponent.new(resources: @resources, resource: @resource, reflection: @reflection, parent_record: @parent_record, parent_resource: @parent_resource, pagy: @pagy, query: @query)) %>
           </div>
         <% else %>
           <%= helpers.empty_state by_association: params[:related_name].present?, view_type: view_type, add_background: true %>
         <% end %>
       <% end %>
-    <% end %>
-    <% c.with_bare_content do %>
       <% if view_type.to_sym == :table || view_type.to_sym == :map %>
-        <% if @models.present? %>
+        <% if @records.present? %>
           <div class="mt-4">
-            <%= render Avo::PaginatorComponent.new pagy: @pagy, turbo_frame: @turbo_frame || 'none', index_params: @index_params, resource: @resource, parent_model: @parent_model, discreet_pagination: field&.discreet_pagination %>
+            <%= render Avo::PaginatorComponent.new pagy: @pagy, turbo_frame: turbo_frame || 'none', index_params: @index_params, resource: @resource, parent_record: parent_record, discreet_pagination: field&.discreet_pagination %>
           </div>
         <% end %>
       <% end %>
       <% if view_type.to_sym == :grid %>
-        <%= render Avo::Index::ResourceGridComponent.new(resources: @resources, resource: @resource, reflection: @reflection, parent_model: @parent_model, parent_resource: @parent_resource) %>
+        <div id="records_panel">
+          <%= render Avo::Index::ResourceGridComponent.new(resources: @resources, resource: @resource, reflection: @reflection, parent_record: parent_record, parent_resource: parent_resource, actions: actions) %>
+        </div>
         <div class="mt-6">
-          <%= render Avo::PaginatorComponent.new pagy: @pagy, turbo_frame: @turbo_frame || 'none', index_params: @index_params, resource: @resource, parent_model: @parent_model, discreet_pagination: field&.discreet_pagination %>
+          <%= render Avo::PaginatorComponent.new pagy: @pagy, turbo_frame: turbo_frame || 'none', index_params: @index_params, resource: @resource, parent_record: parent_record, discreet_pagination: field&.discreet_pagination %>
         </div>
       <% end %>
     <% end %>