Update currency config

CHANGELOG.md

@@ -14,6 +14,8 @@ way to update this template, but currently, we follow a pattern:
 
 ## Upcoming version 2019-XX-XX
 
+- [add] Added NZD and HKD subunit divisors and refactored currency configuration.
+  [#1063](https://github.com/sharetribe/flex-template-web/pull/1063)
 - [add] Add support for arbitrary line items.
   [#1062](https://github.com/sharetribe/flex-template-web/pull/1062)
 - [fix] US individual accounts had a non-editable business url in PayoutDetailsForm. It was probably

src/config.js

@@ -1,6 +1,7 @@
 import * as custom from './marketplace-custom-config.js';
 import defaultLocationSearches from './default-location-searches';
 import { stripePublishableKey, stripeSupportedCountries } from './stripe-config';
+import { currencyConfiguration } from './currency-config';
 
 const env = process.env.REACT_APP_ENV;
 const dev = process.env.REACT_APP_ENV === 'development';
@@ -59,6 +60,10 @@ const sdkTransitVerbose = process.env.REACT_APP_SHARETRIBE_SDK_TRANSIT_VERBOSE =
 
 const currency = process.env.REACT_APP_SHARETRIBE_MARKETPLACE_CURRENCY;
 
+// Currency formatting options.
+// See: https://github.com/yahoo/react-intl/wiki/API#formatnumber
+const currencyConfig = currencyConfiguration(currency);
+
 // Listing minimum price in currency sub units, e.g. cents.
 // 0 means no restriction to the price
 const listingMinimumPriceSubUnits = 0;
@@ -69,21 +74,6 @@ const sentryDsn = process.env.REACT_APP_SENTRY_DSN;
 // If webapp is using SSL (i.e. it's behind 'https' protocol)
 const usingSSL = process.env.REACT_APP_SHARETRIBE_USING_SSL === 'true';
 
-// Currency formatting options.
-// See: https://github.com/yahoo/react-intl/wiki/API#formatnumber
-//
-// TODO: Remove this and hide formating within the util/currency module
-const currencyConfig = {
-  style: 'currency',
-  currency,
-  currencyDisplay: 'symbol',
-  useGrouping: true,
-  // Note: you should change fraction digits to 0,
-  //       if the currency is not using subunits (like JPY).
-  minimumFractionDigits: 2,
-  maximumFractionDigits: 2,
-};
-
 // Address information is used in SEO schema for Organization (http://schema.org/PostalAddress)
 const addressCountry = 'FI';
 const addressRegion = 'Helsinki';
@@ -205,8 +195,8 @@ const config = {
   },
   sortSearchByDistance,
   currency,
-  listingMinimumPriceSubUnits,
   currencyConfig,
+  listingMinimumPriceSubUnits,
   stripe: {
     publishableKey: stripePublishableKey,
     supportedCountries: stripeSupportedCountries,

src/currency-config.js

@@ -0,0 +1,47 @@
+// See: https://en.wikipedia.org/wiki/ISO_4217
+// See: https://stripe.com/docs/currencies
+export const subUnitDivisors = {
+  AUD: 100,
+  CAD: 100,
+  CHF: 100,
+  CNY: 100,
+  DKK: 100,
+  EUR: 100,
+  GBP: 100,
+  HKD: 100,
+  INR: 100,
+  JPY: 1,
+  MXN: 100,
+  NOK: 100,
+  NZD: 100,
+  SEK: 100,
+  SGD: 100,
+  USD: 100,
+};
+
+// Currency formatting options.
+// See: https://github.com/yahoo/react-intl/wiki/API#formatnumber
+export const currencyConfiguration = currency => {
+  if (!subUnitDivisors[currency]) {
+    throw new Error(`Configuration missing for currency: ${currency}.`);
+  }
+
+  return subUnitDivisors[currency] === 1
+    ? {
+        style: 'currency',
+        currency,
+        currencyDisplay: 'symbol',
+        useGrouping: true,
+        // If the currency is not using subunits (like JPY), remove fractions.
+        minimumFractionDigits: 0,
+        maximumFractionDigits: 0,
+      }
+    : {
+        style: 'currency',
+        currency,
+        currencyDisplay: 'symbol',
+        useGrouping: true,
+        minimumFractionDigits: 2,
+        maximumFractionDigits: 2,
+      };
+};

src/util/currency.js

@@ -2,7 +2,7 @@ import has from 'lodash/has';
 import trimEnd from 'lodash/trimEnd';
 import Decimal from 'decimal.js';
 import { types as sdkTypes } from './sdkLoader';
-import { subUnitDivisors } from './currencyConfig';
+import { subUnitDivisors } from '../currency-config';
 
 const { Money } = sdkTypes;