spree_admin 5.1.7 → 5.2.0.rc1

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

@@ -1,18 +1 @@
-<% content_for :page_title do %>
-  <%= page_header_back_button spree.admin_roles_url %>
-  <%= Spree.t(:new_role) %>
-<% end %>
-
-<div class="row">
-  <div class="col-lg-6 offset-lg-3">
-    <%= form_for [:admin, @role] do |f| %>
-      <div class="card mb-4">
-        <div class="card-body">
-          <%= render partial: 'spree/admin/shared/error_messages', locals: { target: @role } %>
-          <%= render 'form', f: f %>
-        </div>
-      </div>
-      <%= render 'spree/admin/shared/new_resource_links' %>
-    <% end %>
-  </div>
-</div>
+<%= render 'spree/admin/shared/new_resource' %>

data/app/views/spree/admin/shared/_alerts.html.erb

@@ -1,4 +1,6 @@
-<%= turbo_frame_tag :alerts do %>
+<% frame_name ||= :alerts %>
+
+<%= turbo_frame_tag frame_name do %>
   <% flash.to_h.each do |msg_type, text| %>
     <div class="alerts-container" style="pointer-events: none;">
       <div class="d-flex justify-content-center px-2">

data/app/views/spree/admin/shared/_back_to_dashboard.html.erb

@@ -0,0 +1 @@
+<%= link_to_with_icon 'arrow-back', Spree.t('admin.back_to_dashboard'), spree.admin_path, class: 'store-dropdown hover-gray justify-content-start gap-2 px-4' %>

data/app/views/spree/admin/shared/_breadcrumbs.html.erb

@@ -1,7 +1,7 @@
 <nav aria-label="breadcrumb">
   <ol class="breadcrumb">
     <%= render_breadcrumb_icon %>
-    <% if settings_active? %>
+    <% if settings_area? %>
       <li>
         <%= active_link_to Spree.t(:settings), spree.edit_admin_store_path %>
       </li>

data/app/views/spree/admin/shared/_bulk_modal.html.erb

@@ -1,20 +1,14 @@
-<div class="modal fade" id="bulk-modal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
-  <div class="modal-dialog modal-dialog-centered">
-    <%= turbo_frame_tag :bulk_modal do %>
-      <div class="modal-content">
-        <%= modal_header(Spree.t(:loading)) %>
-        <div class="modal-body text-center">
-          <div class="spinner-border text-muted" role="status">
-            <span class="sr-only"><%= Spree.t(:loading) %>...</span>
-          </div>
-        </div>
-        <div class="modal-footer">
-          <%= modal_discard_button %>
-          <button type="button" class="btn btn-primary" disabled="disabled">
-            <%= Spree.t('actions.save') %>
-          </button>
-        </div>
+<dialog class="dialog overflow-visible" data-bulk-dialog-target="dialog" id="bulk-dialog">
+  <%= turbo_frame_tag :bulk_dialog do %>
+    <%= dialog_header(Spree.t(:loading), 'bulk-dialog') %>
+    <div class="dialog-body text-center overflow-visible">
+      <div class="spinner-border text-muted" role="status">
+        <span class="sr-only"><%= Spree.t(:loading) %>...</span>
       </div>
-    <% end %>
-  </div>
-</div>
+    </div>
+    <div class="dialog-footer">
+      <%= dialog_discard_button('bulk-dialog') %>
+      <%= turbo_save_button_tag %>
+    </div>
+  <% end %>
+</dialog>

data/app/views/spree/admin/shared/_calendar_range_picker.html.erb

@@ -7,9 +7,8 @@
 
 <% dropdown_direction ||= 'left' %>
 
-<div data-controller="calendar-range" class="dropdown h-100" 
-     data-action="click->calendar-range#open">
-  <div class="<%= css_classes %>" data-toggle="dropdown">
+<%= dropdown data: { controller: 'dropdown calendar-range', action: 'click->calendar-range#open' }, class: 'h-100' do %>
+  <%= dropdown_toggle class: css_classes do %>
     <%= icon('calendar', class: 'mr-2') %>
     <div data-calendar-range-target="label">
       <% if date_from_value.present? && date_to_value.present? %>
@@ -18,11 +17,11 @@
         <%= Spree.t(:all_time) %>
       <% end %>
     </div>
-  </div>
-  <div class="dropdown-menu dropdown-menu-<%= dropdown_direction %> pb-0 pr-0 pl-1 pt-1" onclick="event.stopPropagation()">
+  <% end %>
+  <%= dropdown_menu direction: dropdown_direction, class: "pt-2 px-2 pb-1" do %>
     <div data-calendar-range-target="picker" class="d-none"></div>
-  </div>
+  <% end %>
 
   <%= hidden_field_tag date_from_input_name, date_from_value&.to_date, data: { 'calendar-range-target': 'dateFrom' } %>
   <%= hidden_field_tag date_to_input_name, date_to_value&.to_date, data: { 'calendar-range-target': 'dateTo' } %>
-</div>
+<% end %>

data/app/views/spree/admin/shared/_close_bulk_modal.turbo_stream.erb

@@ -1,2 +1,5 @@
 <%= turbo_render_alerts %>
-<%= turbo_close_modal('bulk-modal') %>
+
+<%= turbo_stream.replace 'bulk-dialog' do %>
+  <%= render 'spree/admin/shared/bulk_modal' %>
+<% end %>

data/app/views/spree/admin/shared/_content_header.html.erb

@@ -1,26 +1,19 @@
-<% record = @object || @customer_return || @order || @product || @vendor || @user || @admin_user || @taxon || @store_credit %>
-<% record = nil if @user&.is_a?(Spree.admin_user_class) %>
+<% record = @object || @customer_return || @order || @product || @vendor || @user || @admin_user || @taxon || @store_credit || @store %>
 
 <% show_record_subtitle = record && record.persisted? && record.has_attribute?(:updated_at) %>
 <% content_for(:page_subtitle) do %>
-  <%= local_time record.updated_at, class: 'badge badge-light with-tip', title: 'Last update' %>
+  <span class="badge badge-light" data-controller="tooltip">
+    <%= spree_time record.updated_at %>
+    <%= tooltip(Spree.t(:updated_at)) %>
+  </span>
 <% end if show_record_subtitle && !content_for(:page_subtitle) %>
 
 <% if content_for?(:page_title) %>
-  <header id="page-header" class="container-fluid" data-controller="sticky">
+  <header id="page-header" class="container" data-controller="sticky">
     <h3 class="page-header-title mb-0 d-flex align-items-center gap-3">
       <%= yield :page_title %>
     </h3>
     <div id="page_actions" class="ml-auto page-actions d-flex align-items-center gap-2">
-      <% if action_name == 'index' && defined?(model_class) && model_class && Spree::Export.available_models.include?(model_class) && can?(:create, Spree::Export) %>
-        <span data-toggle="modal" data-target="#modal">
-          <%= link_to spree.new_admin_export_path(export: { search_params: params[:q]&.to_json, type: Spree::Export.type_for_model(model_class) }), class: 'btn btn-light bg-transparent with-tip', title: 'Download records as CSV file', data: { turbo_frame: :dialog_modal } do %>
-            <%= icon 'table-export', class: 'mr-0 mr-lg-2' %>
-            <span class="d-none d-lg-inline"><%= Spree.t(:export) %></span>
-          <% end %>
-        </span>
-      <% end %>
-
       <%= yield :page_actions if content_for?(:page_actions) %>
 
       <% if action_name == 'edit' && @object %>
@@ -29,13 +22,17 @@
       <% end %>
 
       <% if show_record_subtitle || content_for(:page_actions_dropdown) %>
-        <div class="dropdown h-100" id="page_actions_dropdown">
-          <%= link_to '#', class: 'btn btn-light bg-transparent h-100 p-2', data: { toggle: 'dropdown' }, id: 'more-actions-link' do %>
+        <%= dropdown id: 'page_actions_dropdown', class: 'h-100' do %>
+          <%= dropdown_toggle id: 'more-actions-link', class: 'btn-light h-100 p-2' do %>
             <%= icon 'dots-vertical', class: 'mr-0' %>
           <% end %>
-          <div class="dropdown-menu dropdown-menu-right">
+          <%= dropdown_menu id: 'page_actions_dropdown_menu' do %>
             <%= yield :page_actions_dropdown if content_for(:page_actions_dropdown) %>
-            <% if record %>
+            <% if record && record.persisted? %>
+              <%= link_to_edit_metafields(record) %>
+              <%= link_to_edit_translations(record) %>
+              <%= link_to_show_json(record) %>
+
               <% if record.respond_to?(:audits) && spree.respond_to?(:admin_audits_path) && defined?(Audited) && can?(:read, Audited.audit_class) %>
                 <a href="<%= spree.admin_audits_path(q: { auditable_id_eq: record.id, auditable_type_eq: record.class.to_s }) %>" target="_blank" class="dropdown-item">
                   <%= icon 'history' %>
@@ -43,17 +40,17 @@
                 </a>
               <% end %>
               <% if record.respond_to?(:number) %>
-                <div data-controller="clipboard">
+                <div data-controller="clipboard" data-clipboard-success-content-value='<%= icon('check') + ' ' + Spree.t(:copied) %>'>
                   <%= hidden_field_tag :record_number, record.number, data: { clipboard_target: 'source' } %>
-                  <button data-action="clipboard#copy" class="text-left dropdown-item">
+                  <button data-action="clipboard#copy" class="text-left dropdown-item" data-clipboard-target="button">
                     <%= icon 'copy' %>
                     <%= 'Copy number' %>
                   </button>
                 </div>
               <% end %>
-              <div data-controller="clipboard">
+              <div data-controller="clipboard" data-clipboard-success-content-value='<%= icon('check') + ' ' + Spree.t(:copied) %>'>
                 <%= hidden_field_tag :record_id, record.id, data: { clipboard_target: 'source' } %>
-                <button data-action="clipboard#copy" class="text-left dropdown-item">
+                <button data-action="clipboard#copy" class="text-left dropdown-item" data-clipboard-target="button">
                   <%= icon 'copy' %>
                   <%= Spree.t(:copy_id) %>
                 </button>
@@ -64,24 +61,9 @@
                 <%= link_to_with_icon 'trash', Spree.t('actions.destroy'), object_url, class: 'dropdown-item btn-danger', data: { turbo_method: :delete, turbo_confirm: Spree.t(:are_you_sure) } %>
               <% end %>
             <% end %>
-          </div>
-        </div>
+          <% end %>
+        <% end%>
       <% end %>
     </div>
   </header>
 <% end %>
-
-<% if content_for?(:page_tabs) %>
-  <div class="container-fluid" id="page-tabs">
-    <ul class="nav">
-      <%= yield :page_tabs %>
-    </ul>
-  </div>
-<% end %>
-<% if content_for(:page_alerts) %>
-  <div class="container">
-    <div class="page-alerts">
-      <%= yield(:page_alerts) %>
-    </div>
-  </div>
-<% end %>

data/app/views/spree/admin/shared/_dialog.html.erb

@@ -0,0 +1,4 @@
+<dialog class="dialog" data-dialog-target="dialog" id="main-dialog">
+  <%= turbo_frame_tag :dialog_alerts %>
+  <%= turbo_frame_tag :dialog %>
+</dialog>

data/app/views/spree/admin/shared/_drawer.html.erb

@@ -0,0 +1,4 @@
+<dialog class="drawer" data-drawer-target="dialog" id="drawer-dialog">
+  <%= turbo_frame_tag :drawer_alerts %>
+  <%= turbo_frame_tag :drawer %>
+</dialog>

data/app/views/spree/admin/shared/_edit_resource.html.erb

@@ -0,0 +1,17 @@
+<% col_class ||= 'col-lg-6 offset-lg-3' %>
+<% page_header_back_button_url ||= collection_url %>
+
+<%= content_for :page_title do %>
+  <%= page_header_back_button(page_header_back_button_url) %>
+  <%= @object.try(:name) || @object.try(:title) || @object.try(:number) %>
+<% end %>
+
+<%= form_with model: [:admin, @object], url: object_url, scope: @resource.object_name, id: "edit_#{controller_name.singularize}_#{@object.id}", data: local_assigns[:data] || {} do |f| %>
+  <div class="row">
+    <div class="<%= col_class %>">
+      <%= render 'spree/admin/shared/error_messages', target: @object %>
+      <%= render 'form', f: f %>
+      <%= render 'spree/admin/shared/edit_resource_links', f: f %>
+    </div>
+  </div>
+<% end %>

data/app/views/spree/admin/shared/_export_modal.html.erb

@@ -0,0 +1,3 @@
+<dialog class="dialog" data-export-dialog-target="dialog" id="export-dialog">
+  <%= turbo_frame_tag :export_dialog, src: spree.new_admin_export_path(export: { search_params: params[:q]&.to_json, type: export_type }) %>
+</dialog>

data/app/views/spree/admin/shared/_filters_button.html.erb

@@ -1,7 +1,7 @@
 <button
-  class="btn btn-light"
+  class="btn btn-light d-flex align-items-center"
   type="button"
-  data-action="reveal#toggle"
+  data-action="dropdown#toggle click@window->dropdown#hide"
 >
   <%= icon "adjustments", class: "mr-1" %>
   <%= Spree.t("admin.filters") %>

data/app/views/spree/admin/shared/_head.html.erb

@@ -8,7 +8,7 @@
   <% if content_for? :title %>
     <%= yield :title %>
   <% else %>
-    <% if @object.present? && @object.persisted? %><%= @object.try(:name) || @object.try(:title) %> - <% end %>
+    <% if @object.present? && @object.persisted? %><%= @object.try(:name) || @object.try(:title) || @object.try(:display_name) || @object.try(:number) %> - <% end %>
     <% if @order.present? && @order.persisted? %><%= @order.number %> - <% end %>
     <%= Spree.t(controller_name, default: controller_name.titleize) %>
   <% end %>
@@ -37,9 +37,13 @@
 <%= tinymce_assets %>
 <link rel="stylesheet" type="text/css" href="https://unpkg.com/trix@2.1.12/dist/trix.css">
 
-<script async src="https://ga.jspm.io/npm:es-module-shims@1.8.2/dist/es-module-shims.js" data-turbo-track="reload"></script>
+<% if Rails.application.importmap.packages["application"].present? && Spree::Admin::RuntimeConfig.include_application_importmap %>
+  <%= javascript_importmap_tags "application" %>
+<% else %>
+  <script async src="https://ga.jspm.io/npm:es-module-shims@1.8.2/dist/es-module-shims.js" data-turbo-track="reload"></script>
+<% end %>
 
-<%= javascript_importmap_tags 'application-spree-admin', importmap: Rails.application.config.spree_admin.importmap %>
+<%= javascript_importmap_tags "application-spree-admin", importmap: Rails.application.config.spree_admin.importmap %>
 
 <%= yield :head %>
 

data/app/views/spree/admin/shared/_header.html.erb

@@ -10,11 +10,8 @@
       </button>
     </div>
 
-    <% if settings_active? %>
-      <%= link_to spree.admin_path, class: 'store-dropdown text-decoration-none px-2 justify-content-start with-tip', title: Spree.t('admin.back_to_dashboard'), data: { admin_target: 'close' } do %>
-        <%= icon 'x', class: 'mx-2' %>
-        <kbd>ESC</kbd>
-      <% end %>
+    <% if settings_area? %>
+      <%= render 'spree/admin/shared/back_to_dashboard' %>
     <% else %>
       <% if defined?(current_vendor) && current_vendor.present? %>
         <%= render 'spree/admin/shared/sidebar/vendor_dropdown' %>

data/app/views/spree/admin/shared/_index_table.html.erb

@@ -0,0 +1,34 @@
+<% sortable = local_assigns[:sortable] %>
+
+<%= turbo_frame_tag controller_name, autoscroll: true, data: { autoscroll_block: :start, autoscroll_behavior: :smooth, turbo_action: 'advance' } do %>
+  <%= render 'spree/admin/shared/export_modal', export_type: export_type if local_assigns[:export_type] %>
+  <div class="card-lg">
+    <% if lookup_context.template_exists?('filters', lookup_context.prefixes, true) %>
+      <%= render 'filters' %>
+    <% end %>
+
+    <% if paginated_collection.any? %>
+      <div class="<% if lookup_context.template_exists?('filters', lookup_context.prefixes, true) %>with-filters<% end %>" id="listing_<%= controller_name %>">
+        <table class="table">
+          <thead>
+            <%= render 'table_header' %>
+          </thead>
+          <tbody
+            <% if sortable %>
+              data-controller="sortable"
+              data-sortable-handle-value=".move-handle"
+              data-sortable-resource-name-value="<%= controller_name.singularize %>"
+              data-sortable-response-kind-value="turbo-stream"
+            <% end %>
+          >
+            <%= render partial: 'table_row', collection: paginated_collection, as: controller_name.singularize %>
+          </tbody>
+        </table>
+      </div>
+
+      <%= render 'spree/admin/shared/index_table_options', collection: paginated_collection %>
+    <% else %>
+      <%= render 'spree/admin/shared/no_resource_found', new_object_url: (new_object_url if can?(:create, model_class)) %>
+    <% end %>
+  </div>
+<% end %>

data/app/views/spree/admin/shared/_index_table_options.html.erb

@@ -5,16 +5,14 @@
   <% args[:action] = per_page_action %>
 <% end %>
 
-<% if collection.any? %>
+<% if collection.any? && collection.respond_to?(:current_page) %>
   <div class="pagination-container">
-    <div class="index-pagination-row d-flex align-items-center">
-      <div class="col-6 col-lg-3">
-        <%= per_page_dropdown %>
-      </div>
-      <div class="d-none d-lg-block col-lg-6 text-center text-muted small">
+    <div class="index-pagination-row d-flex align-items-center justify-content-between px-2">
+      <%= per_page_dropdown %>
+      <div class="d-none d-lg-block text-center text-muted">
         <%= page_entries_info(collection, entry_name: entry_name) %>
       </div>
-      <div class="col-6 col-lg-3 text-right pr-lg-2">
+      <div class="text-right pr-lg-2">
         <%= paginate collection, theme: 'admin-twitter-bootstrap-4' %>
       </div>
     </div>

data/app/views/spree/admin/{variants/form → shared}/_media_asset.html.erb

@@ -7,9 +7,7 @@
     <button class="btn btn-light btn-sm px-1"><%= icon('grip-vertical', class: 'mr-0') %></button>
   </div>
 
-  <div data-toggle="modal" data-target="#modal-lg">
-    <%= link_to spree.edit_admin_asset_path(asset), data: { turbo_frame: 'dialog_modal_lg' } do %>
-      <%= spree_image_tag(asset.attachment, width: 200, height: 200, alt: asset.alt, class: 'w-100 d-block h-100 position-absolute') %>
-    <% end %>
-  </div>
+  <%= link_to spree.edit_admin_asset_path(asset), data: { turbo_frame: 'dialog', action: 'dialog#open' } do %>
+    <%= spree_image_tag(asset.attachment, width: 200, height: 200, alt: asset.alt, class: 'w-100 d-block h-100 position-absolute') %>
+  <% end %>
 </div>

data/app/views/spree/admin/{variants/form/_media.html.erb → shared/_media_form.html.erb}

@@ -12,12 +12,12 @@
           data-sortable-handle-value=".move-handle"
           data-sortable-resource-name-value="asset"
           data-sortable-response-kind-value="json">
-      <%= render partial: 'spree/admin/variants/form/media_asset', collection: media_form_assets(viewable), as: :asset, cached: spree_base_cache_scope %>
+      <%= render partial: 'spree/admin/shared/media_asset', collection: media_form_assets(viewable, viewable_type), as: :asset, cached: spree_base_cache_scope %>
       <%= button_tag class: 'upload-area media-form__add-button', data: {
           controller: 'asset-uploader',
           asset_uploader_multiple_value: true,
           asset_uploader_viewable_id_value: viewable&.id,
-          asset_uploader_viewable_type_value: 'Spree::Variant',
+          asset_uploader_viewable_type_value: viewable_type,
           asset_uploader_allowed_file_types_value: allowed_file_types_for_upload,
           asset_uploader_admin_assets_path_value: spree.admin_assets_path,
           action: 'asset-uploader#open',

data/app/views/spree/admin/shared/_multi_product_picker.html.erb

@@ -1,22 +1,22 @@
-<%= turbo_frame_tag :dialog_modal do %>
-  <div class="modal-content" data-controller="search-picker">
-    <%= modal_header(Spree.t(:add_products)) %>
-    <div class="modal-body border-bottom">
+<%= turbo_frame_tag :dialog do %>
+  <div data-controller="search-picker">
+    <%= dialog_header(Spree.t(:add_products)) %>
+    <div class="dialog-body border-bottom">
       <%= form_with url: spree.search_admin_products_path, method: :post, data: { controller: 'auto-submit'} do |form| %>
         <%= form.hidden_field :omit_ids, value: parent.product_ids.join(',') %>
         <%= form.search_field :q, value: params[:q], class: 'form-control', data: { search_picker_target: :search, action: 'auto-submit#submit' }, autofocus: true %>
       <% end %>
     </div>
     <%= form_with url: url do |form| %>
-      <div class="modal-body p-0">
+      <div class="dialog-body">
         <div id="products_search_results" class="search-results">
           <p class="text-muted text-center py-5">
             <%= Spree.t(:start_typing_to_search_for_products) %>
           </p>
         </div>
       </div>
-      <div class="modal-footer">
-        <%= modal_discard_button %>
+      <div class="dialog-footer">
+        <%= dialog_discard_button %>
         <%= turbo_save_button_tag Spree.t(:add_selected_products), class: 'btn btn-primary', disabled: true, data: { search_picker_target: :submit } %>
       </div>
     <% end %>

data/app/views/spree/admin/shared/_new_item_dropdown.html.erb

@@ -1,9 +1,9 @@
-<div class="dropdown">
-  <button type="button" class="btn btn-sm btn-light shadow-xs px-1" data-toggle="dropdown" aria-expanded="false">
+<%= dropdown do %>
+  <%= dropdown_toggle class: 'btn-light btn-sm px-1' do %>
     <%= icon 'plus', class: 'mr-0' %>
-  </button>
-  <div class="dropdown-menu">
-    <%= link_to_with_icon 'shopping-bag-plus', Spree.t(:new_order), spree.admin_orders_path, class: "dropdown-item", data: { turbo_method: :post } if can?(:manage, Spree::Order)  %>
+  <% end %>
+  <%= dropdown_menu direction: 'left' do %>
+    <%= link_to_with_icon 'shopping-bag-plus', Spree.t(:new_order), spree.new_admin_order_path, class: "dropdown-item" if can?(:manage, Spree::Order)  %>
 
     <%= link_to spree.new_admin_product_path, class: 'dropdown-item' do %>
       <%= icon 'cube-plus' %>
@@ -24,9 +24,7 @@
     <% if can?(:create, Spree::Store) && Spree.root_domain.present? %>
       <div class="dropdown-divider"></div>
 
-      <span data-toggle="modal" data-target="#modal-lg">
-        <%= link_to_with_icon 'building-store', Spree.t(:new_store), spree.new_admin_store_path, class: 'dropdown-item', data: { turbo_frame: 'dialog_modal_lg' } %>
-      </span>
+      <%= link_to_with_icon 'building-store', Spree.t(:new_store), spree.new_admin_store_path, class: 'dropdown-item' %>
     <% end %>
-  </div>
-</div>
+  <% end %>
+<% end %>

data/app/views/spree/admin/shared/_new_resource.html.erb

@@ -0,0 +1,18 @@
+<% col_class ||= 'col-lg-6 offset-lg-3' %>
+<% page_header_back_button_url ||= collection_url %>
+<% form_url ||= collection_url %>
+
+<%= content_for :page_title do %>
+  <%= page_header_back_button(page_header_back_button_url) %>
+  <%= Spree.t("new_#{controller_name.singularize}") %>
+<% end %>
+
+<%= form_with model: [:admin, @object], url: form_url, id: "new_#{controller_name.singularize}", data: local_assigns[:data] || {} do |f| %>
+  <div class="row">
+    <div class="<%= col_class %>">
+      <%= render 'spree/admin/shared/error_messages', target: @object %>
+      <%= render 'form', f: f %>
+      <%= render 'spree/admin/shared/new_resource_links', f: f %>
+    </div>
+  </div>
+<% end %>

data/app/views/spree/admin/shared/_no_resource_found.html.erb

@@ -5,5 +5,5 @@
   <p>
     <%= Spree.t(:no_resource_found, resource: resource_name) %>
   </p>
-  <%= link_to_with_icon 'plus', Spree.t(:add_one), new_object_url, class: 'btn btn-link btn-sm ml-3', data: { 'turbo-frame': '_top' } if can?(:create, model_class) && defined?(new_object_url) && new_object_url.present? %>
+  <%= link_to_with_icon 'plus', Spree.t(:add_one), new_object_url, class: 'btn btn-primary btn-sm ml-3', data: { 'turbo-frame': '_top' } if can?(:create, model_class) && defined?(new_object_url) && new_object_url.present? %>
 </div>

data/app/views/spree/admin/shared/_page_alerts.html.erb

@@ -0,0 +1,5 @@
+<% if content_for(:page_alerts) %>
+  <div class="container mb-2" id="page-alerts">
+    <%= yield(:page_alerts) %>
+  </div>
+<% end %>

data/app/views/spree/admin/shared/_page_section_image.html.erb

@@ -1 +1,7 @@
 <%= render 'active_storage/upload_form', form: f, field_name: :asset, width: 400, height: 128, auto_submit: true %>
+<% if f.object.has_preference?(:image_alt) %>
+  <div class="form-group">
+    <%= f.label :preferred_image_alt, Spree.t(:alt_text) %>
+    <%= f.text_field :preferred_image_alt, data: { action: 'auto-submit#submit' }, class: 'form-control' %>
+  </div>
+<% end %>

data/app/views/spree/admin/shared/_page_tabs.html.erb

@@ -0,0 +1,9 @@
+<% if content_for?(:page_tabs) %>
+  <div id="page-tabs">
+    <div class="container mb-2">
+      <ul class="nav">
+        <%= yield :page_tabs %>
+      </ul>
+    </div>
+  </div>
+<% end %>

data/app/views/spree/admin/shared/_refunds.html.erb

@@ -2,25 +2,23 @@
   <table class="table table-condensed" id='refunds' data-order-id='<%= @order.number %>'>
     <thead>
       <tr data-hook="refunds_header" class="border-bottom">
-        <th><%= "#{Spree.t('date')}/#{Spree.t('time')}" %></th>
-        <th><%= Spree.t(:amount) %></th>
-        <th><%= Spree.t(:reason) %></th>
+        <th scope="col"><%= "#{Spree.t('date')}/#{Spree.t('time')}" %></th>
+        <th scope="col"><%= Spree.t(:amount) %></th>
+        <th scope="col"><%= Spree.t(:reason) %></th>
         <% if show_actions %>
-          <th></th>
+          <th scope="col"></th>
         <% end %>
       </tr>
     </thead>
     <tbody>
       <% refunds.each do |refund| %>
         <tr id="<%= spree_dom_id(refund) %>">
-          <td><%= local_time(refund.created_at) %></td>
+          <td><%= spree_time(refund.created_at) %></td>
           <td class="amount"><%= refund.display_amount %></td>
           <td><%= truncate(refund.reason.name, length: 100) %></td>
           <% if show_actions && !refund.payment.order.canceled? %>
             <td class="actions">
-              <span data-toggle="modal" data-target="#modal">
-                <%= link_to_with_icon('edit', Spree.t(:edit), spree.edit_admin_order_payment_refund_path(refund.payment.order, refund.payment, refund), no_text: true, data: { turbo_frame: 'dialog_modal' }, class: "btn btn-light btn-sm") if can?(:edit, refund) %>
-              </span>
+              <%= link_to_with_icon('edit', Spree.t(:edit), spree.edit_admin_order_payment_refund_path(refund.payment.order, refund.payment, refund), no_text: true, data: { turbo_frame: 'dialog', action: 'dialog#open' }, class: "btn btn-light btn-sm") if can?(:edit, refund) %>
             </td>
           <% end %>
         </tr>

data/app/views/spree/admin/shared/_seo.html.erb

@@ -17,14 +17,9 @@
       <%= placeholder %>
     </div>
     <div class="seo__inputs d-none" data-seo-form-target="inputsContainer">
-      <div class="form-group">
-        <%= f.label :meta_title, Spree.t(:meta_title) %>
-        <%= f.text_field :meta_title, class: 'form-control', data: { seo_form_target: 'titleInput', action: 'input->seo-form#updatePreviews' } %>
-      </div>
-      <div class="form-group">
-        <%= f.label :meta_description, Spree.t(:meta_description) %>
-        <%= f.text_area :meta_description, class: 'form-control', rows: 4, data: { seo_form_target: 'descriptionInput', action: 'input->seo-form#updatePreviews' } %>
-      </div>
+      <%= f.spree_text_field :meta_title, data: { seo_form_target: 'titleInput', action: 'input->seo-form#updatePreviews' } %>
+      <%= f.spree_text_area :meta_description, rows: 4, data: { seo_form_target: 'descriptionInput', action: 'input->seo-form#updatePreviews' } %>
+      
       <div class="form-group">
         <% if defined?(slug_attribute_name) %>
           <%= label_tag slug_attribute_name, Spree.t(:slug) %>

data/app/views/spree/admin/shared/_team_nav.html.erb

@@ -8,7 +8,5 @@
 <% end %>
 
 <% content_for :page_actions do %>
-  <span data-toggle="modal" data-target="#modal">
-    <%= link_to_with_icon 'send', Spree.t('actions.send_invitation'), spree.new_admin_invitation_path, class: "btn btn-primary", data: { turbo_frame: 'dialog_modal' } %>
-  </span>
+  <%= link_to_with_icon 'send', Spree.t('actions.send_invitation'), spree.new_admin_invitation_path, class: "btn btn-primary", data: { turbo_frame: 'dialog', action: 'dialog#open' } %>
 <% end if can? :create, Spree::Invitation %>

data/app/views/spree/admin/shared/_user.html.erb

@@ -10,8 +10,9 @@
       <br />
     <% end %>
     <% unless defined?(current_vendor) && current_vendor %>
-      <span class="text-muted with-tip" title="<%= user.email %>">
+      <span class="text-muted" data-controller="tooltip">
         <%= user.email %>
+        <%= tooltip(user.email) %>
       </span>
       <%= clipboard_component(user.email) %>
     <% end %>

data/app/views/spree/admin/shared/_user_dropdown.html.erb

@@ -1,12 +1,10 @@
 <% if try_spree_current_user.present? %>
-  <div class="dropdown" id="<%= dom_id(try_spree_current_user, 'account-dropdown') %>" data-turbo-permanent>
-    <button type="button"
-          class="btn d-flex align-items-center justify-content-between text-left w-100 pr-0"
-          data-toggle="dropdown" aria-expanded="false" id="accountNav">
+  <%= dropdown id: dom_id(try_spree_current_user, 'account-dropdown') do %>
+    <%= dropdown_toggle class: 'd-flex align-items-center justify-content-between text-left w-100 pr-0' do %>
       <%= render_avatar(try_spree_current_user, width: 32, height: 32) %>
-    </button>
-    <div class="dropdown-menu dropdown-menu-right" style="min-width: 250px;">
-      <div class="d-flex align-items-center p-2 bg-gray-25 rounded-lg">
+    <% end %>
+    <%= dropdown_menu class: 'dropdown-menu-right', style: 'min-width: 250px;' do %>
+      <div class="d-flex align-items-center p-2 bg-light rounded-lg">
         <%= render_avatar(try_spree_current_user, width: 34, height: 34) %>
         <span class="d-none d-lg-inline ml-lg-2">
           <% if try_spree_current_user.name.present? %>
@@ -41,6 +39,6 @@
         <%= icon('logout', class: "icon icon-logout")  %>
         <%= Spree.t(:logout) %>
       <% end if defined?(spree_admin_logout_path) %>
-    </div>
-  </div>
+    <% end %>
+  <% end %>
 <% end %>