spree_backend 4.1.1 → 4.5.0

data/app/assets/javascripts/spree/backend/stock_movement.js

@@ -1,18 +1,48 @@
 /* global variantTemplate */
-$(function () {
+document.addEventListener("spree:load", function() {
   var el = $('#stock_movement_stock_item_id')
+  var jsonApiVariants = {}
   el.select2({
     placeholder: 'Find a stock item', // translate
+    minimumInputLength: 3,
+    quietMillis: 200,
     ajax: {
-      url: Spree.url(Spree.routes.stock_items_api(el.data('stock-location-id'))),
-      data: function (term, page) {
+      url: Spree.routes.stock_items_api_v2,
+      data: function (params, page) {
         return {
-          q: {
-            variant_product_name_cont: term
+          filter: {
+            variant_product_name_cont: params.term,
+            stock_location_id_eq: el.data('stock-location-id')
+          },
+          include: 'variant',
+          image_transformation: {
+            size: '100x100'
+          },
+          fields: {
+            'variant': 'name,sku,options_text,images'
           },
           per_page: 50,
-          page: page,
-          token: Spree.api_key
+          page: page
+        }
+      },
+      headers: Spree.apiV2Authentication(),
+      success: function(data) {
+        var JSONAPIDeserializer = require('jsonapi-serializer').Deserializer
+        new JSONAPIDeserializer({ keyForAttribute: 'snake_case' }).deserialize(data, function (_err, variants) {
+          jsonApiVariants = variants
+        })
+      },
+      processResults: function (json) {
+        var res = jsonApiVariants.map(function (stockItem) {
+          return {
+            id: stockItem.id,
+            text: stockItem.variant.name,
+            variant: stockItem.variant
+          }
+        })
+
+        return {
+          results: res
         }
       },
       results: function (data, page) {
@@ -23,13 +53,28 @@ $(function () {
         }
       }
     },
-    formatResult: function (stockItem) {
-      return variantTemplate({
-        variant: stockItem.variant
-      })
+    templateResult: function (stockItem) {
+      if (stockItem.loading) {
+        return stockItem.text
+      }
+
+      let variant = stockItem.variant
+      if (variant['images'][0] !== undefined && variant['images'][0].transformed_url !== undefined) {
+        variant.image = variant.images[0].transformed_url
+      }
+      return $(variantTemplate({
+        variant: variant
+      }))
     },
-    formatSelection: function (stockItem) {
-      return Select2.util.escapeMarkup(stockItem.variant.name + '(' + stockItem.variant.options_text + ')')
+    templateSelection: function(stockItem) {
+      const variant = stockItem.variant
+      if (variant === undefined) {
+        return stockItem.text
+      } else if (!!variant.options_text && variant.options_text !== '') {
+        return variant.name + '(' + variant.options_text + ')'
+      } else {
+        return variant.name
+      }
     }
   })
 })

data/app/assets/javascripts/spree/backend/stock_transfer.js

@@ -1,8 +1,9 @@
-$(function () {
+document.addEventListener("spree:load", function() {
   function TransferVariant (variant1) {
+    // refactor variant1
     this.variant = variant1
-    this.id = this.variant.id
-    this.name = this.variant.name + ' - ' + this.variant.sku
+    this.id = this.variant[0].variant.id
+    this.name = this.variant[0].variant.name + ' - ' + this.variant[0].variant.sku
     this.quantity = 0
   }
   TransferVariant.prototype.add = function (quantity) {
@@ -15,13 +16,26 @@ $(function () {
     this.destination = $('#transfer_destination_location_id')
     this.source.change(this.populate_destination.bind(this))
     $('#transfer_receive_stock').change(this.receive_stock_change.bind(this))
-    $.getJSON(Spree.url(Spree.routes.stock_locations_api) + '?token=' + Spree.api_key + '&per_page=1000', function (data) {
+
+    $.ajax({
+      url: Spree.routes.stock_locations_api_v2 + '?per_page=1000',
+      type: 'GET',
+      data: {
+        fields: {
+          stock_location: 'name'
+        }
+      },
+      headers: Spree.apiV2Authentication()
+    }).then(function (json) {
       this.locations = (function () {
-        var ref = data.stock_locations
+        var ref = json.data
         var results = []
         var i, len
         for (i = 0, len = ref.length; i < len; i++) {
-          results.push(ref[i])
+          results.push({
+            id: ref[i].id,
+            name: ref[i].attributes.name
+          })
         }
         return results
       })()
@@ -72,7 +86,7 @@ $(function () {
     if (this.is_source_location_hidden()) {
       return this.populate_select(this.destination)
     } else {
-      return this.populate_select(this.destination, parseInt(this.source.val()))
+      return this.populate_select(this.destination, this.source.val())
     }
   }
 
@@ -109,12 +123,12 @@ $(function () {
   }
 
   TransferVariants.prototype._search_transfer_variants = function () {
-    return this.build_select(Spree.url(Spree.routes.variants_api), 'product_name_or_sku_cont')
+    return this.build_select(Spree.url(Spree.routes.variants_api_v2), 'product_name_or_sku_cont')
   }
 
   TransferVariants.prototype._search_transfer_stock_items = function () {
     var stockLocationId = $('#transfer_source_location_id').val()
-    return this.build_select(Spree.url(Spree.routes.stock_locations_api + ('/' + stockLocationId + '/stock_items')), 'variant_product_name_or_variant_sku_cont')
+    return this.build_select(Spree.routes.stock_items_api_v2 + '?filter[stock_location_id_eq]=' + stockLocationId + '&include=variant', 'variant_product_name_or_variant_sku_cont')
   }
 
   TransferVariants.prototype.format_variant_result = function (result) {
@@ -126,35 +140,69 @@ $(function () {
     }
   }
 
+  function formattedVariantList(obj) {
+    return {
+     id: obj.id,
+     text: obj.name,
+     name: obj.name,
+     sku: obj.sku,
+     options_text: obj.options_text,
+     variant: obj
+    }
+  }
+
   TransferVariants.prototype.build_select = function (url, query) {
     return $('#transfer_variant').select2({
       minimumInputLength: 3,
       ajax: {
         url: url,
         datatype: 'json',
-        data: function (term) {
-          var q = {}
-          q[query] = term
+        data: function (params) {
+          var filter = {}
+          filter[query] = params.term
+
           return {
-            q: q,
-            token: Spree.api_key
+            filter: filter,
+            fields: {
+              'variant': 'name,sku,options_text'
+            }
           }
         },
-        results: function (data) {
-          var result = data['variants'] || data['stock_items']
-          if (data['stock_items'] != null) {
-            result = _(result).map(function (variant) {
-              return variant.variant
-            })
-          }
-          window.variants = result
-          return {
-            results: result
+        headers: Spree.apiV2Authentication(),
+        success: function(data) {
+          var JSONAPIDeserializer = require('jsonapi-serializer').Deserializer
+          new JSONAPIDeserializer({ keyForAttribute: 'snake_case' }).deserialize(data, function (_err, variants) {
+            jsonApiVariants = variants
+          })
+        },
+        processResults: function (json) {
+          if (json && json.data && jsonApiVariants) {
+            var res = {}
+
+            if (json.links.self.match(/platform\/variants/)) {
+              res = jsonApiVariants.map(function (variant) {
+                return formattedVariantList(variant)
+              })
+            } else {
+              res = jsonApiVariants.map(function (variant) {
+                return formattedVariantList(variant.variant)
+              })
+            }
+
+            return {
+              results: res
+            }
           }
         }
       },
-      formatResult: this.format_variant_result,
-      formatSelection: function (variant) {
+      templateResult: function(variant) {
+        if (variant.options_text !== "") {
+          return variant.name + ' - ' + variant.sku + ' (' + variant.options_text + ')'
+        } else {
+          return variant.name + ' - ' + variant.sku
+        }
+      },
+      templateSelection: function (variant) {
         // eslint-disable-next-line no-extra-boolean-cast
         if (!!variant.options_text) {
           return variant.name + (' (' + variant.options_text + ')') + (' - ' + variant.sku)
@@ -199,7 +247,7 @@ $(function () {
 
   TransferAddVariants.prototype.find_or_add = function (variant) {
     var existing = _.find(this.variants, function (v) {
-      return v.id === variant.id
+      return v.id.toString() === variant[0].id
     })
     if (existing) {
       return existing
@@ -212,14 +260,15 @@ $(function () {
 
   TransferAddVariants.prototype.remove_variant = function (target) {
     var v
-    var variantId = parseInt(target.data('variantId'))
+    var variantId = target.data('variantId').toString()
+
     this.variants = (function () {
       var ref = this.variants
       var results = []
       var i, len
       for (i = 0, len = ref.length; i < len; i++) {
         v = ref[i]
-        if (v.id !== variantId) {
+        if (v.id.toString() !== variantId) {
           results.push(v)
         }
       }

data/app/assets/javascripts/spree/backend/taxon_autocomplete.js

@@ -1,52 +1,46 @@
-'use strict'
-// eslint-disable-next-line camelcase
-function set_taxon_select (selector) {
-  function formatTaxon (taxon) {
-    return Select2.util.escapeMarkup(taxon.pretty_name)
+$.fn.taxonAutocomplete = function() {
+  'use strict'
+
+  function formatTaxonList(values) {
+    return values.map(function (obj) {
+      return {
+        id: obj.id,
+        text: obj.attributes.pretty_name
+      }
+    })
   }
 
-  if ($(selector).length > 0) {
-    $(selector).select2({
-      placeholder: Spree.translations.taxon_placeholder,
-      multiple: true,
-      initSelection: function (element, callback) {
-        var url = Spree.url(Spree.routes.taxons_api, {
-          ids: element.val(),
-          without_children: true,
-          token: Spree.api_key
-        })
-        return $.getJSON(url, null, function (data) {
-          return callback(data['taxons'])
-        })
-      },
-      ajax: {
-        url: Spree.routes.taxons_api,
-        datatype: 'json',
-        data: function (term, page) {
-          return {
-            per_page: 50,
-            page: page,
-            without_children: true,
-            q: {
-              name_cont: term
-            },
-            token: Spree.api_key
-          }
-        },
-        results: function (data, page) {
-          var more = page < data.pages
-          return {
-            results: data['taxons'],
-            more: more
+  this.select2({
+    multiple: true,
+    placeholder: Spree.translations.taxon_placeholder,
+    minimumInputLength: 2,
+    ajax: {
+      url: Spree.routes.taxons_api_v2,
+      dataType: 'json',
+      data: function (params) {
+        return {
+          filter: {
+            name_cont: params.term
+          },
+          fields: {
+            taxon: 'pretty_name'
           }
         }
       },
-      formatResult: formatTaxon,
-      formatSelection: formatTaxon
-    })
-  }
+      headers: Spree.apiV2Authentication(),
+      processResults: function(data) {
+        return {
+          results: formatTaxonList(data.data)
+        }
+      }
+    }
+  })
 }
 
-$(document).ready(function () {
-  set_taxon_select('#product_taxon_ids')
+document.addEventListener("spree:load", function() {
+  var productTaxonSelector = document.getElementById('product_taxon_ids')
+  if (productTaxonSelector == null) return
+  if (productTaxonSelector.hasAttribute('data-autocomplete-url-value')) return
+
+  $('#product_taxon_ids').taxonAutocomplete()
 })

data/app/assets/javascripts/spree/backend/taxons.js

@@ -1,122 +1,148 @@
 /* global productTemplate */
-$(function () {
+document.addEventListener("spree:load", function() {
   window.productTemplate = Handlebars.compile($('#product_template').text())
   var taxonProducts = $('#taxon_products')
   var taxonId = $('#taxon_id')
 
-  taxonProducts.sortable({
-    handle: '.js-sort-handle'
-  })
-
-  taxonProducts.on('sortstop', function (event, ui) {
-    return $.ajax({
-      url: Spree.routes.classifications_api,
-      method: 'PUT',
-      dataType: 'json',
-      data: {
-        token: Spree.api_key,
-        product_id: ui.item.data('product-id'),
-        taxon_id: $('#taxon_id').val(),
-        position: ui.item.index()
+  var el = document.getElementById('taxon_products')
+  if (el) {
+    Sortable.create(el, {
+      handle: '.sort-handle',
+      ghostClass: 'moving-this',
+      animation: 550,
+      easing: 'cubic-bezier(1, 0, 0, 1)',
+      swapThreshold: 0.9,
+      forceFallback: true,
+      onEnd: function (evt) {
+        handleClassificationReposition(evt)
       }
     })
-  })
+  }
+
+  function handleClassificationReposition(evt) {
+    var classificationId = evt.item.getAttribute('data-classification-id')
+    var data = {
+      classification: {
+        position: parseInt(evt.newIndex, 10) + 1
+      }
+    }
+    var requestData = {
+       uri: Spree.routes.classifications_api_v2 + '/' + classificationId,
+       method: 'PATCH',
+       dataBody: data,
+    }
+    spreeFetchRequest(requestData)
+  }
 
   if (taxonId.length > 0) {
     taxonId.select2({
-      dropdownCssClass: 'taxon_select_box',
       placeholder: Spree.translations.find_a_taxon,
+      minimumInputLength: 3,
+      multiple: false,
       ajax: {
-        url: Spree.routes.taxons_api,
+        url: Spree.routes.taxons_api_v2,
         datatype: 'json',
-        data: function (term, page) {
+        headers: Spree.apiV2Authentication(),
+        data: function (params, page) {
           return {
             per_page: 50,
             page: page,
-            without_children: true,
-            token: Spree.api_key,
-            q: {
-              name_cont: term
+            filter: {
+              name_cont: params.term
             }
           }
         },
-        results: function (data, page) {
-          var more = page < data.pages
+        processResults: function (data, page) {
+          var more = page < data.meta.total_pages
+
+          var results = data.data.map(function (obj) {
+            return {
+              id: obj.id,
+              text: obj.attributes.pretty_name
+            }
+          })
+
           return {
-            results: data['taxons'],
-            more: more
+            results: results,
+            pagination: {
+              more: more
+            }
           }
         }
-      },
-      formatResult: formatTaxon,
-      formatSelection: formatTaxon
-    })
-  }
-
-  taxonId.on('change', function (e) {
-    var el = $('#taxon_products')
-    $.ajax({
-      url: Spree.routes.taxon_products_api,
-      data: {
-        id: e.val,
-        token: Spree.api_key
       }
-    }).done(function (data) {
-      var i, j, len, len1, product, ref, ref1, results, variant
-      el.empty()
-      if (data.products.length === 0) {
-        return $('#taxon_products').html('<div class="alert alert-info">' + Spree.translations.no_results + '</div>')
-      } else {
-        ref = data.products
-        results = []
-        for (i = 0, len = ref.length; i < len; i++) {
-          product = ref[i]
-          if (product.master.images[0] !== void 0 && product.master.images[0].small_url !== void 0) {
-            product.image = product.master.images[0].small_url
-          } else {
-            ref1 = product.variants
-            for (j = 0, len1 = ref1.length; j < len1; j++) {
-              variant = ref1[j]
-              if (variant.images[0] !== void 0 && variant.images[0].small_url !== void 0) {
-                product.image = variant.images[0].small_url
-                break
+    }).on('select2:select', function (e) {
+      $.ajax({
+        url: Spree.routes.classifications_api_v2,
+        headers: Spree.apiV2Authentication(),
+        data: {
+          filter: {
+            taxon_id_eq: e.params.data.id
+          },
+          include: 'product.images',
+          per_page: 150,
+          sort: 'position'
+        }
+      }).done(function (json) {
+        taxonProducts.empty()
+
+        if (json.meta.total_count === 0) {
+          return taxonProducts.html('<p class="text-center w-100 p-4">' + Spree.translations.no_results + '</p>')
+        } else {
+          var results = []
+
+          json.data.forEach(function (classification) {
+            var productId = classification.relationships.product.data.id.toString()
+
+            var product = json.included.find(function(included) {
+              if (included.type === 'product' && included.id === productId) {
+                return included
               }
+            })
+
+            if (product && classification) {
+              var imageUrl = null
+
+              if (product.relationships.images.data.length > 0) {
+                var imageId = product.relationships.images.data[0].id
+
+                var image = json.included.find(function(included) {
+                  if (included.type === 'image' && included.id === imageId) {
+                    return included
+                  }
+                })
+
+                if (image && image.attributes && image.attributes.styles) {
+                  imageUrl = image.attributes.styles[2].url
+                }
+              }
+
+              results.push(taxonProducts.append(productTemplate({
+                product: product,
+                classification: classification,
+                image: imageUrl
+              })))
             }
-          }
-          results.push(el.append(productTemplate({
-            product: product
-          })))
+          })
+
+          return results
         }
-        return results
-      }
+      })
     })
-  })
+  }
+
   taxonProducts.on('click', '.js-delete-product', function (e) {
-    var currentTaxonId = $('#taxon_id').val()
     var product = $(this).parents('.product')
-    var productId = product.data('product-id')
-    var productTaxons = String(product.data('taxons')).split(',').map(Number)
-    var productIndex = productTaxons.indexOf(parseFloat(currentTaxonId))
-    productTaxons.splice(productIndex, 1)
-    var taxonIds = productTaxons.length > 0 ? productTaxons : ['']
+    var classificationId = product.data('classification-id')
     $.ajax({
-      url: Spree.routes.products_api + '/' + productId,
-      data: {
-        product: {
-          taxon_ids: taxonIds
-        },
-        token: Spree.api_key
-      },
-      type: 'PUT'
+      url: Spree.routes.classifications_api_v2 + '/' + classificationId.toString(),
+      headers: Spree.apiV2Authentication(),
+      type: 'DELETE'
     }).done(function () {
       product.fadeOut(400, function (e) {
         product.remove()
       })
     })
   })
-  $('.variant_autocomplete').variantAutocomplete()
 
-  function formatTaxon (taxon) {
-    return Select2.util.escapeMarkup(taxon.pretty_name)
-  }
+  $('.variant_autocomplete').variantAutocomplete()
 })

data/app/assets/javascripts/spree/backend/user_picker.js

@@ -1,43 +1,38 @@
 $.fn.userAutocomplete = function () {
   'use strict'
 
-  function formatUser (user) {
-    return Select2.util.escapeMarkup(user.email)
+  function formatUserList(values) {
+    return values.map(function (obj) {
+      return {
+        id: obj.id,
+        text: obj.attributes.email
+      }
+    })
   }
 
   this.select2({
-    minimumInputLength: 1,
     multiple: true,
-    initSelection: function (element, callback) {
-      $.get(Spree.routes.users_api, {
-        ids: element.val(),
-        token: Spree.api_key
-      }, function (data) {
-        callback(data.users)
-      })
-    },
+    minimumInputLength: 1,
     ajax: {
-      url: Spree.routes.users_api,
-      datatype: 'json',
-      data: function (term) {
+      url: Spree.routes.users_api_v2,
+      dataType: 'json',
+      headers: Spree.apiV2Authentication(),
+      data: function (params) {
         return {
-          q: {
-            email_cont: term
-          },
-          token: Spree.api_key
+          filter: {
+            email_i_cont: params.term
+          }
         }
       },
-      results: function (data) {
+      processResults: function(data) {
         return {
-          results: data.users
+          results: formatUserList(data.data)
         }
       }
-    },
-    formatResult: formatUser,
-    formatSelection: formatUser
+    }
   })
 }
 
-$(document).ready(function () {
+document.addEventListener("spree:load", function() {
   $('.user_picker').userAutocomplete()
 })

data/app/assets/javascripts/spree/backend/users/edit.js

@@ -1,4 +1,4 @@
-$(document).ready(function () {
+document.addEventListener("spree:load", function() {
   var useBilling = $('#user_use_billing')
 
   if (useBilling.is(':checked')) {