spree_admin 5.1.0.beta3 → 5.1.0.rc1

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

@@ -0,0 +1,24 @@
+<% if @collection.any? %>
+  <div class="table-responsive" id="listing_gift_cards">
+    <table class="table">
+      <thead class="text-muted">
+        <tr>
+          <th><%= Spree.t(:code) %></th>
+          <th><%= Spree.t(:amount) %></th>
+          <th><%= Spree.t(:used) %></th>
+          <th><%= Spree.t(:currency) %></th>
+          <th><%= Spree.t(:status) %></th>
+          <th><%= Spree.t(:expires_at) %></th>
+          <th><%= Spree.t(:customer) %></th>
+        </tr>
+      </thead>
+      <tbody>
+        <%= render collection: @collection, partial: 'spree/admin/gift_cards/gift_card' %>
+      </tbody>
+    </table>
+  </div>
+  <%= render partial: 'spree/admin/shared/index_table_options', locals: { collection: @collection } %>
+<% else %>
+  <% new_object_url = @user.present? ? spree.new_admin_user_gift_card_path(@user) : spree.new_admin_gift_card_path %>
+  <%= render 'spree/admin/shared/no_resource_found', model_class: Spree::GiftCard, new_object_url: new_object_url %>
+<% end %>

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

@@ -0,0 +1,25 @@
+<div class="dropdown">
+  <button class="btn btn-light dropdown-toggle" type="button" data-toggle="dropdown" data-display="static" data-flip="false" aria-expanded="false">
+    <span class="text-muted font-weight-normal">Show:</span>
+    <%= gift_cards_filter_dropdown_value %>
+  </button>
+  <div class="dropdown-menu w-100" style="min-width: 200px">
+
+    <%= active_link_to Spree.t('admin.gift_cards.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?) %>
+    
+    <%= link_to Spree.t('admin.gift_cards.active'),
+      params.to_unsafe_h.deep_merge({page: nil, q: {status_eq: :active}}),
+      class: "dropdown-item #{'active' if params[:q] && params[:q][:status_eq] == 'active'}" %>
+    
+    <%= link_to params.to_unsafe_h.deep_merge({page: nil, q: {status_eq: :expired}}),
+      class: "dropdown-item #{'active' if params[:q] && params[:q][:status_eq] == 'expired'}" do %>
+        <%= Spree.t(:expired) %>
+    <% end %>
+
+    <%= link_to params.to_unsafe_h.deep_merge({page: nil, q: {status_eq: :redeemed}}),
+      class: "dropdown-item #{'active' if params[:q] && params[:q][:status_eq] == 'redeemed'}" do %>
+        <%= Spree.t('admin.gift_cards.redeemed') %>
+    <% end %>
+
+  </div>
+</div>

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

@@ -0,0 +1,20 @@
+<%= turbo_frame_tag :gift_card_settings do %>
+  <%= form_for [:admin, @user, @object] do |f| %>
+    <div class="card">
+      <div class="card-header d-flex justify-content-between">
+        <h5 class="card-title">
+          <%= Spree.t(:settings) %>
+        </h5>
+      </div>
+      <div class="card-body">
+        <%= render partial: 'spree/admin/shared/error_messages', locals: { target: @object } %>
+        <%= render 'form', f: f %>
+      </div>
+      <div class="card-footer d-flex justify-content-between">
+        <%= turbo_save_button_tag Spree.t('actions.update') %>
+
+        <%= link_to Spree.t('actions.discard'), spree.admin_gift_card_path(@object), class: 'btn btn-light' %>
+      </div>
+    </div>
+  <% end %>
+<% end %>

data/app/views/spree/admin/gift_cards/index.csv.erb

@@ -0,0 +1,22 @@
+<%- headers = [
+  Spree.t(:code),
+  Spree.t(:amount),
+  Spree.t(:used),
+  Spree.t(:currency),
+  Spree.t(:status),
+  Spree.t(:expires_at),
+  Spree.t(:customer)
+  ]
+-%>
+<%= CSV.generate_line(headers).strip %>
+<%- @collection.find_each do |gift_card| -%>
+  <%= CSV.generate_line([
+    gift_card.display_code,
+    gift_card.display_amount,
+    gift_card.display_amount_used,
+    gift_card.currency,
+    gift_card.display_state,
+    gift_card.expires_at,
+    gift_card.user&.email,
+    ]).strip %>
+<%- end -%>

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

@@ -0,0 +1,41 @@
+<% unless turbo_frame_request? %>
+  <% content_for :page_title do %>
+    <%= Spree.t(:gift_cards) %>
+  <% end %>
+
+  <% content_for :page_actions do %>
+    <%= link_to spree.admin_gift_cards_path(q: params[:q].to_unsafe_hash, per_page: params[:per_page], format: :csv), id: 'gift-card-batch-export-link', class: 'btn btn-light bg-transparent with-tip', title: 'Export gift cards to a CSV file' do %>
+      <%= icon 'table-export', class: 'mr-2' %>
+      <%= Spree.t(:export) %>
+    <% end %>
+
+    <div class="dropdown" id="page_actions_dropdown">
+      <%= link_to_with_icon 'plus', Spree.t(:new_gift_card), '#', class: 'text-nowrap btn btn-primary align-self-center', data: { toggle: 'dropdown' }, id: 'more-actions-link' %>
+      <div class="dropdown-menu dropdown-menu-right">
+        <%= link_to spree.new_admin_gift_card_path,
+              class: 'text-left dropdown-item'  do %>
+          <%= icon 'add' %>
+          <%= Spree.t(:gift_card) %>
+        <% end %>
+
+        <%= link_to spree.new_admin_gift_card_batch_path,
+              class: 'text-left dropdown-item'  do %>
+          <%= icon 'add' %>
+          <%= Spree.t(:gift_card_batch) %>
+        <% end %>
+      </div>
+    </div>
+  <% end %>
+<% end %>
+
+<div class="card-lg p-0">
+  <% if params[:frame_name].present? %>
+    <%= turbo_frame_tag params[:frame_name], autoscroll: true, data: { autoscroll_block: :nearest, autoscroll_behavior: :smooth } do %>
+      <%= render 'filters', frame_name: params[:frame_name] %>
+      <%= render 'list' %>
+    <% end %>
+  <% else %>
+    <%= render 'filters' %>
+    <%= render 'list' %>
+  <% end %>
+</div>

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

@@ -0,0 +1,30 @@
+<% content_for :page_title do %>
+  <% if @user.present? %>
+    <%= page_header_back_button spree.admin_user_path(@user) %>
+  <% else %>
+    <%= page_header_back_button spree.admin_gift_cards_path %>
+  <% end %>
+
+  <%= Spree.t(:new_gift_card) %>
+<% end %>
+
+<% url = @user.present? ? spree.admin_user_gift_cards_path(@user) : spree.admin_gift_cards_path %>
+
+<%= form_for @object, url: url do |f| %>
+  <div class="row">
+    <div class="col-lg-6 offset-lg-3">
+      <%= render partial: 'spree/admin/shared/error_messages', locals: { target: @object } %>
+      <div class="card mb-4">
+        <div class="card-header">
+          <h5 class="card-title">
+            <%= Spree.t(:new_gift_card) %>
+          </h5>
+        </div>
+        <div class="card-body">
+          <%= render 'form', f: f %>
+        </div>
+      </div>
+      <%= render 'spree/admin/shared/new_resource_links' %>
+    </div>
+  </div>
+<% end %>

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

@@ -0,0 +1,199 @@
+<% content_for :page_title do %>
+  <% if @user.present? %>
+    <%= page_header_back_button spree.admin_user_path(@user) %>
+  <% else %>
+    <%= page_header_back_button spree.admin_gift_cards_path %>
+  <% end %>
+
+  <%= @object.code.upcase %>
+  <span class="badge">
+    <%= active_badge(@object.active?, label: @object.display_state, class: 'badge-sm') %>
+  </span>
+<% end %>
+
+<% content_for :title do %>
+  <%= Spree.t(:gift_card) %>
+  <%= @object.code.upcase %>
+<% end %>
+
+<div class="row">
+  <div class="col-md-8">
+
+    <div class="card mb-4">
+      <div class="card-header d-flex justify-content-between align-items-center">
+        <h5 class="card-title">
+          <%= Spree.t('admin.gift_cards.usage') %>
+        </h5>
+      </div>
+      <div class="card-body border-bottom">
+        <div class="d-flex justify-content-between align-items-center">
+          <div class="w-75">
+            <%= progress_bar_component(@object.amount_used, max: @object.amount) %>
+          </div>
+          <div class="w-25 text-right">
+            <%= @object.display_amount_used %> <%= Spree.t(:used).downcase %> / <%= @object.display_amount %>
+          </div>
+        </div>
+      </div>
+      <div class="card-body p-0">
+        <% if @orders.any? %>
+          <div class="table-responsive">
+            <table class="table">
+              <thead>
+                <tr>
+                  <th><%= Spree.t(:order) %></th>
+                  <th><%= Spree.t(:status) %></th>
+                  <th><%= Spree.t(:customer) %></th>
+                  <th class="text-right"><%= I18n.t('activerecord.attributes.spree/gift_card.amount_used') %></th>
+                  <th class="text-right"><%= Spree.t(:total) %></th>
+                </tr>
+              </thead>
+              <tbody>
+                <% @orders.each do |order| %>
+                  <tr>
+                    <td>
+                      <%= link_to order.number, spree.edit_admin_order_path(order), class: 'text-dark font-weight-bold' %>
+                    </td>
+                    <td>
+                      <% if order.completed? %>
+                        <span class="badge badge-success">
+                          <%= icon('check') %>
+                          <%= Spree.t("state_machine_states.completed") %>
+                        </span>
+                      <% else %>
+                        <span class="badge badge-warning">
+                          <%= Spree.t("state_machine_states.#{order.state}") %>
+                        </span>
+                      <% end %>
+                    </td>
+                    <td>
+                      <%= order.user.email %>
+                    </td>
+                    <td class="text-right">
+                      <%= order.display_gift_card_total %>
+                    </td>
+                    <td class="text-right">
+                      <%= order.display_total %>
+                    </td>
+                  </tr>
+                <% end %>
+              </tbody>
+            </table>
+          </div>
+        <% else %>
+          <%= render 'spree/admin/shared/no_resource_found', resource_name: Spree.t(:order), new_object_url: nil %>
+        <% end %>
+      </div>
+    </div>
+
+    </div>
+
+  <div class="col-md-4">
+    <%= turbo_frame_tag :gift_card_settings do %>
+      <div class="card">
+        <div class="card-header d-flex justify-content-between">
+          <h5 class="card-title">
+            <%= Spree.t(:settings) %>
+          </h5>
+          <%= link_to_with_icon 'edit', Spree.t(:edit), spree.edit_admin_gift_card_path(@object), icon: 'pencil', class: 'btn btn-sm btn-light', if: @gift_card.editable? %>
+        </div>
+        <div class="card-body p-0">
+          <ul class="list-group list-group-flush">
+            <li class="list-group-item d-flex justify-content-between align-items-center">
+              <span class="text-muted">
+                <%= Spree.t(:code) %>
+              </span>
+              <span>
+                <code><%= @object.display_code %></code>
+                <%= clipboard_component(@object.display_code) %>
+              </span>
+            </li>
+
+            <li class="list-group-item d-flex justify-content-between align-items-center">
+              <span class="text-muted">
+                <%= Spree.t(:customer) %>
+              </span>
+              <span>
+                <% if @object.user %>
+                  <%= link_to @object.user.email, spree.admin_user_path(@object.user), data: { turbo_frame: '_top' } %>
+                <% else %>
+                  <span class="text-muted">
+                    <%= Spree.t(:not_available) %>
+                  </span>
+                <% end %>
+              </span>
+            </li>
+
+            <li class="list-group-item d-flex justify-content-between align-items-center">
+              <span class="text-muted">
+                <%= Spree.t(:amount) %>
+              </span>
+              <span>
+                <%= @object.display_amount %>
+              </span>
+            </li>
+            <li class="list-group-item d-flex justify-content-between align-items-center">
+              <span class="text-muted">
+                <%= Spree.t(:used) %>
+              </span>
+              <span>
+                <%= @object.display_amount_used %>
+              </span>
+            </li>
+
+            <li class="list-group-item d-flex justify-content-between align-items-center">
+              <span class="text-muted">
+                <%= Spree.t('store_credit.remaining') %>
+              </span>
+              <span>
+                <%= @object.display_amount_remaining %>
+              </span>
+            </li>
+
+            <li class="list-group-item d-flex justify-content-between align-items-center">
+              <span class="text-muted">
+                <%= Spree.t(:currency) %>
+              </span>
+              <span>
+                <%= @object.currency %>
+              </span>
+            </li>
+
+            <li class="list-group-item d-flex justify-content-between align-items-center">
+              <span class="text-muted">
+                <%= Spree.t(:expires_at) %>
+              </span>
+              <% if @object.expires_at %>
+                <span><%= local_time(@object.expires_at) %></span>
+              <% else %>
+                <span class="text-muted"><%= Spree.t(:not_available) %></span>
+              <% end %>
+            </li>
+
+            <li class="list-group-item d-flex justify-content-between align-items-center">
+              <span class="text-muted">
+                <%= Spree.t(:created_by) %>
+              </span>
+              <span>
+                <% if @object.created_by %>
+                  <%= link_to @object.created_by.email, spree.admin_admin_user_path(@object.created_by), data: { turbo_frame: '_top' } %>
+                <% else %>
+                  <span class="text-muted">
+                    <%= Spree.t(:not_available) %>
+                  </span>
+                <% end %>
+              </span>
+            </li>
+
+            <li class="list-group-item d-flex justify-content-between align-items-center">
+              <span class="text-muted">
+                <%= Spree.t(:created_at) %>
+              </span>
+              <span><%= local_time(@object.created_at) %></span>
+            </li>
+          </ul>
+        </div>
+      </div>
+    <% end %>
+  </div>
+</div>

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

@@ -3,12 +3,15 @@
   <%= Spree.t('actions.connect') %> <%= @integration.name %>
 <% end %>
 
-<%= render partial: 'spree/admin/shared/error_messages', locals: { target: @integration } %>
-
 <%= form_for @integration, as: :integration, url: spree.admin_integrations_path do |form| %>
   <%= form.hidden_field :type %>
   <%= form.hidden_field :active, value: true %>
 
-  <%= render "spree/admin/integrations/forms/#{@integration.key}", form: form %>
-  <%= render 'spree/admin/shared/new_resource_links' %>
+  <div class="row">
+    <div class="col-lg-6 offset-lg-3">
+      <%= render partial: 'spree/admin/shared/error_messages', locals: { target: @integration } %>
+      <%= render "spree/admin/integrations/forms/#{@integration.key}", form: form %>
+      <%= render 'spree/admin/shared/new_resource_links' %>
+    </div>
+  </div>
 <% end %>

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

@@ -3,11 +3,10 @@
   <%= @oauth_application.name.capitalize %>
 <% end %>
 
-<%= render partial: 'spree/admin/shared/error_messages', locals: { target: @oauth_application } %>
-
 <div class="row">
-  <div class="col-lg-6">
+  <div class="col-lg-6 offset-lg-3">
     <%= form_for [:admin, @oauth_application] do |f| %>
+      <%= render partial: 'spree/admin/shared/error_messages', locals: { target: @oauth_application } %>
       <div class="card mb-4">
         <div class="card-body">
           <%= render 'form', f: f %>

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

@@ -7,10 +7,9 @@
   <%= Spree.t('admin.oauth_applications.new') %>
 <% end %>
 
-<%= render partial: 'spree/admin/shared/error_messages', locals: { target: @oauth_application } %>
-
 <div class="row">
-  <div class="col-lg-6">
+  <div class="col-lg-6 offset-lg-3">
+    <%= render partial: 'spree/admin/shared/error_messages', locals: { target: @oauth_application } %>
     <%= turbo_frame_tag 'new_oauth_application' do %>
       <%= form_for [:admin, @oauth_application] do |f| %>
         <div class="card mb-4">

data/app/views/spree/admin/orders/_customer.html.erb

@@ -5,7 +5,7 @@
     </h5>
     <% if can?(:update_customer, @order) || can?(:update_addresses, @order) %>
       <div class="dropdown ml-auto" id="customer-edit-dropdown">
-        <%= link_to_with_icon 'dots-vertical', nil, '#', class: 'btn btn-light btn-sm px-2', data: { toggle: 'dropdown', test_id: 'dropdown-toggle' } %>
+        <%= link_to_with_icon 'dots-vertical', nil, '#', class: 'btn btn-light btn-sm px-1', data: { toggle: 'dropdown', test_id: 'dropdown-toggle' } %>
         <div class="dropdown-menu dropdown-menu-right" >
           <div data-toggle="modal" data-target="#modal">
             <% if can?(:update_customer, @order) && !@order.user.present? %>
@@ -37,7 +37,10 @@
           <%= render 'spree/admin/shared/user', user: @order.user %>
           <%= render 'spree/admin/orders/user_overview', user: @order.user %>
         <% elsif @order.email.present? %>
-          <%= mail_to truncate(@order.email, length: 35), class: 'text-dark with-tip', title: @order.email %>
+          <div class="d-flex align-items-center w-100">
+            <%= mail_to @order.email, @order.email, class: 'text-blue' %>
+            <%= clipboard_component(@order.email) %>
+          </div>
         <% else %>
           <span class="text-muted">
             <%= Spree.t(:no_email_provided) %>

data/app/views/spree/admin/orders/_payments.html.erb

@@ -10,7 +10,7 @@
         <%= order_payment_state(@order, class: "ml-auto") %>
       <% end %>
     </div>
-    <div class="card-body d-flex flex-column gap-2 px-1 pt-0 pb-1">
+    <div class="card-body d-flex flex-column gap-2 px-2 pt-0 pb-2">
       <%= render collection: @payments, partial: 'spree/admin/payments/payment', as: :payment %>
 
       <% if @order.payment_total < @order.total && can?(:create, Spree::Payment.new(order: @order)) %>

data/app/views/spree/admin/orders/_return_authorizations.html.erb

@@ -17,7 +17,9 @@
             </tr>
           </thead>
           <tbody>
-            <%= render partial: 'spree/admin/orders/return_authorizations/return_authorization', collection: @return_authorizations, cached: spree_base_cache_scope %>
+            <%= render partial: "spree/admin/orders/return_authorizations/return_authorization",
+            collection: @return_authorizations,
+            cached: ->(r) { [spree_base_cache_key, r.cache_key_with_version, r.return_items.maximum(:updated_at)] } %>
           </tbody>
         </table>
       </div>

data/app/views/spree/admin/orders/_shipment.html.erb

@@ -65,7 +65,7 @@
           <strong><%= Spree.t(:tracking) %>: </strong>
           <% if shipment.tracked? %>
             <% if shipment.tracking_url.present? %>
-              <span><%= link_to ERB::Util.html_escape(shipment.tracking), ERB::Util.html_escape(shipment.tracking_url), target: '_blank', rel: "noopener noreferrer" %></span>
+              <span><%= shipment_tracking_link_to(shipment: shipment, html_options: { target: '_blank', rel: 'noopener noreferrer' }) %></span>
             <% elsif shipment.tracking.present? %>
               <span><%= shipment.tracking %></span>
             <% end %>

data/app/views/spree/admin/orders/_shipments.html.erb

@@ -10,7 +10,7 @@
       <%= order_shipment_state(@order, class: "ml-auto") %>
     <% end %>
   </div>
-  <div class="card-body px-1 pt-0 pb-1 d-flex flex-column gap-2">
+  <div class="card-body px-2 pt-0 pb-2 d-flex flex-column gap-2">
     <% if @shipments.any? %>
       <%= render partial: "shipment", collection: @shipments %>
     <% else %>

data/app/views/spree/admin/orders/return_authorizations/_form.html.erb

@@ -68,9 +68,9 @@
             <td><%= inventory_unit.state.humanize %></td>
             <td
               class="charged-amount"
-              data-charged-amount="<%= return_item.pre_tax_amount %>"
+              data-charged-amount="<%= inventory_unit.charged_amount %>"
             >
-              <%= return_item.display_pre_tax_amount %>
+              <%= inventory_unit.display_charged_amount %>
             </td>
             <td class="purchased-quantity">
               <%= inventory_unit.quantity %>
@@ -81,6 +81,7 @@
                                          {
                                            class: "refund-quantity-input form-control",
                                            min: 0,
+                                           required: true,
                                            data: {
                                              action: "return-items#updateSuggestedAmount",
                                            },
@@ -93,12 +94,13 @@
             <td>
               <% if editable %>
                 <%= item_fields.text_field :pre_tax_amount,
-                                       {
-                                         class: "refund-amount-input form-control",
-                                         data: {
-                                           action: "return-items#updateTotalRefundAmount",
-                                         },
-                                       } %>
+                                         {
+                                           class: "refund-amount-input form-control",
+                                           required: true,
+                                           data: {
+                                             action: "return-items#updateTotalRefundAmount",
+                                           },
+                                         } %>
               <% else %>
                 <%= return_item.display_pre_tax_amount %>
               <% end %>
@@ -153,9 +155,9 @@
       <div class="form-group">
         <%= f.label :reason, raw(Spree.t(:reason) + required_span_tag) %>
         <%= f.select :return_authorization_reason_id,
-                      @reasons.collect { |r| [r.name, r.id] },
-                      { include_blank: Spree.t(:select_a_return_authorization_reason) },
-                      { class: "custom-select" } %>
+                 @reasons.collect { |r| [r.name, r.id] },
+                 { include_blank: Spree.t(:select_a_return_authorization_reason) },
+                 { class: "custom-select" } %>
         <%= f.error_message_on :reason %>
       </div>
 

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

@@ -21,11 +21,6 @@
   <%= 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.label :preferred_posts_to_show, Spree.t('admin.page_builder.posts_to_show') %>
-  <%= f.select :preferred_posts_to_show, options_for_select([["Newest", "newest"], ["Most popular", "most_popular"]], @page_section.preferred_posts_to_show), {}, 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_posts_to_show') %>: <span data-better-slider-target="currentValueLabel"></span></label>

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

@@ -1,29 +1,23 @@
-<% 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 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="<%= 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 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>
+<%= 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' %>
+

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

@@ -5,7 +5,13 @@
 <% 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 %>
+
+<div class="row">
+  <div class="col-lg-6 offset-lg-3">
+    <%= form_with model: @page, url: spree.admin_pages_path, data: { controller: 'slug-form seo-form' }, scope: :page do |f| %>
+      <%= render partial: 'spree/admin/shared/error_messages', locals: { target: @page } %>
+      <%= render 'form', f: f, vertical: false %>
+      <%= render 'spree/admin/shared/new_resource_links', f: f %>
+    <% end %>
+  </div>
+</div>