spree_admin 5.1.8 → 5.2.0.rc1

data/app/views/spree/admin/posts/filters.html.erb

@@ -0,0 +1,29 @@
+<%= search_form_for [:admin, @search], class: "filter-wrap", data: {controller: "filters dropdown"} do |f| %>
+  <div class="d-flex flex-column flex-lg-row gap-2">
+    <%= render 'spree/admin/shared/filters_search_bar', param: :search_by_title, label: Spree.t(:title) %>
+
+    <%= render 'spree/admin/shared/filters_button' %>
+  </div>
+  <div data-dropdown-target="menu" id="table-filter" class="hidden">
+    <div class="form-group">
+      <%= f.label :author_id_eq, Spree.t(:author) %>
+      <%= f.select :author_id_eq,
+               options_for_select(post_authors_select_options, params.dig(:q, :author_id_eq)),
+               { include_blank: true },
+               { data: { filters_target: :input, controller: 'autocomplete-select' } } %>
+    </div>
+    <div class="form-group">
+      <%= f.label :post_category_id_eq, Spree.t(:category) %>
+      <%= f.select :post_category_id_eq,
+               options_for_select(@post_categories.pluck(:title, :id), params.dig(:q, :post_category_id_eq)),
+               { include_blank: true },
+               { data: { filters_target: :input, controller: 'autocomplete-select' } } %>
+    </div>
+    <%= render_admin_partials(:posts_filters_partials, f: f) %>
+    <%= render 'spree/admin/shared/filter_submit' %>
+  </div>
+
+  <%= render "spree/admin/shared/filter_badge_template" %>
+
+  <div data-filters-target="badgesContainer" class="filter-badges-container"></div>
+<% end %>

data/app/views/spree/admin/posts/index.html.erb

@@ -7,27 +7,4 @@
 
 <%= render_admin_partials(:posts_header_partials) %>
 
-<div class="card-lg">
-  <%= render "spree/admin/posts/filters" %>
-  <% if @collection.any? %>
-    <div class="table-responsive rounded-lg">
-      <table class="table">
-        <thead>
-          <tr>
-            <th><%= sort_link @search, :title, Spree.t(:title) %></th>
-            <th><%= Spree.t(:category) %></th>
-            <th><%= Spree.t(:author) %></th>
-            <th><%= sort_link @search, :published_at, Spree.t(:published_at) %></th>
-            <th></th>
-          </tr>
-        </thead>
-        <tbody>
-          <%= render collection: @collection, partial: "spree/admin/posts/post", cached: spree_base_cache_scope %>
-        </tbody>
-      </table>
-    </div>
-    <%= render "spree/admin/shared/index_table_options", collection: @collection %>
-  <% else %>
-    <%= render 'spree/admin/shared/no_resource_found' %>
-  <% end %>
-</div>
+<%= render 'spree/admin/shared/index_table' %>

data/app/views/spree/admin/products/_bulk_operations.html.erb

@@ -18,21 +18,11 @@
       url: spree.bulk_status_update_admin_products_path(status: :draft)
     ) %>
 
-    <div class="dropdown dropup" role="group">
-      <button
-        type="button"
-        data-display="static"
-        class="btn btn-light"
-        data-placement="bottom"
-        data-toggle="dropdown"
-        aria-expanded="false"
-      >
+    <%= dropdown do %>
+      <%= dropdown_toggle do %>
         <%= icon('dots-vertical', class: "mr-0") %>
-      </button>
-      <div
-        class="dropdown-menu dropdown-menu-left"
-        aria-labelledby="btnGroupDrop1"
-      >
+      <% end %>
+      <%= dropdown_menu direction: 'top', class: 'mb-2' do %>
         <%= bulk_action_link(
           Spree.t("admin.bulk_ops.products.title.set_status", status: :archived),
           spree.bulk_modal_admin_products_path(kind: :set_status, status: :archived),
@@ -80,8 +70,8 @@
             class: "dropdown-item"
           ) %>
         <% end %>
-      </div>
-    </div>
+      <% end %>
+    <% end %>
 
     <%= bulk_operations_close_button %>
   </div>

data/app/views/spree/admin/products/_filters.html.erb

@@ -3,8 +3,7 @@
 <%= search_form_for product_list_filters_search_form_path,
   class: "filter-wrap",
   data: {
-    controller: "filters reveal",
-    reveal_hidden_class: "d-none",
+    controller: "filters dropdown",
     filters_url_value: request.url
   } do |f| %>
   <%= hidden_field_tag :frame_name, frame_name if frame_name.present? %>
@@ -14,45 +13,39 @@
     <%= render "spree/admin/products/table_filter_dropdown" %>
     <%= render 'spree/admin/shared/filters_button' %>
   </div>
-  <div data-reveal-target="item" class="d-none" id="table-filter">
+  <div data-dropdown-target="menu" id="table-filter" class="hidden">
     <%= f.hidden_field :status_eq, value: params.dig(:q, :status_eq) %>
-    <div class="row">
-      <div class="col-12 col-lg-6">
-        <div class="form-group">
-          <%= f.label :taxons_id_in, Spree.t(:taxons) %>
-          <% @categories = current_store.taxons.where(id: params.dig(:q, :taxons_id_in)).pluck(:pretty_name, :id) if params.dig(
-            :q,
-            :taxons_id_in,
-          ) %>
-          <%= tom_select_tag "q[taxons_id_in]",
-          multiple: true,
-          preloaded_options: @categories,
-          active_option: params.dig(:q, :taxons_id_in),
-          empty_option: Spree.t(:without_taxon),
-          url: spree.admin_taxons_select_options_path(format: :json),
-          select_data: {
-            filters_target: "input",
-          } %>
-        </div>
-      </div>
-
-      <div class="col-12 col-lg-6">
-        <div class="form-group">
-          <%= f.label :tags_name_in, Spree.t(:tags) %>
-          <%= tom_select_tag "q[tags_name_in]",
-          active_option: params[:q][:tags_name_in],
-          options: tags_json_array,
-          multiple: true,
-          value_field: :name,
-          select_class: "w-100",
-          select_data: {
-            filters_target: "input",
-          } %>
-        </div>
-      </div>
-      <%= render_admin_partials(:products_filters_partials, f: f) %>
+    <div class="form-group">
+      <%= f.label :taxons_id_in, Spree.t(:taxons) %>
+      <% @categories = current_store.taxons.where(id: params.dig(:q, :taxons_id_in)).pluck(:pretty_name, :id) if params.dig(
+        :q,
+        :taxons_id_in,
+      ) %>
+      <%= tom_select_tag "q[taxons_id_in]",
+      multiple: true,
+      preloaded_options: @categories,
+      active_option: params.dig(:q, :taxons_id_in),
+      empty_option: Spree.t(:without_taxon),
+      url: spree.admin_taxons_select_options_path(format: :json),
+      select_data: {
+        filters_target: "input",
+      } %>
     </div>
 
+    <div class="form-group">
+      <%= f.label :tags_name_in, Spree.t(:tags) %>
+      <%= tom_select_tag "q[tags_name_in]",
+      active_option: params[:q][:tags_name_in],
+      options: tags_json_array,
+      multiple: true,
+      value_field: :name,
+      select_class: "w-100",
+      select_data: {
+        filters_target: "input",
+      } %>
+    </div>
+    
+    <%= render_admin_partials(:products_filters_partials, f: f) %>
     <%= render 'spree/admin/shared/filter_submit' %>
   </div>
 

data/app/views/spree/admin/products/_form.html.erb

@@ -1,13 +1,14 @@
 <div class="row" data-controller="product-form slug-form seo-form" data-seo-form-editor-value="tinymce">
   <div class="col-md-8">
     <%= render 'spree/admin/products/form/base', f: f %>
-    <%= render 'spree/admin/variants/form/media', viewable: @product.master %>
+    <%= render 'spree/admin/shared/media_form', viewable: @product.master, viewable_type: 'Spree::Variant' %>
     <%= f.fields_for :master, @product.master do |vf| %>
       <%= render 'spree/admin/variants/form/pricing', f: vf %>
     <% end unless @product.has_variants? %>
     <%= render 'spree/admin/products/form/variants', f: f %>
     <%= render 'spree/admin/products/form/inventory', f: f unless @product.has_variants? %>
-    <%= render 'spree/admin/products/form/properties', f: f %>
+    <%= render 'spree/admin/products/form/properties', f: f if Spree::Config[:product_properties_enabled] %>
+
     <%= render_admin_partials(:product_form_partials, f: f, product: @product) %>
   </div>
   <div class="col-md-4">

data/app/views/spree/admin/products/_list.html.erb

@@ -1,5 +1,5 @@
   <% if @collection.any? %>
-    <div data-controller="bulk-operation" data-action="keydown.esc->bulk-operation#cancel" tabindex="0">
+    <div data-controller="bulk-operation bulk-dialog" data-action="keydown.esc->bulk-operation#cancel" tabindex="0">
       <%= form_tag spree.admin_products_path, method: :put, data: { 'bulk-operation-target': 'form' } do %>
         <%= render 'spree/admin/shared/bulk_modal' %>
         <%= render 'spree/admin/products/bulk_operations' %>

data/app/views/spree/admin/products/_product.html.erb

@@ -13,7 +13,7 @@
     <% end %>
   </td>
   <%= render 'spree/admin/products/product_status', product: product %>
-  <td class="text-muted w-20 cursor-pointer text-wrap" data-action="click->row-link#openLink">
+  <td class="w-20 cursor-pointer text-wrap" data-action="click->row-link#openLink">
     <%= display_inventory(product) %>
   </td>
   <% if defined?(current_vendor) %>

data/app/views/spree/admin/products/_table_filter_dropdown.html.erb

@@ -1,5 +1,5 @@
-<div class="dropdown">
-  <button class="btn btn-light dropdown-toggle" type="button" data-toggle="dropdown" data-display="static" data-flip="false" aria-expanded="false">
+<%= dropdown do %>
+  <%= dropdown_toggle class: 'btn-light dropdown-toggle' do %>
     <span class="text-muted font-weight-normal mr-1">
       <%= Spree.t(:show) %>
     </span>
@@ -12,8 +12,8 @@
       <% end %>
       <%= product_filter_stock_dropdown_value if product_filter_stock_dropdown_value != Spree.t('admin.products.any_stock') %>
     <% end %>
-  </button>
-  <div class="dropdown-menu w-100" style="min-width: 200px">
+  <% end %>
+  <%= dropdown_menu class: 'w-100', style: 'min-width: 200px' do %>
     <h6 class="dropdown-header"><%= Spree.t('admin.products.by_status') %>:</h6>
 
     <%= active_link_to Spree.t('admin.products.all_statuses'), params.to_unsafe_h.deep_merge({page: nil, q: {status_eq: nil}}), class: 'dropdown-item', active: (params[:q] || {}).values_at(*%w[status_eq in_stock_items out_of_stock_items] ).all?(&:blank?) %>
@@ -38,5 +38,5 @@
       <%= link_to Spree.t('admin.products.out_of_stock'),
         params.to_unsafe_h.deep_merge({page: nil, q: {out_of_stock_items: '1', in_stock_items: nil}}),
         class: "dropdown-item #{'active' if params[:q][:out_of_stock_items] == '1'}" %>
-  </div>
-</div>
+  <% end %>
+<% end %>

data/app/views/spree/admin/products/bulk_modal.html.erb

@@ -1,18 +1,16 @@
-<%= turbo_frame_tag :bulk_modal do %>
-  <div class="modal-content">
-    <%= modal_header(@title) %>
-    <div class="modal-body">
-      <p><%= @body %></p>
+<%= turbo_frame_tag :bulk_dialog do %>
+  <%= dialog_header(@title, 'bulk-dialog') %>
+  <div class="dialog-body overflow-visible">
+    <p><%= @body %></p>
 
-      <% if params[:kind] == 'add_to_taxons' || params[:kind] == 'remove_from_taxons' %>
-        <%= tom_select_tag 'taxon_ids', multiple: true, class: 'w-100', url: spree.admin_taxons_select_options_path(format: :json), required: true %>
-      <% elsif params[:kind] == 'add_tags' || params[:kind] == 'remove_tags' %>
-        <%= tom_select_tag 'tags', multiple: true, class: 'w-100', options: tags_json_array, required: true, value_field: :name, create: params[:kind] == 'add_tags' %>
-      <% end %>
-    </div>
-    <div class="modal-footer">
-      <%= modal_discard_button %>
-      <%= turbo_save_button_tag %>
-    </div>
+    <% if params[:kind] == 'add_to_taxons' || params[:kind] == 'remove_from_taxons' %>
+      <%= tom_select_tag 'taxon_ids', multiple: true, class: 'w-100', url: spree.admin_taxons_select_options_path(format: :json), required: true %>
+    <% elsif params[:kind] == 'add_tags' || params[:kind] == 'remove_tags' %>
+      <%= tom_select_tag 'tags', multiple: true, class: 'w-100', options: tags_json_array, required: true, value_field: :name, create: params[:kind] == 'add_tags' %>
+    <% end %>
+  </div>
+  <div class="dialog-footer">
+    <%= dialog_discard_button('bulk-dialog') %>
+    <%= turbo_save_button_tag %>
   </div>
 <% end %>

data/app/views/spree/admin/products/edit.html.erb

@@ -1,5 +1,4 @@
 <% content_for :page_actions_dropdown do %>
-  <%= link_to_edit_translations(@product) %>
   <%= link_to_with_icon(
     "files",
     Spree.t(:digital_assets),

data/app/views/spree/admin/products/form/_base.html.erb

@@ -1,10 +1,6 @@
 <div class="card mb-4">
   <div class="card-body">
-    <div class="form-group">
-      <%= f.label :name, Spree.t(:name) %>
-      <%= f.text_field :name, class: 'form-control', required: true, autofocus: f.object.new_record?, data: { seo_form_target: 'sourceTitleInput', slug_form_target: :name, action: 'slug-form#updateUrlFromName' } %>
-      <%= f.error_message_on :name %>
-    </div>
+    <%= f.spree_text_field :name, required: true, autofocus: f.object.new_record?, data: { seo_form_target: 'sourceTitleInput', slug_form_target: :name, action: 'slug-form#updateUrlFromName' } %>
 
     <div class="form-group mb-0">
       <%= f.label :description, Spree.t(:description) %>

data/app/views/spree/admin/products/form/_properties.html.erb

@@ -10,8 +10,8 @@
     <table class="table">
       <thead>
         <tr>
-          <th><%= Spree.t(:property) %></th>
-          <th><%= Spree.t(:value) %></th>
+          <th scope="col"><%= Spree.t(:property) %></th>
+          <th scope="col"><%= Spree.t(:value) %></th>
         </tr>
       </thead>
       <tbody>

data/app/views/spree/admin/products/form/_shipping.html.erb

@@ -7,10 +7,6 @@
       <%= render 'spree/admin/variants/form/dimensions', f: f %>
     <% end %>
 
-    <div class="form-group">
-      <%= f.label :shipping_category_id, Spree.t(:shipping_category) %>
-      <%= f.select(:shipping_category_id, @shipping_categories.pluck(:name, :id), { include_blank: Spree.t('match_choices.none') }, { class: 'custom-select' }) %>
-      <%= f.error_message_on :shipping_category %>
-    </div>
+    <%= f.spree_select :shipping_category_id, @shipping_categories.pluck(:name, :id), { include_blank: Spree.t('match_choices.none'), label: Spree.t(:shipping_category) } %>
   </div>
 </div>

data/app/views/spree/admin/products/form/_tax.html.erb

@@ -3,10 +3,6 @@
     <h5 class="card-title"><%= Spree.t(:tax) %></h5>
   </div>
   <div class="card-body">
-    <div class="form-group">
-      <%= f.label :tax_category_id, Spree.t(:tax_category) %>
-      <%= f.select(:tax_category_id, @tax_categories.pluck(:name, :id), { include_blank: false }, { class: 'custom-select' }) %>
-      <%= f.error_message_on :tax_category %>
-    </div>
+    <%= f.spree_select :tax_category_id, @tax_categories.pluck(:name, :id), { include_blank: false, label: Spree.t(:tax_category) } %>
   </div>
 </div>

data/app/views/spree/admin/products/form/_variants.html.erb

@@ -63,7 +63,7 @@
                     action: "variants-form#handleSelectedOptionName tomSelectInitialized->variants-form#refreshOptionNameSelect"
                   } %>
                 <% if can?(:manage, Spree::OptionType) %>
-                  <p class="form-text text-muted mt-2">
+                  <p class="form-text mt-2">
                     <%= Spree.t('admin.products.variants.option_types_link', link: spree.admin_option_types_path).html_safe %>
                   </p>
                 <% end %>

data/app/views/spree/admin/products/index.html.erb

@@ -4,6 +4,8 @@
 
 <% content_for :page_actions do %>
   <%= render_admin_partials(:products_actions_partials) %>
+  <%= link_to_with_icon 'table-import', Spree.t(:import), spree.new_admin_import_path(type: 'Spree::Imports::Products'), class: 'btn btn-light', data: { action: 'drawer#open',turbo_frame: :drawer } if can?(:create, Spree::Import) %>
+  <%= link_to_export_modal %>
   <%= link_to_with_icon 'plus', Spree.t(:new_product), new_object_url, class: 'btn btn-primary' if can?(:create, Spree::Product) %>
 <% end %>
 
@@ -16,8 +18,11 @@
       <%= render 'list' %>
     <% end %>
   <% else %>
-    <%= render 'filters' %>
-    <%= render 'list' %>
+    <%= turbo_frame_tag "products", autoscroll: true, data: { autoscroll_behavior: :smooth, turbo_action: 'advance' } do %>
+      <%= render 'spree/admin/shared/export_modal', export_type: Spree::Exports::Products %>
+      <%= render 'filters' %>
+      <%= render 'list' %>
+    <% end %>
   <% end %>
 </div>
 

data/app/views/spree/admin/promotion_actions/_promotion_action.html.erb

@@ -4,15 +4,15 @@
       <h5 class="card-title"><%= promotion_action.human_name %></h5>
 
       <% if can?(:update, promotion_action) || can?(:destroy, promotion_action) %>
-        <div class="dropdown">
-          <button class="btn btn-light btn-sm px-1" type="button" data-toggle="dropdown" aria-expanded="false">
+        <%= dropdown do %>
+          <%= dropdown_toggle class: 'btn-light btn-sm px-1' do %>
             <%= icon('dots-vertical', class: 'mr-0') %>
-        </button>
-        <div class="dropdown-menu">
-            <%= link_to_with_icon 'pencil', Spree.t('actions.edit'), spree.edit_admin_promotion_action_path(promotion_action.promotion, promotion_action), class: 'dropdown-item' if can?(:update, promotion_action) %> 
+          <% end %>
+          <%= dropdown_menu do %>
+            <%= link_to_with_icon 'pencil', Spree.t('actions.edit'), spree.edit_admin_promotion_action_path(promotion_action.promotion, promotion_action), class: 'dropdown-item' if can?(:update, promotion_action) %>
             <%= link_to_with_icon 'trash', Spree.t('actions.destroy'), spree.admin_promotion_action_path(promotion_action.promotion, promotion_action), class: 'dropdown-item btn-danger', data: { turbo_method: :delete, turbo_confirm: Spree.t(:are_you_sure), turbo_frame: '_top' } if can?(:destroy, promotion_action) %>
-          </div>
-        </div>
+          <% end %>
+        <% end %>
       <% end %>
     </div>
     <div class="card-body">

data/app/views/spree/admin/promotion_actions/forms/_create_line_items.html.erb

@@ -11,9 +11,9 @@
     <table class="table">
       <thead>
         <tr>
-          <th><%= Spree.t(:variant) %></th>
-          <th><%= Spree.t(:quantity) %></th>
-          <th></th>
+          <th scope="col"><%= Spree.t(:variant) %></th>
+          <th scope="col"><%= Spree.t(:quantity) %></th>
+          <th scope="col"></th>
         </tr>
       </thead>
       <tbody>
@@ -23,7 +23,7 @@
         <!-- Inserted elements will be injected before that target. -->
         <tr data-nested-form-target="target">
           <td colspan="3">
-            <button type="button" class="btn btn-link" data-action="nested-form#add">
+            <button type="button" class="btn btn-secondary" data-action="nested-form#add">
               <%= icon('plus', class: 'mr-2') %>
               <%= Spree.t(:add_one)%>
             </button>

data/app/views/spree/admin/promotion_actions/new.html.erb

@@ -1,43 +1,37 @@
-<%= turbo_frame_tag :dialog_modal do %>
+<%= turbo_frame_tag :dialog do %>
   <%= form_with model: @promotion_action, url: spree.admin_promotion_actions_path(@promotion), method: :post, scope: :promotion_action do |f| %>
-    <div class="modal-content">
+    <% if @promotion_action.type.nil? %>
+      <%= dialog_header(Spree.t(:add_action_of_type)) %>
+    <% else %>
+      <%= dialog_header(@promotion_action.human_name) %>
+    <% end %>
+    <div class="dialog-body">
+      <%= render partial: 'spree/admin/shared/error_messages', locals: { target: @promotion_action } %>
       <% if @promotion_action.type.nil? %>
-        <%= modal_header(Spree.t(:add_action_of_type)) %>
-      <% else %>
-        <%= modal_header(@promotion_action.human_name) %>
-      <% end %>
-      <div class="modal-body">
-        <%= render partial: 'spree/admin/shared/error_messages', locals: { target: @promotion_action } %>
-        <% if @promotion_action.type.nil? %>
-          <%= render 'spree/admin/shared/spinner' %>
-          <ul class="list-group">
-            <% options_for_promotion_action_types(@promotion).each do |action_type| %>
-              <% key = action_type.to_s.demodulize.underscore %>
-              <li class="list-group-item p-0 overflow-hidden">
-                <%= link_to spree.new_admin_promotion_action_path(@promotion, promotion_action: { type: action_type }), class: 'd-flex align-items-top w-100 py-2 px-3 hover-light text-primary', data: { turbo_prefetch: false } do %>
-                  <%= radio_button_tag :type, action_type, checked: @promotion_action.type == action_type %>
-                  <div class="ml-3">
-                    <h6><%= Spree.t("promotion_action_types.#{key}.name") %></h6>
-                    <p class="text-muted mb-0"><%= Spree.t("promotion_action_types.#{key}.description") %></p>
-                  </div>
-                <% end %>
-              </li>
+        <%= render 'spree/admin/shared/spinner' %>
+        <% options_for_promotion_action_types(@promotion).each do |action_type| %>
+          <% key = action_type.to_s.demodulize.underscore %>
+            <%= link_to spree.new_admin_promotion_action_path(@promotion, promotion_action: { type: action_type }), class: 'd-flex align-items-top w-100 py-2 px-3 hover-gray rounded-lg mb-2', data: { turbo_prefetch: false } do %>
+              <%= radio_button_tag :type, action_type, checked: @promotion_action.type == action_type %>
+              <div class="ml-3">
+                <h6><%= Spree.t("promotion_action_types.#{key}.name") %></h6>
+                <p class="text-muted mb-0"><%= Spree.t("promotion_action_types.#{key}.description") %></p>
+              </div>
             <% end %>
-          </ul>
-        <% else %>
-          <p class="text-muted">
-            <%= @promotion_action.human_description %>
-          </p>
-          <%= f.hidden_field :type, value: @promotion_action.type %>
-          <%= render "spree/admin/promotion_actions/forms/#{@promotion_action.key}", f: f %>
         <% end %>
-      </div>
-      <% if @promotion_action.type.present? %>
-        <div class="modal-footer">
-          <%= modal_discard_button %>
-          <%= turbo_save_button_tag Spree.t('actions.create'), data: { turbo_frame: '_top' } %>
-        </div>
+      <% else %>
+        <p class="text-muted">
+          <%= @promotion_action.human_description %>
+        </p>
+        <%= f.hidden_field :type, value: @promotion_action.type %>
+        <%= render "spree/admin/promotion_actions/forms/#{@promotion_action.key}", f: f %>
       <% end %>
     </div>
+    <% if @promotion_action.type.present? %>
+      <div class="dialog-footer">
+        <%= dialog_discard_button %>
+        <%= turbo_save_button_tag Spree.t('actions.create'), data: { turbo_frame: '_top' } %>
+      </div>
+    <% end %>
   <% end %>
 <% end %>

data/app/views/spree/admin/promotion_rules/_promotion_rule.html.erb

@@ -4,15 +4,15 @@
       <h5 class="card-title"><%= promotion_rule.human_name %></h5>
 
       <% if can?(:update, promotion_rule) || can?(:destroy, promotion_rule) %>
-        <div class="dropdown">
-          <button class="btn btn-light btn-sm px-1" type="button" data-toggle="dropdown" aria-expanded="false">
+        <%= dropdown do %>
+          <%= dropdown_toggle class: 'btn-light btn-sm px-1' do %>
             <%= icon('dots-vertical', class: 'mr-0') %>
-        </button>
-        <div class="dropdown-menu">
-          <%= link_to_with_icon 'pencil', Spree.t('actions.edit'), spree.edit_admin_promotion_rule_path(promotion_rule.promotion, promotion_rule), class: 'dropdown-item' if can?(:update, promotion_rule) %>
-          <%= link_to_with_icon 'trash', Spree.t('actions.destroy'), spree.admin_promotion_rule_path(promotion_rule.promotion, promotion_rule), class: 'dropdown-item btn-danger', data: { turbo_method: :delete, turbo_confirm: Spree.t(:are_you_sure), turbo_frame: '_top' } if can?(:destroy, promotion_rule) %>
-          </div>
-        </div>
+          <% end %>
+          <%= dropdown_menu do %>
+            <%= link_to_with_icon 'pencil', Spree.t('actions.edit'), spree.edit_admin_promotion_rule_path(promotion_rule.promotion, promotion_rule), class: 'dropdown-item' if can?(:update, promotion_rule) %>
+            <%= link_to_with_icon 'trash', Spree.t('actions.destroy'), spree.admin_promotion_rule_path(promotion_rule.promotion, promotion_rule), class: 'dropdown-item btn-danger', data: { turbo_method: :delete, turbo_confirm: Spree.t(:are_you_sure), turbo_frame: '_top' } if can?(:destroy, promotion_rule) %>
+          <% end %>
+        <% end %>
       <% end %>
     </div>
     <div class="card-body">

data/app/views/spree/admin/promotion_rules/forms/_item_total.html.erb

@@ -19,7 +19,7 @@
   <div class="col-6">
     <%= f.number_field :preferred_amount_max, class: 'form-control' %>
 
-    <span class="form-text text-muted mt-2">
+    <span class="form-text mt-2">
       Leave this field blank to not limit the maximum amount.
     </span>
   </div>

data/app/views/spree/admin/promotion_rules/new.html.erb

@@ -1,43 +1,37 @@
-<%= turbo_frame_tag :dialog_modal do %>
+<%= turbo_frame_tag :dialog do %>
   <%= form_with model: @promotion_rule, url: spree.admin_promotion_rules_path(@promotion), method: :post, scope: :promotion_rule do |f| %>
-    <div class="modal-content">
+    <% if @promotion_rule.type.nil? %>
+      <%= dialog_header(Spree.t(:add_rule_of_type)) %>
+    <% else %>
+      <%= dialog_header(@promotion_rule.human_name) %>
+    <% end %>
+    <div class="dialog-body">
+      <%= render partial: 'spree/admin/shared/error_messages', locals: { target: @promotion_rule } %>
       <% if @promotion_rule.type.nil? %>
-        <%= modal_header(Spree.t(:add_rule_of_type)) %>
-      <% else %>
-        <%= modal_header(@promotion_rule.human_name) %>
-      <% end %>
-      <div class="modal-body">
-        <%= render partial: 'spree/admin/shared/error_messages', locals: { target: @promotion_rule } %>
-        <% if @promotion_rule.type.nil? %>
-          <%= render 'spree/admin/shared/spinner' %>
-          <ul class="list-group">
-            <% options_for_promotion_rule_types(@promotion).each do |rule_type| %>
-              <% key = rule_type.demodulize.underscore %>
-              <li class="list-group-item p-0 overflow-hidden">
-                <%= link_to spree.new_admin_promotion_rule_path(@promotion, promotion_rule: { type: rule_type }), class: 'd-flex align-items-top w-100 py-2 px-3 hover-light text-primary', data: { turbo_prefetch: false } do %>
-                  <%= radio_button_tag :type, rule_type %>
-                  <div class="ml-3">
-                    <h6><%= Spree.t("promotion_rule_types.#{key}.name") %></h6>
-                    <p class="text-muted mb-0"><%= Spree.t("promotion_rule_types.#{key}.description") %></p>
-                  </div>
-                <% end %>
-              </li>
-            <% end %>
-          </ul>
-        <% else %>
-          <p class="text-muted">
-            <%= @promotion_rule.human_description %>
-          </p>
-          <%= f.hidden_field :type, value: @promotion_rule.type %>
-          <%= render "spree/admin/promotion_rules/forms/#{@promotion_rule.key}", f: f %>
+        <%= render 'spree/admin/shared/spinner' %>
+        <% options_for_promotion_rule_types(@promotion).each do |rule_type| %>
+          <% key = rule_type.demodulize.underscore %>
+          <%= link_to spree.new_admin_promotion_rule_path(@promotion, promotion_rule: { type: rule_type }), class: 'd-flex align-items-top w-100 py-2 px-3 hover-gray rounded-lg mb-2', data: { turbo_prefetch: false } do %>
+            <%= radio_button_tag :type, rule_type %>
+            <div class="ml-3">
+              <h6 class="font-weight-bold mb-1"><%= Spree.t("promotion_rule_types.#{key}.name") %></h6>
+              <p class="text-muted mb-0"><%= Spree.t("promotion_rule_types.#{key}.description") %></p>
+            </div>
+          <% end %>
         <% end %>
-      </div>
-      <% if @promotion_rule.type.present? %>
-        <div class="modal-footer">
-          <%= modal_discard_button %>
-          <%= turbo_save_button_tag Spree.t('actions.create'), data: { turbo_frame: '_top' } %>
-        </div>
+      <% else %>
+        <p class="text-muted">
+          <%= @promotion_rule.human_description %>
+        </p>
+        <%= f.hidden_field :type, value: @promotion_rule.type %>
+        <%= render "spree/admin/promotion_rules/forms/#{@promotion_rule.key}", f: f %>
       <% end %>
     </div>
+    <% if @promotion_rule.type.present? %>
+      <div class="dialog-footer">
+        <%= dialog_discard_button %>
+        <%= turbo_save_button_tag Spree.t('actions.create'), data: { turbo_frame: '_top' } %>
+      </div>
+    <% end %>
   <% end %>
 <% end %>