Added i18next-loader to webpack

package.json

@@ -15,6 +15,7 @@
   "author": "Ajay Bura",
   "license": "MIT",
   "dependencies": {
+    "@alienfast/i18next-loader": "^1.1.4",
     "@fontsource/inter": "^4.5.11",
     "@fontsource/roboto": "^4.5.7",
     "@matrix-org/olm": "https://gitlab.matrix.org/api/v4/projects/27/packages/npm/@matrix-org/olm/-/@matrix-org/olm-3.2.8.tgz",
@@ -26,11 +27,10 @@
     "file-saver": "^2.0.5",
     "flux": "^4.0.3",
     "formik": "^2.2.9",
-    "html-react-parser": "^1.4.14",
+    "html-react-parser": "^2.0.0",
     "i18next": "^21.8.9",
     "i18next-browser-languagedetector": "^6.1.4",
     "i18next-http-backend": "^1.4.1",
-    "html-react-parser": "^2.0.0",
     "katex": "^0.15.6",
     "linkify-html": "^4.0.0-beta.5",
     "linkifyjs": "^4.0.0-beta.5",

public/locales/en/translation.json

@@ -1,4 +1,5 @@
 {
+    "translation": {
         "common": {
             "close": "Close",
             "open": "Open",
@@ -456,8 +457,7 @@
             "ConfirmDialog": {
                 "cancel": "Cancel"
             },
-        "ReusableDialog":
+            "ReusableDialog": {
-        {
                 "close_tooltip": "Close"
             },
             "FollowingMembers": {
@@ -466,14 +466,12 @@
                 "users_following_three": "<bold>{{user_one}}</bold>, <bold>{{user_two}}</bold>, and <bold>{{user_three}}</bold> are following the conversation",
                 "users_following_other": "<bold>{{user_one}}</bold>, <bold>{{user_two}}</bold>, <bold>{{user_three}}</bold> and {{other_count}} others are following the conversation"
             },
-        "ImageUpload":
+            "ImageUpload": {
-        {
                 "prompt": "Upload",
                 "cancel": "Cancel",
                 "remove": "Remove"
             },
-        "ExportE2ERoomKeys":
+            "ExportE2ERoomKeys": {
-        {
                 "getting_keys": "Getting keys...",
                 "encrypting_keys": "Encrypting Keys...",
                 "password_does_not_match": "Password does not match.",
@@ -481,8 +479,7 @@
                 "export_failed": "Failed to export keys. Please try again.",
                 "button_text": "Export"
             },
-        "ImportE2ERoomKeys":
+            "ImportE2ERoomKeys": {
-        {
                 "decrypting_file": "Decrypting file...",
                 "decrypting_messages": "Decrypting messages...",
                 "import_success": "Successfully imported all keys",
@@ -496,8 +493,7 @@
                 "play_audio": "Play audio",
                 "play_video": "Play video"
             },
-        "Message":
+            "Message": {
-        {
                 "message_deleted": "*** This message has been deleted ***",
                 "unable_to_load_reply": "*** Unable to load reply ***",
                 "unknown_user": "** Unknown user **",
@@ -518,8 +514,7 @@
                 "delete_message_confirmation": "Are you sure that you want to delete this message?",
                 "delete_message_button": "Delete"
             },
-        "PopupWindow":
+            "PopupWindow": {
-        {
                 "close_tooltip": "Back"
             },
             "PowerLevelSelector": {
@@ -536,22 +531,19 @@
                 "unpublish_alias": "Unpublish",
                 "delete_alias": "Delete",
                 "main_alias": "Main",
-            "publish_to_room_directory":
+                "publish_to_room_directory": {
-            {
                     "title": "Publish to room directory",
                     "publish_room_message": "Publish this room to the {{homeserver}} publish directory?",
                     "publish_space_message": "Publish this space to the {{homeserver}} publish directory?"
                 },
-            "published_addresses":
+                "published_addresses": {
-            {
                     "title": "Published addresses",
                     "none": "No published addresses",
                     "no_main_address": "No main address (select one from below)",
                     "message_room": "Published addresses can be used by anyone on any server to join your room. To publish an address, it needs to be set as a local address first.",
                     "message_space": "Published addresses can be used by anyone on any server to join your space. To publish an address, it needs to be set as a local address first."
                 },
-            "local_addresses":
+                "local_addresses": {
-            {
                     "title": "Local addresses",
                     "none": "No local addresses",
                     "message_room": "Set local addresses for this room so users can find this room through your homeserver.",
@@ -562,7 +554,6 @@
                     "placeholder_space": "my_space_address",
                     "hide": "Hide local addresses",
                     "view": "View local addresses"
-
                 }
             },
             "RoomEncryption": {
@@ -573,7 +564,6 @@
                 "enable_encryption_prompt": "Enable Encryption",
                 "enable_encryption_button": "Enable",
                 "continue_button": "Continue"
-            
             },
             "RoomHistoryVisibility": {
                 "world_readable": "Anyone (including guests)",
@@ -594,8 +584,7 @@
                 "banned": "Banned",
                 "search_placeholder": "Search for name"
             },
-        "RoomNotification":
+            "RoomNotification": {
-        {
                 "default": "Global",
                 "all_messages": "All messages",
                 "mentions_and_keywords": "Mentions & Keywords",
@@ -612,8 +601,7 @@
                 "notifications_heading": "Notifications",
                 "invite": "Invite"
             },
-        "RoomPermissions":
+            "RoomPermissions": {
-        {
                 "default_role": {
                     "name": "Default role",
                     "description": "Set default role for all members"
@@ -698,8 +686,7 @@
                     "name": "Modify widgets",
                     "description": "Set minimum power level to modify room widgets"
                 },
-            "groups":
+                "groups": {
-            {
                     "general": "General permissions",
                     "manage_members": "Manage members permissions",
                     "room": "Room profile permissions",
@@ -774,3 +761,4 @@
             }
         }
     }
+}

public/locales/index.js

@@ -0,0 +1 @@
+//root pointer

src/app/i18n.jsx

@@ -1,11 +1,9 @@
 import i18n from 'i18next';
 import { initReactI18next } from 'react-i18next';
 import LanguageDetector from 'i18next-browser-languagedetector';
-import Backend from 'i18next-http-backend'
+import resources from '../../public/locales';
 
 i18n
-  .use(Backend)
-  // detect user language
   // learn more: https://github.com/i18next/i18next-browser-languageDetector
   .use(LanguageDetector)
   // pass the i18n instance to react-i18next.
@@ -13,10 +11,12 @@ i18n
   // init i18next
   // for all options read: https://www.i18next.com/overview/configuration-options
   .init({
+    resources,
     debug: true,
+    fallbackLng: 'en',
     interpolation: {
       escapeValue: false, // not needed for react as it escapes by default
-    }
+    },
   });
 
 export default i18n;

webpack.common.js

@@ -47,6 +47,10 @@ module.exports = {
       {
         test: /\.svg$/,
         type: 'asset/inline',
+      },
+      {
+        test: /locales/,
+        loader: '@alienfast/i18next-loader'
       }
     ],
   },

webpack.dev.js

@@ -21,7 +21,8 @@ module.exports = merge(common, {
           'css-loader',
           'sass-loader',
         ],
-      },
+        
+      }
     ],
   },
 });