avo 2.9.1.pre7 → 2.10.0

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

@@ -1,77 +1,55 @@
 <%= content_tag :div,
-  class: "space-y-12",
   data: {
     'model-id': @resource.model.id,
     selected_resources_name: @resource.model_key,
     selected_resources: [@resource.model.id],
     **@resource.stimulus_data_attributes
   } do %>
-  <% @resource.panels.each_with_index do |resource_panel, index| %>
-    <%= form_with model: @resource.model,
-        scope: @resource.form_scope,
-        url: form_url,
-        local: true,
-        multipart: true do |form| %>
-      <%= render Avo::ReferrerParamsComponent.new back_path: back_path %>
-      <%= render Avo::PanelComponent.new(title: resource_panel[:name], description: @resource.resource_description, display_breadcrumbs: true, index: index) do |c| %>
-        <% c.tools do %>
-          <%= a_link back_path,
-            style: :text,
-            icon: 'arrow-left' do %>
-            <%= t('avo.cancel').capitalize %>
-          <% end %>
-          <%= render Avo::ActionsComponent.new actions: @actions, resource: @resource, view: @view %>
-          <% if can_see_the_save_button? %>
-            <%= a_button color: :primary,
+  <%= form_with model: @resource.model,
+    scope: @resource.form_scope,
+    url: form_url,
+    method: form_method,
+    local: true,
+    html: {
+      novalidate: true
+    },
+    multipart: true do |form| %>
+    <%= render Avo::ReferrerParamsComponent.new back_path: back_path %>
+    <%= render Avo::PanelComponent.new(title: title, description: @resource.resource_description, display_breadcrumbs: @reflection.blank?, index: 0, data: { panel_id: "main" }) do |c| %>
+      <% c.tools do %>
+        <%= a_link back_path,
+        style: :text,
+        icon: 'arrow-left' do %>
+          <%= t('avo.cancel').capitalize %>
+        <% end %>
+        <%= render Avo::ActionsComponent.new actions: @actions, resource: @resource, view: @view %>
+        <% if can_see_the_save_button? %>
+          <%= a_button color: :primary,
               style: :primary,
               loading: true,
               type: :submit,
               icon: 'save' do %>
-              <%= t('avo.save').capitalize %>
-            <% end %>
+            <%= t('avo.save').capitalize %>
           <% end %>
         <% end %>
-        <% if Avo.configuration.buttons_on_form_footers %>
-          <% c.footer_tools do %>
-            <%= a_link back_path, icon: 'arrow-left' do %>
-              <%= t('avo.cancel').capitalize %>
-            <% end %>
-            <% if can_see_the_save_button? %>
-              <%= a_button color: :green, loading: true, type: :submit, icon: 'save' do %>
-                <%= t('avo.save').capitalize %>
-              <% end %>
-            <% end %>
+      <% end %>
+      <% if Avo.configuration.buttons_on_form_footers %>
+        <% c.footer_tools do %>
+          <%= a_link back_path, icon: 'arrow-left' do %>
+            <%= t('avo.cancel').capitalize %>
           <% end %>
-        <% end %>
-        <% c.body do %>
-          <div class="divide-y">
-            <% @resource.get_fields.each_with_index do |field, index| %>
-              <%= render field.component_for_view(:edit).new(field: field, resource: @resource, index: index, form: form) unless field.computed %>
+          <% if can_see_the_save_button? %>
+            <%= a_button color: :green, loading: true, type: :submit, icon: 'save' do %>
+              <%= t('avo.save').capitalize %>
             <% end %>
-          </div>
+          <% end %>
         <% end %>
       <% end %>
     <% end %>
-  <% end %>
-  <% if @reflection.blank? %>
-    <% if has_one_panels.present? %>
-      <% has_one_panels.each_with_index do |field, index| %>
-        <%= render field.component_for_view(:show).new(field: field, resource: @resource, index: index) %>
-      <% end %>
-    <% end %>
-    <% if has_many_panels.present? %>
-      <% has_many_panels.each_with_index do |field, index| %>
-        <%= render field.component_for_view(:show).new(field: field, resource: @resource, index: index) %>
-      <% end %>
-    <% end %>
-    <% if has_as_belongs_to_many_panels.present? %>
-      <% has_as_belongs_to_many_panels.each_with_index do |field, index| %>
-        <%= render field.component_for_view(:show).new(field: field, resource: @resource, index: index) %>
-      <% end %>
-    <% end %>
-    <% if resource_tools.present? %>
-      <% resource_tools.each do |tool, index| %>
-        <%= render tool.partial, tool: tool %>
+    <%= 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 %>

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

@@ -15,6 +15,10 @@ class Avo::Views::ResourceEditComponent < Avo::ResourceComponent
     split_panel_fields
   end
 
+  def title
+    @resource.default_panel_name
+  end
+
   def back_path
     if via_resource?
       helpers.resource_path(model: params[:via_resource_class].safe_constantize, resource: relation_resource, resource_id: params[:via_resource_id])
@@ -45,6 +49,12 @@ class Avo::Views::ResourceEditComponent < Avo::ResourceComponent
     view == :edit
   end
 
+  def form_method
+    return :put if is_edit?
+
+    :post
+  end
+
   def form_url
     if is_edit?
       helpers.resource_path(

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

@@ -37,7 +37,7 @@
             <%= render partial: 'avo/partials/resource_search', locals: {resource: @resource.model_name.collection} %>
           </div>
         <% else %>
-          <%# Offset for the space-y-2 property when the serach is missing %>
+          <%# 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 %>

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

@@ -113,7 +113,7 @@ class Avo::Views::ResourceIndexComponent < Avo::ResourceComponent
       end
     end
 
-    helpers.new_resource_path(model: @resource.model_class, resource: @resource, **args)
+    helpers.new_resource_path(resource: @resource, **args)
   end
 
   def attach_path

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

@@ -1,105 +1,74 @@
 <%= content_tag :div,
-  class: "space-y-12",
   data: {
     'model-id': @resource.model.id,
     selected_resources_name: @resource.model_key,
     selected_resources: [@resource.model.id],
     **@resource.stimulus_data_attributes
   } do %>
-  <% @resource.panels.each_with_index do |resource_panel, index| %>
-    <%= render Avo::PanelComponent.new(title: title, description: @resource.resource_description, display_breadcrumbs: @reflection.blank?, index: index) do |c| %>
-      <% c.tools do %>
-        <% if resource_panel[:name] == @resource.default_panel_name %>
-          <% if @reflection.present? && @resource.model.present? %>
-            <% if can_detach? %>
-              <%= a_button url: detach_path,
-                icon: 'detach',
-                method: :delete,
-                form_class: 'flex flex-col sm:flex-row sm:inline-flex',
-                style: :text,
-                data: {
-                  confirm: "Are you sure you want to detach this #{title}."
-                } do %>
-                <%= t('avo.detach_item', item: title).capitalize %>
-              <% end %>
-              <%= render Avo::ActionsComponent.new actions: @actions, resource: @resource, view: @view %>
-            <% end %>
-            <% if can_see_the_edit_button? %>
-              <%= a_link edit_path,
-                color: :primary,
-                style: :primary,
-                icon: 'edit' do %>
-                <%= t('avo.edit').capitalize %>
-              <% end %>
-            <% end %>
-          <% else %>
-            <%= a_link back_path,
-              style: :text,
-              icon: 'arrow-left' do %>
-              <%= t('avo.go_back') %>
-            <% end %>
-            <% if can_see_the_destroy_button? %>
-              <%= a_button url: helpers.resource_path(model: @resource.model, resource: @resource),
-                method: :delete,
-                local: true,
-                style: :text,
-                title: t('avo.delete_item', item: @resource.model.model_name.name.downcase).capitalize,
-                loading: true,
-                confirm: t('avo.are_you_sure', item: @resource.model.model_name.name.downcase),
-                color: :red,
-                icon: 'trash',
-                form_class: 'flex flex-col sm:flex-row sm:inline-flex',
-                data: {
-                  control: :destroy,
-                  'resource-id': @resource.model.id,
-                  'tippy': 'tooltip',
-                } do %>
-                <%= t('avo.delete').capitalize %>
-              <% end %>
-            <% end %>
-            <%= render Avo::ActionsComponent.new actions: @actions, resource: @resource, view: @view %>
-            <% if @resource.authorization.authorize_action(:edit, raise_exception: false) %>
-              <%= a_link edit_path,
-                color: :primary,
-                style: :primary,
-                icon: 'edit' do %>
-                <%= t('avo.edit').capitalize %>
-              <% end %>
-            <% end %>
+  <%= render Avo::PanelComponent.new(title: title, description: @resource.resource_description, display_breadcrumbs: @reflection.blank?, index: 0, data: { panel_id: "main" }) do |c| %>
+    <% c.tools do %>
+      <% if @reflection.present? && @resource.model.present? %>
+        <% if can_detach? %>
+          <%= a_button url: detach_path,
+            icon: 'detach',
+            method: :delete,
+            form_class: 'flex flex-col sm:flex-row sm:inline-flex',
+            style: :text,
+            data: {
+              confirm: "Are you sure you want to detach this #{title}."
+            } do %>
+            <%= t('avo.detach_item', item: title).capitalize %>
           <% end %>
+          <%= render Avo::ActionsComponent.new actions: @actions, resource: @resource, view: @view %>
         <% end %>
-      <% end %>
-      <% c.body do %>
-        <% if fields_by_panel[resource_panel[:name]].present? %>
-          <div class="divide-y">
-            <% fields_by_panel[resource_panel[:name]].each_with_index do |field, index| %>
-              <%= render field.component_for_view(:show).new(field: field, resource: @resource, index: index) %>
-            <% end %>
-          </div>
+        <% if can_see_the_edit_button? %>
+          <%= a_link edit_path,
+            color: :primary,
+            style: :primary,
+            icon: 'edit' do %>
+            <%= t('avo.edit').capitalize %>
+          <% end %>
+        <% end %>
+      <% else %>
+        <%= a_link back_path,
+          style: :text,
+          icon: 'arrow-left' do %>
+          <%= t('avo.go_back') %>
+        <% end %>
+        <% if can_see_the_destroy_button? %>
+          <%= a_button url: helpers.resource_path(model: @resource.model, resource: @resource),
+            method: :delete,
+            local: true,
+            style: :text,
+            loading: true,
+            confirm: t('avo.are_you_sure', item: @resource.model.model_name.name.downcase),
+            color: :red,
+            icon: 'trash',
+            form_class: 'flex flex-col sm:flex-row sm:inline-flex',
+            data: {
+              control: :destroy,
+              'resource-id': @resource.model.id,
+              'tippy': 'tooltip',
+            } do %>
+            <%= t('avo.delete').capitalize %>
+          <% end %>
+        <% end %>
+        <%= render Avo::ActionsComponent.new actions: @actions, resource: @resource, view: @view %>
+        <% if @resource.authorization.authorize_action(:edit, raise_exception: false) %>
+          <%= a_link edit_path,
+            color: :primary,
+            style: :primary,
+            icon: 'edit' do %>
+            <%= t('avo.edit').capitalize %>
+          <% end %>
         <% end %>
       <% end %>
     <% end %>
   <% end %>
-  <% if @reflection.blank? %>
-    <% if has_one_panels.present? %>
-      <% has_one_panels.each_with_index do |field, index| %>
-        <%= render field.component_for_view(:show).new(field: field, resource: @resource, index: index) %>
-      <% end %>
-    <% end %>
-    <% if has_many_panels.present? %>
-      <% has_many_panels.each_with_index do |field, index| %>
-        <%= render field.component_for_view(:show).new(field: field, resource: @resource, index: index) %>
-      <% end %>
-    <% end %>
-    <% if has_as_belongs_to_many_panels.present? %>
-      <% has_as_belongs_to_many_panels.each_with_index do |field, index| %>
-        <%= render field.component_for_view(:show).new(field: field, resource: @resource, index: index) %>
-      <% end %>
-    <% end %>
-    <% if resource_tools.present? %>
-      <% resource_tools.each do |tool, index| %>
-        <%= render tool.partial, tool: tool %>
-      <% 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, reflection: @reflection, item: item, index: index + 1, view: @view %>
     <% end %>
   <% end %>
   <% if should_display_invalid_fields_errors? %>

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

@@ -19,7 +19,7 @@ class Avo::Views::ResourceShowComponent < Avo::ResourceComponent
       return field.name if has_one_field?
       reflection_resource.name
     else
-      @resource.panels.first[:name]
+      @resource.default_panel_name
     end
   end
 
@@ -52,6 +52,6 @@ class Avo::Views::ResourceShowComponent < Avo::ResourceComponent
   end
 
   def has_one_field?
-    field.present? and field.class == Avo::Fields::HasOneField
+    field.present? and field.instance_of? Avo::Fields::HasOneField
   end
 end

data/app/controllers/avo/actions_controller.rb

@@ -42,7 +42,7 @@ module Avo
         model = @resource.class.find_scope.find params[:id]
       end
 
-      @action = action_class.new(model: model, resource: resource, user: _current_user)
+      @action = action_class.new(model: model, resource: resource, user: _current_user, view: :edit)
     end
 
     def respond(response)

data/app/controllers/avo/application_controller.rb

@@ -14,7 +14,7 @@ module Avo
     before_action :init_app
     before_action :check_avo_license
     before_action :set_default_locale
-    around_action :set_force_locale
+    around_action :set_force_locale, if: -> { params[:force_locale].present? }
     before_action :set_authorization
     before_action :_authenticate!
     before_action :set_container_classes
@@ -294,16 +294,12 @@ module Avo
       I18n.default_locale = I18n.locale
     end
 
-    # Temporary set the locale
+    # Temporary set the locale and reverting at the end of the request.
     def set_force_locale
-      if params[:force_locale].present?
-        initial_locale = I18n.locale.to_s.dup
-        I18n.locale = params[:force_locale]
-        yield
-        I18n.locale = initial_locale
-      else
-        yield
-      end
+      initial_locale = I18n.locale.to_s.dup
+      I18n.locale = params[:force_locale]
+      yield
+      I18n.locale = initial_locale
     end
 
     def default_url_options

data/app/helpers/avo/application_helper.rb

@@ -20,12 +20,6 @@ module Avo
       render Avo::EmptyStateComponent.new **args
     end
 
-    def turbo_frame_wrap(name, &block)
-      render Avo::TurboFrameWrapperComponent.new name do
-        capture(&block)
-      end
-    end
-
     def a_button(**args, &block)
       render Avo::ButtonComponent.new(is_link: false, **args) do
         capture(&block) if block_given?

data/app/helpers/avo/url_helpers.rb

@@ -35,7 +35,7 @@ module Avo
       avo.send :"resources_#{resource.singular_route_key}_path", id, **args
     end
 
-    def new_resource_path(model:, resource:, **args)
+    def new_resource_path(resource:, **args)
       avo.send :"new_resources_#{resource.singular_route_key}_path", **args
     end
 

data/app/javascript/js/controllers/loading_button_controller.js

@@ -7,33 +7,37 @@ export default class extends Controller {
   <div class="double-bounce2"></div>
 </div>`;
 
-  confirmed = false
-
-  connect() {
-    this.context.scope.element.addEventListener('click', (e) => {
-      // If the user has to confirm the action
-      if (this.confirmationMessage) {
-        // Intervene only if not confirmed
-        if (!this.confirmed) {
-          e.preventDefault()
-          if (window.confirm(this.confirmationMessage)) {
-            this.applyLoader()
-          }
-        }
-      } else {
+  static values = {
+    confirmationMessage: String,
+    confirmed: Boolean,
+  }
+
+  attemptSubmit(e) {
+    // If the user has to confirm the action
+    if (this.confirmationMessageValue) {
+      this.confirmAndApply(e)
+    } else {
+      this.applyLoader()
+    }
+
+    return null
+  }
+
+  confirmAndApply(e) {
+    // Intervene only if not confirmed
+    if (!this.confirmedValue) {
+      e.preventDefault()
+
+      if (window.confirm(this.confirmationMessageValue)) {
         this.applyLoader()
       }
-    })
+    }
   }
 
   get button() {
     return this.context.scope.element
   }
 
-  get confirmationMessage() {
-    return this.context.scope.element.getAttribute('data-avo-confirm')
-  }
-
   applyLoader() {
     const { button } = this
 
@@ -50,10 +54,10 @@ export default class extends Controller {
   }
 
   markConfirmed() {
-    this.confirmed = true
+    this.confirmedValue = true
   }
 
   markUnconfirmed() {
-    this.confirmed = false
+    this.confirmedValue = false
   }
 }

data/app/javascript/js/controllers/tabs_controller.js

@@ -6,6 +6,7 @@ export default class extends Controller {
   static targets = ['tab'];
 
   static values = {
+    view: String,
     activeTab: String,
   };
 
@@ -35,9 +36,15 @@ export default class extends Controller {
   }
 
   /**
-  * Sets the target container height to the previous panel height so we don't get jerky tab changes.
-  */
+   * Sets the target container height to the previous panel height so we don't get jerky tab changes.
+   */
   setTheTargetPanelHeight(id) {
+    // Ignore this on edit.
+    // All tabs are loaded beforehand, they have their own height, and the page won't jiggle when the user toggles between them.
+    if (this.viewValue === 'edit' || this.viewValue === 'new') {
+      return
+    }
+
     // We don't need to add a height to this panel because it was loaded before
     if (castBoolean(this.targetTab(id).dataset.loaded)) {
       return
@@ -71,7 +78,6 @@ export default class extends Controller {
         element.classList.remove('hidden')
       }
     })
-    // this.tabTargets.map((element) => element.clasList.add('hidden'))
   }
 
   hideTabs() {

data/app/javascript/js/controllers.js

@@ -27,6 +27,7 @@ import SearchController from './controllers/search_controller'
 import SelectController from './controllers/select_controller'
 import SelectFilterController from './controllers/select_filter_controller'
 import SimpleMdeController from './controllers/fields/simple_mde_controller'
+import TabsController from './controllers/tabs_controller'
 import TagsFieldController from './controllers/fields/tags_field_controller'
 import TextFilterController from './controllers/text_filter_controller'
 import TippyController from './controllers/tippy_controller'
@@ -55,6 +56,7 @@ application.register('resource-show', ResourceShowController)
 application.register('search', SearchController)
 application.register('select', SelectController)
 application.register('select-filter', SelectFilterController)
+application.register('tabs', TabsController)
 application.register('tags-field', TagsFieldController)
 application.register('text-filter', TextFilterController)
 application.register('tippy', TippyController)

data/app/views/avo/base/index.html.erb

@@ -1,4 +1,4 @@
-<%= turbo_frame_wrap(params[:turbo_frame]) do %>
+<%= render Avo::TurboFrameWrapperComponent.new(params[:turbo_frame]) do %>
   <%= render Avo::Views::ResourceIndexComponent.new(
       resource: @resource,
       resources: @resources,

data/app/views/avo/base/show.html.erb

@@ -1,3 +1,3 @@
-<%= turbo_frame_wrap(params[:turbo_frame]) do %>
+<%= render Avo::TurboFrameWrapperComponent.new(params[:turbo_frame]) do %>
   <%= render Avo::Views::ResourceShowComponent.new(resource: @resource, reflection: @reflection, actions: @actions) %>
 <% end %>

data/app/views/avo/cards/show.html.erb

@@ -1,3 +1,3 @@
-<%= turbo_frame_wrap(params[:turbo_frame]) do %>
+<%= render Avo::TurboFrameWrapperComponent.new(params[:turbo_frame]) do %>
   <%= render Avo::CardComponent.new card: @card %>
 <% end %>

data/app/views/avo/debug/index.html.erb

@@ -14,7 +14,7 @@
   hq_payload = Avo::Licensing::HQ.new(request).payload
 %>
 <div class="flex flex-col">
-  <%= render Avo::PanelComponent.new title: 'Debug Avo', description: 'Use this page to debug the Avo license.' do |c| %>
+  <%= render Avo::PanelComponent.new(title: 'Debug Avo', description: 'Use this page to debug the Avo license.') do |c| %>
     <% c.tools do %>
     <% end %>
     <% c.bare_content do %>

data/app/views/avo/home/_actions.html.erb

@@ -11,6 +11,6 @@
       </div>
     </div>
 
-    <a href="https://docs.avohq.io/1.0/actions.html" target="_blank" title="Avo Actions documentation" class="text-bold cursor-pointer block mt-2">Actions in the docs 👉</a>
+    <a href="https://docs.avohq.io/2.0/actions.html" target="_blank" title="Avo Actions documentation" class="text-bold cursor-pointer block mt-2">Actions in the docs 👉</a>
   </div>
 </div>

data/app/views/avo/home/_dashboards.html.erb

@@ -0,0 +1,19 @@
+<div>
+  <h3>Dashboards</h3>
+
+  <div>There comes the point in your app's life when you need to display the data in an aggregated form like a metric or chart. That's what Avo's Dashboards are all about.</div>
+
+  <div>Generate a dashboard using the command below 👇👇</div>
+
+
+  <div class="mt-2">
+    <div class="mt-1">
+      <code class="p-1 rounded bg-sky-500 text-white">bin/rails generate avo:dashboard dashy</code>
+    </div>
+  </div>
+
+  <p>
+    <a href="https://docs.avohq.io/2.0/dashboards.html" target="_blank" title="Avo Dashboards documentation">Docs</a>
+  </p>
+</div>
+

data/app/views/avo/home/_filters.html.erb

@@ -11,6 +11,6 @@
       </div>
     </div>
 
-    <a href="https://docs.avohq.io/1.0/filters.html" target="_blank" title="Avo Filters documentation" class="text-bold cursor-pointer block mt-2">Filters in the docs 👉</a>
+    <a href="https://docs.avohq.io/2.0/filters.html" target="_blank" title="Avo Filters documentation" class="text-bold cursor-pointer block mt-2">Filters in the docs 👉</a>
   </div>
 </div>

data/app/views/avo/home/_resources.html.erb

@@ -35,7 +35,7 @@
   <% end %>
 
   <p>
-    <a href="https://docs.avohq.io/1.0/resources.html" target="_blank" title="Avo Resources documentation">Docs</a>
+    <a href="https://docs.avohq.io/2.0/resources.html" target="_blank" title="Avo Resources documentation">Docs</a>
   </p>
 </div>
 

data/app/views/avo/home/failed_to_load.html.erb

@@ -1,4 +1,4 @@
-<%= turbo_frame_wrap(params[:turbo_frame]) do %>
+<%= render Avo::TurboFrameWrapperComponent.new(params[:turbo_frame]) do %>
   <%
   classes = 'absolute inset-auto left-1/2 top-1/2 transform -translate-x-1/2 -translate-y-1/2'
   label = t 'avo.failed_to_load'