add internationalization tooling

contributor_docs/internationalization.md

@@ -82,6 +82,8 @@ The easiest way to do this is to add your language code (like "de" for German, "
 
 This will generate you a fresh translations file in `translations/{LANGUAGE_CODE}/`! Now you can begin populating it with your fresh translations! 🥖
 
+You'll also need to add an entry for it in `translations/index.js`. You can follow the pattern used in that file for `en` and `es`.
+
 ### Further Reading
 
 See the [i18next translation function documentation](https://www.i18next.com/translation-function/essentials). Everything documented above is just a subset of their functionality.

src/core/init.js

@@ -44,6 +44,6 @@ const waitForDocumentReady = () =>
 
 // only load translations if we're using the full, un-minified library
 const waitingForTranslator =
-  typeof IS_MINIFIED === undefined ? initTranslator() : Promise.resolve();
+  typeof IS_MINIFIED === 'undefined' ? initTranslator() : Promise.resolve();
 
 Promise.all([waitForDocumentReady(), waitingForTranslator]).then(_globalInit);

src/core/internationalization.js

@@ -31,6 +31,12 @@ export const initialize = () =>
         nestingPrefix: '$tr(',
         nestingSuffix: ')',
         defaultNS: 'translation',
+        interpolation: {
+          escapeValue: false
+        },
+        detection: {
+          checkWhitelist: false
+        },
         resources
       })
       .then(

translations/es/translation.json

@@ -1,6 +1,6 @@
 {
   "fes": {
-    "autoplay": "",
+    "autoplay": "Su browser impidío un medio tocar (de '{{src}}'), posiblemente porque las reglas de autoplay. Para aprender más, visite {{link}}.",
     "fileLoadError": {
       "bytes": "",
       "font": "",