@ordergroove/offers 2.27.21 → 2.27.22-alpha-PR-663-5.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ordergroove/offers",
-  "version": "2.27.21",
+  "version": "2.27.22-alpha-PR-663-5.4+a95dd1be",
   "description": "offer state component",
   "author": "Eugenio Lattanzio <eugenio63@gmail.com>",
   "homepage": "https://github.com/ordergroove/plush-toys#readme",
@@ -45,5 +45,5 @@
   "devDependencies": {
     "@ordergroove/offers-templates": "^0.4.15"
   },
-  "gitHead": "e2b5d12965378f8ce62ea66be35de68ac7338e9c"
+  "gitHead": "a95dd1be7e59823c6754a58ad6fe5066630697ab"
 }

package/src/core/store.js

@@ -3,6 +3,7 @@ import thunk from 'redux-thunk';
 
 import { loadState } from './localStorage';
 import { dispatchMiddleware, localStorageMiddleware, offerEvents } from './middleware';
+import { waitUntilOffersReady } from './waitUntilOffersReady';
 
 export function makeStore(reducer, ...extraMiddlewares) {
   if (window.og && window.og.store) return window.og.store;
@@ -14,11 +15,11 @@ export function makeStore(reducer, ...extraMiddlewares) {
     typeof window === 'object' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
       ? // eslint-disable-next-line no-underscore-dangle
         window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
-          // Specify extension’s options like name, actionsBlacklist, actionsCreators, serialize...
+          name: 'Ordergroove Offers'
         })
       : compose;
 
-  const middlewares = [thunk, dispatchMiddleware, offerEvents];
+  const middlewares = [waitUntilOffersReady, thunk, dispatchMiddleware, offerEvents];
 
   let initial = {};
 

package/src/core/utils.ts

@@ -36,7 +36,7 @@ export function resolveEnvAndMerchant() {
 }
 
 export const safeProductId = product => {
-  if (!product ) return '';
+  if (!product) return '';
   let productId = `${product.id || product}`;
   if (platform?.shopify_selling_plans) {
     // we can't avoid make offer request since we need to know the upsell group and autoship by default
@@ -49,9 +49,9 @@ export const safeProductId = product => {
 /**
  * Returns the OG frequency if platform is running on selling plans
  * @param initialFrequency
- * @param config 
+ * @param config
  */
- export const safeOgFrequency = (initialFrequency, config) => {
+export const safeOgFrequency = (initialFrequency, config) => {
   if (platform.shopify_selling_plans) {
     const ix = config.frequencies?.indexOf(initialFrequency);
     if (ix >= 0 && config.frequenciesEveryPeriod[ix]) {
@@ -70,9 +70,20 @@ export const safeProductId = product => {
  */
 export function autoInitializeOffers(offers) {
   if (offers.isReady()) return;
+
+  console.info('OG offers are auto initializing');
+  
   const [merchantId, env] = resolveEnvAndMerchant();
   if (!env && !merchantId) return;
-  offers.initialize(merchantId, env);
+  const script = document.createElement('script');
+  script.onload = () => console.info('OG pull initialization chunk for merchant', merchantId, env);
+  script.onerror = () => offers.initialize(merchantId, env);
+  script.src = `${window.location.protocol}//${
+    env === ENV_PROD ? STATIC_HOST : STAGING_STATIC_HOST
+  }/${merchantId}/main.js?initOnly=true`;
+
+  
+  document.head.appendChild(script);
 }
 
 export const clearCookie = cookieId => {

package/src/core/waitUntilOffersReady.js

@@ -0,0 +1,66 @@
+import { createSessionId, fetchAuth } from './actions';
+import {
+  CREATED_SESSION_ID,
+  SET_ENVIRONMENT_DEV,
+  SET_ENVIRONMENT_PROD,
+  SET_ENVIRONMENT_STAGING,
+  SET_MERCHANT_ID
+} from './constants';
+import { listenLocalStorageChanges } from './localStorage';
+
+const waitFor = () => {
+  let resolve, reject;
+  return [
+    new Promise((yes, no) => {
+      resolve = yes;
+      reject = no;
+    }),
+    resolve,
+    reject
+  ];
+};
+/**
+ * Middleware that awaits offers being initialized and resumes the regular actions after.
+ * @param {*} store
+ * @returns
+ */
+export function waitUntilOffersReady(store) {
+  const [waitForSetEnv, resolveEnv] = waitFor();
+  const [waitForMerchantId, resolveMerchantId] = waitFor();
+  const [waitForSessionId, resolveSessionId] = waitFor();
+
+  waitForMerchantId.then(merchantId => {
+    const { sessionId } = store.getState();
+    if (!sessionId || (merchantId && !sessionId.startsWith(merchantId))) {
+      store.dispatch(createSessionId(merchantId));
+    } else {
+      resolveSessionId(sessionId);
+    }
+  });
+
+  const waitForReady = Promise.all([waitForMerchantId, waitForSetEnv, waitForSessionId]);
+
+  waitForReady.then(() => {
+    window.addEventListener('storage', listenLocalStorageChanges(store));
+    if (!store.getState().auth?.ts) {
+      store.dispatch(fetchAuth());
+    }
+  });
+
+  return next => async action => {
+    if (
+      SET_ENVIRONMENT_DEV === action.type ||
+      SET_ENVIRONMENT_STAGING === action.type ||
+      SET_ENVIRONMENT_PROD === action.type
+    ) {
+      resolveEnv(action.payload);
+    } else if (SET_MERCHANT_ID === action.type) {
+      resolveMerchantId(action.payload);
+    } else if (CREATED_SESSION_ID === action.type) {
+      resolveSessionId(action.payload);
+    } else {
+      await waitForReady;
+    }
+    next(action);
+  };
+}

package/src/index.js

@@ -34,15 +34,19 @@ export const setTemplates = offers.setTemplates;
 export const setupCart = offers.setupCart;
 export const setupProduct = offers.setupProduct;
 export const setupProducts = offers.setupProducts;
+export const autoInit = () => autoInitializeOffers(offers);
+
 export { platform };
 export default offers.initialize;
-
 /*
  * Attempts to auto initialize the offer library reading the merchantId and env from
  * integration script i.e. <script src="http://static.ordergroove...."/>.
  * Useful when local develop using http redirects
  */
-onReady(() => autoInitializeOffers(offers));
+if (process.env.NODE_ENV === 'development') {
+  console.info('%c Ordergroove Offers DEV MODE ', 'background: #222; color: #bada55');
+  onReady(autoInit);
+}
 
 if (platform?.shopify_selling_plans) {
   onReady(() => authorizeShopifyCustomer(offers));

package/src/make-api.js

@@ -156,7 +156,11 @@ export default function makeApi(store) {
      */
     initialize(merchantId, env, authUrl) {
       // settings resolves once, before anything.
-      if (!isReady) offers.resolveSettings(merchantId, env, window.og_settings, store);
+      if (isReady) {
+        console.warn('og.offers has been initialized already. Skipping.');
+      } else {
+        offers.resolveSettings(merchantId, env, window.og_settings, store);
+      }
 
       const state = store.getState();
       // dont re-trigger actions if value is the same. allowing set new authurl only
@@ -165,20 +169,6 @@ export default function makeApi(store) {
       // allow set new authUrl
       if (authUrl) offers.setAuthUrl(authUrl);
 
-      if (isReady) {
-        console.warn('og.offers has been initialized already. Skipping.');
-      } else {
-        window.addEventListener('storage', listenLocalStorageChanges(store));
-        store.dispatch(actions.requestSessionId());
-      }
-
-      if (arguments.length === 3) {
-        // fetch auth is not there already
-        if (!store.getState().auth?.ts) {
-          store.dispatch(actions.fetchAuth());
-        }
-      }
-
       isReady = true;
 
       return this;