From 4860b20e20e4be6643aaaa0c5f8c1ea3d015ee3b Mon Sep 17 00:00:00 2001
From: Jean-Baptiste Pasquier <contact@jbpasquier.eu>
Date: Tue, 30 Mar 2021 21:10:05 +0200
Subject: [PATCH] minor: i18n component writing - #1050

---
 README.md     | 119 +++++++++++++++++++++++++-------------------------
 src/index.pug |  14 +++---
 2 files changed, 66 insertions(+), 67 deletions(-)

diff --git a/README.md b/README.md
index ecb59f9..c58877a 100644
--- a/README.md
+++ b/README.md
@@ -120,14 +120,7 @@ On `config.json`:
     "css": "/path/to/custom.css",
     "i18n": {
       "lang": "fr",
-      "force": "false",
-      "files": [
-        {
-          "name": "yourCustomLangName",
-          "file": "/path/to/file.json"
-        },
-        ...
-      ]
+      "force": "false"
     }
   }
 }
@@ -139,8 +132,6 @@ Where:
 * `client.css` is an URL to a distant CSS that'll be the last one loaded by the Hubl
 * `client.i18n.lang` is the fallback langage in case the visitor's browser one does not contain the string
 * `client.i18n.force` allows to ignore the visitor's browser langage and force the `client.i18n.lang` one
-* `client.i18n.files[].name` allows to use custom client lang file.
-* `client.i18n.files[].file` is the path the the json lang file
 
 ### Allow to login to your application
 
@@ -159,56 +150,6 @@ Where:
 
 * `authority` is the OpenID Provider. Usually, if you use `djangoldp_account` it's the same as your djangoldp server.
 
-### Custom lang files
-
-Each client can overwrite langs files with their own or even create custom langs.
-
-#### Overwrite langs
-
-On `config.json`:
-
-```json
-{
-  "client": {
-    "i18n": {
-      "files": [
-        {
-          "name": "fr",
-          "file": "/path/to/custom-fr.json"
-        }
-      ]
-    }
-  }
-}
-```
-
-#### Custom langs
-
-Needs `client.i18n.force` to `true` and `client.i18n.lang` to the custom lang name.
-
-Your custom JSON file **must** contain every keys, from the template and from every bloxes, prefixed by the blox namespace. See example on `src/locales/fr.json`.
-
-On `config.json`:
-
-```json
-{
-  "client": {
-    "i18n": {
-      "lang": "pirate",
-      "force": "true",
-      "files": [
-        {
-          "name": "pirate",
-          "file": "/path/to/yarr.json"
-        }
-      ]
-    }
-  }
-}
-```
-
-Setting custom langs will not allow user to choose their own lang.
-
 ## Optional modules
 
 ### Adding modules
@@ -405,6 +346,64 @@ You can get only future events by using:
         "get": "http://server.url/events/future/",
 ```
 
+### Internationalization
+
+Each client can overwrite langs files with their own or even create custom langs.
+
+#### Overwrite langs
+
+On `config.json`:
+
+```json
+    {
+      "type": "lang",
+      "parameters": {
+        "name": "fr",
+        "file": "/path/to/fr.json"
+      },
+      "route": false
+    }
+```
+
+Where:
+
+* `parameters.name` allows to use custom client lang file.
+* `parameters.file` is the path the the json lang file
+
+#### Custom langs
+
+Needs `client.i18n.force` to `true` and `client.i18n.lang` to the custom lang name.
+
+Your custom JSON file **must** contain every keys, from the template and from every bloxes, prefixed by the blox namespace. See example on `src/locales/fr.json`.
+
+On `config.json`:
+
+```json
+  "client": {
+    "i18n": {
+      "lang": "pirate",
+      "force": "true"
+    }
+  },
+  "components": [
+    {
+      "type": "i18n",
+      "parameters": {
+        "name": "pirate",
+        "file": "/path/to/yarr.json"
+      },
+      "route": false
+    }
+  ]
+```
+
+Where:
+
+* `parameters.name` allows to use custom client lang file.
+* `parameters.file` is the path the the json lang file
+
+Setting custom langs will not allow user to choose their own lang.
+
 ### Job Offers
 
 Job Offers includes a job board with conversation. To activate them
diff --git a/src/index.pug b/src/index.pug
index 6e6d152..e36d8b2 100644
--- a/src/index.pug
+++ b/src/index.pug
@@ -175,6 +175,13 @@ html(lang="en")
             if component.type == "notification"
               include views/partials/notifications.pug
 
+            if component.type == "lang"
+              hubl-lang(
+                hidden 
+                lang=component.parameters.name
+                file=component.parameters.file
+              )
+
         if componentSet.has('profileDirectory')
           .scrollbar-content(
             id=`${getRoute("profileDirectory", true)}-profile`
@@ -220,13 +227,6 @@ html(lang="en")
         hidden
         lang=client.i18n.lang?client.i18n.lang:"fr"
       )&attributes({"force": client.i18n.force})
-      if client.i18n.files
-        for clientI18n in client.i18n.files
-          hubl-lang(
-            hidden 
-            lang=clientI18n.name
-            file=clientI18n.file
-          )
 
     div(
       id="swal-content-text"