@ordergroove/offers 2.35.6 → 2.35.8-alpha-PR-831-1.26

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ordergroove/offers",
-  "version": "2.35.6",
+  "version": "2.35.8-alpha-PR-831-1.26+837c516f",
   "description": "offer state component",
   "author": "Eugenio Lattanzio <eugenio63@gmail.com>",
   "homepage": "https://github.com/ordergroove/plush-toys#readme",
@@ -45,8 +45,8 @@
     "throttle-debounce": "^2.1.0"
   },
   "devDependencies": {
-    "@ordergroove/offers-templates": "^0.9.5",
+    "@ordergroove/offers-templates": "^0.9.6",
     "@types/lodash.memoize": "^4.1.9"
   },
-  "gitHead": "0110539ccd5202a8c19a67fa44e4d924dd597e89"
+  "gitHead": "837c516f9418cb8720c90fd955373945bea4d5f2"
 }

package/src/components/Offer.js

@@ -28,6 +28,17 @@ import { DEFAULT_OFFER_MODULE } from '../core/constants';
 
 const memoizeKey = (...args) => JSON.stringify(args);
 
+let hasLogged = false;
+function logMulticurrencyWarning(storeCurrency, primaryCurrency) {
+  // only log once
+  if (!hasLogged) {
+    console.warn(
+      `Hiding Ordergroove offer since the store currency ${storeCurrency} does not match your configured currency ${primaryCurrency} and you are not setup for multicurrency. Contact your Ordergroove rep for next steps.`
+    );
+    hasLogged = true;
+  }
+}
+
 export const productAndComponents = memoize(
   (product, components) => Object.assign({ components }, product),
   memoizeKey
@@ -308,10 +319,26 @@ export class Offer extends TemplateElement {
     return this.preview || window.og.previewMode;
   }
 
+  get shouldRenderOffer() {
+    if (this.config && this.config.storeCurrency && this.config.merchantSettings) {
+      const shouldRender =
+        this.config.merchantSettings.multicurrency_enabled ||
+        this.config.storeCurrency === this.config.merchantSettings.currency_code;
+      if (!shouldRender) {
+        logMulticurrencyWarning(this.config.storeCurrency, this.config.merchantSettings.currency_code);
+      }
+      return shouldRender;
+    }
+
+    return true;
+  }
+
   render() {
-    return html`
-      <slot></slot>
-    `;
+    return this.shouldRenderOffer
+      ? html`
+          <slot></slot>
+        `
+      : null;
   }
 
   get defaultFrequency() {

package/src/components/__tests__/Offer.spec.js

@@ -301,3 +301,71 @@ describe('previewMode', () => {
     expect(el.preview).toEqual('upsell');
   });
 });
+
+describe('multi-currency', () => {
+  async function getOfferElement(config) {
+    const element = new Offer();
+    element.innerHTML = `
+      <p>Offer content</p>
+    `;
+    element.config = config;
+    await appendToBody(element);
+    return element;
+  }
+
+  function assertOfferShown(element) {
+    expect(element.querySelector('*').assignedSlot).not.toBeNull();
+  }
+
+  function assertOfferHidden(element) {
+    expect(element.querySelector('*').assignedSlot).toBeNull();
+  }
+
+  it('should show the offer when config not set', async () => {
+    const element = await getOfferElement();
+    assertOfferShown(element);
+  });
+
+  it('should show the offer if store currency not available', async () => {
+    const element = await getOfferElement({
+      merchantSettings: {
+        currency_code: 'USD',
+        multicurrency_enabled: false
+      }
+    });
+    assertOfferShown(element);
+  });
+
+  it('should show the offer when store currency matches primary currency', async () => {
+    const element = await getOfferElement({
+      storeCurrency: 'MXN',
+      merchantSettings: {
+        currency_code: 'MXN',
+        multicurrency_enabled: false
+      }
+    });
+    assertOfferShown(element);
+  });
+
+  it('should hide the offer when multicurrency not enabled and store currency does not match primary currency', async () => {
+    const element = await getOfferElement({
+      storeCurrency: 'MXN',
+      merchantSettings: {
+        currency_code: 'USD',
+        multicurrency_enabled: false
+      }
+    });
+    assertOfferHidden(element);
+  });
+
+  it('should show the offer when multicurrency enabled and store currency does not match primary currency', async () => {
+    const element = await getOfferElement({
+      storeCurrency: 'MXN',
+      merchantSettings: {
+        currency_code: 'USD',
+        multicurrency_enabled: true
+      }
+    });
+    assertOfferShown(element);
+  });
+});

package/src/core/actions.js

@@ -312,3 +312,8 @@ export const setProductToSubscribe = (product, productToSubscribe) => ({
   type: constants.SET_PRODUCT_TO_SUBSCRIBE,
   payload: { product, productToSubscribe }
 });
+
+export const receiveMerchantSettings = settings => ({
+  type: constants.RECEIVE_MERCHANT_SETTINGS,
+  payload: settings
+});

package/src/core/constants.js

@@ -42,6 +42,7 @@ export const SET_PRODUCT_TO_SUBSCRIBE = 'SET_PRODUCT_TO_SUBSCRIBE';
 export const RECEIVE_PRODUCT_PLANS = 'RECEIVE_PRODUCT_PLANS';
 export const SETUP_PRODUCT = 'SETUP_PRODUCT';
 export const SETUP_CART = 'SETUP_CART';
+export const RECEIVE_MERCHANT_SETTINGS = 'RECEIVE_MERCHANT_SETTINGS';
 export const DEFAULT_OFFER_MODULE = 'pdp';
 export const ENV_DEV = 'dev';
 export const ENV_STAGING = 'staging';

package/src/core/reducer.js

@@ -400,6 +400,13 @@ export const config = (
         frequenciesEveryPeriod: [],
         frequencies: action.payload.frequencies ? action.payload.frequencies.map(stringifyFrequency) : state.frequencies
       };
+    case constants.RECEIVE_MERCHANT_SETTINGS:
+      return {
+        ...state,
+        merchantSettings: {
+          ...action.payload
+        }
+      };
     default:
       return state;
   }

package/src/make-api.js

@@ -82,6 +82,10 @@ export default function makeApi(store) {
       store.dispatch(actions.setAuthUrl(authUrl));
       return this;
     },
+    receiveMerchantSettings(settings) {
+      store.dispatch(actions.receiveMerchantSettings(settings));
+      return this;
+    },
     getProductsForPurchasePost(productIds = []) {
       return adapters.getProductsForPurchasePost(store.getState(), productIds);
     },
@@ -163,7 +167,7 @@ export default function makeApi(store) {
      * @param {*} env
      * @param {*} authUrl
      */
-    initialize(merchantId, env, authUrl) {
+    initialize(merchantId, env, authUrl, merchantSettings) {
       // settings resolves once, before anything.
       if (isReady) {
         console.warn('og.offers has been initialized already. Skipping.');
@@ -175,6 +179,7 @@ export default function makeApi(store) {
       // dont re-trigger actions if value is the same. allowing set new authurl only
       if (merchantId && merchantId !== state.merchantId) offers.setMerchantId(merchantId);
       if (env && env !== state.environment?.name) offers.setEnvironment(env);
+      if (merchantSettings) offers.receiveMerchantSettings(merchantSettings);
       // allow set new authUrl
       if (authUrl) offers.setAuthUrl(authUrl);
 

package/src/shopify/__tests__/shopifyReducer.spec.js

@@ -435,16 +435,18 @@ describe('config', () => {
         }
       }
     );
-    expect(actual).toEqual({
-      prepaidSellingPlans: {
-        43017264201944: [
-          {
-            numberShipments: 4,
-            sellingPlan: '2146042072'
-          }
-        ]
-      }
-    });
+    expect(actual).toEqual(
+      jasmine.objectContaining({
+        prepaidSellingPlans: {
+          43017264201944: [
+            {
+              numberShipments: 4,
+              sellingPlan: '2146042072'
+            }
+          ]
+        }
+      })
+    );
   });
 
   it('should add prepaidSellingPlans on top of old ones', () => {
@@ -502,28 +504,30 @@ describe('config', () => {
         }
       }
     );
-    expect(actual).toEqual({
-      prepaidSellingPlans: {
-        43017264201944: [
-          {
-            numberShipments: 4,
-            sellingPlan: '2146042071'
-          }
-        ],
-        43017264201946: [
-          {
-            numberShipments: 3,
-            sellingPlan: '2146042072'
-          }
-        ],
-        43017264201945: [
-          {
-            numberShipments: 5,
-            sellingPlan: '2146042073'
-          }
-        ]
-      }
-    });
+    expect(actual).toEqual(
+      jasmine.objectContaining({
+        prepaidSellingPlans: {
+          43017264201944: [
+            {
+              numberShipments: 4,
+              sellingPlan: '2146042071'
+            }
+          ],
+          43017264201946: [
+            {
+              numberShipments: 3,
+              sellingPlan: '2146042072'
+            }
+          ],
+          43017264201945: [
+            {
+              numberShipments: 5,
+              sellingPlan: '2146042073'
+            }
+          ]
+        }
+      })
+    );
   });
 
   it('should return unmodified state given unsupported action', () => {

package/src/shopify/shopifyReducer.js

@@ -259,7 +259,7 @@ export const config = (
 
   if (constants.SETUP_PRODUCT === action.type) {
     const {
-      payload: { product }
+      payload: { product, currency }
     } = action;
     let configToAdd = {};
     // pay as you go selling plans
@@ -294,7 +294,8 @@ export const config = (
     }
     return {
       ...state,
-      ...configToAdd
+      ...configToAdd,
+      storeCurrency: currency
     };
   }
 
@@ -328,6 +329,15 @@ export const config = (
     };
   }
 
+  if (constants.RECEIVE_MERCHANT_SETTINGS === action.type) {
+    return {
+      ...state,
+      merchantSettings: {
+        ...action.payload
+      }
+    };
+  }
+
   return state;
 };