Merge pull request #729 from jsonwebtoken/localize-ttb-ja

Feat: localize jwt.io banner Japanese

Author: chiaradz

package-lock.json

@@ -6,13 +6,15 @@
         "url": "https://github.com/jsonwebtoken/jsonwebtoken.github.io"
     },
     "dependencies": {
+        "@formatjs/intl-localematcher": "^0.5.10",
         "@octokit/rest": "^18.0.12",
         "dotenv": "^8.2.0",
         "express": "^4.17.1",
         "express-sslify": "^1.2.0",
         "jstransformer-markdown": "^1.2.1",
         "jstransformer-markdown-it": "^2.1.0",
         "lodash.debounce": "^4.0.8",
+        "negotiator": "^1.0.0",
         "pug": "^2.0.4",
         "querystring": "^0.2.0"
     },
@@ -83,4 +85,4 @@
         "build:libraries": "node libraries.js"
     },
     "heroku-run-build-script": true
-}
+}

package.json

@@ -2,6 +2,8 @@ const express = require("express");
 const enforce = require("express-sslify");
 const languages = require("./libraries.json");
 const dotenv = require("dotenv").config();
+const Negotiator = require("negotiator");
+const localeMatcher = require("@formatjs/intl-localematcher");
 
 const app = express();
 
@@ -18,22 +20,42 @@ if (process.env.NODE_ENV === "production") {
     );
 }
 
+app.use((req, res, next) => {
+    const languagesFromRequestHeaders = new Negotiator(req).languages();
+    const LANGUAGE_CODES = ["en", "ja"]
+    const DEFAULT_LANGUAGE_CODE = ["en"]
+
+    const languageFromRequestHeader = localeMatcher.match(
+        languagesFromRequestHeaders,
+        LANGUAGE_CODES,
+        DEFAULT_LANGUAGE_CODE,
+    );
+
+    req.preferredLanguage = languageFromRequestHeader;
+    next();
+})
+
 app.use((req, res, next) => {
     res.locals.COOKIE_CONSENT_DOMAIN_ID = process.env.COOKIE_CONSENT_DOMAIN_ID;
     next();
 });
 app.use(express.static("dist/website"));
 app.get("/", function(req, res) {
-    res.render("index");
+    res.render("index", {
+        preferredLanguage: req.preferredLanguage,
+    });
 });
 
 app.get("/introduction", function(req, res) {
-    res.render("introduction");
+    res.render("introduction", {
+        preferredLanguage: req.preferredLanguage,
+    });
 });
 
 app.get("/libraries", function(req, res) {
     res.render("libraries", {
-        languages: languages
+        languages: languages,
+        preferredLanguage: req.preferredLanguage,
     });
 });
 
@@ -44,4 +66,4 @@ app.get("/home", function(req, res) {
 
 app.listen(process.env.PORT || 3000, function() {
     console.log("Started.");
-});
+});

server.js

@@ -1,8 +1,12 @@
 .top-banner-bg.closed
 .top-banner.closed
   .top-banner-container
-    a(href="https://a0.to/jwt-io-feedback" target="_blank") Get an exclusive look at jwt.io v2 and help us shape its final form with your feedback.
-      span(aria-hiden="true") →
+    if preferredLanguage === 'ja'
+      a(href="https://a0.to/jwt-io-feedback-ja" target="_blank") jwt.io v2ベータバージョン: フィードバックをお寄せください。
+        span(aria-hiden="true") →
+    else
+      a(href="https://a0.to/jwt-io-feedback" target="_blank") Get an exclusive look at jwt.io v2 and help us shape its final form with your feedback.
+        span(aria-hiden="true") →
     button.close-top-banner +
 
 nav.navbar