Commit 1e4b8f9

mo <mo.khan@gmail.com>
2018-09-09 15:54:13
make translations available to js.
1 parent aa05d11
Changed files (6)
app/javascript/i18n.js
@@ -0,0 +1,16 @@
+import translations from './translations.json'; /* eslint-disable-line import/no-unresolved */
+
+export default class {
+  translate(key) {
+    return this.constructor.translate(key);
+  }
+
+  static translate(key) {
+    return translations[this.locale][key];
+  }
+
+  static get locale() {
+    const html = document.querySelector('html');
+    return html.getAttribute('lang') || 'en';
+  }
+}
app/views/layouts/application.html.erb
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="<%= I18n.locale %>">
   <head>
     <title>Proof</title>
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
config/webpack/environment.js
@@ -1,6 +1,13 @@
 const { environment } = require('@rails/webpacker')
+const RailsTranslationsPlugin = require("rails-translations-webpack-plugin");
+const path = require('path');
 const webpack = require('webpack')
 
+environment.loaders.append('json', { test: /\.json$/, use: ['json-loader'] });
+environment.plugins.prepend('RailsTranslationsPlugin', new RailsTranslationsPlugin({
+  localesPath: path.resolve(__dirname, "../locales/"),
+  root: './app/javascript'
+}))
 environment.plugins.append(
   'Provide',
   new webpack.ProvidePlugin({
spec/javascripts/i18n.spec.js
@@ -0,0 +1,12 @@
+import I18n from '../../app/javascript/i18n.js';
+
+describe("I18n", () => {
+  describe(".translate", () => {
+    const subject = I18n;
+
+    it("returns the correct translations for a nested value", () => {
+      const result = subject.translate('application.navbar.home')
+      expect(result).toEqual('Home')
+    });
+  });
+});
package.json
@@ -10,8 +10,10 @@
     "@rails/webpacker": "3.4",
     "bootstrap": "^4.0.0",
     "jquery": "^3.3.1",
+    "json-loader": "^0.5.7",
     "popper.js": "^1.14.3",
     "qrcode": "^1.2.0",
+    "rails-translations-webpack-plugin": "^1.1.0",
     "stimulus": "^1.0.1"
   },
   "devDependencies": {
yarn.lock
@@ -3912,7 +3912,7 @@ jsesc@~0.5.0:
   version "0.5.0"
   resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-0.5.0.tgz#e7dee66e35d6fc16f710fe91d5cf69f70f08911d"
 
-json-loader@^0.5.4:
+json-loader@^0.5.4, json-loader@^0.5.7:
   version "0.5.7"
   resolved "https://registry.yarnpkg.com/json-loader/-/json-loader-0.5.7.tgz#dca14a70235ff82f0ac9a3abeb60d337a365185d"
 
@@ -5889,6 +5889,15 @@ quibble@^0.5.5:
     lodash "^4.17.2"
     resolve "^1.7.1"
 
+rails-translations-webpack-plugin@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/rails-translations-webpack-plugin/-/rails-translations-webpack-plugin-1.1.0.tgz#b1e8f8ec0ac9202a49d0b496d49dac81f556ec3f"
+  dependencies:
+    glob "^7.1.1"
+    lodash "^4.17.4"
+    virtual-module-webpack-plugin "^0.3.0"
+    yaml-js "^0.1.4"
+
 randomatic@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-3.1.0.tgz#36f2ca708e9e567f5ed2ec01949026d50aa10116"
@@ -7392,6 +7401,10 @@ viewport-dimensions@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/viewport-dimensions/-/viewport-dimensions-0.2.0.tgz#de740747db5387fd1725f5175e91bac76afdf36c"
 
+virtual-module-webpack-plugin@^0.3.0:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/virtual-module-webpack-plugin/-/virtual-module-webpack-plugin-0.3.0.tgz#b2095b2b8c51480362ab3ec2bd613bdd507cbd46"
+
 vm-browserify@0.0.4:
   version "0.0.4"
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-0.0.4.tgz#5d7ea45bbef9e4a6ff65f95438e0a87c357d5a73"
@@ -7642,6 +7655,10 @@ yallist@^3.0.0, yallist@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-3.0.2.tgz#8452b4bb7e83c7c188d8041c1a837c773d6d8bb9"
 
+yaml-js@^0.1.4:
+  version "0.1.5"
+  resolved "https://registry.yarnpkg.com/yaml-js/-/yaml-js-0.1.5.tgz#a01369010b3558d8aaed2394615dfd0780fd8fac"
+
 yargs-parser@^4.2.0:
   version "4.2.1"
   resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-4.2.1.tgz#29cceac0dc4f03c6c87b4a9f217dd18c9f74871c"