@rebilly/instruments 2.0.0-beta → 3.0.1-beta.0

package/src/index.spec.js

@@ -4,14 +4,6 @@ import { avoidUnhandledPromises } from 'tests/async-utilities';
 describe('RebillyInstruments instance', () => {
   let rebillyInstruments;
 
-  function setupInstance(
-    options = {
-      test: 'value'
-    }
-  ) {
-    rebillyInstruments.mount(options);
-  }
-
   beforeEach(() => {
     rebillyInstruments = RebillyInstruments;
   });
@@ -30,24 +22,14 @@ describe('RebillyInstruments instance', () => {
 
     const options = {
       form: '.form-selector',
-      test: 'value'
+      summary: '.summary-selector',
+      items: []
     };
 
-    setupInstance(options);
+    await rebillyInstruments.mount(options);
 
     expect(rebillyInstruments.mount).toHaveBeenCalledTimes(1);
     expect(rebillyInstruments.mount).toHaveBeenCalledWith(options);
     await avoidUnhandledPromises();
   });
-
-  it('should be able to trigger a purchase', () => {
-    jest.spyOn(rebillyInstruments, 'purchase');
-
-    const instrument = {};
-
-    setupInstance();
-    rebillyInstruments.purchase(instrument);
-
-    expect(rebillyInstruments.purchase).toHaveBeenCalledTimes(1);
-  });
 });

package/src/loader/index.js

@@ -15,17 +15,15 @@ export class Loader {
   }
 
   addDOMElement({ section = 'form', el = null } = {}) {
-    const minHeight = '200px';
-
     if (isDOMElement(el)) {
       el.style.position = 'relative';
-      el.style.minHeight = minHeight;
 
       this.DOM[section] = el;
     }
   }
 
   startLoading({ section = 'form', id = '' } = {}) {
+    const minHeight = '200px';
     this[section].push(id);
 
     if (this.DOM?.[section]) {
@@ -36,6 +34,7 @@ export class Loader {
           .querySelector('.rebilly-instruments-loader')
           .classList.add('is-active');
       }
+      this.DOM[section].style.minHeight = minHeight; 
     }
   }
 
@@ -53,6 +52,7 @@ export class Loader {
       this.DOM[section]
         .querySelector('.rebilly-instruments-loader')
         .classList.remove('is-active');
+      this.DOM[section].style.minHeight = '';
     }
   }
 

package/src/storefront/index.js

@@ -1,5 +1,33 @@
 import { RebillyStorefrontAPI } from 'rebilly-js-sdk';
 
+export function validateStateForStorefront({state}) {
+  if (!state.storefront) {
+    throw new Error('Could not access rebilly-js-sdk instance');
+  }
+
+  if (!state.options) {
+    throw new Error(
+      'Could not use Rebilly Instruments mount options to fetch Rebilly data'
+    );
+  }
+}
+
+export async function Endpoint({
+  state
+} = {}, callback) {
+  try {
+    validateStateForStorefront({state});
+    return await callback();
+  } catch(error) {
+    // TODO: standard error handling for all endpoints
+    // console.error(error);
+    if(error.status === 422) {
+      error.details.forEach(e => console.error(e));
+    }
+    throw error;
+  }
+}
+
 export class StorefrontInstance {
   constructor({
     publishableKey = null,

package/src/storefront/invoices.js

@@ -0,0 +1,11 @@
+import InvoiceModel from './models/invoice-model';
+import { Endpoint } from './index';
+
+export async function fetchInvoice({ data = null, state = null }) {
+  return Endpoint({state}, async () => {
+    state.storefront.setSessionToken(state.options.customerJwt);
+    const {fields} = await state.storefront.invoices.get(data);
+
+    return new InvoiceModel(fields);
+  });
+}

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

@@ -0,0 +1,10 @@
+export default class BaseModel {
+  constructor({
+    ...fields
+  } = {}) {
+    Object.entries(fields)
+      .forEach(([key, value]) => {
+        this[key] = value;
+      })
+  }
+}

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

@@ -0,0 +1,3 @@
+import BaseModel from './base-model';
+
+export default class InvoiceModel extends BaseModel {}

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

@@ -1,35 +1,3 @@
-export default class PlanModel {
-  constructor({
-    id = '',
-    name = '',
-    productId = '',
-    productOptions = {},
-    currency = '',
-    currencySign = '',
-    pricing = {},
-    recurringInterval = {},
-    trial = null,
-    isTrialOnly = false,
-    setup = null,
-    customFields = {},
-    createdTime = '',
-    updatedTime = '',
-    invoiceTimeShift = {}
-  } = {}) {
-    this.id = id;
-    this.name = name;
-    this.productId = productId;
-    this.productOptions = productOptions;
-    this.currency = currency;
-    this.currencySign = currencySign;
-    this.pricing = pricing;
-    this.recurringInterval = recurringInterval;
-    this.trial = trial;
-    this.isTrialOnly = isTrialOnly;
-    this.setup = setup;
-    this.customFields = customFields;
-    this.createdTime = createdTime;
-    this.updatedTime = updatedTime;
-    this.invoiceTimeShift = invoiceTimeShift;
-  }
-}
+import BaseModel from './base-model';
+
+export default class PlanModel extends BaseModel {}

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

@@ -1,23 +1,3 @@
-export default class ProductModel {
-  constructor({
-    id = '',
-    name = '',
-    unitLabel = '',
-    description = {},
-    requiresShipping = false,
-    options = [],
-    customFields = {},
-    createdTime = '',
-    updatedTime = ''
-  } = {}) {
-    this.id = id;
-    this.name = name;
-    this.unitLabel = unitLabel;
-    this.description = description;
-    this.requiresShipping = requiresShipping;
-    this.options = options;
-    this.customFields = customFields;
-    this.createdTime = createdTime;
-    this.updatedTime = updatedTime;
-  }
-}
+import BaseModel from './base-model';
+
+export default class ProductModel extends BaseModel {}

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

@@ -1,35 +1,28 @@
-export class SummaryLineItemModel {
+import BaseModel from './base-model';
+
+export class SummaryLineItemModel extends BaseModel {
   constructor({
-    type = '',
-    description = '',
     unitPrice = 0.0,
     quantity = 0,
     price = 0.0,
-    planId = '',
-    productId = ''
+    ...fields
   } = {}) {
-    this.type = type;
-    this.description = description;
+    super(fields);
     this.unitPrice = unitPrice;
     this.quantity = quantity;
     this.price = price;
-    this.planId = planId;
-    this.productId = productId;
   }
 }
 
-export class SummaryTaxModel {
-  constructor({ amount = '', description = '' } = {}) {
-    this.amount = amount;
-    this.description = description;
-  }
-}
+export class SummaryTaxModel extends BaseModel {}
 
-export class SummaryDiscountModel {
-  constructor({ couponId = '', amount = 0, description = '' } = {}) {
-    this.couponId = couponId;
+export class SummaryDiscountModel extends BaseModel {
+  constructor({
+    amount = 0,
+    ...fields
+  }) {
+    super(fields);
     this.amount = amount;
-    this.description = description;
   }
 }
 

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

@@ -0,0 +1,19 @@
+import BaseModel from './base-model';
+
+export default class TransactionModel extends BaseModel {
+  constructor({
+    invoiceIds = [],
+    ...fields
+  }) {
+    super(fields);
+    this.invoiceIds = invoiceIds || [];
+  }
+
+  get invoiceId () {
+    return this.invoiceIds[0] || null;
+  }
+
+  get hasInvoice () {
+      return !!this.invoiceId;
+  }
+}

package/src/storefront/payment-instruments.js

@@ -0,0 +1,30 @@
+import { Endpoint } from './index';
+
+export async function setupPaymentInstrument({ data, state }) {
+  return Endpoint({state}, async () => {
+    // Create payment instrument
+    const { fields: instrument }  = await state.storefront.paymentInstruments.create({data});
+
+    // Setup the payment instrument
+    state.storefront.setSessionToken(instrument.token);
+
+    const setupPayload = {
+      id: instrument.id,
+      data: {
+        websiteId: state.options.websiteId,
+        ...data
+      }
+    }
+
+    if(state.data.getAmountAndCurrency) {
+      setupPayload.data = {
+        ...setupPayload.data,
+        ...state.data.getAmountAndCurrency
+      }
+    }
+
+    const { fields: transaction } = await state.storefront.paymentInstruments.setup(setupPayload);
+
+    return {instrument, transaction};
+  });
+}

package/src/storefront/payment-instruments.spec.js

@@ -0,0 +1,69 @@
+import { StorefontTestingInstance } from 'tests/mocks/storefront-mock';
+import { ok, post } from 'msw-when-then';
+import { when } from 'tests/msw/server';
+import { storefrontURL } from 'tests/mocks/storefront-api-mock';
+
+describe('Storefront API Setup', () => {
+  it('can make purchase', async () => {
+    const instance = new StorefontTestingInstance();
+
+    const paymentInstrumentFields = {
+      id: 'payment-instrument-id'
+    };
+
+    const paymentInstrumentSetupFields = {
+      id: 'payment-instrument-id',
+      approvalUrl: null
+    };
+
+    const paymentInstrumentPayload = {
+      data: {
+        token: 'test-token'
+      }
+    };
+
+    const paymentInstrumentSetupPayload = {
+      id: paymentInstrumentFields.id,
+      data: {
+        websiteId: 'website-id',
+        currency: 'USD',
+        amount: 30
+      }
+    };
+
+    when(post(`${storefrontURL}/payment-instruments`)).thenReturn(ok(paymentInstrumentFields));
+    when(post(`${storefrontURL}/payment-instruments/*/setup`)).thenReturn(ok(paymentInstrumentSetupFields));
+
+
+    jest.spyOn(instance.storefront.paymentInstruments, 'create');
+    jest.spyOn(instance.storefront.paymentInstruments, 'setup');
+
+    const paymentInstrumentResponse = await instance.storefront.paymentInstruments.create(
+      paymentInstrumentPayload
+    );
+
+    const paymentInstrumentSetupResponse = await instance.storefront.paymentInstruments.setup(
+      paymentInstrumentSetupPayload
+    );
+
+    expect(instance.storefront.paymentInstruments.create).toBeCalledTimes(1);
+    expect(instance.storefront.paymentInstruments.create).toBeCalledWith(paymentInstrumentPayload);
+
+    expect(instance.storefront.paymentInstruments.setup).toBeCalledTimes(1);
+    expect(instance.storefront.paymentInstruments.setup).toBeCalledWith(paymentInstrumentSetupPayload);
+
+    expect(paymentInstrumentResponse.config).toBeInstanceOf(Object);
+    expect(paymentInstrumentResponse.fields).toBeInstanceOf(Object);
+    expect(paymentInstrumentResponse.response).toBeInstanceOf(Object);
+
+    expect(paymentInstrumentResponse.fields).toEqual(paymentInstrumentFields);
+    expect(paymentInstrumentResponse.fields).toMatchObject(paymentInstrumentFields);
+
+    expect(paymentInstrumentSetupResponse.config).toBeInstanceOf(Object);
+    expect(paymentInstrumentSetupResponse.fields).toBeInstanceOf(Object);
+    expect(paymentInstrumentSetupResponse.response).toBeInstanceOf(Object);
+
+    expect(paymentInstrumentSetupResponse.fields).toEqual(paymentInstrumentSetupFields);
+    expect(paymentInstrumentSetupResponse.fields).toMatchObject(paymentInstrumentSetupFields);
+  });
+});

package/src/storefront/plans.js

@@ -1,24 +1,15 @@
 import PlanModel from './models/plan-model';
+import { Endpoint } from './index';
 
-export async function fetchPlans({ data = null, state = null }) {
-  if (!state.storefront) {
-    throw new Error('Could not access rebilly-js-sdk instance');
-  }
-
-  if (!state.options) {
-    throw new Error(
-      'Could not use Rebilly Instruments mount options to fetch Rebilly data'
-    );
-  }
-
-  try {
-    const { lineItems } = data || {};
+export async function fetchPlans({ state = {}, data = {} }) {
+  return Endpoint({state}, async () => {
+    const lineItems = data.lineItems || state.data.summaryLineItems;
 
     const filterByPlanId = {
       filter: ''
     };
 
-    if (lineItems) {
+    if (lineItems.length) {
       filterByPlanId.filter = `id:${lineItems
         .map((item) => item.planId)
         .join(',')}`;
@@ -28,7 +19,5 @@ export async function fetchPlans({ data = null, state = null }) {
       filterByPlanId
     );
     return planItems.map(({ fields }) => new PlanModel(fields));
-  } catch (error) {
-    throw error;
-  }
+  });
 }

package/src/storefront/plans.spec.js

@@ -1,4 +1,4 @@
-import { MockStorefront } from 'tests/mocks/storefront-mock';
+import { StorefontTestingInstance } from 'tests/mocks/storefront-mock';
 import { ok, get } from 'msw-when-then';
 import { when } from 'tests/msw/server';
 import { storefrontURL } from 'tests/mocks/storefront-api-mock';
@@ -7,19 +7,12 @@ import PlanModel from './models/plan-model';
 import { expectConfigurationError } from 'tests/async-utilities';
 
 describe('Storefront API Plan', () => {
-  class TestPlansInstance {
-    constructor({ options = {} } = {}) {
-      this.options = options;
-      this.storefront = MockStorefront();
-    }
-  }
-
   it('can fetch plans', async () => {
     const testPlan = { name: 'Test Plan', id: 'test-plan-id-1' };
 
     when(get(`${storefrontURL}/plans`)).thenReturn(ok([testPlan]));
 
-    const instance = new TestPlansInstance();
+    const instance = new StorefontTestingInstance();
 
     jest.spyOn(instance.storefront.plans, 'getAll');
 
@@ -35,7 +28,7 @@ describe('Storefront API Plan', () => {
   });
 
   it('can fetch plans with filter', async () => {
-    const instance = new TestPlansInstance();
+    const instance = new StorefontTestingInstance();
 
     jest.spyOn(instance.storefront.plans, 'getAll');
 
@@ -59,7 +52,7 @@ describe('Storefront API Plan', () => {
   });
 
   it('should throw errors with no options', async () => {
-    const noConfigOrOptionsInstance = new TestPlansInstance({
+    const noConfigOrOptionsInstance = new StorefontTestingInstance({
       options: null
     });
     await expectConfigurationError(

package/src/storefront/products.js

@@ -1,19 +1,13 @@
 import ProductModel from './models/product-model';
+import { Endpoint } from './index';
 
-export async function fetchProducts({ data = null, state }) {
-  if (!state.storefront) {
-    throw new Error('Could not access rebilly-js-sdk instance');
-  }
-
-  if (!state.options) {
-    throw new Error(
-      'Could not use Rebilly Instruments mount options to fetch Rebilly data'
-    );
-  }
-
-  try {
-    const plansData = data || [];
+export async function fetchProducts({ state }) {
+  return Endpoint({state}, async () => {
+    if (state.data.plans === null) {
+      return null;
+    }
 
+    const plansData = state.data.plans || [];
     const filterByProductId = {
       filter: ''
     };
@@ -28,7 +22,5 @@ export async function fetchProducts({ data = null, state }) {
       filterByProductId
     );
     return productItems.map(({ fields }) => new ProductModel(fields));
-  } catch (error) {
-    throw error;
-  }
+  });
 }

package/src/storefront/products.spec.js

@@ -1,4 +1,4 @@
-import { MockStorefront } from 'tests/mocks/storefront-mock';
+import { StorefontTestingInstance } from 'tests/mocks/storefront-mock';
 import { ok, get } from 'msw-when-then';
 import { when } from 'tests/msw/server';
 import { storefrontURL } from 'tests/mocks/storefront-api-mock';
@@ -7,19 +7,12 @@ import ProductModel from './models/product-model';
 import { expectConfigurationError } from 'tests/async-utilities';
 
 describe('Storefront API Plan', () => {
-  class TestProductsInstance {
-    constructor({ options = {} } = {}) {
-      this.options = options;
-      this.storefront = MockStorefront();
-    }
-  }
-
   it('can fetch products', async () => {
     const testProduct = { name: 'Test Product', id: 'test-product-id-1' };
 
     when(get(`${storefrontURL}/products`)).thenReturn(ok([testProduct]));
 
-    const instance = new TestProductsInstance();
+    const instance = new StorefontTestingInstance();
 
     jest.spyOn(instance.storefront.products, 'getAll');
 
@@ -35,21 +28,22 @@ describe('Storefront API Plan', () => {
   });
 
   it('can fetch products with filter', async () => {
-    const instance = new TestProductsInstance();
+    const instance = new StorefontTestingInstance({
+      data: {
+        plans: [
+          {
+            productId: 'test-product-1'
+          },
+          {
+            productId: 'test-product-2'
+          }
+        ]
+      }
+    });
 
     jest.spyOn(instance.storefront.products, 'getAll');
 
-    await fetchProducts({
-      state: instance,
-      data: [
-        {
-          productId: 'test-product-1'
-        },
-        {
-          productId: 'test-product-2'
-        }
-      ]
-    });
+    await fetchProducts({ state: instance });
 
     expect(instance.storefront.products.getAll).toBeCalledWith({
       filter: 'id:test-product-1,test-product-2'
@@ -57,7 +51,7 @@ describe('Storefront API Plan', () => {
   });
 
   it('should throw errors with no options', async () => {
-    const noConfigOrOptionsInstance = new TestProductsInstance({
+    const noConfigOrOptionsInstance = new StorefontTestingInstance({
       options: null
     });
     await expectConfigurationError(

package/src/storefront/purchase.js

@@ -1,21 +1,19 @@
-export async function postPurchase({ data, state }) {
-  if (!state.storefront) {
-    throw new Error('Could not access rebilly-js-sdk instance');
-  }
-
-  if (!state.options) {
-    throw new Error(
-      'Could not use Rebilly Instruments mount options to fetch Rebilly data'
-    );
-  }
+import { Endpoint } from './index';
 
-  try {
+export async function postPurchase({ data, state }) {
+  return Endpoint({state}, async () => {
     if (data._raw) {
       delete data._raw;
     }
-    const resp = await state.storefront.purchase.purchase({ data });
-    return resp;
-  } catch (error) {
-    throw error;
-  }
+    return state.storefront.purchase.purchase({ data });
+  });
 }
+
+export async function postPayment({ data, state }) {
+  return Endpoint({state}, async () => {
+    if (data._raw) {
+      delete data._raw;
+    }
+    return state.storefront.purchase.payment({ data });
+  });
+}

package/src/storefront/purchase.spec.js

@@ -1,23 +1,11 @@
-import { MockStorefront } from 'tests/mocks/storefront-mock';
+import { StorefontTestingInstance } from 'tests/mocks/storefront-mock';
 import { ok, post } from 'msw-when-then';
 import { when } from 'tests/msw/server';
 import { storefrontURL } from 'tests/mocks/storefront-api-mock';
-import { postPurchase } from './purchase';
 
 describe('Storefront API Purchase', () => {
-  class TestPurchaseInstance {
-    constructor({ options = {} } = {}) {
-      this.options = options;
-      this.storefront = MockStorefront();
-    }
-
-    postPurchase(...args) {
-      return postPurchase({ state: this, data: args });
-    }
-  }
-
   it('can make purchase', async () => {
-    const instance = new TestPurchaseInstance();
+    const instance = StorefontTestingInstance();
     const payload = {
       websiteId: 'test-website-id',
       items: [

package/src/storefront/ready-to-pay.js

@@ -1,31 +1,30 @@
 import { collectData } from '@rebilly/risk-data-collector';
 import ReadyToPayModel from './models/ready-to-pay-model';
+import { Endpoint } from './index';
 
 export async function fetchReadyToPay({ state, riskMetadata = null }) {
-  if (!state.storefront) {
-    throw new Error('Could not access rebilly-js-sdk instance');
-  }
-
-  if (!state.options) {
-    throw new Error(
-      'Could not use Rebilly Instruments mount options to fetch Rebilly data'
-    );
-  }
-
-  try {
+  return Endpoint({state}, async () => {
     if (!riskMetadata) {
       const { riskMetadata: data } = await collectData();
       riskMetadata = data;
     }
     const websiteId = state.options?.websiteId || null;
-    const items = state.options?.items || [];
 
     const data = {
-      items,
       websiteId,
       riskMetadata
     };
 
+    if (state.options?.items) {
+      data.items = state.options.items;
+    }
+
+    if (state.data?.amountAndCurrency) {
+      const money = state.data.amountAndCurrency;
+      data.amount = money.amount;
+      data.currency = money.currency;
+    }
+
     const { fields: readyToPayFields } =
       await state.storefront.purchase.readyToPay({ data });
 
@@ -36,7 +35,5 @@ export async function fetchReadyToPay({ state, riskMetadata = null }) {
           ...fields
         })
     );
-  } catch (error) {
-    throw error;
-  }
+  });
 }