@ordergroove/offers 2.29.0 → 2.29.1-alpha-PR-707-2.113

package/src/core/reducer.js

@@ -3,7 +3,8 @@ import { combineReducers } from 'redux';
 import * as constants from './constants';
 import { isSameProduct } from './selectors';
 import { stringifyFrequency } from './api';
-import { safeProductId } from './utils';
+import { getObjectStructuredProductPlans } from './adapters';
+import { safeProductId, getMatchingProductIfExists } from './utils';
 
 export const optedin = (state = [], action) => {
   switch (action.type) {
@@ -12,16 +13,26 @@ export const optedin = (state = [], action) => {
     case constants.LOCAL_STORAGE_CHANGE:
       return action.newValue ? action.newValue.optedin : state;
     case constants.OPTIN_PRODUCT:
-    case constants.PRODUCT_CHANGE_FREQUENCY:
-      const [[oldone], rest] = state.reduce(
-        (acc, val) => acc[isSameProduct(action.payload.product, val) ? 0 : 1].push(val) && acc,
-        [[], []]
-      );
-      return (rest || []).concat({
+    case constants.PRODUCT_CHANGE_FREQUENCY: {
+      // since prepaid maps to a different set of frequencies, we remove prepaidShipments when frequency is changed
+      const [{ prepaidShipments, ...oldone }, rest] = getMatchingProductIfExists(state, action.payload.product);
+      return rest.concat({
         ...oldone,
         ...action.payload.product,
         frequency: action.payload.frequency
       });
+    }
+    case constants.PRODUCT_CHANGE_PREPAID_SHIPMENTS:
+      const { payload } = action;
+      const [{ prepaidShipments, ...oldone }, rest] = getMatchingProductIfExists(state, payload.product);
+      const newState = {
+        ...oldone,
+        ...payload.product
+      };
+      if (payload.prepaidShipments) {
+        newState.prepaidShipments = payload.prepaidShipments;
+      }
+      return rest.concat(newState);
     case constants.OPTOUT_PRODUCT:
       return state.filter(a => !isSameProduct(action.payload.product, a));
     case constants.PRODUCT_HAS_CHANGED:
@@ -47,11 +58,8 @@ export const optedout = (state = [], action) => {
     case constants.PRODUCT_CHANGE_FREQUENCY:
       return state.filter(a => !isSameProduct(action.payload.product, a));
     case constants.OPTOUT_PRODUCT:
-      const [[oldone], rest] = state.reduce(
-        (acc, val) => acc[isSameProduct(action.payload.product, val) ? 0 : 1].push(val) && acc,
-        [[], []]
-      );
-      return (rest || []).concat({
+      const [oldone, rest] = getMatchingProductIfExists(state, action.payload.product);
+      return rest.concat({
         ...oldone,
         ...action.payload.product,
         frequency: action.payload.frequency
@@ -451,7 +459,19 @@ export const templates = (state = [], action) => {
 export const productPlans = (state = {}, action) => {
   switch (action.type) {
     case constants.RECEIVE_PRODUCT_PLANS:
-      return { ...action.payload };
+      return getObjectStructuredProductPlans(action.payload);
+    default:
+      return state;
+  }
+};
+
+export const prepaidShipmentsSelected = (state = {}, action) => {
+  switch (action.type) {
+    case constants.PRODUCT_CHANGE_PREPAID_SHIPMENTS:
+      if (action.payload.prepaidShipments) {
+        return { ...state, [action.payload.product.id]: action.payload.prepaidShipments };
+      }
+      return state;
     default:
       return state;
   }
@@ -483,5 +503,6 @@ export default combineReducers({
   autoshipByDefault,
   defaultFrequencies,
   templates,
-  productPlans
+  productPlans,
+  prepaidShipmentsSelected
 });

package/src/core/selectors.js

@@ -60,6 +60,9 @@ export const sellingPlansSelector = state => state?.config?.frequencies || [];
 
 export const frequenciesEveryPeriodSelector = state => state?.config?.frequenciesEveryPeriod || [];
 
+export const prepaidSellingPlansSelector = state => state?.config?.prepaidSellingPlans || [];
+export const prepaidShipmentsSelectedSelector = state => state?.prepaidShipmentsSelected || {};
+
 /**
  * Creates a function with state arguments that return the true when
  * productId is in the optedin array or not in optedout or autoship by default
@@ -99,6 +102,21 @@ export const makeSubscribedSelector = memoize(
   product => JSON.stringify(product)
 );
 
+export const makePrepaidSubscribedSelector = memoize(
+  product =>
+    createSelector(optedinSelector, optedin => optedin.some(b => isSameProduct(product, b) && b.prepaidShipments)),
+  product => JSON.stringify(product)
+);
+
+export const makePrepaidShipmentsSelectedSelector = memoize(
+  product =>
+    createSelector(
+      prepaidShipmentsSelectedSelector,
+      prepaidShipmentsSelected => prepaidShipmentsSelected[product.id] || null
+    ),
+  product => JSON.stringify(product)
+);
+
 /**
  * Creates a function with state arguments that return the true when
  * productId is in the optedout array
@@ -114,6 +132,20 @@ export const makeProductFrequencySelector = memoize(productId =>
   createSelector(makeOptedinSelector(productId), productOptin => (productOptin && productOptin.frequency) || null)
 );
 
+export const makeProductPrepaidShipmentsOptedInSelector = memoize(productId =>
+  createSelector(
+    makeOptedinSelector(productId),
+    productOptin => (productOptin && productOptin.prepaidShipments) || null
+  )
+);
+
+export const makeProductPrepaidShipmentOptionsSelector = memoize(productId =>
+  createSelector(
+    prepaidSellingPlansSelector,
+    prepaidSellingPlans => prepaidSellingPlans[productId]?.map(({ numberShipments }) => numberShipments) || []
+  )
+);
+
 /**
  * Creates a function with state arguments that returns stringified frequency
  * if default frequency exists for the product

package/src/core/utils.ts

@@ -1,5 +1,6 @@
 import platform from '../platform';
 import { ENV_PROD, ENV_STAGING, STAGING_STATIC_HOST, STATIC_HOST } from './constants';
+import { isSameProduct } from './selectors';
 
 export function onReady(fn) {
   if (document.readyState === 'loading') {
@@ -140,3 +141,18 @@ export function getOrCreateHidden(parent, name, value) {
     input.value = value;
   }
 }
+
+/**
+ * Returns the first matching product if it exists, or an empty object if it doesn't.
+ * @param state - the optedin/optedout state array to search
+ * @param product - the product to search for
+ * @returns {[any, any[]]} - a two item array where the first item is the matching product and the second is the remaining items from the original state.
+ */
+export function getMatchingProductIfExists(state, product) {
+  const [[oldone], rest] = state.reduce((acc, val) => acc[isSameProduct(product, val) ? 0 : 1].push(val) && acc, [
+    [],
+    []
+  ]);
+
+  return [oldone || {}, rest || []];
+}

package/src/make-api.js

@@ -20,6 +20,8 @@ import { Modal } from './components/Modal';
 import { Select } from './components/Select';
 import { Tooltip } from './components/Tooltip';
 import { ConnectedFrequencyStatus } from './components/FrequencyStatus';
+import { ConnectedPrepaidToggle } from './components/PrepaidToggle';
+import { ConnectedPrepaidData } from './components/PrepaidData';
 import * as testMode from './test-mode';
 import { api } from './core/api';
 import { environment, offer } from './core/reducer';
@@ -51,6 +53,8 @@ export default function makeApi(store) {
     customElements.define('og-upsell-modal', ConnectedUpsellModal);
     customElements.define('og-next-upcoming-order', ConnectedNextUpcomingOrder);
     customElements.define('og-price', ConnectedPrice);
+    customElements.define('og-prepaid-toggle', ConnectedPrepaidToggle);
+    customElements.define('og-prepaid-data', ConnectedPrepaidData);
   } catch (err) {
     console.info('OG WebComponents already registered, skipping.');
   }

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

@@ -0,0 +1,513 @@
+import {
+  isPrepaidAllocation,
+  getPrepaidShipmentsNumberFromOptions,
+  getAllocationFrequency,
+  getAllocationSubscriptionPrice,
+  getAllocationDiscountRate,
+  addPrepaidPriceAndSavings,
+  mapSellingPlanToDiscount,
+  getSellingPlans,
+  DEFAULT_PAY_AS_YOU_GO_GROUP_NAME
+} from '../reducers/productPlans';
+
+describe('Shopify productPlan Reducer', () => {
+  describe('isPrepaidAllocation', () => {
+    it('should return true if there is prepaid option', () => {
+      const allocation = {
+        selling_plan: {
+          options: [
+            {
+              name: 'Delivery every',
+              position: 1,
+              value: 'PREPAID-1 month'
+            },
+            {
+              name: 'Shipment amount',
+              position: 2,
+              value: '3 shipments'
+            }
+          ]
+        }
+      };
+      expect(isPrepaidAllocation(allocation)).toBeTruthy();
+    });
+
+    it('should return false if there is no prepaid option', () => {
+      const allocation = {
+        selling_plan: {
+          options: [
+            {
+              name: 'Delivery every',
+              position: 1,
+              value: '1 month'
+            }
+          ]
+        }
+      };
+      expect(isPrepaidAllocation(allocation)).toBeFalsy();
+    });
+  });
+
+  describe('getPrepaidShipmentsNumberFromOptions', () => {
+    it('should return number of shipments as number', () => {
+      const options = [
+        {
+          name: 'Delivery every',
+          position: 1,
+          value: 'PREPAID-1 month'
+        },
+        {
+          name: 'Shipment amount',
+          position: 2,
+          value: '3 shipments'
+        }
+      ];
+      expect(getPrepaidShipmentsNumberFromOptions(options)).toBe(3);
+    });
+
+    it('should return null when getting shipments from a non prepaid selling plan', () => {
+      const options = [
+        {
+          name: 'Delivery every',
+          position: 1,
+          value: '1 month'
+        }
+      ];
+      expect(getPrepaidShipmentsNumberFromOptions(options)).toBe(null);
+    });
+  });
+
+  describe('getAllocationFrequency', () => {
+    it('should return frequency as selling-plan-id for allocation with selling_plan_id', () => {
+      const allocation = {
+        selling_plan_id: 123456789
+      };
+      expect(getAllocationFrequency(allocation)).toBe('123456789');
+    });
+
+    it('should return frequency as selling-plan-id for allocation with selling_plan object', () => {
+      const allocation = {
+        selling_plan: { id: 123456789 }
+      };
+      expect(getAllocationFrequency(allocation)).toBe('123456789');
+    });
+  });
+
+  describe('getAllocationSubscriptionPrice', () => {
+    it('should return money price for pay-as-you-go subscription', () => {
+      const allocation = {
+        price: 1350
+      };
+      expect(getAllocationSubscriptionPrice(allocation)).toBe('$13.50');
+    });
+
+    it('should return per delivery money price for prepaid subscription', () => {
+      const allocation = {
+        price: 3000,
+        selling_plan: {
+          options: [
+            {
+              name: 'Delivery every',
+              position: 1,
+              value: 'PREPAID-1 month'
+            },
+            {
+              name: 'Shipment amount',
+              position: 2,
+              value: '3 shipments'
+            }
+          ]
+        }
+      };
+      expect(getAllocationSubscriptionPrice(allocation)).toBe('$10.00');
+    });
+  });
+
+  describe('getAllocationDiscountRate', () => {
+    it('should return discount for pay-as-you-go subscription as percentage', () => {
+      const allocation = {
+        price_adjustments: [{ position: 1, value: 10, value_type: 'percentage' }]
+      };
+      expect(getAllocationDiscountRate(allocation)).toBe('10%');
+    });
+
+    it('should return discount for pay-as-you-go subscription from price adjustment', () => {
+      const allocation = {
+        price_adjustments: [{ position: 1, value: 1050 }]
+      };
+      expect(getAllocationDiscountRate(allocation)).toBe('$10.50');
+    });
+
+    it('should return discount for pay-as-you-go subscription from compare_at_price', () => {
+      const allocation = {
+        compare_at_price: 1350,
+        price: 1200,
+        price_adjustments: []
+      };
+      expect(getAllocationDiscountRate(allocation)).toBe('$1.50');
+    });
+
+    it('should return prepaid percentage discount when prepaid options are present - 3 shipments', () => {
+      const allocation = {
+        compare_at_price: 1500,
+        price: 3600,
+        selling_plan: {
+          options: [
+            {
+              name: 'Delivery every',
+              position: 1,
+              value: 'PREPAID-1 month'
+            },
+            {
+              name: 'Shipment amount',
+              position: 2,
+              value: '3 shipments'
+            }
+          ]
+        }
+      };
+      expect(getAllocationDiscountRate(allocation)).toBe('20%');
+    });
+
+    it('should return prepaid percentage discount when prepaid options are present - 12 shipments', () => {
+      const allocation = {
+        compare_at_price: 1500,
+        price: 13500,
+        selling_plan: {
+          options: [
+            {
+              name: 'Delivery every',
+              position: 1,
+              value: 'PREPAID-1 month'
+            },
+            {
+              name: 'Shipment amount',
+              position: 2,
+              value: '12 shipments'
+            }
+          ]
+        }
+      };
+      expect(getAllocationDiscountRate(allocation)).toBe('25%');
+    });
+  });
+
+  describe('addPrepaidPriceAndSavings', () => {
+    it('should add more prepaid data when selling plan is prepaid', () => {
+      const allocation = {
+        price: 2400,
+        compare_at_price: 500,
+        selling_plan: {
+          options: [
+            {
+              name: 'Delivery every',
+              position: 1,
+              value: 'PREPAID-1 month'
+            },
+            {
+              name: 'Shipment amount',
+              position: 2,
+              value: '6 shipments'
+            }
+          ]
+        }
+      };
+
+      const productPlan = {
+        frequency: '688412852500',
+        regularPrice: '$5.00',
+        subscriptionPrice: '$4.00',
+        discountRate: '20%',
+        prepaidShipments: 6
+      };
+
+      const expectedProductPlan = {
+        frequency: '688412852500',
+        regularPrice: '$5.00',
+        subscriptionPrice: '$4.00',
+        discountRate: '20%',
+        prepaidShipments: 6,
+        regularPrepaidPrice: '$24.00',
+        prepaidSavingsPerShipment: '$1.00',
+        prepaidSavingsTotal: '$6.00'
+      };
+
+      const newProductPlan = addPrepaidPriceAndSavings(allocation, productPlan);
+
+      expect(newProductPlan).toEqual(expectedProductPlan);
+    });
+  });
+
+  describe('mapSellingPlanToDiscount', () => {
+    it('should create pay-as-you-go product plan', () => {
+      const allocation = {
+        price_adjustments: [
+          {
+            position: 1,
+            price: 450
+          }
+        ],
+        price: 450,
+        compare_at_price: 500,
+        per_delivery_price: 450,
+        selling_plan_id: 688412655892,
+        selling_plan_group_id: 'f0c2b41b7b770c58287b7e02da5a2f4df4605c7b'
+      };
+
+      const expectedProductPlan = {
+        frequency: '688412655892',
+        regularPrice: '$5.00',
+        subscriptionPrice: '$4.50',
+        discountRate: '$.50',
+        prepaidShipments: null
+      };
+
+      const productPlanCreated = mapSellingPlanToDiscount(allocation);
+
+      expect(productPlanCreated).toEqual(expectedProductPlan);
+    });
+
+    it('should create prepaid product plan', () => {
+      const allocation = {
+        price_adjustments: [
+          {
+            position: 1,
+            price: 4800
+          }
+        ],
+        price: 4800,
+        compare_at_price: 2000,
+        per_delivery_price: 4800,
+        selling_plan_id: 688412983572,
+        selling_plan_group_id: '78cc7d24bc5c4f3000c0d86f2d514e066c4b9fd2'
+      };
+
+      const sellingPlans = [
+        {
+          id: 688412983572,
+          name: 'Delivered every 1 month, prepaid for 3 shipments',
+          description: null,
+          options: [
+            {
+              name: 'Delivery every',
+              position: 1,
+              value: 'PREPAID-1 month'
+            },
+            {
+              name: 'Shipment amount',
+              position: 2,
+              value: '3 shipments'
+            }
+          ],
+          recurring_deliveries: true,
+          price_adjustments: [
+            {
+              order_count: null,
+              position: 1,
+              value_type: 'price',
+              value: 4800
+            }
+          ]
+        }
+      ];
+
+      const expectedProductPlan = {
+        frequency: '688412983572',
+        regularPrice: '$20.00',
+        subscriptionPrice: '$16.00',
+        discountRate: '20%',
+        prepaidShipments: 3,
+        regularPrepaidPrice: '$48.00',
+        prepaidSavingsPerShipment: '$4.00',
+        prepaidSavingsTotal: '$12.00'
+      };
+
+      const productPlanCreated = mapSellingPlanToDiscount(allocation, sellingPlans);
+
+      expect(productPlanCreated).toEqual(expectedProductPlan);
+    });
+
+    it('should create prepaid product plan with extra discount percentage', () => {
+      const allocation = {
+        price_adjustments: [
+          {
+            position: 1,
+            price: 4800
+          }
+        ],
+        price: 4800,
+        compare_at_price: 2000,
+        per_delivery_price: 4800,
+        selling_plan_id: 688412983572,
+        selling_plan_group_id: '78cc7d24bc5c4f3000c0d86f2d514e066c4b9fd2'
+      };
+
+      const sellingPlans = [
+        {
+          id: 688412983572,
+          name: 'Delivered every 1 month, prepaid for 3 shipments',
+          description: null,
+          options: [
+            {
+              name: 'Delivery every',
+              position: 1,
+              value: 'PREPAID-1 month'
+            },
+            {
+              name: 'Shipment amount',
+              position: 2,
+              value: '3 shipments'
+            }
+          ],
+          recurring_deliveries: true,
+          price_adjustments: [
+            {
+              order_count: null,
+              position: 1,
+              value_type: 'price',
+              value: 4800
+            }
+          ],
+          group_name: 'Prepaid-'
+        },
+        {
+          id: 688412983573,
+          name: 'Delivered every month. Get 10% off today and all future orders.',
+          description: null,
+          options: [
+            {
+              name: 'Delivery every',
+              position: 1,
+              value: '1 month'
+            }
+          ],
+          recurring_deliveries: true,
+          price_adjustments: [
+            {
+              order_count: null,
+              position: 1,
+              value_type: 'percentage',
+              value: 10
+            }
+          ],
+          group_name: DEFAULT_PAY_AS_YOU_GO_GROUP_NAME
+        }
+      ];
+
+      const expectedProductPlan = {
+        frequency: '688412983572',
+        regularPrice: '$20.00',
+        subscriptionPrice: '$16.00',
+        discountRate: '20%',
+        prepaidShipments: 3,
+        regularPrepaidPrice: '$48.00',
+        prepaidSavingsPerShipment: '$4.00',
+        prepaidSavingsTotal: '$12.00',
+        prepaidExtraSavingsPercentage: '10%'
+      };
+
+      const productPlanCreated = mapSellingPlanToDiscount(allocation, sellingPlans);
+
+      expect(productPlanCreated).toEqual(expectedProductPlan);
+    });
+  });
+
+  describe('getSellingPlans', () => {
+    it('should convert selling plan groups to selling plan', () => {
+      const product = {
+        selling_plan_groups: [
+          {
+            name: 'Prepaid-',
+            selling_plans: [
+              {
+                id: 688412721428,
+                options: [
+                  {
+                    name: 'Delivery every',
+                    position: 1,
+                    value: 'PREPAID-1 month'
+                  },
+                  {
+                    name: 'Shipment amount',
+                    position: 2,
+                    value: '3 shipments'
+                  }
+                ]
+              }
+            ]
+          },
+          {
+            name: DEFAULT_PAY_AS_YOU_GO_GROUP_NAME,
+            selling_plans: [
+              {
+                id: 688412623124,
+                options: [
+                  {
+                    name: 'Delivery every',
+                    position: 1,
+                    value: 'month'
+                  }
+                ]
+              },
+              {
+                id: 688412655892,
+                options: [
+                  {
+                    name: 'Delivery every',
+                    position: 1,
+                    value: '2 months'
+                  }
+                ]
+              }
+            ]
+          }
+        ]
+      };
+
+      const expectedSellingPlans = [
+        {
+          group_name: 'Prepaid-',
+          id: 688412721428,
+          options: [
+            {
+              name: 'Delivery every',
+              position: 1,
+              value: 'PREPAID-1 month'
+            },
+            {
+              name: 'Shipment amount',
+              position: 2,
+              value: '3 shipments'
+            }
+          ]
+        },
+        {
+          group_name: DEFAULT_PAY_AS_YOU_GO_GROUP_NAME,
+          id: 688412623124,
+          options: [
+            {
+              name: 'Delivery every',
+              position: 1,
+              value: 'month'
+            }
+          ]
+        },
+        {
+          group_name: DEFAULT_PAY_AS_YOU_GO_GROUP_NAME,
+          id: 688412655892,
+          options: [
+            {
+              name: 'Delivery every',
+              position: 1,
+              value: '2 months'
+            }
+          ]
+        }
+      ];
+
+      const sellingPlans = getSellingPlans(product);
+
+      expect(sellingPlans).toEqual(expectedSellingPlans);
+    });
+  });
+});