diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index 310b8e6a1d..d24efc5f21 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -15,6 +15,7 @@ const Navbar = () => {
           history.push('/')
         },
       }}
+<<<<<<< HEAD
       search={{
         onClickButton: () => {
           // no oop
@@ -31,15 +32,27 @@ const Navbar = () => {
           onClick: () => {
             // no oop
           },
+=======
+      bg="dark"
+      variant="dark"
+      search={{
+        onClickButton: () => console.log('hello'),
+        onChangeInput: () => console.log('hello'),
+      }}
+      navLinks={[
+        {
+          label: t('patients.label', 'patients'),
+          onClick: () => {},
+>>>>>>> add-translation-resources
           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')
               },
diff --git a/src/i18n.ts b/src/i18n.ts
new file mode 100644
index 0000000000..a6d53f248c
--- /dev/null
+++ b/src/i18n.ts
@@ -0,0 +1,64 @@
+import i18n from 'i18next';
+import LanguageDetector from 'i18next-browser-languagedetector';
+import { initReactI18next } from 'react-i18next';
+
+import translationAR from './locales/ar/translations';
+import translationDE from './locales/de/translations';
+import translationEN from './locales/en/translations';
+import translationES from './locales/es/translations';
+import translationIN from './locales/in/translations';
+import translationJA from './locales/ja/translations';
+import translationPT from './locales/pt/translations';
+import translationRU from './locales/ru/translations';
+import translationZR from './locales/zr/translations';
+
+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
+  // detect user language
+  // learn more: https://github.com/i18next/i18next-browser-languageDetector
+  .use(LanguageDetector)
+  // pass the i18n instance to react-i18next.
+  .use(initReactI18next)
+  // init i18next
+  // for all options read: https://www.i18next.com/overview/configuration-options
+  .init({
+    fallbackLng: 'en',
+    debug: true,
+    resources: resources,
+    interpolation: {
+      escapeValue: false, // not needed for react as it escapes by default
+    },
+  });
+
+export default i18n;
diff --git a/src/index.tsx b/src/index.tsx
index 71b2ba1135..441abcd322 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -4,7 +4,7 @@ import '@hospitalrun/components/scss/main.scss'
 import './index.css'
 import App from './App'
 import * as serviceWorker from './serviceWorker'
-import './i18n'
+import './i18n.ts'
 
 ReactDOM.render(<App />, document.getElementById('root'))
 
diff --git a/src/locales/ar/translations/actions/index.ts b/src/locales/ar/translations/actions/index.ts
new file mode 100644
index 0000000000..24196b8408
--- /dev/null
+++ b/src/locales/ar/translations/actions/index.ts
@@ -0,0 +1,9 @@
+export default {
+  "actions": {
+    "edit": "تصحيح",
+    "save": "حفظ",
+    "cancel": "إلغاء",
+    "new": "الجديد",
+    "list": "قائمة"
+  }
+}
diff --git a/src/locales/ar/translations/dashboard/index.ts b/src/locales/ar/translations/dashboard/index.ts
new file mode 100644
index 0000000000..bfff30a0b0
--- /dev/null
+++ b/src/locales/ar/translations/dashboard/index.ts
@@ -0,0 +1,5 @@
+export default {
+  "dashboard": {
+    "label": "لوحة القيادة"
+  }
+}
diff --git a/src/locales/ar/translations/index.ts b/src/locales/ar/translations/index.ts
new file mode 100644
index 0000000000..068c48304a
--- /dev/null
+++ b/src/locales/ar/translations/index.ts
@@ -0,0 +1,11 @@
+import actions from './actions';
+import dashboard from './dashboard';
+import patient from './patient';
+import patients from './patients';
+
+export default {
+  ...actions,
+  ...dashboard,
+  ...patient,
+  ...patients,
+}
diff --git a/src/locales/ar/translations/patient/index.ts b/src/locales/ar/translations/patient/index.ts
new file mode 100644
index 0000000000..2a38b86ade
--- /dev/null
+++ b/src/locales/ar/translations/patient/index.ts
@@ -0,0 +1,6 @@
+export default {
+  "patient": {
+    "firstName": "الاسم الاول",
+    "lastName": "الكنية"
+  }
+}
diff --git a/src/locales/ar/translations/patients/index.ts b/src/locales/ar/translations/patients/index.ts
new file mode 100644
index 0000000000..fa271ed9d8
--- /dev/null
+++ b/src/locales/ar/translations/patients/index.ts
@@ -0,0 +1,8 @@
+export default {
+  "patients": {
+    "label": "المرضى",
+    "viewPatients": "عرض المرضى",
+    "viewPatient": "عرض المريض",
+    "newPatient": "مريض جديد"
+  }
+}
diff --git a/src/locales/de/translations/actions/index.ts b/src/locales/de/translations/actions/index.ts
new file mode 100644
index 0000000000..bae1e424ed
--- /dev/null
+++ b/src/locales/de/translations/actions/index.ts
@@ -0,0 +1,9 @@
+export default {
+  "actions": {
+    "edit": "Bearbeiten",
+    "save": "speichern",
+    "cancel": "Stornieren",
+    "new": "Neu",
+    "list": "Liste"
+  }
+}
diff --git a/src/locales/de/translations/dashboard/index.ts b/src/locales/de/translations/dashboard/index.ts
new file mode 100644
index 0000000000..357fc0c1e5
--- /dev/null
+++ b/src/locales/de/translations/dashboard/index.ts
@@ -0,0 +1,5 @@
+export default {
+  "dashboard": {
+    "label": "Instrumententafel"
+  }
+}
diff --git a/src/locales/de/translations/index.ts b/src/locales/de/translations/index.ts
new file mode 100644
index 0000000000..068c48304a
--- /dev/null
+++ b/src/locales/de/translations/index.ts
@@ -0,0 +1,11 @@
+import actions from './actions';
+import dashboard from './dashboard';
+import patient from './patient';
+import patients from './patients';
+
+export default {
+  ...actions,
+  ...dashboard,
+  ...patient,
+  ...patients,
+}
diff --git a/src/locales/de/translations/patient/index.ts b/src/locales/de/translations/patient/index.ts
new file mode 100644
index 0000000000..4a6cd51143
--- /dev/null
+++ b/src/locales/de/translations/patient/index.ts
@@ -0,0 +1,6 @@
+export default {
+  "patient": {
+    "firstName": "Vorname",
+    "lastName": "Nachname"
+  }
+}
diff --git a/src/locales/de/translations/patients/index.ts b/src/locales/de/translations/patients/index.ts
new file mode 100644
index 0000000000..3e92cb58d5
--- /dev/null
+++ b/src/locales/de/translations/patients/index.ts
@@ -0,0 +1,8 @@
+export default {
+  "patients": {
+    "label": "Patienten",
+    "viewPatients": "Patienten anzeigen",
+    "viewPatient": "Patient anzeigen",
+    "newPatient": "Neuer Patient"
+  }
+}
diff --git a/src/locales/en/translations/actions/index.ts b/src/locales/en/translations/actions/index.ts
new file mode 100644
index 0000000000..e7d3161d3a
--- /dev/null
+++ b/src/locales/en/translations/actions/index.ts
@@ -0,0 +1,9 @@
+export default {
+  "actions": {
+    "edit": "Edit",
+    "save": "Save",
+    "cancel": "Cancel",
+    "new": "New",
+    "list": "List"
+  }
+}
diff --git a/src/locales/en/translations/dashboard/index.ts b/src/locales/en/translations/dashboard/index.ts
new file mode 100644
index 0000000000..0d19bd0e85
--- /dev/null
+++ b/src/locales/en/translations/dashboard/index.ts
@@ -0,0 +1,5 @@
+export default {
+  "dashboard": {
+    "label": "Dashboard"
+  }
+}
diff --git a/src/locales/en/translations/index.ts b/src/locales/en/translations/index.ts
new file mode 100644
index 0000000000..068c48304a
--- /dev/null
+++ b/src/locales/en/translations/index.ts
@@ -0,0 +1,11 @@
+import actions from './actions';
+import dashboard from './dashboard';
+import patient from './patient';
+import patients from './patients';
+
+export default {
+  ...actions,
+  ...dashboard,
+  ...patient,
+  ...patients,
+}
diff --git a/src/locales/en/translations/patient/index.ts b/src/locales/en/translations/patient/index.ts
new file mode 100644
index 0000000000..f7d48e6998
--- /dev/null
+++ b/src/locales/en/translations/patient/index.ts
@@ -0,0 +1,6 @@
+export default {
+  "patient": {
+    "firstName": "First Name",
+    "lastName": "Last Name"
+  }
+}
diff --git a/src/locales/en/translations/patients/index.ts b/src/locales/en/translations/patients/index.ts
new file mode 100644
index 0000000000..59a4314839
--- /dev/null
+++ b/src/locales/en/translations/patients/index.ts
@@ -0,0 +1,8 @@
+export default {
+  "patients": {
+    "label": "Patients",
+    "viewPatients": "View Patients",
+    "viewPatient": "View Patient",
+    "newPatient": "New Patient"
+  }
+}
diff --git a/src/locales/es/translations/actions/index.ts b/src/locales/es/translations/actions/index.ts
new file mode 100644
index 0000000000..44676e9c8e
--- /dev/null
+++ b/src/locales/es/translations/actions/index.ts
@@ -0,0 +1,9 @@
+export default {
+  "actions": {
+    "edit": "Editar",
+    "save": "Guardar",
+    "cancel": "Cancelar",
+    "new": "Nuevo",
+    "list": "Lista"
+  }
+}
diff --git a/src/locales/es/translations/dashboard/index.ts b/src/locales/es/translations/dashboard/index.ts
new file mode 100644
index 0000000000..47458257a5
--- /dev/null
+++ b/src/locales/es/translations/dashboard/index.ts
@@ -0,0 +1,5 @@
+export default {
+  "dashboard": {
+    "label": "Panel"
+  }
+}
diff --git a/src/locales/es/translations/index.ts b/src/locales/es/translations/index.ts
new file mode 100644
index 0000000000..068c48304a
--- /dev/null
+++ b/src/locales/es/translations/index.ts
@@ -0,0 +1,11 @@
+import actions from './actions';
+import dashboard from './dashboard';
+import patient from './patient';
+import patients from './patients';
+
+export default {
+  ...actions,
+  ...dashboard,
+  ...patient,
+  ...patients,
+}
diff --git a/src/locales/es/translations/patient/index.ts b/src/locales/es/translations/patient/index.ts
new file mode 100644
index 0000000000..baa4c6e93b
--- /dev/null
+++ b/src/locales/es/translations/patient/index.ts
@@ -0,0 +1,6 @@
+export default {
+  "patient": {
+    "firstName": "Nombre de pila",
+    "lastName": "Apellido"
+  }
+}
diff --git a/src/locales/es/translations/patients/index.ts b/src/locales/es/translations/patients/index.ts
new file mode 100644
index 0000000000..9c1d7cd784
--- /dev/null
+++ b/src/locales/es/translations/patients/index.ts
@@ -0,0 +1,8 @@
+export default {
+  "patients": {
+    "label": "Pacientes",
+    "viewPatients": "Ver pacientes",
+    "viewPatient": "Ver pacientes",
+    "newPatient": "Nuevo paciente"
+  }
+}
diff --git a/src/locales/in/translations/actions/index.ts b/src/locales/in/translations/actions/index.ts
new file mode 100644
index 0000000000..3aa647caeb
--- /dev/null
+++ b/src/locales/in/translations/actions/index.ts
@@ -0,0 +1,9 @@
+export default {
+  "actions": {
+    "edit": "Edit",
+    "save": "Menyimpan",
+    "cancel": "Membatalkan",
+    "new": "Baru",
+    "list": "Daftar"
+  }
+}
diff --git a/src/locales/in/translations/dashboard/index.ts b/src/locales/in/translations/dashboard/index.ts
new file mode 100644
index 0000000000..4a74cbf1fa
--- /dev/null
+++ b/src/locales/in/translations/dashboard/index.ts
@@ -0,0 +1,5 @@
+export default {
+  "dashboard": {
+    "label": "Dasbor"
+  }
+}
diff --git a/src/locales/in/translations/index.ts b/src/locales/in/translations/index.ts
new file mode 100644
index 0000000000..068c48304a
--- /dev/null
+++ b/src/locales/in/translations/index.ts
@@ -0,0 +1,11 @@
+import actions from './actions';
+import dashboard from './dashboard';
+import patient from './patient';
+import patients from './patients';
+
+export default {
+  ...actions,
+  ...dashboard,
+  ...patient,
+  ...patients,
+}
diff --git a/src/locales/in/translations/patient/index.ts b/src/locales/in/translations/patient/index.ts
new file mode 100644
index 0000000000..c1e856acba
--- /dev/null
+++ b/src/locales/in/translations/patient/index.ts
@@ -0,0 +1,6 @@
+export default {
+  "patient": {
+    "firstName": "Nama depan",
+    "lastName": "Nama keluarga"
+  }
+}
diff --git a/src/locales/in/translations/patients/index.ts b/src/locales/in/translations/patients/index.ts
new file mode 100644
index 0000000000..1b3c61d89f
--- /dev/null
+++ b/src/locales/in/translations/patients/index.ts
@@ -0,0 +1,8 @@
+export default {
+  "patients": {
+    "label": "Pasien",
+    "viewPatients": "Lihat Pasien",
+    "viewPatient": "Lihat Pasien",
+    "newPatient": "Pasien Baru"
+  }
+}
diff --git a/src/locales/ja/translations/actions/index.ts b/src/locales/ja/translations/actions/index.ts
new file mode 100644
index 0000000000..e9083f4d60
--- /dev/null
+++ b/src/locales/ja/translations/actions/index.ts
@@ -0,0 +1,9 @@
+export default {
+  "actions": {
+    "edit": "編集",
+    "save": "セーブ",
+    "cancel": "キャンセル",
+    "new": "新しい",
+    "list": "リスト"
+  }
+}
diff --git a/src/locales/ja/translations/dashboard/index.ts b/src/locales/ja/translations/dashboard/index.ts
new file mode 100644
index 0000000000..e4116d4695
--- /dev/null
+++ b/src/locales/ja/translations/dashboard/index.ts
@@ -0,0 +1,5 @@
+export default {
+  "dashboard": {
+    "label": "ダッシュボード"
+  }
+}
diff --git a/src/locales/ja/translations/index.ts b/src/locales/ja/translations/index.ts
new file mode 100644
index 0000000000..068c48304a
--- /dev/null
+++ b/src/locales/ja/translations/index.ts
@@ -0,0 +1,11 @@
+import actions from './actions';
+import dashboard from './dashboard';
+import patient from './patient';
+import patients from './patients';
+
+export default {
+  ...actions,
+  ...dashboard,
+  ...patient,
+  ...patients,
+}
diff --git a/src/locales/ja/translations/patient/index.ts b/src/locales/ja/translations/patient/index.ts
new file mode 100644
index 0000000000..c960028e79
--- /dev/null
+++ b/src/locales/ja/translations/patient/index.ts
@@ -0,0 +1,6 @@
+export default {
+  "patient": {
+    "firstName": "ファーストネーム",
+    "lastName": "苗字"
+  }
+}
diff --git a/src/locales/ja/translations/patients/index.ts b/src/locales/ja/translations/patients/index.ts
new file mode 100644
index 0000000000..e76d57c7be
--- /dev/null
+++ b/src/locales/ja/translations/patients/index.ts
@@ -0,0 +1,8 @@
+export default {
+  "patients": {
+    "label": "患者さん",
+    "viewPatients": "患者を見る",
+    "viewPatient": "患者を見る",
+    "newPatient": "新しい患者"
+  }
+}
diff --git a/src/locales/pt/translations/actions/index.ts b/src/locales/pt/translations/actions/index.ts
new file mode 100644
index 0000000000..78e0631e66
--- /dev/null
+++ b/src/locales/pt/translations/actions/index.ts
@@ -0,0 +1,9 @@
+export default {
+  "actions": {
+    "edit": "Editar",
+    "save": "Salvar",
+    "cancel": "Cancelar",
+    "new": "Novo",
+    "list": "Lista"
+  }
+}
diff --git a/src/locales/pt/translations/dashboard/index.ts b/src/locales/pt/translations/dashboard/index.ts
new file mode 100644
index 0000000000..240f973c1c
--- /dev/null
+++ b/src/locales/pt/translations/dashboard/index.ts
@@ -0,0 +1,5 @@
+export default {
+  "dashboard": {
+    "label": "Painel de controle"
+  }
+}
diff --git a/src/locales/pt/translations/index.ts b/src/locales/pt/translations/index.ts
new file mode 100644
index 0000000000..068c48304a
--- /dev/null
+++ b/src/locales/pt/translations/index.ts
@@ -0,0 +1,11 @@
+import actions from './actions';
+import dashboard from './dashboard';
+import patient from './patient';
+import patients from './patients';
+
+export default {
+  ...actions,
+  ...dashboard,
+  ...patient,
+  ...patients,
+}
diff --git a/src/locales/pt/translations/patient/index.ts b/src/locales/pt/translations/patient/index.ts
new file mode 100644
index 0000000000..fedd2ccb45
--- /dev/null
+++ b/src/locales/pt/translations/patient/index.ts
@@ -0,0 +1,6 @@
+export default {
+  "patient": {
+    "firstName": "Primeiro nome",
+    "lastName": "Último nome"
+  }
+}
diff --git a/src/locales/pt/translations/patients/index.ts b/src/locales/pt/translations/patients/index.ts
new file mode 100644
index 0000000000..87ea615802
--- /dev/null
+++ b/src/locales/pt/translations/patients/index.ts
@@ -0,0 +1,8 @@
+export default {
+  "patients": {
+    "label": "Pacientes",
+    "viewPatients": "Exibir pacientes",
+    "viewPatient": "Ver paciente",
+    "newPatient": "Novo Paciente"
+  }
+}
diff --git a/src/locales/ru/translations/actions/index.ts b/src/locales/ru/translations/actions/index.ts
new file mode 100644
index 0000000000..e2013ca6c6
--- /dev/null
+++ b/src/locales/ru/translations/actions/index.ts
@@ -0,0 +1,9 @@
+export default {
+  "actions": {
+    "edit": "редактировать",
+    "save": "Сохранить",
+    "cancel": "Отмена",
+    "new": "новый",
+    "list": "Список"
+  }
+}
diff --git a/src/locales/ru/translations/dashboard/index.ts b/src/locales/ru/translations/dashboard/index.ts
new file mode 100644
index 0000000000..82073fa46c
--- /dev/null
+++ b/src/locales/ru/translations/dashboard/index.ts
@@ -0,0 +1,5 @@
+export default {
+  "dashboard": {
+    "label": "Панель приборов"
+  }
+}
diff --git a/src/locales/ru/translations/index.ts b/src/locales/ru/translations/index.ts
new file mode 100644
index 0000000000..068c48304a
--- /dev/null
+++ b/src/locales/ru/translations/index.ts
@@ -0,0 +1,11 @@
+import actions from './actions';
+import dashboard from './dashboard';
+import patient from './patient';
+import patients from './patients';
+
+export default {
+  ...actions,
+  ...dashboard,
+  ...patient,
+  ...patients,
+}
diff --git a/src/locales/ru/translations/patient/index.ts b/src/locales/ru/translations/patient/index.ts
new file mode 100644
index 0000000000..a4f7034c15
--- /dev/null
+++ b/src/locales/ru/translations/patient/index.ts
@@ -0,0 +1,6 @@
+export default {
+  "patient": {
+    "firstName": "Имя",
+    "lastName": "Фамилия"
+  }
+}
diff --git a/src/locales/ru/translations/patients/index.ts b/src/locales/ru/translations/patients/index.ts
new file mode 100644
index 0000000000..2c03a06674
--- /dev/null
+++ b/src/locales/ru/translations/patients/index.ts
@@ -0,0 +1,8 @@
+export default {
+  "patients": {
+    "label": "Пациенты",
+    "viewPatients": "Просмотр пациентов",
+    "viewPatient": "Просмотр пациента",
+    "newPatient": "Новый пациент"
+  }
+}
diff --git a/src/locales/zr/translations/actions/index.ts b/src/locales/zr/translations/actions/index.ts
new file mode 100644
index 0000000000..1cd0766cd1
--- /dev/null
+++ b/src/locales/zr/translations/actions/index.ts
@@ -0,0 +1,9 @@
+export default {
+  "actions": {
+    "edit": "编辑",
+    "save": "保存",
+    "cancel": "取消",
+    "new": "新",
+    "list": "清单"
+  }
+}
diff --git a/src/locales/zr/translations/dashboard/index.ts b/src/locales/zr/translations/dashboard/index.ts
new file mode 100644
index 0000000000..3196036732
--- /dev/null
+++ b/src/locales/zr/translations/dashboard/index.ts
@@ -0,0 +1,5 @@
+export default {
+  "dashboard": {
+    "label": "仪表板"
+  }
+}
diff --git a/src/locales/zr/translations/index.ts b/src/locales/zr/translations/index.ts
new file mode 100644
index 0000000000..068c48304a
--- /dev/null
+++ b/src/locales/zr/translations/index.ts
@@ -0,0 +1,11 @@
+import actions from './actions';
+import dashboard from './dashboard';
+import patient from './patient';
+import patients from './patients';
+
+export default {
+  ...actions,
+  ...dashboard,
+  ...patient,
+  ...patients,
+}
diff --git a/src/locales/zr/translations/patient/index.ts b/src/locales/zr/translations/patient/index.ts
new file mode 100644
index 0000000000..ddca18b3dd
--- /dev/null
+++ b/src/locales/zr/translations/patient/index.ts
@@ -0,0 +1,6 @@
+export default {
+  "patient": {
+    "firstName": "名字",
+    "lastName": "姓"
+  }
+}
diff --git a/src/locales/zr/translations/patients/index.ts b/src/locales/zr/translations/patients/index.ts
new file mode 100644
index 0000000000..1fb6acfb59
--- /dev/null
+++ b/src/locales/zr/translations/patients/index.ts
@@ -0,0 +1,8 @@
+export default {
+  "patients": {
+    "label": "耐心",
+    "viewPatients": "查看患者",
+    "viewPatient": "查看患者",
+    "newPatient": "新病人"
+  }
+}