@@ -115,7 +126,14 @@ BookingBreakdownComponent.defaultProps = {
commission: null,
};
-const { string, instanceOf } = PropTypes;
+const { string, instanceOf, arrayOf, oneOf, shape } = PropTypes;
+
+const lineItem = shape({
+ code: string.isRequired,
+ quantity: instanceOf(Decimal),
+ unitPrice: propTypes.money,
+ lineTotal: propTypes.money,
+});
BookingBreakdownComponent.propTypes = {
rootClassName: string,
@@ -123,10 +141,10 @@ BookingBreakdownComponent.propTypes = {
bookingStart: instanceOf(Date).isRequired,
bookingEnd: instanceOf(Date).isRequired,
-
- unitPrice: propTypes.money.isRequired,
- totalPrice: propTypes.money.isRequired,
- commission: propTypes.money,
+ lineItems: arrayOf(lineItem).isRequired,
+ userRole: oneOf(['customer', 'provider']).isRequired,
+ payinTotal: propTypes.money.isRequired,
+ payoutTotal: propTypes.money.isRequired,
// from injectIntl
intl: intlShape.isRequired,
diff --git a/src/components/OrderDetailsPanel/OrderDetailsPanel.js b/src/components/OrderDetailsPanel/OrderDetailsPanel.js
index 34c5b315..4f0006c5 100644
--- a/src/components/OrderDetailsPanel/OrderDetailsPanel.js
+++ b/src/components/OrderDetailsPanel/OrderDetailsPanel.js
@@ -10,14 +10,14 @@ import css from './OrderDetailsPanel.css';
const breakdown = transaction => {
const tx = ensureTransaction(transaction);
- const listing = ensureListing(tx.listing);
const booking = ensureBooking(tx.booking);
const bookingStart = booking.attributes.start;
const bookingEnd = booking.attributes.end;
- const unitPrice = listing.attributes.price;
- const totalPrice = tx.attributes.payinTotal;
+ const payinTotal = tx.attributes.payinTotal;
+ const payoutTotal = tx.attributes.payoutTotal;
+ const lineItems = tx.attributes.lineItems;
- if (!bookingStart || !bookingEnd || !unitPrice || !totalPrice) {
+ if (!bookingStart || !bookingEnd || !payinTotal || !payoutTotal || !lineItems) {
return null;
}
return (
@@ -25,8 +25,10 @@ const breakdown = transaction => {
className={css.receipt}
bookingStart={bookingStart}
bookingEnd={bookingEnd}
- unitPrice={unitPrice}
- totalPrice={totalPrice}
+ payinTotal={payinTotal}
+ payoutTotal={payoutTotal}
+ lineItems={lineItems}
+ userRole="customer"
/>
);
};
diff --git a/src/components/SaleDetailsPanel/SaleDetailsPanel.js b/src/components/SaleDetailsPanel/SaleDetailsPanel.js
index 6a6968d4..8c0a740d 100644
--- a/src/components/SaleDetailsPanel/SaleDetailsPanel.js
+++ b/src/components/SaleDetailsPanel/SaleDetailsPanel.js
@@ -1,59 +1,35 @@
import React, { PropTypes } from 'react';
import { FormattedDate, FormattedMessage } from 'react-intl';
-import Decimal from 'decimal.js';
import classNames from 'classnames';
import * as propTypes from '../../util/propTypes';
-import { types } from '../../util/sdkLoader';
import { createSlug } from '../../util/urlHelpers';
import { ensureListing, ensureTransaction, ensureBooking, ensureUser } from '../../util/data';
-import { convertMoneyToNumber, convertUnitToSubUnit } from '../../util/currency';
-import config from '../../config';
import { Avatar, BookingBreakdown, NamedLink } from '../../components';
import css from './SaleDetailsPanel.css';
-// TODO: This is a temporary function to calculate the booking
-// price. This should be removed when the API supports dry-runs and we
-// can take the total price from the transaction itself.
-const estimatedCommission = (customerTotalPrice, providerTotalPrice) => {
- const { subUnitDivisor, currency } = config.currencyConfig;
- if (customerTotalPrice.currency !== currency || providerTotalPrice.currency !== currency) {
- throw new Error('Transaction total or commission currency does not match marketplace currency');
- }
-
- const numericCustomerTotalPrice = convertMoneyToNumber(customerTotalPrice, subUnitDivisor);
- const numericProviderTotalPrice = convertMoneyToNumber(providerTotalPrice, subUnitDivisor);
- const numericCommission = new Decimal(numericProviderTotalPrice)
- .minus(numericCustomerTotalPrice)
- .toNumber();
-
- return new types.Money(convertUnitToSubUnit(numericCommission, subUnitDivisor), currency);
-};
-
const breakdown = transaction => {
const tx = ensureTransaction(transaction);
- const listing = ensureListing(tx.listing);
const booking = ensureBooking(tx.booking);
const bookingStart = booking.attributes.start;
const bookingEnd = booking.attributes.end;
- const unitPrice = listing.attributes.price;
- const customerTotalPrice = tx.attributes.payinTotal;
- const providerTotalPrice = tx.attributes.payoutTotal;
+ const payinTotal = tx.attributes.payinTotal;
+ const payoutTotal = tx.attributes.payoutTotal;
+ const lineItems = tx.attributes.lineItems;
- if (!bookingStart || !bookingEnd || !unitPrice || !customerTotalPrice || !providerTotalPrice) {
+ if (!bookingStart || !bookingEnd || !payinTotal || !payoutTotal || !lineItems) {
return null;
}
- const commission = estimatedCommission(customerTotalPrice, providerTotalPrice);
-
return (
);
};
diff --git a/src/index.js b/src/index.js
index a82c6210..b4fc1b9a 100644
--- a/src/index.js
+++ b/src/index.js
@@ -13,6 +13,7 @@
import React from 'react';
import ReactDOM from 'react-dom';
+import Decimal from 'decimal.js';
import { createInstance, types } from './util/sdkLoader';
import { ClientApp, renderApp } from './app';
import configureStore from './store';
@@ -25,6 +26,8 @@ import routeConfiguration from './routesConfiguration';
import './marketplace.css';
+const { BigDecimal } = types;
+
const render = store => {
// If the server already loaded the auth information, render the app
// immediately. Otherwise wait for the flag to be loaded and render
@@ -54,7 +57,18 @@ if (typeof window !== 'undefined') {
// eslint-disable-next-line no-underscore-dangle
const preloadedState = window.__PRELOADED_STATE__ || '{}';
const initialState = JSON.parse(preloadedState, types.reviver);
- const sdk = createInstance({ clientId: config.sdk.clientId, baseUrl: config.sdk.baseUrl });
+ const sdk = createInstance({
+ clientId: config.sdk.clientId,
+ baseUrl: config.sdk.baseUrl,
+ typeHandlers: [
+ {
+ type: BigDecimal,
+ customType: Decimal,
+ writer: v => new BigDecimal(v.toString()),
+ reader: v => new Decimal(v.value),
+ },
+ ],
+ });
const store = configureStore(sdk, initialState);
setupStripe();