avo 2.9.1.pre3 → 2.9.1.pre6

data/app/components/avo/actions_component.rb

@@ -43,10 +43,14 @@ class Avo::ActionsComponent < ViewComponent::Base
   end
 
   def single_record_path(id)
-    "#{@resource.record_path}/actions/#{id}"
+    Avo::Services::URIService.parse(@resource.record_path)
+      .append_paths("actions", id)
+      .to_s
   end
 
   def many_records_path(id)
-    "#{@resource.records_path}/actions/#{id}"
+    Avo::Services::URIService.parse(@resource.records_path)
+      .append_paths("actions", id)
+      .to_s
   end
 end

data/app/components/avo/fields/common/key_value_component.html.erb

@@ -3,7 +3,7 @@
   data-key-value-target="controller"
   data-options="<%= @field.options.to_json %>"
   data-input-classes="<%= input_classes %>"
-  data-editable="<%= @view.in?([:edit, :create]) %>"
+  data-editable="<%= @view.in?([:edit, :new]) %>"
 >
   <div class="w-full flex flex-col">
     <div class="flex w-full">
@@ -14,7 +14,7 @@
         <div class="w-1/2 py-3 px-3 uppercase font-semibold text-xs text-white">
           <%= @field.value_label %>
         </div>
-        <% if @view.in?([:edit, :create]) %>
+        <% if @view.in?([:edit, :new]) %>
           <div class="flex items-center justify-center p-2 px-3 border-l border-gray-600">
             <a href="javascript:void(0);"
               title="<%= @field.action_text %>"

data/app/components/avo/fields/common/single_file_viewer_component.rb

@@ -10,7 +10,7 @@ class Avo::Fields::Common::SingleFileViewerComponent < ViewComponent::Base
   end
 
   def destroy_path
-    "#{@resource.record_path}/active_storage_attachments/#{id}/#{file.id}"
+    Avo::Services::URIService.parse(@resource.record_path).append_paths("active_storage_attachments", id, file.id).to_s
   end
 
   def id

data/app/components/avo/fields/date_field/edit_component.html.erb

@@ -6,6 +6,7 @@
         'date-field-target': 'input',
         'first-day-of-week': @field.first_day_of_week,
         'picker-format': @field.picker_format,
+        'disable-mobile': @field.disable_mobile,
         'enable-time': false,
         format: @field.format,
         placeholder: @field.placeholder,

data/app/components/avo/fields/date_time_field/edit_component.html.erb

@@ -1,18 +1,16 @@
 <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal do %>
-  <%= content_tag :div, data: {
-      controller: "date-field",
-      date_field_view_value: @view,
-      date_field_enable_time_value: true,
-      date_field_picker_format_value: @field.picker_format,
-      date_field_first_day_of_week_value: @field.first_day_of_week,
-      date_field_time24_hr_value: @field.time_24hr,
-      date_field_timezone_value: @field.timezone,
-  } do %>
+  <div data-controller="date-field">
     <%= @form.datetime_field @field.id,
-      value: @field.edit_formatted_value,
       class: classes("w-full"),
       data: {
         'date-field-target': 'input',
+        'first-day-of-week': @field.first_day_of_week,
+        'picker-format': @field.picker_format,
+        'disable-mobile': @field.disable_mobile,
+        'enable-time': true,
+        time24hr: @field.time_24hr,
+        timezone: @field.timezone,
+        format: @field.format,
         placeholder: @field.placeholder,
         relative: @field.relative,
         **@field.get_html(:data, view: view, element: :input)
@@ -21,5 +19,5 @@
       placeholder: @field.placeholder,
       style: @field.get_html(:style, view: view, element: :input)
     %>
-  <% end %>
+  </div>
 <% end %>

data/app/components/avo/fields/date_time_field/index_component.html.erb

@@ -1,11 +1,3 @@
 <%= index_field_wrapper field: @field, resource: @resource do %>
-   <%= content_tag :div, data: {
-    controller: "date-field",
-    date_field_view_value: @view,
-    date_field_format_value: @field.format,
-    date_field_timezone_value: @field.timezone,
-    date_field_picker_format_value: @field.picker_format,
-  } do %>
-    <%= @field.formatted_value %>
-  <% end %>
+  <%= @field.formatted_value %>
 <% end %>

data/app/components/avo/fields/date_time_field/show_component.html.erb

@@ -1,11 +1,3 @@
 <%= show_field_wrapper field: @field, resource: @resource, index: @index do %>
-  <%= content_tag :div, data: {
-    controller: "date-field",
-    date_field_view_value: @view,
-    date_field_format_value: @field.format,
-    date_field_timezone_value: @field.timezone,
-    date_field_picker_format_value: @field.picker_format,
-  } do %>
-    <%= @field.formatted_value %>
-  <% end %>
+  <%= @field.formatted_value %>
 <% end %>

data/app/components/avo/index/ordering/button_component.rb

@@ -1,6 +1,8 @@
 # frozen_string_literal: true
 
 class Avo::Index::Ordering::ButtonComponent < Avo::Index::Ordering::BaseComponent
+  delegate :view_context, to: ::Avo::App
+
   attr_accessor :resource
   attr_accessor :reflection
   attr_accessor :direction
@@ -18,20 +20,10 @@ class Avo::Index::Ordering::ButtonComponent < Avo::Index::Ordering::BaseComponen
   end
 
   def order_path(args)
-    if reflection.present?
-      path = "#{::Avo::App.root_path}/resources/#{reflection_parent_resource.route_key}/#{params[:id]}/#{field.id}/#{resource.model.id}/order"
+     if reflection.present?
+      view_context.avo.associations_order_path(reflection_parent_resource.route_key, params[:id], field.id, resource.model.id, **args)
     else
-      path = "#{::Avo::App.root_path}/resources/#{resource.route_key}/#{resource.model.id}/order"
+      view_context.avo.resources_order_path(resource.route_key, resource.model.id, **args)
     end
-
-    if args.present?
-      string_args = args.map do |key, value|
-        "#{key}=#{value}"
-      end.join('&')
-
-      path = "#{path}?#{string_args}"
-    end
-
-    path
   end
 end

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

@@ -46,7 +46,7 @@
         }
       %>
       <%= hidden_field_tag :turbo_frame, params[:turbo_frame], id: "turbo_frame_detach_#{@resource.model.id}" if params[:turbo_frame] %>
-      <%= hidden_field_tag :referrer, request.fullpath, id: "referrer_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 %>
 
@@ -71,7 +71,7 @@
       %>
       <%= 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: request.fullpath, id: "referrer_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 %>
   <% end %>
 </div>

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

@@ -41,7 +41,7 @@ class Avo::Index::ResourceControlsComponent < Avo::ResourceComponent
   end
 
   def edit_path
-    #Add the `view` param to let Avo know where to redirect back when the user clicks the `Cancel` button.
+    # 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?
@@ -71,4 +71,8 @@ class Avo::Index::ResourceControlsComponent < Avo::ResourceComponent
   def is_has_many_association
     @reflection.is_a?(::ActiveRecord::Reflection::HasManyReflection) || @reflection.is_a?(::ActiveRecord::Reflection::ThroughReflection)
   end
+
+  def referrer_path
+    Avo::App.root_path(paths: ['resources', params[:resource_name], params[:id], params[:related_name]], query: request.query_parameters.to_h)
+  end
 end

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

@@ -32,7 +32,7 @@ class Avo::Views::ResourceEditComponent < Avo::ResourceComponent
   # The save button is dependent on the edit? policy method.
   # The update? method should be called only when the user clicks the Save button so the developer gets access to the params from the form.
   def can_see_the_save_button?
-    @resource.authorization.authorize_action :edit, raise_exception: false
+    @resource.authorization.authorize_action @view, raise_exception: false
   end
 
   private

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

@@ -117,7 +117,7 @@ class Avo::Views::ResourceIndexComponent < Avo::ResourceComponent
   end
 
   def attach_path
-    "#{Avo::App.root_path}#{request.env["PATH_INFO"]}/new"
+    Avo::App.root_path(paths: [request.env["PATH_INFO"], "new"])
   end
 
   def singular_resource_name
@@ -145,7 +145,7 @@ class Avo::Views::ResourceIndexComponent < Avo::ResourceComponent
     @reflection.active_record.to_s
   end
 
-  def name 
+  def name
     field.custom_name? ? field.name : field.plural_name
   end
 

data/app/controllers/avo/application_controller.rb

@@ -13,7 +13,8 @@ module Avo
     protect_from_forgery with: :exception
     before_action :init_app
     before_action :check_avo_license
-    before_action :set_locale
+    before_action :set_default_locale
+    around_action :set_force_locale
     before_action :set_authorization
     before_action :_authenticate!
     before_action :set_container_classes
@@ -27,7 +28,7 @@ module Avo
     add_flash_types :info, :warning, :success, :error
 
     def init_app
-      Avo::App.init request: request, context: context, root_path: avo.root_path.delete_suffix("/"), current_user: _current_user, view_context: view_context, params: params
+      Avo::App.init request: request, context: context, current_user: _current_user, view_context: view_context, params: params
 
       @license = Avo::App.license
     end
@@ -287,10 +288,30 @@ module Avo
       @resource.form_scope
     end
 
-    def set_locale
+    def set_default_locale
       I18n.locale = params[:set_locale] || I18n.default_locale
 
       I18n.default_locale = I18n.locale
     end
+
+    # Temporary set the locale
+    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
+    end
+
+    def default_url_options
+      if params[:force_locale].present?
+        { **super, force_locale: params[:force_locale] }
+      else
+        super
+      end
+    end
   end
 end

data/app/javascript/avo.js

@@ -74,7 +74,11 @@ document.addEventListener('turbo:frame-load', () => {
 document.addEventListener('turbo:before-fetch-response', async (e) => {
   if (e.detail.fetchResponse.response.status === 500) {
     const { id, src } = e.target
-    e.target.src = `${window.Avo.configuration.root_path}/failed_to_load?turbo_frame=${id}&src=${src}`
+    // Don't try to redirect to failed to load if this is alread a redirection to failed to load and crashed somewhere.
+    // You'll end up with a request loop.
+    if (!e.detail.fetchResponse?.response?.url?.includes('/failed_to_load')) {
+      e.target.src = `${window.Avo.configuration.root_path}/failed_to_load?turbo_frame=${id}&src=${src}`
+    }
   }
 })
 

data/app/javascript/js/controllers/fields/date_field_controller.js

@@ -2,6 +2,8 @@ import { Controller } from '@hotwired/stimulus'
 import { DateTime } from 'luxon'
 import flatpickr from 'flatpickr'
 
+import { castBoolean } from '../../helpers/cast_boolean'
+
 // Get the DateTime with the TZ offset applied.
 function universalTimestamp(timestampStr) {
   return new Date(new Date(timestampStr).getTime() + (new Date(timestampStr).getTimezoneOffset() * 60 * 1000))
@@ -10,99 +12,53 @@ function universalTimestamp(timestampStr) {
 export default class extends Controller {
   static targets = ['input']
 
-  static values = {
-    view: String,
-    timezone: String,
-    format: String,
-    enableTime: Boolean,
-    pickerFormat: String,
-    firstDayOfWeek: Number,
-    time24Hr: Boolean,
-  }
-
-  get browserZone() {
-    const time = DateTime.local()
-
-    return time.zoneName
-  }
-
-  get initialValue() {
-    if (this.isOnShow || this.isOnIndex) {
-      return this.context.element.innerText
-    } if (this.isOnEdit) {
-      return this.inputTarget.value
-    }
-
-    return null
-  }
-
-  get isOnIndex() {
-    return this.viewValue === 'index'
-  }
-
-  get isOnEdit() {
-    return this.viewValue === 'edit'
-  }
-
-  get isOnShow() {
-    return this.viewValue === 'show'
-  }
-
-  // Parse the time as if it were UTC
-  get parsedValue() {
-    return DateTime.fromISO(this.initialValue, { zone: 'UTC' })
-  }
-
-  get displayTimezone() {
-    return this.timezoneValue || this.browserZone
-  }
-
   connect() {
-    if (this.isOnShow || this.isOnIndex) {
-      this.initShow()
-    } else if (this.isOnEdit) {
-      this.initEdit()
-    }
-  }
-
-  // Turns the value in the controller wrapper into the timezone of the browser
-  initShow() {
-    this.context.element.innerText = this.parsedValue.setZone(this.displayTimezone).toFormat(this.formatValue)
-  }
-
-  initEdit() {
     const options = {
       enableTime: false,
       enableSeconds: false,
       // eslint-disable-next-line camelcase
-      time_24hr: this.time24HrValue,
+      time_24hr: false,
       locale: {
         firstDayOfWeek: 0,
       },
       altInput: true,
     }
+    const enableTime = castBoolean(this.inputTarget.dataset.enableTime)
 
     // Set the format of the displayed input field.
-    options.altFormat = this.pickerFormatValue
+    options.altFormat = this.inputTarget.dataset.pickerFormat
+
+    // Disable native input in mobile browsers
+    options.disableMobile = this.inputTarget.dataset.disableMobile
 
     // Set first day of the week.
-    options.locale.firstDayOfWeek = this.firstDayOfWeekValue
+    options.locale.firstDayOfWeek = this.inputTarget.dataset.firstDayOfWeek
 
     // Enable time if needed.
-    options.enableTime = this.enableTimeValue
-    options.enableSeconds = this.enableTimeValue
+    options.enableTime = enableTime
+    options.enableSeconds = enableTime
+
+    let currentValue
 
     // enable timezone display
-    if (this.enableTimeValue) {
-      options.defaultDate = this.parsedValue.setZone(this.displayTimezone).toISO()
+    if (enableTime) {
+      currentValue = DateTime.fromISO(this.inputTarget.value, { zone: window.Avo.configuration.timezone })
+      currentValue = currentValue.setZone(this.inputTarget.dataset.timezone)
+      currentValue = currentValue.toISO()
 
       options.dateFormat = 'Y-m-d H:i:S'
+      // eslint-disable-next-line camelcase
+      options.time_24hr = castBoolean(this.inputTarget.dataset.time24hr)
+      // this.timezone = Intl.DateTimeFormat().resolvedOptions().timeZone
+      options.appTimezone = this.inputTarget.dataset.timezone
     } else {
       // Because the browser treats the date like a timestamp and updates it ot 00:00 hour, when on a western timezone the date will be converted with one day offset.
       // Ex: 2022-01-30 will render as 2022-01-29 on an American timezone
-      options.defaultDate = universalTimestamp(this.initialValue)
+      currentValue = universalTimestamp(this.inputTarget.value)
     }
 
+    options.defaultDate = currentValue
+
     flatpickr(this.inputTarget, options)
   }
 }

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

@@ -0,0 +1,80 @@
+import { AttributeObserver } from '@stimulus/mutation-observers'
+import { Controller } from '@hotwired/stimulus'
+import { castBoolean } from '../helpers/cast_boolean'
+
+export default class extends Controller {
+  static targets = ['tab'];
+
+  static values = {
+    activeTab: String,
+  };
+
+  get currentTab() {
+    return this.tabTargets.find(
+      (element) => element.dataset.tabId === this.activeTabValue,
+    )
+  }
+
+  targetTab(id) {
+    return this.tabTargets.find((element) => element.dataset.tabId === id)
+  }
+
+  changeTab(e) {
+    e.preventDefault()
+
+    const { params } = e
+    const { id } = params
+
+    this.setTheTargetPanelHeight(id)
+
+    this.hideTabs()
+    this.showTab(id)
+    this.markTabLoaded(id)
+
+    this.activeTabValue = id
+  }
+
+  /**
+  * Sets the target container height to the previous panel height so we don't get jerky tab changes.
+  */
+  setTheTargetPanelHeight(id) {
+    // We don't need to add a height to this panel because it was loaded before
+    if (castBoolean(this.targetTab(id).dataset.loaded)) {
+      return
+    }
+
+    // Get the height of the active panel
+    const { height } = this.currentTab.getBoundingClientRect()
+    // Set it to the target panel
+    this.targetTab(id).style.height = `${height}px`
+
+    // Wait until the panel loaded it's content and then remove the forced height
+    const observer = new AttributeObserver(this.targetTab(id), 'busy', {
+      elementUnmatchedAttribute: () => {
+        // The content is not available in an instant so delay the height reset a bit.
+        setTimeout(() => {
+          this.targetTab(id).style.height = ''
+        }, 300)
+        if (observer) observer.stop()
+      },
+    })
+    observer.start()
+  }
+
+  markTabLoaded(id) {
+    this.targetTab(id).dataset.loaded = true
+  }
+
+  showTab(id) {
+    this.tabTargets.forEach((element) => {
+      if (element.dataset.tabId === id) {
+        element.classList.remove('hidden')
+      }
+    })
+    // this.tabTargets.map((element) => element.clasList.add('hidden'))
+  }
+
+  hideTabs() {
+    this.tabTargets.map((element) => element.classList.add('hidden'))
+  }
+}

data/app/views/avo/partials/_javascript.html.erb

@@ -1,6 +1,6 @@
 <%= javascript_tag nonce: true do %>
   window.Avo = window.Avo || { configuration: {} }
   Avo.configuration.timezone = '<%= Avo.configuration.timezone %>'
-  Avo.configuration.root_path = '<%= Avo::App.root_path %>'
+  Avo.configuration.root_path = '<%= Avo.configuration.root_path %>'
   Avo.configuration.search_debounce = '<%= Avo.configuration.search_debounce %>'
 <% end %>

data/config/routes.rb

@@ -23,7 +23,7 @@ Avo::Engine.routes.draw do
     delete "/:resource_name/:id/active_storage_attachments/:attachment_name/:attachment_id", to: "attachments#destroy"
 
     # Ordering
-    patch "/:resource_name/:id/order", to: "resources#order"
+    patch "/:resource_name/:id/order", to: "resources#order", as: "order"
     patch "/:resource_name/:id/:related_name/:related_id/order", to: "associations#order", as: "associations_order"
 
     # Actions

data/lib/avo/app.rb

@@ -29,14 +29,21 @@ module Avo
         end
       end
 
-      def init(request:, context:, current_user:, root_path:, view_context:, params:)
+      # Renerate a dynamic root path using the URIService
+      def root_path(paths: [], query: {}, **args)
+        Avo::Services::URIService.parse(view_context.avo.root_url.to_s)
+          .append_paths(paths)
+          .append_query(query)
+          .to_s
+      end
+
+      def init(request:, context:, current_user:, view_context:, params:)
         self.error_messages = []
-        self.request = request
         self.context = context
         self.current_user = current_user
-        self.root_path = root_path
-        self.view_context = view_context
         self.params = params
+        self.request = request
+        self.view_context = view_context
 
         self.license = Licensing::LicenseManager.new(Licensing::HQ.new(request).response).license
         self.translation_enabled = license.has(:localization)

data/lib/avo/base_card.rb

@@ -59,13 +59,7 @@ module Avo
     def frame_url(enforced_range: nil, params: {})
       enforced_range ||= initial_range || ranges.first
 
-      # append the parent params to the card request
-      begin
-        other_params = "&#{params.permit!.to_h.map { |k, v| "#{k}=#{v}" }.join("&")}"
-      rescue
-      end
-
-      "#{Avo::App.root_path}/dashboards/#{dashboard.id}/cards/#{id}?turbo_frame=#{turbo_frame}&index=#{index}&range=#{enforced_range}#{other_params}"
+      Avo::App.view_context.avo.dashboard_card_path(dashboard.id, id, turbo_frame: turbo_frame, index: index, range: enforced_range, **params.permit!)
     end
 
     def card_classes

data/lib/avo/base_resource.rb

@@ -8,6 +8,7 @@ module Avo
     include Avo::Concerns::HasModel
     include Avo::Concerns::HasFields
     include Avo::Concerns::HasStimulusControllers
+    include Avo::Concerns::ModelClassConstantized
 
     delegate :view_context, to: ::Avo::App
     delegate :simple_format, :content_tag, to: :view_context
@@ -29,7 +30,6 @@ module Avo
     class_attribute :search_query, default: nil
     class_attribute :search_query_help, default: ""
     class_attribute :includes, default: []
-    class_attribute :model_class
     class_attribute :translation_key
     class_attribute :default_view_type, default: :table
     class_attribute :devise_password_optional, default: false

data/lib/avo/concerns/handles_field_args.rb

@@ -28,7 +28,7 @@ module Avo
         add_prop_from_args args, name: name, default: default, type: :array
       end
 
-      def add_string_prop(args, name, default = nil)
+      def add_string_prop(args, name, default = [])
         add_prop_from_args args, name: name, default: default, type: :string
       end
     end

data/lib/avo/concerns/model_class_constantized.rb

@@ -0,0 +1,23 @@
+module Avo
+  module Concerns
+    module ModelClassConstantized
+      extend ActiveSupport::Concern
+
+      class_methods do
+        attr_reader :model_class
+
+        # Cast the model class to a constantized version and memoize it like that
+        def model_class=(value)
+          @model_class = case value
+          when Class
+            value
+          when String, Symbol
+            value.to_s.safe_constantize
+          else
+            raise ArgumentError.new "Failed to find a proper model class for #{self.to_s}"
+          end
+        end
+      end
+    end
+  end
+end

data/lib/avo/dashboards/base_dashboard.rb

@@ -65,7 +65,7 @@ module Avo
         end
 
         def navigation_path
-          "#{Avo::App.root_path}/dashboards/#{id}"
+          Avo::App.view_context.avo.dashboard_path id
         end
 
         def is_visible?

data/lib/avo/fields/date_field.rb

@@ -3,6 +3,7 @@ module Avo
     class DateField < TextField
       attr_reader :first_day_of_week
       attr_reader :picker_format
+      attr_reader :disable_mobile
       attr_reader :format
       attr_reader :relative
 
@@ -13,6 +14,7 @@ module Avo
         @picker_format = args[:picker_format].present? ? args[:picker_format] : "Y-m-d"
         @format = args[:format].present? ? args[:format] : :long
         @relative = args[:relative].present? ? args[:relative] : false
+        @disable_mobile = args[:disable_mobile].present? ? args[:disable_mobile] : false
       end
 
       def formatted_value