Plans: add support for client-side currency formatting

[gwwar]

This PR adds a currency-formatter library currency formatting library which gives us the ability to display money properly on the client. This is to accommodate for cases where we have raw pricing data, but the server formatted price is too limiting for our use case. This comes up in monthly pricing, or when we wish to wrap markup around things like the currency symbol for a prettier display.

~~As to why I've pulled in another dependency for this:

1. number.toLocaleString is unsupported in Safari, and has inconsistent browser results
2. currency display has a number of edge cases and at least warrants its own lib module.
   If we think the dependency is too large, I'd be open to writing a similar one from scratch.~~

I've also updated the plans-features component to use the currency formatter as an advanced example.

Testing Instructions

• No functional changes to Calypso
• Navigate to http://calypso.localhost:3000/devdocs/app-components/plan-features
• Select Different Currencies, plan price display looks correct
• Tests Pass

cc @lamosty @dmsnell @rralian @retrofox

Test live: https://calypso.live/?branch=try/currency-formatter

[dmsnell]

This format doesn't look right. It's missing some .s

9.800.900,32€

[gwwar]

This depends on the country, some will use spaces for the thousand separator. We can still update the default here. https://docs.oracle.com/cd/E19455-01/806-0169/overview-9/index.html

[aduth]

options.code should be documented?

[gwwar]

Updated in b7b2d14

[gwwar]

Unfortunately, interpolated components is not available as a main dependency. I'll look into writing our own currency formatter that gives us more detailed information.

[dmsnell]

Please don't feel like I'm trying to be critical - this is just a style note related to L41 below, but you can avoid the Object.assign() here too. This is just my personal preference and nothing more 😄

return formatter.format( number, { symbol, thousand: thousandsSeparator, ...options } );

If you put ...options first, then if it has symbol or thousand properties they will be overwritten.

/me ❤️ the spread operator

[gwwar]

I've also renamed the util lib from currency-formatter to format-currency, since I don't actually return a formatter object.

[lamosty]

To be honest, this looks rather strange and complicated. I liked your previous solution better. It was more readable. But that's just my opinion and this is a minor detail. :)

[gwwar]

Yeah I think an existential operator would read better, but it basically boils down to fetch plan.raw_price if possible, otherwise default to -1.

https://lodash.com/docs#get

[lamosty]

I see. My point is that a programmer who didn't read the lodash docs or is not super familiar with get won't be able to parse this line quickly. Or to phrase it differently: I did not understand it at first sight, only after going through the lodash docs. :)

[lamosty]

Let's 🚢 this.

[gwwar]

Thanks for the reviews @lamosty @dmsnell @aduth !