Option to always sync prices clientside and include the user token

CHANGELOG.md

@@ -8,7 +8,6 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## [1.12.0-rc1] - UNRELEASED
 
 ### Added
-
 - Separating endpoints for CSR/SSR - @Fifciu (#2861)
 - Added short hands for version and help flags - @jamesgeorge007 (#3946)
 - Add `or` operator for Elasticsearch filters in `quickSearchByQuery` and use exists if value is `null` - @cewald (#3960)
@@ -53,6 +52,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Improve typescript support for test utils - @resubaka (#4067)
 - Removed `product/loadConfigurableAttributes` calls - @andrzejewsky, @gibkigonzo (#3336)
 - Disable `mapFallback` url by default - @gibkigonzo(#4092)
+- Include token in pricing sync -  @carlokok (#4156)
 
 ## [1.11.2] - 2020.03.10
 

config/default.json

@@ -351,6 +351,7 @@
     "listOutOfStockProducts": true,
     "preventConfigurableChildrenDirectAccess": true,
     "alwaysSyncPlatformPricesOver": false,
+    "alwaysSyncPricesClientSide": false,
     "clearPricesBeforePlatformSync": false,
     "waitForPlatformSync": false,
     "setupVariantByAttributeCode": true,

core/modules/catalog/store/product/actions.ts

@@ -117,6 +117,10 @@ const actions: ActionTree<ProductState, RootState> = {
       url = `${url}&userGroupId=${rootGetters['tax/getUserTaxGroupId']}`
     }
 
+    if (rootGetters['user/getToken']) {
+      url = `${url}&token=${rootGetters['user/getToken']}`
+    }
+
     return TaskQueue.execute({ url, // sync the cart
       payload: {
         method: 'GET',

docs/guide/basics/configuration.md

@@ -467,6 +467,12 @@ This is related to `alwaysSyncPlatformPricesOver` and when it's set to true, the
 
 This is related to `alwaysSyncPlatformPricesOver`. When true, Vue Storefront will wait for dynamic prices before rendering the page. Otherwise, the product and category pages will be rendered using the default (Elasticsearch-based) prices and then asynchronously override them with current ones.
 
+```json
+  "alwaysSyncPricesClientSide": false,
+```
+
+This is related to `alwaysSyncPlatformPricesOver`. When true, Vue Storefront will force a refresh of the prices on the client side, including the token from the current logged in user, so customer specific pricing can be applied. 
+
 
 ```json
   "endpoint": "http://localhost:8080/api/product",

src/themes/default/pages/Product.vue

@@ -221,6 +221,7 @@ import { registerModule, isModuleRegistered } from '@vue-storefront/core/lib/mod
 import { onlineHelper, isServer, productJsonLd } from '@vue-storefront/core/helpers'
 import { catalogHooksExecutors } from '@vue-storefront/core/modules/catalog-next/hooks'
 import ProductPrice from 'theme/components/core/ProductPrice.vue'
+import { doPlatformPricesSync } from '@vue-storefront/core/modules/catalog/helpers'
 
 export default {
   components: {
@@ -324,7 +325,7 @@ export default {
       return currentStoreView()
     },
     getJsonLd () {
-      return productJsonLd(this.getCurrentProduct, this.getCurrentProductConfiguration.color.label, this.$store.state.storeView.i18n.currencyCode, this.getCustomAttributes)
+      return productJsonLd(this.getCurrentProduct, this.getCurrentProductConfiguration.color && this.getCurrentProductConfiguration.color.label, this.$store.state.storeView.i18n.currencyCode, this.getCustomAttributes)
     }
   },
   async mounted () {
@@ -396,6 +397,9 @@ export default {
       if (this.isStockInfoLoading) return // stock info is already loading
       this.isStockInfoLoading = true
       try {
+        if (config.products.alwaysSyncPricesClientSide) {
+          doPlatformPricesSync([this.getCurrentProduct]);
+        }
         const res = await this.$store.dispatch('stock/check', {
           product: this.getCurrentProduct,
           qty: this.getCurrentProduct.qty