Add new format money with commas to presenters (#485)

https://eaflood.atlassian.net/browse/WATER-4155

To support our work on building a new bill page we need to display money values to the user in the UI for the first time. We've done stuff in our API endpoints before hence we have `formatNumberAsMoney()` in `app/presenters/base.presenter.js`.

But this will only take numbers like `1599.4` and `15350` and ensure they have 2 decimal places; `1599.40` and `15350.00`. For the UI we need to be _even fancier_!

In the UI we need to delineate the hundreds and thousands i.e. stick in commas. So, using our examples we need to display them as `1,599.40` and `15,350.00`.

The legacy [water-abstraction-ui](https://github.com/DEFRA/water-abstraction-ui) of course does this with a package because you can never have too many! 😜 [comma-number](https://github.com/elidoran/comma-number) if you are interested.

But as with most things we can do this with just the tools Node.js and JavaScript provides. So, this change adds a new `formatNumberAsMoneyWithCommas()` function to our base presenter to do the same thing.

app/presenters/base.presenter.js

@@ -129,6 +129,22 @@ function formatNumberAsMoney (value, includeSymbol = false) {
   return `${symbol}${value.toFixed(2)}`
 }
 
+/**
+ * Formats a number which represents a value in pounds as a money string with commas, for example, 2889 as '2,889.00'
+ *
+ * > Credit to https://stackoverflow.com/a/32154217/6117745
+ *
+ * @param {Number} value The value to display as currency. Assumed to be in pounds
+ * @param {Boolean} includeSymbol Whether to add the £ symbol to the start of the returned string
+ *
+ * @returns {string} The value formatted as a money string with commas with optional currency symbol
+ */
+function formatNumberAsMoneyWithCommas (value, includeSymbol = false) {
+  const symbol = includeSymbol ? '£' : ''
+
+  return `${symbol}${value.toLocaleString('en-GB', { minimumFractionDigits: 2 })}`
+}
+
 /**
  * Pads a number to a given length with leading zeroes and returns the result as a string
  *
@@ -152,5 +168,6 @@ module.exports = {
   formatLongDate,
   formatLongDateTime,
   formatNumberAsMoney,
+  formatNumberAsMoneyWithCommas,
   leftPadZeroes
 }

test/presenters/base.presenter.test.js

@@ -167,25 +167,45 @@ describe('Base presenter', () => {
   })
 
   describe('#formatNumberAsMoney()', () => {
-    const valueInPence = 1149.5
+    const valueInPounds = 1149.5
 
     describe('when no £ symbol is requested', () => {
       it('correctly returns the value as a money string with no symbol, for example, 1149.50', async () => {
-        const result = BasePresenter.formatNumberAsMoney(valueInPence)
+        const result = BasePresenter.formatNumberAsMoney(valueInPounds)
 
         expect(result).to.equal('1149.50')
       })
     })
 
     describe('when the £ symbol is requested', () => {
       it('correctly returns the value as a money string with a symbol, for example, £1149.50', async () => {
-        const result = BasePresenter.formatNumberAsMoney(valueInPence, true)
+        const result = BasePresenter.formatNumberAsMoney(valueInPounds, true)
 
         expect(result).to.equal('£1149.50')
       })
     })
   })
 
+  describe('#formatNumberAsMoneyWithCommas()', () => {
+    const valueInPounds = 1149.5
+
+    describe('when no £ symbol is requested', () => {
+      it('correctly returns the value as a money string with commas and no symbol, for example, 1,149.50', async () => {
+        const result = BasePresenter.formatNumberAsMoneyWithCommas(valueInPounds)
+
+        expect(result).to.equal('1,149.50')
+      })
+    })
+
+    describe('when the £ symbol is requested', () => {
+      it('correctly returns the value as a money string with commas and a symbol, for example, £1,149.50', async () => {
+        const result = BasePresenter.formatNumberAsMoneyWithCommas(valueInPounds, true)
+
+        expect(result).to.equal('£1,149.50')
+      })
+    })
+  })
+
   describe('#leftPadZeroes()', () => {
     it('correctly pads numbers', async () => {
       const number = 123