fix(i18n): fix i18n translation keys and reorganize files

fix #1668

src/components/Navbar.tsx

@@ -22,17 +22,17 @@ const Navbar = () => {
       }}
       navLinks={[
         {
-          label: t('patients.label'),
+          label: t('patients.label', 'patients'),
           onClick: () => {},
           children: [
             {
-              label: t('actions.list'),
+              label: t('actions.list', 'list'),
               onClick: () => {
                 history.push('/patients')
               },
             },
             {
-              label: t('actions.new'),
+              label: t('actions.new', 'new'),
               onClick: () => {
                 history.push('/patients/new')
               },

src/components/Sidebar.tsx

@@ -12,7 +12,7 @@ const Sidebar = () => {
         <ul className="nav flex-column">
           <li className="nav-item">
             <Link to="/" className={`nav-link ${path.pathname === '/' ? ' active' : ''}`}>
-              {t('dashboard.label')}
+              {t('dashboard.label', 'dashboard')}
             </Link>
           </li>
           <li className="nav-item">
@@ -21,7 +21,7 @@ const Sidebar = () => {
               className={`nav-link ${path.pathname.includes('patient') ? ' active' : ''}`}
             >
               <Icon icon="patients" />
-              {`  ${t('patients.label')}`}
+              {`  ${t('patients.label', 'patients')}`}
             </Link>
           </li>
         </ul>

src/i18n.tsx

@@ -1,12 +1,56 @@
 import i18n from 'i18next';
-import Backend from 'i18next-xhr-backend';
+// import Backend from 'i18next-xhr-backend';
 import LanguageDetector from 'i18next-browser-languagedetector';
 import { initReactI18next } from 'react-i18next';
 
+import translationAR from './locales/ar/translation.json';
+import translationDE from './locales/de/translation.json';
+import translationEN from './locales/en/translation.json';
+import translationES from './locales/es/translation.json';
+import translationIN from './locales/in/translation.json';
+import translationJA from './locales/ja/translation.json';
+import translationPT from './locales/pt/translation.json';
+import translationRU from './locales/ru/translation.json';
+import translationZR from './locales/zr/translation.json';
+
+const resources = {
+  ar: {
+    translation: translationAR,
+  },
+  de: {
+    translation: translationDE,
+  },
+  en: {
+    translation: translationEN,
+  },
+  es: {
+    translation: translationES,
+  },
+  in: {
+    translation: translationIN,
+  },
+  ja: {
+    translation: translationJA,
+  },
+  pt: {
+    translation: translationPT,
+  },
+  ru: {
+    translation: translationRU,
+  },
+  zr: {
+    translation: translationZR,
+  },
+};
+
 i18n
   // load translation using xhr -> see /public/locales
   // learn more: https://github.com/i18next/i18next-xhr-backend
-  .use(Backend)
+
+  // SET UP Backend resource
+  // .use(Backend)
+
+
   // detect user language
   // learn more: https://github.com/i18next/i18next-browser-languageDetector
   .use(LanguageDetector)
@@ -17,7 +61,7 @@ i18n
   .init({
     fallbackLng: 'en',
     debug: true,
-
+    resources: resources,
     interpolation: {
       escapeValue: false, // not needed for react as it escapes by default
     },

src/locales/ar/translation.json

@@ -0,0 +1,22 @@
+{
+  "actions": {
+    "edit": "تصحيح",
+    "save": "حفظ",
+    "cancel": "إلغاء",
+    "new": "الجديد",
+    "list": "قائمة"
+  },
+  "dashboard": {
+    "label": "لوحة القيادة"
+  },
+  "patient": {
+    "firstName": "الاسم الاول",
+    "lastName": "الكنية"
+  },
+  "patients": {
+    "label": "المرضى",
+    "viewPatients": "عرض المرضى",
+    "viewPatient": "عرض المريض",
+    "newPatient": "مريض جديد"
+  }
+}

src/locales/de/translation.json

@@ -0,0 +1,22 @@
+{
+  "actions": {
+    "edit": "Bearbeiten",
+    "save": "speichern",
+    "cancel": "Stornieren",
+    "new": "Neu",
+    "list": "Liste"
+  },
+  "dashboard": {
+    "label": "لوحة القيادة"
+  },
+  "patient": {
+    "firstName": "Vorname",
+    "lastName": "Nachname"
+  },
+  "patients": {
+    "label": "Patienten",
+    "viewPatients": "Patienten anzeigen",
+    "viewPatient": "Patient anzeigen",
+    "newPatient": "Neuer Patient"
+  }
+}

src/locales/en/translation.json

@@ -0,0 +1,22 @@
+{
+  "actions": {
+    "edit": "Edit",
+    "save": "Save",
+    "cancel": "Cancel",
+    "new": "New",
+    "list": "List"
+  },
+  "dashboard": {
+    "label": "Dashboard"
+  },
+  "patient": {
+    "firstName": "First Name",
+    "lastName": "Last Name"
+  },
+  "patients": {
+    "label": "Patients",
+    "viewPatients": "View Patients",
+    "viewPatient": "View Patient",
+    "newPatient": "New Patient"
+  }
+}