spree_admin 5.0.0.rc1

data/app/views/spree/admin/page_sections/forms/_featured_product.html.erb

@@ -0,0 +1,4 @@
+<div class="form-group">
+  <%= f.label :preferred_product, Spree.t(:product) %>
+  <%= tom_select_tag 'page_section[preferred_product_id]', active_option: @page_section.preferred_product_id, class: 'w-100', url: spree.select_options_admin_products_path(format: :json), include_blank: false, select_data: {action: 'auto-submit#submit'} %>
+</div>

data/app/views/spree/admin/page_sections/forms/_featured_taxon.html.erb

@@ -0,0 +1,59 @@
+<div class="form-group">
+  <%= f.label :preferred_heading, Spree.t('admin.page_builder.heading') %>
+  <%= f.text_field :preferred_heading, data: { action: 'auto-submit#submit' }, class: "form-control" %>
+</div>
+<div class="form-group">
+  <%= f.label :preferred_heading_size, Spree.t('admin.page_builder.heading_size') %>
+  <%= f.select :preferred_heading_size, options_for_select([ ["Small", 'small'], ["Medium", 'medium'], ["Large", 'large'] ], @page_section.preferred_heading_size ), {}, data: { action: 'auto-submit#submit' }, class: "custom-select" %>
+</div>
+<div class="form-group">
+  <%= f.label :preferred_heading_alignment, Spree.t('admin.page_builder.heading_alignment') %>
+  <%= f.select :preferred_heading_alignment, options_for_select([ ["Left", "left"], ["Center", "center"], ["Right", "right"] ], @page_section.preferred_heading_alignment ), {}, data: { action: 'auto-submit#submit' }, class: "custom-select" %>
+</div>
+<div class="form-group">
+  <%= f.label :description %>
+  <div class="trix-container">
+    <%= f.rich_text_area :description, data: {action: 'trix-change->auto-submit#submit'}, class: 'mb-3 w-full' %>
+  </div>
+</div>
+<div class="form-group">
+  <%= f.label :preferred_description_alignment, Spree.t('admin.page_builder.description_alignment') %>
+  <%= f.select :preferred_description_alignment, options_for_select([ ["Left", "left"], ["Center", "center"], ["Right", "right"] ], @page_section.preferred_description_alignment ), {}, data: { action: 'auto-submit#submit' }, class: "custom-select" %>
+</div>
+<div class="form-group">
+  <%= f.check_box :preferred_use_description_from_admin, class: "checkbox-input", data: { action: 'auto-submit#submit' } %>
+  <%= f.label :preferred_use_description_from_admin, Spree.t('admin.page_builder.use_description_from_admin') %>
+  <div class="alert alert-info">If the category description is not set, then the above description will be used.</div>
+</div>
+<div class="form-group">
+  <%= f.label :preferred_button_text, Spree.t('admin.page_builder.button_text') %>
+  <%= f.text_field :preferred_button_text, class: 'form-control', data: { action: 'blur->auto-submit#submit' }, placeholder: 'eg. Explore category', required: true %>
+</div>
+<div class="form-group">
+  <%= f.check_box :preferred_show_taxon_image, class: "checkbox-input", data: { action: 'auto-submit#submit' } %>
+  <%= f.label :preferred_show_taxon_image, Spree.t('admin.page_builder.show_taxon_image') %>
+</div>
+<div class="form-group">
+  <%= f.label :preferred_taxon, Spree.t('admin.page_builder.category') %>
+  <%= tom_select_tag 'page_section[preferred_taxon_id]', active_option: @page_section.preferred_taxon_id, class: 'w-100', url: spree.admin_taxons_select_options_path(format: :json, with_automatic: true), select_data: {action: 'auto-submit#submit'} %>
+</div>
+<div class="form-group">
+  <%= f.check_box :preferred_show_more_button, class: "checkbox-input", data: { action: 'auto-submit#submit' } %>
+  <%= f.label :preferred_show_more_button, Spree.t('admin.page_builder.show_more_button') %>
+</div>
+<div class="form-group">
+  <div data-controller="better-slider">
+    <label><%= Spree.t('admin.page_builder.maximum_products_to_show') %>: <span data-better-slider-target="currentValueLabel"></span></label>
+    <div class="flex flex-row w-full">
+      <span class="mr-2">3</span>
+      <%= f.range_field :preferred_max_products_to_show, class: "custom-range w-full", min: 3, max: 20, data: {'better-slider-target': 'rangeInput', action: 'auto-submit#submit'} %>
+      <span class="ml-2">20</span>
+    </div>
+  </div>
+</div>
+<% content_for(:design_tab) do %>
+  <div class="form-group">
+    <%= f.label :preferred_button_style, Spree.t('admin.page_builder.button_style') %>
+    <%= f.select :preferred_button_style, options_for_select([['Primary', 'primary'], ['Secondary', 'secondary']], @page_section.preferred_button_style), {}, data: {  action: 'auto-submit#submit' },  class: 'custom-select' %>
+  </div>
+<% end %>

data/app/views/spree/admin/page_sections/forms/_featured_taxons.html.erb

@@ -0,0 +1,13 @@
+<div class="form-group">
+  <%= f.label :preferred_heading, Spree.t('admin.page_builder.heading') %>
+  <%= f.text_field :preferred_heading, data: { action: 'auto-submit#submit' }, class: "form-control" %>
+</div>
+<div class="form-group">
+  <%= f.label :preferred_heading_size, Spree.t('admin.page_builder.heading_size') %>
+  <%= f.select :preferred_heading_size, options_for_select([ ["Small", 'small'], ["Medium", 'medium'], ["Large", 'large'] ], @page_section.preferred_heading_size ), {}, data: { action: 'auto-submit#submit' }, class: "custom-select" %>
+</div>
+<div class="form-group">
+  <%= f.label :preferred_heading_alignment, Spree.t('admin.page_builder.heading_alignment') %>
+  <%= f.select :preferred_heading_alignment, options_for_select([ ["Left", "left"], ["Center", "center"], ["Right", "right"] ], @page_section.preferred_heading_alignment ), {}, data: { action: 'auto-submit#submit' }, class: "custom-select" %>
+</div>
+<%= render 'spree/admin/page_links/list', parent: @page_section, show_add_link_button: true %>

data/app/views/spree/admin/page_sections/forms/_footer.html.erb

@@ -0,0 +1,20 @@
+<div class="alert alert-info mb-3">
+  If you don't upload a logo we'll use the one from the header.
+</div>
+
+<%= render 'spree/admin/shared/page_section_logo', f: f %>
+
+<p class="text-muted small mt-2">
+  We recommend transparent images with a minimum size of 400x128 pixels.
+</p>
+
+<% content_for(:design_tab) do %>
+  <%= render 'spree/admin/page_builder/color_picker',
+      f: f, field: :preferred_copyright_text_color, value: @page_section.preferred_copyright_text_color,
+      label: 'Copyright Text color',
+      action: 'change->auto-submit#submit' %>
+  <%= render 'spree/admin/page_builder/color_picker',
+      f: f, field: :preferred_copyright_background_color, value: @page_section.preferred_copyright_background_color,
+      label: 'Copyright Background color',
+      action: 'change->auto-submit#submit' %>
+<% end %>

data/app/views/spree/admin/page_sections/forms/_header.html.erb

@@ -0,0 +1,14 @@
+<label>Logo image</label>
+
+<%= render 'spree/admin/shared/page_section_logo', f: f %>
+
+<p class="text-muted small mt-2">
+  We recommend transparent images with a minimum size of 400x128 pixels.
+</p>
+
+<%= render 'spree/admin/page_links/list', parent: @page_section, show_add_link_button: true %>
+
+<% content_for(:design_tab) do %>
+  <%= render 'spree/admin/page_sections/fields/header_layout', f: f %>
+  <hr />
+<% end %>

data/app/views/spree/admin/page_sections/forms/_image_banner.html.erb

@@ -0,0 +1,13 @@
+<%= render 'spree/admin/shared/page_section_image', f: f %>
+
+<% content_for(:design_tab) do %>
+  <div class="form-group">
+    <%= f.label :preferred_vertical_alignment, Spree.t('admin.page_builder.vertical_alignment') %>
+    <%= f.select :preferred_vertical_alignment, options_for_select([:top, :middle, :bottom], @page_section.preferred_vertical_alignment), {  }, { class: 'custom-select', data: {  action: 'auto-submit#submit' } } %>
+  </div>
+
+  <%= render 'spree/admin/page_builder/range_input',
+  f: f, field: :preferred_overlay_transparency, min: 1, max: 100, unit: '%' %>
+
+  <%= render 'spree/admin/page_sections/fields/height', f: f %>
+<% end %>

data/app/views/spree/admin/page_sections/forms/_image_with_text.html.erb

@@ -0,0 +1,31 @@
+<%= render 'spree/admin/shared/page_section_image', f: f %>
+
+<div class="py-2">
+  <%= f.fields_for :link do |lf| %>
+    <div class="form-group">
+      <%= lf.label :linkable_type, 'Link' %>
+      <%= lf.select :linkable_type, @page_section.allowed_linkable_types, { include_blank: false }, { class: 'custom-select mb-3', data: { action: 'auto-submit#submit' } } %>
+      <div id="linkable_type_dropdown">
+        <%= render 'spree/admin/page_links/linkable_type_dropdown', page_link: lf.object, form_name: 'page_section[link_attributes]' %>
+      </div>
+    </div>
+
+    <div class="custom-control custom-checkbox pb-2">
+      <%= lf.check_box :open_in_new_tab, class: 'custom-control-input', data: { action: 'auto-submit#submit' } %>
+      <%= lf.label :open_in_new_tab, class: 'custom-control-label' %>
+      <span class="text-muted form-text mt-2">Clicking on the image will send the user to the selected page/URL</span>
+    </div>
+  <% end %>
+</div>
+
+<% content_for(:design_tab) do %>
+  <div class="form-group">
+    <%= f.label :preferred_desktop_image_alignment, Spree.t('admin.page_builder.desktop_image_alignment') %>
+    <%= f.select :preferred_desktop_image_alignment, options_for_select(['left', 'right'], @page_section.preferred_desktop_image_alignment), {  }, { class: 'custom-select', data: {  action: 'auto-submit#submit' } } %>
+  </div>
+  <div class="form-group">
+    <%= f.label :preferred_vertical_alignment, Spree.t('admin.page_builder.vertical_alignment') %>
+    <%= f.select :preferred_vertical_alignment, options_for_select([:top, :middle, :bottom], @page_section.preferred_vertical_alignment), {  }, { class: 'custom-select', data: {  action: 'auto-submit#submit' } } %>
+  </div>
+  <hr />
+<% end %>

data/app/views/spree/admin/page_sections/forms/_main_password_footer.html.erb

@@ -0,0 +1,9 @@
+<div class="alert alert-info mb-3">
+  If you don't upload a logo we'll use the one from the header.
+</div>
+
+<%= render 'spree/admin/shared/page_section_logo', f: f %>
+
+<p class="text-muted small mt-2">
+  We recommend transparent images with a minimum size of 400x128 pixels.
+</p>

data/app/views/spree/admin/page_sections/forms/_main_password_header.erb

@@ -0,0 +1,13 @@
+<label>Logo image</label>
+<%= render 'spree/admin/shared/page_section_logo', f: f %>
+
+<p class="text-muted small mt-2">
+  We recommend transparent images with a minimum size of 400x128 pixels.
+</p>
+
+<% content_for(:design_tab) do %>
+  <%= render 'spree/admin/page_builder/range_input',
+    f: f, field: :preferred_desktop_logo_height, min: 0, max: 120, unit: 'px', label: "Logo height (desktop)", label_for_min_value: "auto"
+  %>
+  <hr />
+<% end %>

data/app/views/spree/admin/page_sections/forms/_newsletter.html.erb

@@ -0,0 +1,15 @@
+<% content_for(:design_tab) do %>
+
+  <%= label_tag :background_image %>
+  <br />
+
+  <%= render 'spree/admin/shared/page_section_image', f: f %>
+
+  <br /><br />
+
+  <%= render 'spree/admin/page_builder/range_input',
+    f: f, field: :preferred_overlay_transparency, min: 1, max: 100, unit: '%'
+  %>
+
+  <hr />
+<% end %>

data/app/views/spree/admin/page_sections/forms/_page_title.html.erb

@@ -0,0 +1,4 @@
+<div class="form-group">
+  <%= f.label :preferred_title, Spree.t('admin.page_builder.title') %>
+  <%= f.text_field :preferred_title, data: { action: 'auto-submit#submit' }, class: "form-control" %>
+</div>

data/app/views/spree/admin/page_sections/forms/_product_details.html.erb

@@ -0,0 +1 @@
+

data/app/views/spree/admin/page_sections/forms/_product_grid.html.erb

@@ -0,0 +1 @@
+

data/app/views/spree/admin/page_sections/forms/_related_products.html.erb

@@ -0,0 +1,32 @@
+<div class="form-group">
+  <%= f.label :preferred_heading, Spree.t('admin.page_builder.heading') %>
+  <%= f.text_field :preferred_heading, data: { action: 'auto-submit#submit' }, class: "form-control" %>
+</div>
+<div class="form-group">
+  <%= f.label :preferred_heading_size, Spree.t('admin.page_builder.heading_size') %>
+  <%= f.select :preferred_heading_size, options_for_select([ ["Small", 'small'], ["Medium", 'medium'], ["Large", 'large'] ], @page_section.preferred_heading_size ), {}, data: { action: 'auto-submit#submit' }, class: "custom-select" %>
+</div>
+<div class="form-group">
+  <%= f.label :preferred_heading_alignment, Spree.t('admin.page_builder.heading_alignment') %>
+  <%= f.select :preferred_heading_alignment, options_for_select([ ["Left", "left"], ["Center", "center"], ["Right", "right"] ], @page_section.preferred_heading_alignment ), {}, data: { action: 'auto-submit#submit' }, class: "custom-select" %>
+</div>
+<div class="form-group">
+  <%= f.label :description, Spree.t('admin.page_builder.description') %>
+  <div class="trix-container">
+    <%= f.rich_text_area :description, data: {action: 'trix-change->auto-submit#submit'}, class: 'mb-3 w-full' %>
+  </div>
+</div>
+<div class="form-group">
+  <%= f.label :preferred_description_alignment, Spree.t('admin.page_builder.description_alignment') %>
+  <%= f.select :preferred_description_alignment, options_for_select([ ["Left", "left"], ["Center", "center"], ["Right", "right"] ], @page_section.preferred_description_alignment ), {}, data: { action: 'auto-submit#submit' }, class: "custom-select" %>
+</div>
+<div class="form-group">
+  <div data-controller="better-slider">
+    <label><%= Spree.t('admin.page_builder.maximum_products_to_show') %>: <span data-better-slider-target="currentValueLabel"></span></label>
+    <div class="flex flex-row w-full">
+      <span class="mr-2">2</span>
+      <%= f.range_field :preferred_max_products_to_show, class: "custom-range w-full", min: 2, max: 20, data: {'better-slider-target': 'rangeInput', action: 'auto-submit#submit'} %>
+      <span class="ml-2">20</span>
+    </div>
+  </div>
+</div>

data/app/views/spree/admin/page_sections/forms/_taxon_grid.html.erb

@@ -0,0 +1,5 @@
+<div class="form-group">
+  <%= f.label :preferred_heading, Spree.t('admin.page_builder.heading') %>
+  <%= f.text_field :preferred_heading, data: { action: 'auto-submit#submit' }, class: "form-control" %>
+</div>
+

data/app/views/spree/admin/page_sections/forms/_video.html.erb

@@ -0,0 +1,15 @@
+<div class="form-group">
+  <%= f.label :preferred_youtube_video_url, Spree.t('admin.page_builder.youtube_video_url') %>
+  <%= f.url_field :preferred_youtube_video_url, data: { action: 'change->auto-submit#submit' }, class: 'form-control' %>
+</div>
+
+<% content_for(:design_tab) do %>
+  <div class="form-group">
+    <%= f.label :preferred_separated, Spree.t('admin.page_builder.separated') %>
+    <%= f.select :preferred_separated, options_for_select(['horizontally', 'vertically'], @page_section.preferred_separated), {  }, { class: 'custom-select', data: {  action: 'auto-submit#submit' } } %>
+  </div>
+
+  <%= render 'spree/admin/page_builder/labeled_range_input',
+    f: f, field: :preferred_width_desktop, min: 1, max: 100, unit: '%', _label: Spree.t('admin.page_builder.max_video_width_on_desktop')
+  %>
+<% end %>

data/app/views/spree/admin/page_sections/move_higher.turbo_stream.erb

@@ -0,0 +1,7 @@
+<%= turbo_stream.replace :page_sidebar do %>
+  <%= render 'spree/admin/page_builder/sidebar_sections' %>
+<% end %>
+
+<%= turbo_stream.replace 'page_sidebar_toolbar' do %>
+  <%= render 'spree/admin/page_builder/sidebar_sections_toolbar' %>
+<% end %>

data/app/views/spree/admin/page_sections/move_lower.turbo_stream.erb

@@ -0,0 +1,7 @@
+<%= turbo_stream.replace :page_sidebar do %>
+  <%= render 'spree/admin/page_builder/sidebar_sections' %>
+<% end %>
+
+<%= turbo_stream.replace 'page_sidebar_toolbar' do %>
+  <%= render 'spree/admin/page_builder/sidebar_sections_toolbar' %>
+<% end %>

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

@@ -0,0 +1,28 @@
+<%= turbo_frame_tag :page_sidebar do %>
+  <h6 class="sidebar-header">
+    <%= link_to collection_url, data: { action: 'click->page-builder#clearActiveOverlays' }, class: 'btn hover-gray px-2' do %>
+      <%= icon 'chevron-left', class: 'mr-0 back' %>
+    <% end %>
+    <%= Spree.t(:add_section) %>
+  </h6>
+  <div class="pb-5 mb-5 edit-block">
+    <%= form_for @page_preview.sections.new, url: spree.admin_page_sections_path(@page_preview), data: { controller: 'section-form', section_form_target: :form } do |f| %>
+      <%= f.hidden_field :type, data: { section_form_target: 'type' } %>
+      <%= f.hidden_field :pageable_id %>
+      <%= f.hidden_field :pageable_type %>
+      <% cache spree_base_cache_scope.call('new-section-list'), expires_in: 1.hour do %>
+        <ul class="list-group list-group-flush m-2 mx-3">
+          <% @theme.available_page_sections.each do |section_class| %>
+            <li class="list-group-item p-2 list-group-item-action cursor-pointer d-flex align-items-center hover-action text-primary"
+              data-action="click->section-form#addSection"
+              data-section-form-type-param="<%= section_class %>"
+            >
+              <%= icon section_class.new.icon_name, class: 'mr-3' if section_class.new.icon_name.present? %>
+              <%= section_class.to_s.demodulize.titleize %>
+            </li>
+          <% end %>
+        </ul>
+      <% end %>
+    <% end %>
+  </div>
+<% end %>

data/app/views/spree/admin/page_sections/remove_attachment.turbo_stream.erb

@@ -0,0 +1,4 @@
+<%= refresh_theme_preview(@page_section) %>
+<%= turbo_stream.replace :page_sidebar do %>
+  <%= render template: 'spree/admin/page_sections/edit' %>
+<% end %>

data/app/views/spree/admin/page_sections/restore_design_settings_to_defaults.turbo_stream.erb

@@ -0,0 +1,4 @@
+<%= refresh_theme_preview(@page_section) %>
+<%= turbo_stream.replace :page_sidebar do %>
+  <%= render template: 'spree/admin/page_sections/edit', locals: {tab_selected: :design} %>
+<% end %>

data/app/views/spree/admin/page_sections/show.html.erb

@@ -0,0 +1 @@
+<%= render 'spree/admin/page_builder/sidebar_section', section: @page_section %>

data/app/views/spree/admin/page_sections/update.turbo_stream.erb

@@ -0,0 +1,10 @@
+<% if @page_section.previous_changes.key?('position') %>
+  <%= refresh_theme_preview %>
+<% else %>
+  <%= refresh_theme_preview(@page_section) %>
+<% end %>
+<% if @page_section.respond_to?(:link) %>
+  <%= turbo_stream.update :linkable_type_dropdown do %>
+    <%= render 'spree/admin/page_links/linkable_type_dropdown', page_link: @page_section.link, form_name: 'page_section[link_attributes]' %>
+  <% end %>
+<% end %>

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

@@ -0,0 +1,7 @@
+<%= search_form_for [:admin, @search], url: spree.admin_pages_path , class: "filter-wrap border-bottom", data: {controller: "filters reveal", reveal_hidden_class: "d-none"} do |f| %>
+  <%= render 'spree/admin/shared/filters_search_bar', param: :name_cont, label: Spree.t(:name) %>
+
+  <%= render "spree/admin/shared/filter_badge_template" %>
+
+  <div data-filters-target="badgesContainer" class="filter-badges-container"></div>
+<% end %>

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

@@ -0,0 +1,29 @@
+<% vertical ||= false %>
+<div class="row">
+  <div class="<%= vertical ? 'col-lg-12' : 'col-lg-8' %>">
+    <div class="card mb-4">
+      <div class="card-header d-flex align-items-center justify-content-between">
+        <h5 class="card-title">
+          <%= Spree.t(:details) %>
+        </h5>
+      </div>
+      <div class="card-body">
+        <div class="form-group">
+          <%= f.label :name, Spree.t(:name) %>
+          <%= f.text_field :name, class: 'form-control', required: true, data: { slug_form_target: :name, action: 'slug-form#updateUrlFromName', seo_form_target: 'sourceTitleInput' }, autofocus: true %>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="<%= vertical ? 'col-lg-12' : 'col-lg-4' %>">
+    <%= render 'spree/admin/shared/seo',
+          f: f,
+          title: @page.name,
+          meta_title: @page.meta_title,
+          description: nil,
+          slug_attribute_name: "page[slug]",
+          slug: @page.slug,
+          slug_path: 'pages',
+          placeholder: 'Add a title to see how this page might appear in a search engine listing' %>
+  </div>
+</div>

data/app/views/spree/admin/pages/_page.erb

@@ -0,0 +1,8 @@
+<tr id="<%= dom_id page %>" data-controller="row-link" class="cursor-pointer">
+  <td scope="row" data-action="click->row-link#openLink">
+    <%= link_to page.name, spree.edit_admin_theme_path(current_store.default_theme, page_id: page.id), data: { row_link_target: :link } %>
+  </td>
+  <td data-action="click->row-link#openLink">
+    <%= local_time_ago(page.updated_at, class: 'with-tip') %>
+  </td>
+</tr>

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

@@ -0,0 +1,18 @@
+<%= turbo_frame_tag :dialog_modal do %>
+  <%= form_with model: @page, url: spree.admin_page_path(@page), data: { controller: 'slug-form seo-form' }, scope: :page do |f| %>
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title" id="exampleModalLabel"><%= Spree.t(:page_settings) %></h5>
+        <button type="button" class="btn-close" data-dismiss="modal" aria-label="<%= Spree.t(:close) %>"></button>
+      </div>
+      <div class="modal-body">
+        <%= render 'spree/admin/shared/error_messages', target: @page %>
+        <%= render 'form', f: f, vertical: true %>
+      </div>
+      <div class="modal-footer d-flex justify-content-between">
+        <%= turbo_save_button_tag Spree.t('actions.save'), data: {turbo_frame: :_top} %>
+        <%= link_to Spree.t('actions.destroy'), spree.admin_page_path(@page.id), data: { turbo_method: :delete, turbo_frame: '_top', turbo_confirm: Spree.t(:are_you_sure )}, class: 'btn btn-danger' %>
+      </div>
+    </div>
+  <% end %>
+<% end %>

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

@@ -0,0 +1,28 @@
+<% content_for :page_title do %>
+  <%= Spree.t(:pages) %>
+<% end %>
+<% content_for :page_actions do %>
+  <%= link_to_with_icon 'plus', Spree.t(:add_new_page), spree.new_admin_page_path, class: "btn btn-primary" if can?(:create, Spree::Page.new) %>
+<% end %>
+
+<div class="card-lg p-0">
+  <%= render "spree/admin/pages/filters" %>
+  <% if @pages.any? %>
+    <div class="table-responsive">
+      <table class="table">
+        <thead class="text-muted">
+          <tr>
+            <th><%= Spree.t(:name) %></th>
+            <th><%= Spree.t(:updated) %></th>
+          </tr>
+        </thead>
+        <tbody>
+          <%= render collection: @pages, partial: "spree/admin/pages/page", cached: spree_base_cache_scope %>
+        </tbody>
+      </table>
+      <%= render partial: "spree/admin/shared/index_table_options", locals: { collection: @pages } %>
+    </div>
+  <% else %>
+    <%= render 'spree/admin/shared/no_resource_found' %>
+  <% end %>
+</div>

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

@@ -0,0 +1,11 @@
+<% content_for :page_title do %>
+  <%= page_header_back_button spree.admin_pages_path %>
+  <%= Spree.t(:new_page) %>
+<% end %>
+<% content_for :title do %>
+  <%= Spree.t(:new_page) %>
+<% end %>
+<%= form_with model: @page, url: spree.admin_pages_path, data: { controller: 'slug-form seo-form' }, scope: :page do |f| %>
+  <%= render 'form', f: f, vertical: false %>
+  <%= render 'spree/admin/shared/new_resource_links', f: f %>
+<% end %>

data/app/views/spree/admin/payment_methods/_available_payment_method.html.erb

@@ -0,0 +1,21 @@
+<tr data-controller="row-link">
+  <td class="cursor-pointer w-30" data-action="click->row-link#openLink">
+    <div class="d-flex align-items-center">
+      <% if payment_method_icon_tag(payment_method.payment_icon_name).present? %>
+        <%= payment_method_icon_tag(payment_method.payment_icon_name, height: 30, class: 'mr-2') %>
+      <% end %>
+
+      <%= payment_method.name %>
+    </div>
+  </td>
+  <td class="cursor-pointer w-40 text-wrap" data-action="click->row-link#openLink">
+    <% if payment_method.try(:description_partial_name) %>
+      <%= render "spree/admin/payment_methods/descriptions/#{payment_method.description_partial_name}", payment_method: payment_method %>
+    <% end %>
+  </td>
+  <td class="actions w-30">
+    <div class="d-flex justify-content-end">
+      <%= link_to_with_icon 'plus', Spree.t(:add), spree.new_admin_payment_method_path(payment_method: { type: payment_method.type }), class: 'btn btn-light btn-sm', data: { row_link_target: :link } %>
+    </div>
+  </td>
+</tr>

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

@@ -0,0 +1,71 @@
+<% if @object.respond_to?(:configuration_guide_partial_name) %>
+  <%= render "spree/admin/payment_methods/configuration_guides/#{@object.configuration_guide_partial_name}", f: f %>
+<% end %>
+
+
+<div class="row">
+  <% if !preference_fields(@object, f).empty? || @object.respond_to?(:custom_form_fields_partial_name) %>
+    <div class="col-12 col-md-6">
+      <div class="card mb-4">
+        <div class="card-header">
+          <h5 class="card-title"><%= Spree.t(:payment_provider_settings) %></h5>
+        </div>
+        <div class="card-body">
+          <%= preference_fields(@object, f) unless preference_fields(@object, f).empty? %>
+
+          <% if @object.respond_to?(:custom_form_fields_partial_name) %>
+            <%= render "spree/admin/payment_methods/custom_form_fields/#{@object.custom_form_fields_partial_name}", f: f %>
+          <% end %>
+        </div>
+      </div>
+    </div>
+  <% end %>
+
+  <div class="col-12 col-md-6">
+    <div class="card mb-4">
+      <div class="card-header">
+        <h5 class="card-title"><%= Spree.t(:display_settings) %></h5>
+      </div>
+      <div class="card-body">
+        <div class="form-group">
+          <%= label_tag :payment_method_name, Spree.t(:name) %>
+          <%= text_field :payment_method, :name, class: 'form-control' %>
+          <span class="text-muted form-text mt-2">
+            This name will be used to identify the payment method on the storefront
+          </span>
+
+          <%= error_message_on :payment_method, :name %>
+        </div>
+
+        <% if can?(:manage, Spree::Store) && available_stores.count > 1 %>
+          <div class="form-group">
+            <%= label_tag :payment_method_stores, Spree.t(:stores) %>
+            <%= f.collection_check_boxes :store_ids, available_stores, :id, :name do |b| %>
+              <div class="custom-control custom-checkbox mb-1">
+                <%= b.check_box(class: 'custom-control-input') %>
+                <%= b.label(class: 'custom-control-label') %>
+              </div>
+            <% end %>
+          </div>
+        <% end %>
+
+        <div class="form-group">
+          <%= label_tag :payment_method_display_on, Spree.t(:display) %>
+          <%= f.select :display_on, display_on_options, {}, { class: 'custom-select' } %>
+        </div>
+        <div class="form-group">
+          <%= label_tag :payment_method_auto_capture, Spree.t(:auto_capture) %>
+          <%= select(:payment_method, :auto_capture, [["#{Spree.t(:use_app_default)} (#{Spree::Config[:auto_capture]})", ''], [Spree.t(:say_yes), true], [Spree.t(:say_no), false]], {}, {class: 'custom-select'}) %>
+        </div>
+
+        <div class="form-group">
+          <label><%= Spree.t(:active) %></label>
+          <div class="custom-control custom-switch">
+            <%= f.check_box :active, class: 'custom-control-input' %>
+            <%= f.label :active, '&nbsp;'.html_safe, class: 'custom-control-label' %>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>

data/app/views/spree/admin/payment_methods/_payment_method.html.erb

@@ -0,0 +1,38 @@
+<tr id="<%= spree_dom_id payment_method %>" data-controller="row-link" data-sortable-update-url="<%= spree.admin_payment_method_path(payment_method) %>">
+  <td class="w-10 move-handle text-center">
+    <%= icon('grip-vertical', class: 'rounded hover-gray p-2') %>
+  </td>
+  <td class="cursor-pointer w-55 text-wrap" data-action="click->row-link#openLink">
+    <div class="d-flex align-items-center">
+      <div class="bg-light rounded" style="width: 95px; height: 60px;">
+        <% if payment_method_icon_tag(payment_method.payment_icon_name).present? %>
+          <%= payment_method_icon_tag(payment_method.payment_icon_name, height: 60, class: 'with-tip', title: payment_method.name) %>
+        <% end %>
+      </div>
+
+      <div class="mx-3">
+        <% if payment_method.try(:description_partial_name) %>
+          <%= render "spree/admin/payment_methods/descriptions/#{payment_method.description_partial_name}", payment_method: payment_method %>
+        <% else %>
+          <%= payment_method.name %>
+        <% end %>
+      </div>
+    </div>
+  </td>
+  <td class="w-20">
+    <%= form_for payment_method, as: :payment_method, url: spree.admin_payment_method_path(payment_method), method: :patch, data: { controller: 'auto-submit' } do |f| %>
+      <%= f.select :display_on, display_on_options, {}, { class: 'custom-select custom-select-sm w-auto', data: { action: 'auto-submit#submit' } } %>
+    <% end %>
+  </td>
+  <td class="w-10 text-center">
+    <%= form_for payment_method, as: :payment_method, url: spree.admin_payment_method_path(payment_method), method: :patch, data: { controller: 'auto-submit' } do |f| %>
+      <div class="custom-control custom-switch">
+        <%= f.check_box :active, class: 'custom-control-input', data: { action: 'auto-submit#submit' }, id: "payment_method_active_#{payment_method.id}" %>
+        <%= f.label :active, '&nbsp;'.html_safe, class: 'custom-control-label', for: "payment_method_active_#{payment_method.id}" %>
+      </div>
+    <% end %>
+  </td>
+  <td class="actions w-5">
+    <%= link_to_edit(payment_method, data: { row_link_target: :link }) %>
+  </td>
+</tr>

data/app/views/spree/admin/payment_methods/descriptions/_gateway.html.erb

@@ -0,0 +1 @@
+Classic ActiveMerchant gateway provided by community.

data/app/views/spree/admin/payment_methods/descriptions/_store_credit.html.erb

@@ -0,0 +1 @@
+Allow customers to use store credit for payment. Issue store credit to customers from the admin.