@rebilly/instruments 3.18.1-beta.0 → 3.20.0-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rebilly/instruments",
-  "version": "3.18.1-beta.0",
+  "version": "3.20.0-beta.0",
   "author": "Rebilly",
   "license": "MIT",
   "main": "dist/index.js",

package/src/data/payment-methods.json

@@ -2273,6 +2273,25 @@
       }
     ]
   },
+  {
+    "apiName": "SafetyPay",
+    "name": "SafetyPay",
+    "landscapeLogo": null,
+    "portraitLogo": null,
+    "summary": "SafetyPay operates the largest network of banks and cash collection points in Latin America, the result of 10+ years effort, with presence in 16 countries consolidated with 380 bank partners and 180,000 collection points.\n",
+    "description": "SafetyPay operates the largest network of banks and cash collection points in Latin America, the result of 10+ years effort, with presence in 16 countries consolidated with 380 bank partners and 180,000 collection points.\n",
+    "countries": {
+      "mode": "unknown",
+      "values": []
+    },
+    "storefrontEnabled": true,
+    "_links": [
+      {
+        "rel": "self",
+        "href": "https://api.rebilly.com/payment-methods/SafetyPay"
+      }
+    ]
+  },
   {
     "apiName": "Siirto",
     "name": "Siirto",

package/src/functions/mount/fetch-data.js

@@ -1,5 +1,6 @@
 import { collectData } from '@rebilly/risk-data-collector';
 import { fetchProductsFromPlans } from '../../storefront/fetch-products-from-plans';
+import { fetchPlansFromAddonsBumpOffers } from '../../storefront/fetch-plans-from-addons-bumpOffers';
 import { fetchReadyToPay } from '../../storefront/ready-to-pay';
 import { fetchSummary } from '../../storefront/summary';
 import { fetchInvoiceAndProducts as FetchInvoiceAndProducts } from '../../storefront/invoices';
@@ -21,6 +22,7 @@ export class DataInstance {
 
     this.money = state.options?.money || null;
     this.couponIds = [];
+    this.addons = [];
   }
 
   get amountAndCurrency() {
@@ -174,15 +176,22 @@ export async function fetchData({
       productsPromise = fetchProductsFromPlans({ state });
     }
 
+    let plansPromise = new Promise((resolve) => resolve([]));
+    if (state.options?.addons || state.options?.bumpOffers) {
+      plansPromise = fetchPlansFromAddonsBumpOffers({ state });
+    }
+
     const [
       readyToPay,
       previewPurchase,
       products,
+      plans,
       availableInstruments
     ] = await Promise.all([
       readyToPayPromise,
       previewPurchasePromise,
       productsPromise,
+      plansPromise,
       availableInstrumentsPromise
     ]);
 
@@ -191,6 +200,7 @@ export async function fetchData({
       readyToPay,
       previewPurchase,
       products,
+      plans,
       availableInstruments
     });
   } catch(error) {

package/src/functions/mount/setup-options.js

@@ -7,6 +7,8 @@ export const defaults = {
   theme: {
     labels: 'stacked'
   },
+  addons: [],
+  bumpOffers: [],
   paymentInstruments: {
     address: {
       name: 'default',
@@ -136,6 +138,7 @@ export default ({
   // Add optional key's
   [
     'items',
+    'bumpOffers',
     'money',
     'invoiceId',
     'transactionId',
@@ -147,5 +150,12 @@ export default ({
     }
   });
 
+  // only add "addons" if items are available
+  if (combinedOptions.items) {
+    if (options.addons) {
+      combinedOptions.addons = options.addons;
+    }
+  }
+
   return combinedOptions;
 }

package/src/functions/purchase.js

@@ -74,6 +74,14 @@ export async function makePurchase({ state, payload }) {
     data.couponIds = state.data.couponIds
   }
 
+  if (state.options.addons && state.data.addons && Array.isArray(state.data.addons)) {
+    state.options.addons.forEach(addon => {
+      if (state.data.addons.includes(addon.planId)) {
+        data.items.push(addon);
+      }
+    })
+  }
+
   const { fields } = await postPurchase({
     state,
     data
@@ -81,30 +89,40 @@ export async function makePurchase({ state, payload }) {
   return fields;
 }
 
-export function handleApprovalUrl({state, fields}) {
-  const { paymentMethodsUrl } = state.options._computed;
+export function handleApprovalUrl({state, fields, payload}) {
+  if (payload.redirectUrl || !fields.transaction?.approvalUrl) {
+    const { paymentMethodsUrl } = state.options._computed;
 
-  const model = {};
-  if (state.data.isPayment) {
-    model.payment = fields;
-  } else {
-    model.purchase = fields;
-  }
-
-  state.data = new DataInstance({state, ...fields});
-
-  mountModal({
-    state,
-    name: 'rebilly-instruments-approval-url',
-    url: `${paymentMethodsUrl}/approval-url`,
-    model,
-    close: (updatedPurchase) => {
-      Events.purchaseCompleted.dispatch(updatedPurchase);
+    const model = {};
+    if (state.data.isPayment) {
+      model.payment = fields;
+    } else {
+      model.purchase = fields;
     }
-  });
+  
+    state.data = new DataInstance({state, ...fields});
+  
+    mountModal({
+      state,
+      name: 'rebilly-instruments-approval-url',
+      url: `${paymentMethodsUrl}/approval-url`,
+      model,
+      close: (updatedPurchase) => {
+        Events.purchaseCompleted.dispatch(updatedPurchase);
+      }
+    });
+  } else if (fields.transaction?.approvalUrl) {
+    window.location = fields.transaction?.approvalUrl
+  }  
 }
 
 export async function purchase({ state, payload }) {
+  Object.keys(payload).forEach(key => {
+    if (payload[key] === null) {
+      delete payload[key];
+    }
+  });
+
   try {
     let fields;
     if (state.data.isPayment) {
@@ -114,7 +132,7 @@ export async function purchase({ state, payload }) {
     }
 
     if (fields.transaction?.approvalUrl && fields.transaction?.result === 'unknown') {
-      handleApprovalUrl({state, fields});
+      handleApprovalUrl({state, fields, payload});
     } else {
       Events.purchaseCompleted.dispatch(fields);
     }

package/src/storefront/fetch-plans-from-addons-bumpOffers.js

@@ -0,0 +1,27 @@
+import PlanModel from './models/plan-model';
+import { Endpoint } from './index';
+
+export async function fetchPlansFromAddonsBumpOffers({ state = {} }) {
+  return Endpoint({state}, async () => {
+    let ids = [];
+
+    if (state.options?.addons) {
+      ids = ids.concat(state.options.addons
+        .map((item) => item.planId));
+    }
+
+    if (state.options?.bumpOffers) {
+      ids = ids.concat(state.options.bumpOffers
+        .map((item) => item.planId));
+    }
+
+    if (ids.length > 0) {
+      const { items: planItems } = await state.storefront.plans.getAll({
+        filter: `id:${ids.join(',')}`
+      });
+      return planItems.map(({fields}) => new PlanModel(fields).toPayload());
+    }
+
+    return [];
+  });
+}

package/src/storefront/fetch-products-from-plans.js

@@ -15,9 +15,20 @@ export async function fetchProductsFromPlans({ state = {} }) {
     };
 
     if (lineItems.length) {
-      filterByPlanId.filter = `id:${lineItems
-        .map((item) => item.planId)
-        .join(',')}`;
+      let ids = lineItems
+        .map((item) => item.planId);
+
+      if (state.options?.addons) {
+        ids = ids.concat(state.options.addons
+          .map((item) => item.planId));
+      }
+
+      if (state.options?.bumpOffers) {
+        ids = ids.concat(state.options.bumpOffers
+          .map((item) => item.planId));
+      }
+
+      filterByPlanId.filter = `id:${[...new Set(ids)].join(',')}`;
     }
 
     // Only fetch plans if we have specific plans to fetch
@@ -28,7 +39,15 @@ export async function fetchProductsFromPlans({ state = {} }) {
           filterByPlanId
         );
 
-        return planItems.map(({ fields }) => new ProductModel(fields._embedded.product));
+        const products = []
+        planItems
+          .map(({ fields }) => new ProductModel(fields._embedded.product))
+          .forEach(product => {
+            if (products.every(item => item.id !== product.id)) {
+              products.push(product)
+            }
+        });
+        return products;
       } catch(e) {
         // Ignore and return empty items
       };

package/src/storefront/models/plan-model.js

@@ -1,3 +1,85 @@
 import BaseModel from './base-model';
 
-export default class PlanModel extends BaseModel {}
+export class PlanPricingBracketModel {
+  constructor ({
+    maxQuantity = null,
+    price = null
+  } = {}) {
+    this.maxQuantity = maxQuantity || Number.MAX_SAFE_INTEGER;
+    this.price = !Number.isNaN(parseFloat(price)) ? parseFloat(price) : null; 
+  }
+}
+
+export class PlanPricingModel {
+  static SimpleFormulas = {
+    fixedFee: 'fixed-fee',
+    flatRate: 'flat-rate'
+  };
+
+  static BracketFormulas = {
+    stairstep: 'stairstep',
+    tiered: 'tiered',
+    volume: 'volume'
+  };
+
+  static Formulas = {
+    ...PlanPricingModel.SimpleFormulas,
+    ...PlanPricingModel.BracketFormulas
+  };
+
+  constructor ({
+    formula = PlanPricingModel.Formulas.fixedFee,
+    price = 0,
+    maxQuantity = null,
+    brackets = []
+  } = {}) {
+    this.formula = formula;
+
+    switch (this.formula) {
+      case PlanPricingModel.Formulas.stairstep:
+      case PlanPricingModel.Formulas.tiered:
+      case PlanPricingModel.Formulas.volume:
+        this.brackets = brackets.map(bracket => new PlanPricingBracketModel(bracket));
+        break;
+      case PlanPricingModel.Formulas.flatRate:
+        this.price = !Number.isNaN(parseFloat(price)) ? parseFloat(price) : null;
+        this.maxQuantity = maxQuantity;
+        break;
+      case PlanPricingModel.Formulas.fixedFee:
+      default:
+        this.price = !Number.isNaN(parseFloat(price)) ? parseFloat(price) : null;
+        break;
+    }
+  }
+
+  get isSimple() {
+    return Object.values(PlanPricingModel.SimpleFormulas).includes(this.formula);
+  }
+
+  get isBracket () {
+    return Object.values(PlanPricingModel.BracketFormulas).includes(this.formula);
+  }
+
+  toPayload() {
+    return {
+      ...this,
+      isSimple: this.isSimple,
+      isBracket: this.isBracket,
+    }
+  }
+}
+
+export default class PlanModel extends BaseModel {
+  constructor(fields = {}) {
+    super(fields);
+
+    this.pricing = new PlanPricingModel(fields.pricing || {});
+  }
+
+  toPayload() {
+    return {
+      ...this,
+      pricing: this.pricing.toPayload(),
+    }
+  }
+}

package/src/storefront/summary.js

@@ -18,6 +18,10 @@ export async function fetchSummary({ data = null, state = null } = {}) {
         planId: item.planId,
         quantity: item.quantity,
       }));
+
+      if (state.data?.addons > 0) {
+        payload.data.items.concat(state.data.addons)
+      }
     }
 
     if (state.data?.amountAndCurrency) {

package/src/views/common/iframe/events/update-addons-handler.js

@@ -0,0 +1,21 @@
+export function updateAddonsHandler(iframe) {
+  iframe.component.on(`${iframe.name}-update-addons`, async ({addons, previewPurchase}) => {
+    const addonPlanIds = addons.map(addon => addon.planId);
+    iframe.state.data.addons = addonPlanIds;
+    iframe.state.data.previewPurchase = previewPurchase;
+    
+    iframe.state.data.previewPurchase.addonLineItems = iframe.state.data.previewPurchase.lineItems
+      .filter(item => addonPlanIds.includes(item.planId));
+    iframe.state.data.previewPurchase.lineItems = iframe.state.data.previewPurchase.lineItems
+      .filter(item => !addonPlanIds.includes(item.planId));
+
+    const updateModel = {
+      data: iframe.state.data.toPostmatesModel(),
+      options: iframe.state.options
+    }
+    if (iframe.state.iframeComponents.summary) {
+      iframe.state.iframeComponents.summary.component.call('update', updateModel);
+    }
+    iframe.state.iframeComponents.form.component.call('update', updateModel);
+  });
+}

package/src/views/common/iframe/view-iframe.js

@@ -3,6 +3,7 @@ import BaseIframe from './base-iframe';
 import { resizeComponentHandler } from './events/resize-component-handler';
 import { dispatchEventHandler } from './events/dispatch-event-handler';
 import { updateCouponsHandler } from './events/update-coupons-handler';
+import { updateAddonsHandler } from './events/update-addons-handler';
 import { showErrorHandler } from './events/show-error-handler';
 import { stopLoaderHandler } from './events/stop-loader-handler';
 
@@ -17,5 +18,6 @@ export class ViewIframe extends BaseIframe {
     stopLoaderHandler(this, { loader });
     showErrorHandler(this);
     updateCouponsHandler(this);
+    updateAddonsHandler(this);
   }
 }