Merge pull request #389 from rapidez/tmp

Merge master in graphql-checkout

CHANGELOG.md

@@ -1,6 +1,62 @@
 # Changelog 
 
-[Unreleased changes](https://github.com/rapidez/core/compare/1.0.0...master)
+[Unreleased changes](https://github.com/rapidez/core/compare/1.4.1...master)
+## [1.4.1](https://github.com/rapidez/core/releases/tag/1.4.1) - 2023-11-24
+
+### Fixed
+
+- Swatches fetch loop bug (#385)
+- Improve slider performance (#384)
+- Throw exception when the store is not found (#386)
+
+## [1.4.0](https://github.com/rapidez/core/releases/tag/1.4.0) - 2023-11-22
+
+### Added
+
+- Support for image disabled option (#381)
+- Position per category support (#382)
+
+### Fixed
+
+- Clear cart storage when not found (#383)
+
+## [1.3.0](https://github.com/rapidez/core/releases/tag/1.3.0) - 2023-11-14
+
+### Added
+
+- Added special price and priceValidUntil to microdata (#380)
+
+### Fixed
+
+- Support MSP way of saving method_title (#379)
+
+## [1.2.0](https://github.com/rapidez/core/releases/tag/1.2.0) - 2023-11-07
+
+### Added
+
+- Implemented customer address prefix, suffix, vat_id and fax (#373)
+
+### Fixed
+
+- Use new config path (#375)
+
+## [1.1.0](https://github.com/rapidez/core/releases/tag/1.1.0) - 2023-11-03
+
+### Changed
+
+- Indexer config with visibility option (#369)
+
+## [1.0.1](https://github.com/rapidez/core/releases/tag/1.0.1) - 2023-11-01
+
+### Fixed
+
+- Avoid error in console (#365)
+- Set mutating to false in a finally (#366)
+- Remove old button component (#367)
+- Use dragOnClick and disable keyboard for the price filter (#368)
+- Use data_get to allow both stdClass & arrays to be used (#370)
+- Update prices when super attribute option is changed (#371)
+
 ## [1.0.0](https://github.com/rapidez/core/releases/tag/1.0.0) - 2023-10-19
 
 ### Added
@@ -38,8 +94,7 @@
 - Wrap raw query parts (#352)
 - Make slidesTotal a computed property (#346)
 - Passive listeners and key instead of keyCode in product image component (#350)
-- Translatable cart title (7a6c533)
-- Translatable checkout title (2a68e8b)
+- Translatable cart + checkout title (7a6c533, 2a68e8b)
 
 ## [0.96.1](https://github.com/rapidez/core/releases/tag/0.96.1) - 2023-10-19
 

config/rapidez/frontend.php

@@ -1,9 +1,6 @@
 <?php
 
 return [
-    // Should the stock qty be exposed and indexed within Elasticsearch?
-    'expose_stock' => false,
-
     // The variables which should be exposed to the frontend.
     'exposed' => [
         'store',
@@ -14,7 +11,7 @@
         'notifications',
         'checkout_steps',
         'flushable_localstorage_keys',
-        'customer_fields_show',
+        'show_customer_address_fields',
     ],
 
     // The checkout steps which are used to name the steps

config/rapidez/indexer.php

@@ -0,0 +1,22 @@
+<?php
+
+return [
+    // Which product visibilities should be indexed?
+    // VISIBILITY_NOT_VISIBLE    = 1
+    // VISIBILITY_IN_CATALOG     = 2
+    // VISIBILITY_IN_SEARCH      = 3
+    // VISIBILITY_BOTH           = 4
+    'visibility' => [2, 3, 4],
+
+    // Additional searchable attributes with the search weight.
+    'searchable' => [
+        // 'attribute' => 4.0,
+    ],
+
+    // From Magento only "Yes/No, Dropdown, Multiple Select and Price" attribute types
+    // can be configured as filter. If you'd like to have a filter for an attribute
+    // with, for example, the type of "Text", you can specify the attribute_code here.
+    'additional_filters' => [
+        // eav_attribute attribute_code. e.g. brand
+    ],
+];

config/rapidez/models.php

@@ -13,6 +13,7 @@
     'option_swatch'             => Rapidez\Core\Models\OptionSwatch::class,
     'option_value'              => Rapidez\Core\Models\OptionValue::class,
     'product_image'             => Rapidez\Core\Models\ProductImage::class,
+    'product_image_value'       => Rapidez\Core\Models\ProductImageValue::class,
     'product_view'              => Rapidez\Core\Models\ProductView::class,
     'product_option'            => Rapidez\Core\Models\ProductOption::class,
     'product_option_title'      => Rapidez\Core\Models\ProductOptionTitle::class,
@@ -32,4 +33,5 @@
     'sales_order_item'          => Rapidez\Core\Models\SalesOrderItem::class,
     'sales_order_payment'       => Rapidez\Core\Models\SalesOrderPayment::class,
     'search_query'              => Rapidez\Core\Models\SearchQuery::class,
+    'search_synonym'            => Rapidez\Core\Models\SearchSynonym::class,
 ];

config/rapidez/system.php

@@ -22,15 +22,6 @@
     // With this token you can run commands from an url.
     'admin_token' => env('RAPIDEZ_TOKEN', env('APP_KEY')),
 
-    // Additional searchable attributes with the search weight.
-    'searchable' => [
-        // 'attribute' => 4.0,
-    ],
-
-    // From Magento only "Yes/No, Dropdown, Multiple Select and Price" attribute types
-    // can be configured as filter. If you'd like to have a filter for an attribute
-    // with, for example, the type of "Text", you can specify the attribute_code here.
-    'additional_filters' => [
-        // eav_attribute attribute_code. e.g. brand
-    ],
+    // Should the stock qty be exposed and indexed within Elasticsearch?
+    'expose_stock' => false,
 ];

package.json

@@ -7,7 +7,7 @@
     },
     "devDependencies": {
         "@appbaseio/reactivesearch-vue": "^1.33.13",
-        "@hotwired/turbo": "^7.2.4",
+        "@hotwired/turbo": "^8.0.0-beta.1",
         "@tailwindcss/forms": "^0.5.3",
         "@tailwindcss/typography": "^0.5.9",
         "@vitejs/plugin-vue2": "^2.2.0",

resources/js/components/Checkout/Checkout.vue

@@ -188,7 +188,9 @@ export default {
             }
 
             const optionalFields = Object.keys(
-                Object.fromEntries(Object.entries(window.config.customer_fields_show).filter(([key, value]) => !value || value === 'opt')),
+                Object.fromEntries(
+                    Object.entries(window.config.show_customer_address_fields).filter(([key, value]) => !value || value === 'opt'),
+                ),
             )
             Object.entries(this.checkout.shipping_address).forEach(([key, val]) => {
                 if (!val && !['region_id', 'customer_address_id', 'same_as_billing'].concat(optionalFields).includes(key)) {

resources/js/components/Elements/Slider.vue

@@ -44,17 +44,19 @@ export default {
             mounted: false,
             hover: false,
             direction: 1,
-            chunk: '',
             pause: () => {},
             resume: () => {},
         }
     },
     mounted() {
         this.initSlider()
         useEventListener(this.slider, 'scroll', useThrottleFn(this.scroll, 150, true, true), { passive: true })
+        if (this.loop) {
+            useEventListener(this.slider, 'scrollend', this.scrollend, { passive: true })
+        }
         this.$nextTick(() => {
             if (this.loop) {
-                this.chunk = this.slider.cloneNode(true)
+                this.initLoop()
             }
             this.slider.dispatchEvent(new CustomEvent('scroll'))
             this.mounted = true
@@ -66,6 +68,29 @@ export default {
         initSlider() {
             this.slider = this.$scopedSlots.default()[0].context.$refs[this.reference]
         },
+        initLoop() {
+            if (!this.loop) {
+                return
+            }
+
+            const slides = Array.from(this.slides)
+            if (!slides.length) {
+                return
+            }
+            let firstChild = this.slider.firstChild
+
+            for (let slide of slides) {
+                let startClone = this.slider.insertBefore(slide.cloneNode(true), firstChild)
+                startClone.dataset.clone = true
+                startClone.dataset.position = 'start'
+
+                let endClone = this.slider.appendChild(slide.cloneNode(true))
+                endClone.dataset.clone = true
+                endClone.dataset.position = 'end'
+            }
+
+            this.slider.dispatchEvent(new CustomEvent('scrollend'))
+        },
         initAutoPlay() {
             if (!this.autoplay) {
                 return
@@ -85,12 +110,20 @@ export default {
             this.showLeft = this.loop || this.position
             this.showRight = this.loop || this.slider.offsetWidth + this.position < this.slider.scrollWidth - 1
         },
+        scrollend(event) {
+            let scrollPosition = this.vertical ? event.target.scrollTop : event.target.scrollLeft
+            if (scrollPosition < this.sliderStart) {
+                this.slider.scrollTo({ [this.vertical ? 'top' : 'left']: scrollPosition + this.sliderStart, behavior: 'instant' })
+            } else if (scrollPosition > this.sliderEnd) {
+                this.slider.scrollTo({ [this.vertical ? 'top' : 'left']: scrollPosition - this.sliderStart, behavior: 'instant' })
+            }
+        },
         autoScroll() {
             if (this.slidesTotal == 1) {
                 return
             }
             let next = this.currentSlide + this.direction
-            if (next >= this.slidesTotal || next < 0) {
+            if ((next >= this.slidesTotal && !this.loop) || next < 0) {
                 if (this.bounce) {
                     this.direction = -this.direction
                     next = this.currentSlide + this.direction
@@ -101,21 +134,11 @@ export default {
             this.navigate(next)
         },
         navigate(index) {
+            index = this.loop ? index + this.slides.length : index
+
             this.vertical
                 ? this.slider.scrollTo(0, this.slider.children[index]?.offsetTop)
-                : this.slider.scrollTo(this.slider.children[0]?.offsetWidth * index, 0)
-        },
-        handleLoop() {
-            if (this.currentSlide + 1 === this.slidesTotal - 1) {
-                Array.from(this.chunk.children).forEach((child) => {
-                    this.slider.appendChild(child.cloneNode(true))
-                })
-            }
-            if (this.currentSlide < 1) {
-                Array.from(this.chunk.children).forEach((child) => {
-                    this.slider.insertBefore(child.cloneNode(true), this.slider.firstChild)
-                })
-            }
+                : this.slider.scrollTo(this.slider.children[index]?.offsetLeft, 0)
         },
     },
     watch: {
@@ -128,18 +151,14 @@ export default {
         },
         currentSlide() {
             this.initSlider()
-            if (this.loop) {
-                this.handleLoop()
-            }
         },
     },
     computed: {
         currentSlide() {
             if (!this.mounted) {
                 return 0
             }
-
-            return Math.round(this.position / this.childSpan)
+            return Math.round(this.position / this.childSpan) % this.slides.length
         },
         slidesVisible() {
             if (!this.mounted) {
@@ -169,7 +188,22 @@ export default {
                 return 0
             }
 
-            return (this.slider.children?.length ?? 1) - this.slidesVisible + 1
+            return (this.slides?.length ?? 1) - (this.loop ? 0 : this.slidesVisible - 1)
+        },
+        slides() {
+            return this.slider.querySelectorAll(':scope > :not([data-clone=true])')
+        },
+        sliderStart() {
+            return this.vertical ? this.slides[0].offsetTop : this.slides[0].offsetLeft
+        },
+        sliderEnd() {
+            let lastChild = this.slides[this.slides.length - 1]
+
+            if (this.vertical) {
+                return lastChild.offsetTop + lastChild.offsetHeight
+            }
+
+            return lastChild.offsetLeft + lastChild.offsetWidth
         },
     },
 }

resources/js/components/Product/AddToCart.vue

@@ -363,6 +363,12 @@ export default {
             },
             deep: true,
         },
+        options: {
+            handler() {
+                this.calculatePrices()
+            },
+            deep: true,
+        },
     },
 }
 </script>

resources/js/stores/useSwatches.js

@@ -2,6 +2,7 @@ import { computedAsync, useLocalStorage } from '@vueuse/core'
 
 export const swatchesStorage = useLocalStorage('swatches', {})
 let isRefreshing = false
+let hasFetched = false
 
 export const refresh = async function () {
     if (isRefreshing) {
@@ -25,18 +26,20 @@ export const refresh = async function () {
         return false
     }
 
+    hasFetched = true
     swatchesStorage.value = response.data
 
     return true
 }
 
 export const clear = async function () {
     swatchesStorage.value = {}
+    hasFetched = false
 }
 
 export const swatches = computedAsync(
     async () => {
-        if (Object.keys(swatchesStorage.value).length === 0) {
+        if (!hasFetched && Object.keys(swatchesStorage.value).length === 0) {
             await refresh()
         }