spree_frontend 4.4.0 → 4.6.0

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

@@ -8,7 +8,7 @@
           <% line_item.variant.option_values.sort { |ov| ov.option_type.position }.each do |ov| %>
           <li>
             <% # TODO: rework option values so options_text method can be used here %>
-            <%= "#{ov.option_type.presentation}: #{ov.name.titleize}" %>
+            <%= "#{ov.option_type.presentation}: #{ov.presentation}" %>
           </li>
         <% end %>
         </ul>

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

@@ -1,6 +1,6 @@
 <% if try_spree_current_user %>
   <%= link_to Spree.t(:my_account).upcase, spree.account_path, class: 'dropdown-item' if spree.respond_to?(:account_path) %>
-  <% if spree.respond_to(:admin_orders_path) %>
+  <% if spree.respond_to?(:admin_orders_path) %>
     <%= link_to Spree.t('nav_bar.admin_panel'), spree.admin_orders_path(locale: nil), class: 'dropdown-item text-uppercase' if try_spree_current_user.has_spree_role?(:admin) %>
   <% end %>
   <%= link_to Spree.t(:logout).upcase, spree_logout_path, class: 'dropdown-item', method: :get if defined?(spree_logout_path) %>

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

@@ -1,6 +1,6 @@
 <div class="col-lg-11 mx-auto">
   <h3 class="spree-mb-large spree-mt-large spree-header"><%= Spree.t(:log_in_to_continue) %></h3>
-  <%= form_for Spree.user_class.new, as: :spree_user, url: spree_login_path do |f| %>
+  <%= form_for Spree.user_class.new, as: :spree_user, url: spree_login_path, data: { turbo: false } do |f| %>
     <div id="password-credentials" class="mb-4">
       <div class="form-group mb-4">
         <p class="form-group checkout-content-inner-field">

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

@@ -44,7 +44,7 @@
                             <%= spree_nav_link_tag(promo_banner, { class: "dropdown-item" }) do %>
                               <div class="category-image text-center my-4 mx-3">
                                 <% if promo_banner.icon.present? %>
-                                  <%= image_tag main_app.url_for(promo_banner.icon.attachment), alt: promo_banner.icon.alt ,title: promo_banner.subtitle %>
+                                  <%= image_tag main_app.cdn_image_url(promo_banner.icon.attachment), alt: promo_banner.icon.alt ,title: promo_banner.subtitle %>
                                 <% end %>
                                 <div class="category-box">
                                   <div class="category-box-small-text">

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

@@ -1,4 +1,4 @@
-<ul id="nav-bar" class="nav align-items-center d-flex flex-nowrap justify-content-end navbar-right" data-turbo-permanent data-turbolinks-permanent>
+<ul id="nav-bar" class="nav align-items-center d-flex flex-nowrap justify-content-end navbar-right" data-turbo-permanent data-turbo-permanent>
   <li>
     <div class="navbar-right-search-menu">
       <button type="button" class="navbar-right-dropdown-toggle search-icons" aria-label="<%= Spree.t('nav_bar.show_search') %>">

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

@@ -86,7 +86,7 @@
                     <% item.variant.option_values.sort { |ov| ov.option_type.position }.each do |ov| %>
                     <li>
                       <% # TODO: rework option values so options_text method can be used here %>
-                      <%= "#{ov.option_type.presentation}: #{ov.name.titleize}" %>
+                      <%= "#{ov.option_type.presentation}: #{ov.presentation}" %>
                     </li>
                   <% end %>
                   </ul>

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

@@ -1,5 +1,5 @@
 <script>
-  window.addEventListener('turbolinks:load', function() {
+  window.addEventListener('turbo:load', function() {
       Spree.translations = <%==
         {
           coupon_code_applied: Spree.t(:coupon_code_applied),

data/app/views/spree/shared/carousel/_single.html.erb

@@ -47,7 +47,7 @@
         data-variant-id="<%= image.viewable_id %>">
         <div class="product-carousel-item-squared <%= 'product-carousel-item-squared-only' if images.length == 1 %>">
           <% image_attrs = {
-            src: main_app.url_for(image.url(zoomed ? :zoomed : :large)),
+            src: main_app.cdn_image_url(image.url(zoomed ? :zoomed : :large)),
             alt: image.alt || @product.name,
             class: "d-block w-100",
             width: zoomed ? 650 : 475,
@@ -66,7 +66,7 @@
         data-slide-to="<%= imageIndex %>"
         class="product-carousel-indicators-indicator product-carousel-indicators-indicator--visible<%= ' active' if imageIndex == 0 %>">
         <%= lazy_image(
-          src: main_app.url_for(image.url(:pdp_thumbnail)),
+          src: main_app.cdn_image_url(image.url(:pdp_thumbnail)),
           class: 'd-block w-100',
           alt: image.alt || @product.name,
           width: image.style(:pdp_thumbnail)[:width],

data/app/views/spree/shared/carousel/_thumbnails.html.erb

@@ -20,7 +20,7 @@
                 data-variant-is-master="<%= image.viewable_id == @product.master.id %>"
                 data-variant-id="<%= image.viewable_id %>">
                 <%= lazy_image(
-                  src: main_app.url_for(image.url(:pdp_thumbnail)),
+                  src: main_app.cdn_image_url(image.url(:pdp_thumbnail)),
                   class: 'd-block w-100',
                   alt: image.alt || @product.name,
                   width: 57,

data/app/views/spree/shared/cms/sections/_hero_image.html.erb

@@ -10,30 +10,30 @@
 <div class="col-12 homepage-hero-image position-relative p-0 <%= section_padding %>">
 
   <div class="bg-light" style="--aspect-ratio:12/5;">
-    <% if section.image_one.attached? %>
+    <% if section.image_one&.attachment&.attached? %>
 
         <!-- SM to MD -->
         <img class="d-block d-md-none lazyload"
-          data-src="<%= main_app.url_for(section.img_one_sm) %>"
-          data-srcset="<%= main_app.url_for(section.img_one_sm) %>"
+          data-src="<%= main_app.cdn_image_url(section.img_one_sm) %>"
+          data-srcset="<%= main_app.cdn_image_url(section.img_one_sm) %>"
           alt="<%= section&.title %>">
 
         <!-- MD to LG -->
         <img class="d-none d-md-block d-lg-none lazyload"
-          data-src="<%= main_app.url_for(section.img_one_md) %>"
-          data-srcset="<%= main_app.url_for(section.img_one_md) %>"
+          data-src="<%= main_app.cdn_image_url(section.img_one_md) %>"
+          data-srcset="<%= main_app.cdn_image_url(section.img_one_md) %>"
           alt="<%= section&.title %>">
 
         <!-- LG to XL -->
         <img class="d-none d-lg-block d-xl-none lazyload"
-          data-src="<%= main_app.url_for(section.img_one_lg) %>"
-          data-srcset="<%= main_app.url_for(section.img_one_lg) %>"
+          data-src="<%= main_app.cdn_image_url(section.img_one_lg) %>"
+          data-srcset="<%= main_app.cdn_image_url(section.img_one_lg) %>"
           alt="<%= section&.title %>">
 
         <!-- XL UP -->
         <img class="d-none d-xl-block lazyload"
-          data-src="<%= main_app.url_for(section.img_one_xl) %>"
-          data-srcset="<%= main_app.url_for(section.img_one_xl) %>"
+          data-src="<%= main_app.cdn_image_url(section.img_one_xl) %>"
+          data-srcset="<%= main_app.cdn_image_url(section.img_one_xl) %>"
           alt="<%= section&.title %>">
 
      <% else %>

data/app/views/spree/shared/cms/sections/_image_gallery.html.erb

@@ -64,24 +64,24 @@
     <div class="col-12">
 
       <%= link_to link_one, class: link_one_classes, style: '--aspect-ratio:18/13;' do %>
-        <% if section.image_one.attached? && section.image_one.variable? %>
+        <% if section.image_one&.attachment&.attached? && section.image_one&.attachment&.variable? %>
 
             <!-- XS to MD -->
             <img class="d-md-none lazyload"
-              data-src="<%= main_app.url_for(section.img_one_md) %>"
-              data-srcset="<%= main_app.url_for(section.img_one_md) %>"
+              data-src="<%= main_app.cdn_image_url(section.img_one_md) %>"
+              data-srcset="<%= main_app.cdn_image_url(section.img_one_md) %>"
               alt="<%= section&.title_one %>">
 
             <!-- MD to XL -->
             <img class="d-none d-md-block d-xl-none lazyload"
-              data-src="<%= main_app.url_for(section.img_one_lg) %>"
-              data-srcset="<%= main_app.url_for(section.img_one_lg) %>"
+              data-src="<%= main_app.cdn_image_url(section.img_one_lg) %>"
+              data-srcset="<%= main_app.cdn_image_url(section.img_one_lg) %>"
               alt="<%= section&.title_one %>">
 
             <!-- XL UP -->
             <img class="d-none d-xl-block lazyload"
-              data-src="<%= main_app.url_for(section.img_one_xl) %>"
-              data-srcset="<%= main_app.url_for(section.img_one_xl) %>"
+              data-src="<%= main_app.cdn_image_url(section.img_one_xl) %>"
+              data-srcset="<%= main_app.cdn_image_url(section.img_one_xl) %>"
               alt="<%= section&.title_one %>">
         <% else %>
           <%= icon( name: 'card-image',
@@ -102,24 +102,24 @@
     <div class="col-12">
 
       <%= link_to link_three, class: link_three_classes, style: '--aspect-ratio:18/13;' do %>
-        <% if section.image_three.attached? && section.image_three.variable? %>
+        <% if section.image_three&.attachment&.attached? && section.image_three&.attachment&.variable? %>
 
             <!-- XS to MD -->
             <img class="d-md-none lazyload"
-              data-src="<%= main_app.url_for(section.img_three_md) %>"
-              data-srcset="<%= main_app.url_for(section.img_three_md) %>"
+              data-src="<%= main_app.cdn_image_url(section.img_three_md) %>"
+              data-srcset="<%= main_app.cdn_image_url(section.img_three_md) %>"
               alt="<%= section&.title_three %>">
 
             <!-- MD to XL -->
             <img class="d-none d-md-block d-xl-none lazyload"
-              data-src="<%= main_app.url_for(section.img_three_lg) %>"
-              data-srcset="<%= main_app.url_for(section.img_three_lg) %>"
+              data-src="<%= main_app.cdn_image_url(section.img_three_lg) %>"
+              data-srcset="<%= main_app.cdn_image_url(section.img_three_lg) %>"
               alt="<%= section&.title_three %>">
 
             <!-- XL UP -->
             <img class="d-none d-xl-block lazyload"
-              data-src="<%= main_app.url_for(section.img_three_xl) %>"
-              data-srcset="<%= main_app.url_for(section.img_three_xl) %>"
+              data-src="<%= main_app.cdn_image_url(section.img_three_xl) %>"
+              data-srcset="<%= main_app.cdn_image_url(section.img_three_xl) %>"
               alt="<%= section&.title_three %>">
         <% else %>
           <%= icon( name: 'card-image',
@@ -139,24 +139,24 @@
 <!-- Right Block TALL -->
 <div class="col-6 <%= section_two_padding %>">
   <%= link_to link_two, class: link_two_classes, style: '--aspect-ratio:27/40;' do %>
-    <% if section.image_two.attached? && section.image_two.variable? %>
+    <% if section.image_two&.attachment&.attached? && section.image_two&.attachment&.variable? %>
 
         <!-- XS to MD -->
         <img class="d-md-none lazyload"
-          data-src="<%= main_app.url_for(section.img_two_md) %>"
-          data-srcset="<%= main_app.url_for(section.img_two_md) %>"
+          data-src="<%= main_app.cdn_image_url(section.img_two_md) %>"
+          data-srcset="<%= main_app.cdn_image_url(section.img_two_md) %>"
           alt="<%= section&.title_two %>">
 
         <!-- MD to XL -->
         <img class="d-none d-md-block d-xl-none lazyload"
-          data-src="<%= main_app.url_for(section.img_two_lg) %>"
-          data-srcset="<%= main_app.url_for(section.img_two_lg) %>"
+          data-src="<%= main_app.cdn_image_url(section.img_two_lg) %>"
+          data-srcset="<%= main_app.cdn_image_url(section.img_two_lg) %>"
           alt="<%= section&.title_two %>">
 
         <!-- XL UP -->
         <img class="d-none d-xl-block lazyload"
-          data-src="<%= main_app.url_for(section.img_two_xl) %>"
-          data-srcset="<%= main_app.url_for(section.img_two_xl) %>"
+          data-src="<%= main_app.cdn_image_url(section.img_two_xl) %>"
+          data-srcset="<%= main_app.cdn_image_url(section.img_two_xl) %>"
           alt="<%= section&.title_two %>">
     <% else %>
       <%= icon( name: 'file-image',

data/app/views/spree/shared/cms/sections/_side_by_side_images.html.erb

@@ -36,23 +36,23 @@
               class: "d-flex align-items-end justify-content-center bg-light text-center overflow-hidden homepage-bottom-box #{'pointer-events-none cursor-default' unless link_one}",
               style: '--aspect-ratio:54/35;' do %>
 
-      <% if section.image_one.attached? %>
+      <% if section.image_one&.attachment&.attached? %>
         <!-- XS to MD -->
         <img class="d-md-none lazyload"
-          data-src="<%= main_app.url_for(section.img_one_md) %>"
-          data-srcset="<%= main_app.url_for(section.img_one_md) %>"
+          data-src="<%= main_app.cdn_image_url(section.img_one_md) %>"
+          data-srcset="<%= main_app.cdn_image_url(section.img_one_md) %>"
           alt="<%= section&.title_one %>">
 
         <!-- MD to XL -->
         <img class="d-none d-md-block d-xl-none lazyload"
-          data-src="<%= main_app.url_for(section.img_one_lg) %>"
-          data-srcset="<%= main_app.url_for(section.img_one_lg) %>"
+          data-src="<%= main_app.cdn_image_url(section.img_one_lg) %>"
+          data-srcset="<%= main_app.cdn_image_url(section.img_one_lg) %>"
           alt="<%= section&.title_one %>">
 
         <!-- XL UP -->
         <img class="d-none d-xl-block lazyload"
-          data-src="<%= main_app.url_for(section.img_one_xl) %>"
-          data-srcset="<%= main_app.url_for(section.img_one_xl) %>"
+          data-src="<%= main_app.cdn_image_url(section.img_one_xl) %>"
+          data-srcset="<%= main_app.cdn_image_url(section.img_one_xl) %>"
           alt="<%= section&.title_one %>">
        <% else %>
         <%= icon( name: 'card-image',
@@ -79,23 +79,23 @@
               class: "d-flex align-items-end justify-content-center bg-light text-center overflow-hidden homepage-bottom-box #{'pointer-events-none cursor-default' unless link_two}",
               style: '--aspect-ratio:54/35;' do %>
 
-      <% if section.image_two.attached? %>
+      <% if section.image_two&.attachment&.attached? %>
         <!-- XS to MD -->
           <img class="d-md-none lazyload"
-            data-src="<%= main_app.url_for(section.img_two_md) %>"
-            data-srcset="<%= main_app.url_for(section.img_two_md) %>"
+            data-src="<%= main_app.cdn_image_url(section.img_two_md) %>"
+            data-srcset="<%= main_app.cdn_image_url(section.img_two_md) %>"
             alt="<%= section&.title_two %>">
 
         <!-- MD to XL -->
           <img class="d-none d-md-block d-xl-none lazyload"
-            data-src="<%= main_app.url_for(section.img_two_lg) %>"
-            data-srcset="<%= main_app.url_for(section.img_two_lg) %>"
+            data-src="<%= main_app.cdn_image_url(section.img_two_lg) %>"
+            data-srcset="<%= main_app.cdn_image_url(section.img_two_lg) %>"
             alt="<%= section&.title_two %>">
 
         <!-- XL UP -->
           <img class="d-none d-xl-block lazyload"
-            data-src="<%= main_app.url_for(section.img_two_xl) %>"
-            data-srcset="<%= main_app.url_for(section.img_two_xl) %>"
+            data-src="<%= main_app.cdn_image_url(section.img_two_xl) %>"
+            data-srcset="<%= main_app.cdn_image_url(section.img_two_xl) %>"
             alt="<%= section&.title_two %>">
        <% else %>
         <%= icon( name: 'card-image',

data/app/views/spree/taxons/_header.html.erb

@@ -13,7 +13,7 @@
   <% if @taxon.icon&.attachment %>
     <div class="d-none d-md-block pt-4 taxon-icon">
       <%= lazy_image(
-        src: main_app.url_for(@taxon.icon.attachment),
+        src: main_app.cdn_image_url(@taxon.icon.attachment),
         alt: @taxon.description || Spree.t('taxon_missing_alt'),
         width: 1110,
         height: 300,

data/app/views/spree/users/_address_controls.html.erb

@@ -2,7 +2,7 @@
   <%= inline_svg_tag('edit.svg', width: 24, height: 24) %>
 <% end %>
 
-<%= link_to '#', class: 'js-delete-address-link ml-3', data: { turbolinks: false, hook: 'remove_address', address: spree.address_path(address) }, aria: { label: Spree.t('address_book.remove_address') } do %>
+<%= link_to '#', class: 'js-delete-address-link ml-3', data: { turbo: false, hook: 'remove_address', address: spree.address_path(address) }, aria: { label: Spree.t('address_book.remove_address') } do %>
     <%= icon(name: 'garbage_2',
              classes: '',
              width: 24,

data/lib/generators/spree/frontend/install/install_generator.rb

@@ -24,7 +24,7 @@ module Spree
           # SCSS theming
           template 'variables.scss', './app/assets/stylesheets/spree/frontend/variables/variables.scss'
           # Sprockets 4 manifest
-          template 'app/assets/config/manifest.js'
+          template 'app/assets/config/manifest.js', force: Rails.env.test?
           # home page template
           directory 'home', './app/views/spree/home'
         end

data/lib/spree/frontend/configuration.rb

@@ -0,0 +1,18 @@
+module Spree
+  module Frontend
+    class Configuration < Preferences::Configuration
+      preference :additional_filters_partials, :array, default: %w()
+      preference :always_put_site_name_in_title, :boolean, default: true
+      preference :coupon_codes_enabled, :boolean, default: true # Determines if we show coupon code form at cart and checkout
+      preference :http_cache_enabled, :boolean, default: true
+      preference :layout, :string, default: 'spree/layouts/spree_application'
+      preference :locale, :string, default: nil
+      preference :products_filters, :array, default: %w(keywords price sort_by)
+      preference :remember_me_enabled, :boolean, default: true
+      preference :shipping_instructions, :boolean, default: false # Request instructions/info for shipping
+      preference :show_raw_product_description, :boolean, default: false
+      preference :show_store_selector, :boolean, default: false
+      preference :title_site_name_separator, :string, default: '-' # When always_put_site_name_in_title is true, insert a separator character before the site name in the title
+    end
+  end
+end

data/lib/spree/frontend/engine.rb

@@ -1,3 +1,5 @@
+require_relative 'configuration'
+
 module Spree
   module Frontend
     class Engine < ::Rails::Engine
@@ -15,14 +17,7 @@ module Spree
       end
 
       initializer 'spree.frontend.environment', before: :load_config_initializers do |_app|
-        Spree::Frontend::Config = Spree::FrontendConfiguration.new
-      end
-
-      initializer 'spree.frontend.checking_deprecated_preferences' do
-        Spree::Frontend::Config.deprecated_preferences.each do |pref|
-          # FIXME: we should only notify about deprecated preferences that are in use, not all of them
-          # warn "[DEPRECATION] Spree::Frontend::Config[:#{pref[:name]}] is deprecated. #{pref[:message]}"
-        end
+        Spree::Frontend::Config = Spree::Frontend::Configuration.new
       end
     end
   end

data/lib/spree/frontend/version.rb

@@ -1,6 +1,6 @@
 module Spree
   module Frontend
-    VERSION = '4.4.0'.freeze
+    VERSION = '4.6.0'.freeze
 
     def self.version
       VERSION

data/lib/spree/frontend.rb

@@ -9,7 +9,8 @@ require 'inline_svg'
 require 'popper_js'
 require 'canonical-rails'
 require 'jquery-rails'
-require 'turbolinks'
+require 'jsbundling-rails'
+require 'turbo-rails'
 require 'responders'
 
 require 'spree/frontend/middleware/seo_assist'

data/spree_frontend.gemspec

@@ -7,7 +7,7 @@ Gem::Specification.new do |s|
   s.version     = Spree::Frontend.version
   s.authors     = ['Sean Schofield', 'Spark Solutions']
   s.email       = 'hello@spreecommerce.org'
-  s.summary     = 'The default Storefront built with Rails and Turbolinks for Spree eCommerce platform'
+  s.summary     = 'The default Storefront built with Rails and Turbo/Hotwire for Spree eCommerce platform'
   s.description = s.summary
   s.homepage    = 'https://spreecommerce.org'
   s.license     = 'BSD-3-Clause'
@@ -33,11 +33,13 @@ Gem::Specification.new do |s|
   s.add_dependency 'glyphicons',      '~> 1.0'
   s.add_dependency 'canonical-rails', '~> 0.2', '>= 0.2.10'
   s.add_dependency 'inline_svg',      '~> 1.5'
+  s.add_dependency 'jsbundling-rails'
   s.add_dependency 'jquery-rails',    '~> 4.3'
   s.add_dependency 'sass-rails',      '>= 5'
-  s.add_dependency 'turbolinks',      '~> 5.2'
+  s.add_dependency 'turbo-rails'
   s.add_dependency 'responders'
   s.add_dependency 'sprockets', '~> 4.0'
+  s.add_dependency 'flag-icons-rails', '~> 3.4'
 
   s.add_development_dependency 'capybara-accessible'
 end