🌐 Translate JS dates & propose utility for d3 locale

src/common/utilities.js

@@ -397,7 +397,7 @@ export function makeNiceDate (datetime) {
   if (datetime === null) return null
   // see https://stackoverflow.com/questions/3552461/how-to-format-a-javascript-date
   const dateTimeFormat = new Intl.DateTimeFormat(
-    'en',
+    process.env.store.app.language,
     { year: 'numeric', month: 'long', day: '2-digit' }
   )
   const [
@@ -406,5 +406,19 @@ export function makeNiceDate (datetime) {
     { value: year }
   ] = dateTimeFormat.formatToParts(datetime)
 
-  return `${day} ${month} ${year}`
+  return `${day} ${month}, ${year}`
 }
+
+/**
+ * Sets the default locale for d3 to format dates in each available language.
+ * @param {Object} d3 - An instance of D3
+ */
+export function setD3Locale(d3) {
+  const languages = {
+    'es-MX': require('./data/es-MX.json')
+  }
+
+  if (process.env.store.app.language !== 'es-US' && languages[process.env.store.app.language]) {
+    d3.timeFormatDefaultLocale(languages[process.env.store.app.language]);
+  }
+}

src/components/TimelineAxis.jsx

@@ -1,8 +1,9 @@
 import React from 'react'
 import * as d3 from 'd3'
+import { setD3Locale } from '../common/utilities';
 
 const TEXT_HEIGHT = 15
-
+setD3Locale(d3);
 class TimelineAxis extends React.Component {
   constructor () {
     super()