spree_frontend 4.2.0.rc3 → 4.2.2

data/app/views/spree/locale/index.html.erb

@@ -0,0 +1 @@
+<%= render 'spree/shared/locale_dropdown' %>

data/app/views/spree/orders/_coupon_code.html.erb

@@ -12,11 +12,10 @@
     <div class="input-group">
       <%= order_form.text_field :applied_coupon_code, name: '', size: '30', class: 'form-control border-right-0 disabled',
         value: Spree.t(:promotion_label, name: promotion.name),
-        data: { code: promotion.code }
-      %>
+        data: { code: promotion.code } %>
       <div class="input-group-append">
         <%= button_tag name: '', id: 'shopping-cart-remove-coupon-code-button', class: 'btn border-left-0 remove' do %>
-          <%= icon(name: 'close', width: 15, height: 14)  %>
+          <%= icon(name: 'close', width: 15, height: 14) %>
         <% end %>
       </div>
     </div>

data/app/views/spree/orders/_line_item.html.erb

@@ -3,13 +3,13 @@
 <%= order_form.fields_for :line_items, line_item do |item_form| %>
   <div class="d-table-row shopping-cart-item">
     <div class="d-table-cell shopping-cart-item-image" data-hook="cart_item_image">
-      <%= link_to product_image(variant), variant.product %>
+      <%= link_to product_image(variant), spree.product_path(variant.product) %>
     </div>
     <div class="d-table-cell shopping-cart-item-description" data-hook="cart_item_description">
       <h2 class="item-title"><%= link_to line_item.name, spree.product_path(variant.product) %></h2>
       <% if line_item.insufficient_stock? %>
         <span class="out-of-stock">
-          <%= Spree.t(:out_of_stock) %>&nbsp;&nbsp;<br />
+          <%= Spree.t(:out_of_stock) %>&nbsp;&nbsp;<br>
         </span>
       <% end %>
       <ul class="item-details-list" data-hook="line_item_description">

data/app/views/spree/orders/_line_item_data.html.erb

@@ -26,6 +26,6 @@
     <%= icon(name: 'garbage',
              classes: 'shopping-cart-item-delete-icon',
              width: 18.9,
-             height: 17)  %>
+             height: 17) %>
   <% end %>
 </div>

data/app/views/spree/orders/edit.html.erb

@@ -12,7 +12,7 @@
           <%= icon(name: 'empty-cart',
                    classes: 'shopping-cart-empty-image',
                    width: 83,
-                   height: 83)  %>
+                   height: 83) %>
 
           <p class="text-center shopping-cart-empty-info"><%= Spree.t('cart_page.empty_info').html_safe %></p>
         </div>
@@ -57,8 +57,7 @@
               <%= render 'coupon_code',
                 promotion: @order.valid_coupon_promotions.first,
                 order_form: order_form,
-                classes: ''
-              %>
+                classes: '' %>
             <% end %>
 
             <div class="text-right shopping-cart-total d-lg-none">

data/app/views/spree/orders/show.html.erb

@@ -15,75 +15,5 @@
   <p class="order-show-number text-uppercase w-100 text-center">
     <%= accurate_title %> / <%= pretty_date(@order.completed_at) %>
   </p>
-  <dl class="w-100 d-lg-flex justify-content-lg-between">
-    <div>
-      <dt class="text-uppercase text-center text-lg-left"><%= Spree.t(:shipping_address) %></dt>
-      <dd class="text-center text-lg-left">
-        <%= render 'spree/shared/address', address: @order.ship_address %>
-      </dd>
-    </div>
-    <div>
-      <dt class="text-uppercase text-center text-lg-left"><%= Spree.t(:billing_address) %></dt>
-      <dd class="text-center text-lg-left">
-        <%= render 'spree/shared/address', address: @order.bill_address %>
-      </dd>
-    </div>
-    <div>
-      <dt class="text-uppercase text-center text-lg-left"><%= Spree.t(:shipping) %></dt>
-      <% @order.shipments.valid.each do |shipment| %>
-        <dd class="text-center text-lg-left">
-          <%= shipment.shipping_method.name %>
-          <%= link_to_tracking(shipment) if shipment.shipped? %>
-        </dd>
-      <% end %>
-    </div>
-    <div>
-      <dt class="text-uppercase text-center text-lg-left"><%= Spree.t(:payment) %></dt>
-      <dd class="text-center text-lg-left">
-        <%= render collection: @order.payments.valid, partial: 'spree/shared/payment' %>
-      </dd>
-    </div>
-  </dl>
-  <hr class="w-100 mt-0 mb-4 d-sm-none" />
-  <div class="order-show-line-items d-flex flex-column align-items-center">
-    <% @order.line_items.each do |item| %>
-      <div class="order-show-line-items-line-item d-flex w-100">
-        <%= link_to product_image(item.variant), item.product %>
-        <div class="order-show-line-items-line-item-desc w-100">
-          <span class="order-show-line-items-line-item-desc-name">
-            <%= item.name %>
-          </span>
-          <span class="order-show-line-items-line-item-desc-subtitle text-break text-uppercase">
-            <ul class="list-unstyled mb-0">
-              <% item.variant.option_values.sort { |ov| ov.option_type.position }.each do |ov| %>
-                <li><%= "#{ov.option_type.presentation}: #{ov.name.titleize}" %></li>
-              <% end %>
-            </ul>
-          </span>
-          <div class="order-show-line-items-line-item-desc-price">
-            <div class="order-show-line-items-line-item-desc-price-attr-name d-inline d-lg-block">
-              <span><%= Spree.t(:price) %></span>
-            </div>
-            <span class="font-weight-bold"><%= item.single_money.to_html %></span>
-          </div>
-          <div class="order-show-line-items-line-item-desc-quantity">
-            <div class="order-show-line-items-line-item-desc-quantity-attr-name d-inline d-lg-block">
-              <span><%= Spree.t(:quantity) %></span>
-            </div>
-            <span class="order-show-line-items-line-item-desc-quantity-val d-lg-block"><%= item.quantity %></span>
-          </div>
-          <div class="order-show-line-items-line-item-desc-total">
-            <div class="order-show-line-items-line-item-desc-total-attr-name d-inline d-lg-block">
-              <span><%= Spree.t(:total) %></span>
-            </div>
-            <span class="font-weight-bold d-lg-block"><%= item.display_total.to_s %></span>
-          </div>
-        </div>
-      </div>
-    <% end %>
-  </div>
-  <hr class="w-100 mt-4 mb-0 d-sm-none" />
-  <div id="checkout-summary" class="w-100" data-hook="checkout_summary_box">
-    <%= render partial: 'spree/checkout/summary', locals: { order: @order } %>
-  </div>
+  <%= render partial: 'spree/shared/order_details', locals: { order: @order } %>
 </div>

data/app/views/spree/products/_cart_form.html.erb

@@ -16,7 +16,6 @@
 
 <% is_product_available_in_currency = product_available_in_currency? %>
 <% default_variant = default_variant(@variants, @product) %>
-<% should_display_compare_at_price = default_variant.compare_at_price.present? && default_variant.compare_at_price > default_variant.price %>
 
 <%= form_for :order, html: {
     id: 'add-to-cart-form',
@@ -28,7 +27,7 @@
   <div id="inside-product-cart-form" data-hook="inside_product_cart_form">
     <% if is_product_available_in_currency %>
       <div id="product-price" class="mb-2 text-center text-md-left add-to-cart-form-price" data-hook="product_price">
-        <% if should_display_compare_at_price %>
+        <% if should_display_compare_at_price?(default_variant) %>
           <span class="compare-at-price mr-3"><%= display_compare_at_price(default_variant) %></span>
         <% end %>
         <span class="price selling" content="<%= @product_price.to_d %>">
@@ -56,7 +55,7 @@
       <ul id="product-variants" class="product-variants">
         <% used_variants_options(@variants, @product).each_with_index do |option_type, index| %>
           <li>
-            <% if Spree::OptionType.color&.name == option_type[:name] %>
+            <% if color_option_type_name.present? && color_option_type_name == option_type[:name] %>
               <%= render "color_option_type", option_type: option_type, index: index %>
             <% else %>
               <%= render "option_type", option_type: option_type, index: index %>

data/app/views/spree/products/_color_option_type.html.erb

@@ -9,7 +9,7 @@
         <li>
           <%= label_tag "variant_option_value_id_#{option_type[:id]}_#{option_value[:id]}",
             class: "m-1 m-sm-2 m-md-1 color-select-label",
-            title: option_value[:name],
+            title: option_value[:name]&.humanize,
             data: { toggle: "tooltip", placement: "bottom" } do %>
 
             <%= radio_button_tag "variant_option_value_id_#{option_type[:id]}",
@@ -22,8 +22,7 @@
                 "presentation" => option_value[:presentation],
                 "variant-id" => option_value[:variant_id],
                 "is-color" => true
-              }
-            %>
+              } %>
 
             <%= render partial: "spree/shared/color_select", locals: {
               color: option_value[:presentation],

data/app/views/spree/products/_filters_desktop.html.erb

@@ -24,8 +24,7 @@
                 params_ot_downcase_name: params[ot_downcase_name],
                 option_type: option_type,
                 permitted_params: permitted_params,
-                ot_downcase_name: ot_downcase_name
-              %>
+                ot_downcase_name: ot_downcase_name %>
             </div>
           </div>
         </div>

data/app/views/spree/products/_gallery.html.erb

@@ -2,16 +2,15 @@
   <% if @product_images.size > 0 %>
     <div
       class="w-100 d-flex align-self-start justify-content-between product-details-images"
-      data-hook="product_left_part_wrap"
-    >
+      data-hook="product_left_part_wrap">
+
       <div class="d-none d-md-block product-details-thumbnails" data-hook="product_thumbnails">
         <%= render 'spree/shared/carousel/thumbnails',
                   images: @product_images,
                   group_id: 'main-product-carousel',
                   id: 'productThumbnailsCarousel',
                   trigger_id: 'productCarousel',
-                  per_page: 5
-        %>
+                  per_page: 5 %>
       </div>
       <div class="product-details-single" data-hook="product_images">
         <%= render 'spree/shared/carousel/single',
@@ -19,8 +18,7 @@
                   group_id: 'main-product-carousel',
                   id: 'productCarousel',
                   trigger_id: 'productCarousel',
-                  zoomed: false
-        %>
+                  zoomed: false %>
       </div>
     </div>
   <% end %>

data/app/views/spree/products/_gallery_modal.html.erb

@@ -1,5 +1,5 @@
 <% if @product_images.size > 0 %>
-  <div class="modal fade" id="picturesModal" tabindex="-1" role="dialog" >
+  <div class="modal fade" id="picturesModal" tabindex="-1" role="dialog">
     <div class="modal-dialog--zoom modal-dialog mw-100 vh-100 mt-0 mb-0" role="document">
       <div class="modal-content h-100">
         <div class="modal-body h-100">
@@ -23,8 +23,7 @@
                             group_id: 'main-product-modal-carousel',
                             id: 'productModalThumbnailsCarousel',
                             trigger_id: 'productCarousel',
-                            per_page: 4
-                %>
+                            per_page: 4 %>
               </div>
             <% end %>
             <div class="product-details-single">
@@ -33,8 +32,7 @@
                           group_id: 'main-product-modal-carousel',
                           id: 'productModalCarousel',
                           trigger_id: 'productCarousel',
-                          zoomed: true
-              %>
+                          zoomed: true %>
             </div>
           </div>
         </div>

data/app/views/spree/products/_option_type.html.erb

@@ -15,8 +15,7 @@
               "option-type-index" => index,
               "presentation" => option_value[:presentation],
               "variant-id" => option_value[:variant_id]
-            }
-          %>
+            } %>
 
           <%= label_tag "variant_option_value_id_#{option_type[:id]}_#{option_value[:id]}",
             class: "m-1 select-label",

data/app/views/spree/products/_sort_mobile.html.erb

@@ -8,7 +8,7 @@
   <div class="plp-overlay-header-border"></div>
   <ul class="pt-1 plp-overlay-ul">
     <li class="plp-overlay-ul-li <%= 'plp-overlay-ul-li--active' if params[:sort_by].blank? %>">
-      <a class="p-3 d-block" href="<%= url_for(permitted_params.merge(sort_by: nil)) %>" >
+      <a class="p-3 d-block" href="<%= url_for(permitted_params.merge(sort_by: nil)) %>">
         <div class="plp-empty-dot">
           <div class="filled-dot"></div>
         </div>
@@ -16,7 +16,7 @@
       </a>
     </li>
     <li class="plp-overlay-ul-li <%= 'plp-overlay-ul-li--active' if params[:sort_by] == 'newest-first' %>">
-      <a class="p-3 d-block" href="<%= url_for(permitted_params.merge(sort_by: 'newest-first')) %>" >
+      <a class="p-3 d-block" href="<%= url_for(permitted_params.merge(sort_by: 'newest-first')) %>">
         <div class="plp-empty-dot">
           <div class="filled-dot"></div>
         </div>
@@ -24,7 +24,7 @@
       </a>
     </li>
     <li class="plp-overlay-ul-li <%= 'plp-overlay-ul-li--active' if params[:sort_by] == 'price-high-to-low' %>">
-      <a class="p-3 d-block" href="<%= url_for(permitted_params.merge(sort_by: 'price-high-to-low')) %>" >
+      <a class="p-3 d-block" href="<%= url_for(permitted_params.merge(sort_by: 'price-high-to-low')) %>">
         <div class="plp-empty-dot">
           <div class="filled-dot"></div>
         </div>
@@ -32,7 +32,7 @@
       </a>
     </li>
     <li class="plp-overlay-ul-li <%= 'plp-overlay-ul-li--active' if params[:sort_by] == 'price-low-to-high' %>">
-      <a class="p-3 d-block" href="<%= url_for(permitted_params.merge(sort_by: 'price-low-to-high')) %>" >
+      <a class="p-3 d-block" href="<%= url_for(permitted_params.merge(sort_by: 'price-low-to-high')) %>">
         <div class="plp-empty-dot">
           <div class="filled-dot"></div>
         </div>

data/app/views/spree/products/related.html.erb

@@ -1,8 +1,14 @@
-<% if related_products.any? %>
+<% if product_relation_types.any? %>
   <div id="related-products">
-    <div class="product-details-related">
-      <p class="font-weight-bold text-center text-uppercase product-details-carousel-text"><%= Spree.t('pdp.you_may_also_like') %></p>
-      <%= render 'spree/shared/carousel_4_products', id: 'related-products-carousel', products: @related_products %>
-    </div>
+    <% product_relation_types.each do |relation_type| %>
+      <% products = product_relations_by_type(relation_type) %>
+
+      <% if products.any? %>
+        <div class="product-details-related" id="product-details-related-<%= relation_type.id %>">
+          <p class="font-weight-bold text-center text-uppercase product-details-carousel-text"><%= relation_type.name %></p>
+          <%= render 'spree/shared/carousel_4_products', id: "related-products-carousel-#{relation_type.id}", products: products %>
+        </div>
+      <% end %>
+    <% end %>
   </div>
 <% end %>

data/app/views/spree/products/show.html.erb

@@ -48,5 +48,4 @@
 <div
   data-related-products
   data-related-products-id="<%= @product.slug %>"
-  data-related-products-enabled="<%= @product.respond_to?(:has_related_products?) %>"
-/>
+  data-related-products-enabled="<%= @product.respond_to?(:has_related_products?) %>" />

data/app/views/spree/shared/_carousel_4_products.html.erb

@@ -20,8 +20,7 @@
       class="d-flex position-absolute justify-content-center align-items-center carousel-icon-control carousel-icon-control--previous"
       href="#<%= id %>-mobile"
       role="button"
-      data-slide="prev"
-    >
+      data-slide="prev">
       <span class="d-flex justify-content-center align-items-center carousel-icon-control-rounded" aria-hidden="true">
         <%= icon(name: 'arrow-right',
                 classes: 'spree-icon-arrow spree-icon-arrow-left',
@@ -35,8 +34,7 @@
       class="d-flex position-absolute justify-content-center align-items-center carousel-icon-control carousel-icon-control--next"
       href="#<%= id %>-mobile"
       role="button"
-      data-slide="next"
-    >
+      data-slide="next">
       <span class="d-flex justify-content-center align-items-center carousel-icon-control-rounded" aria-hidden="true">
         <%= icon(name: 'arrow-right',
                 classes: 'spree-icon-arrow spree-icon-arrow-right',
@@ -56,14 +54,12 @@
               class="d-flex position-absolute justify-content-center align-items-center carousel-icon-control carousel-icon-control--previous"
               href="#<%= id %>-desktop"
               role="button"
-              data-slide="prev"
-            >
+              data-slide="prev">
               <span class="d-flex justify-content-center align-items-center carousel-icon-control-rounded" aria-hidden="true">
                 <%= icon(name: 'arrow-right',
                         classes: 'spree-icon-arrow spree-icon-arrow-left',
                         width: 20,
-                        height: 20)
-                %>
+                        height: 20) %>
               </span>
               <span class="sr-only"><%= Spree.t(:previous) %></span>
             </a>
@@ -80,14 +76,12 @@
               class="d-md-flex position-absolute justify-content-center align-items-center carousel-icon-control carousel-icon-control--next"
               href="#<%= id %>-desktop"
               role="button"
-              data-slide="next"
-            >
+              data-slide="next">
               <span class="d-flex justify-content-center align-items-center carousel-icon-control-rounded" aria-hidden="true">
                 <%= icon(name: 'arrow-right',
                         classes: 'spree-icon-arrow spree-icon-arrow-right',
                         width: 20,
-                        height: 20)
-                %>
+                        height: 20) %>
               </span>
               <span class="sr-only"><%= Spree.t(:next) %></span>
             </a>

data/app/views/spree/shared/_color_select.html.erb

@@ -1,9 +1,9 @@
 <svg class="color-select" height="32" viewBox="0 0 32 32" width="32" xmlns="http://www.w3.org/2000/svg">
   <g class="color-select-border" fill="none" fill-rule="evenodd">
-    <circle class="<%= 'color-select-border--selected' if selected %> plp-overlay-color-item" cx="16" cy="16" r="15" stroke-width="2"/>
+    <circle class="<%= 'color-select-border--selected' if selected %> plp-overlay-color-item" cx="16" cy="16" r="15" stroke-width="2" />
     <g transform="translate(2 2)">
-      <circle cx="14" cy="14" fill="<%= color %>" fill-rule="evenodd" r="12"/>
-      <circle cx="14" cy="14" r="13" stroke="#fff" stroke-width="2"/>
+      <circle cx="14" cy="14" fill="<%= color %>" fill-rule="evenodd" r="12" />
+      <circle cx="14" cy="14" r="13" stroke="#fff" stroke-width="2" />
     </g>
   </g>
 </svg>

data/app/views/spree/shared/_currency_dropdown.html.erb

@@ -0,0 +1,13 @@
+<% if defined?(should_render_currency_dropdown?) && should_render_currency_dropdown? %>
+  <%= form_tag spree.set_currency_path, method: :get, class: 'px-4 py-3 w-100 currency-select' do %>
+    <div class="form-group">
+      <label for="switch_to_currency" class="dropdown-header text-center">
+        <%= Spree.t(:choose_currency) %>
+      </label>
+      <%= select_tag(:switch_to_currency,
+        options_for_select(supported_currency_options, current_currency),
+        class: 'custom-select w-100') %>
+      <noscript><%= submit_tag %></noscript>
+    </div>
+  <% end %>
+<% end %>

data/app/views/spree/shared/_delete_address_popup.html.erb

@@ -18,8 +18,7 @@
       class="btn btn-primary text-uppercase font-weight-bold delete-address-popup-button"
       data-method="delete"
       rel="nofollow"
-      href="#"
-    >
+      href="#">
       <%= Spree.t("address_action_popup.delete_button") %>
     </a>
   </div>

data/app/views/spree/shared/_error_messages.html.erb

@@ -1,10 +1,10 @@
 <% if target && target.errors.any? %>
   <div id="errorExplanation" class="alert alert-danger d-flex justify-content-center mb-0" data-hook>
-     <ul class="mb-0 pl-0"  style="list-style-type: none;">
+     <ul class="mb-0 pl-0" style="list-style-type: none;">
        <% target.errors.full_messages.each do |msg| %>
          <li><%= msg %></li>
        <% end %>
      </ul>
-     <br/>
+     <br>
   </div>
 <% end %>

data/app/views/spree/shared/_footer.html.erb

@@ -33,7 +33,7 @@
           <div class="d-flex flex-column align-items-center align-items-xl-start pb-3 flex-grow-2 footer-spree-contact-note">
             <div>
               <strong><%= current_store.name %></strong>
-              <br/>
+              <br>
               <% if current_store.address %>
                 <%= current_store.address.html_safe %>
               <% end %>
@@ -68,7 +68,7 @@
               <%= Spree.t('nav_bar.my_account') %>
             </div>
             <div class="pt-2">
-              <%= link_to Spree.t('nav_bar.my_orders'), spree.account_path(anchor: "account-my-orders") %>
+              <%= link_to Spree.t(:my_orders).upcase, spree.account_path(anchor: "account-my-orders") %>
             </div>
           </div>
         <% end %>