Recently viewed widget sorting (#1014)

Author: royduin

resources/js/components/Listing/Listing.vue

@@ -33,6 +33,10 @@ export default {
             type: Boolean,
             default: false,
         },
+        transformItems: {
+            type: Function,
+            default: (items) => items,
+        },
     },
 
     data: () => ({

resources/js/components/RecentlyViewed.vue

@@ -37,6 +37,10 @@ export default {
                 this.storage.products = this.storage.products.slice(-this.max)
             }
         },
+
+        sort(items) {
+            return items.sort((a, b) => this.products.indexOf(b.entity_id) - this.products.indexOf(a.entity_id))
+        },
     },
 
     computed: {

resources/views/components/productlist.blade.php

@@ -33,7 +33,7 @@
                         @endif
                     @endslotdefault
 
-                    <ais-hits v-slot="{ items, sendEvent }">
+                    <ais-hits v-slot="{ items, sendEvent }" v-bind:transform-items="listingSlotProps.transformItems">
                         <div v-if="items.length" class="flex flex-col gap-5">
                             @if ($title)
                                 <strong class="font-bold text-2xl">

resources/views/listing/products.blade.php

@@ -16,7 +16,7 @@
     <div class="pb-4 border-b">
         @include('rapidez::listing.partials.toolbar')
     </div>
-    <ais-hits>
+    <ais-hits :transform-items="listingSlotProps.transformItems">
         <template v-slot="{ items, sendEvent }">
             <div v-if="items && items.length" class="overflow-hidden">
                 <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 -mx-5 -mb-px *:border-b">

resources/views/widget/recently-viewed.blade.php

@@ -1,7 +1,8 @@
-<recently-viewed :max="{{ $options->page_size ?? $max ?? Rapidez::config('catalog/recently_products/viewed_count') }}" v-slot="{ products }">
+<recently-viewed :max="{{ $options->page_size ?? $max ?? Rapidez::config('catalog/recently_products/viewed_count') }}" v-slot="{ products, sort }">
     <x-rapidez::productlist
         title="Recently viewed"
         field="entity_id"
         value="products"
+        v-bind:transform-items="sort"
     />
 </recently-viewed>