Initial commit

src/i18n/helper.ts

@@ -0,0 +1,33 @@
+import type { Locale } from "antd/es/locale";
+import arEG from "antd/locale/ar_EG";
+import enUS from "antd/locale/en_US";
+import arabicLang from "assets/locals/ar.json";
+import englishLang from "assets/locals/en.json";
+import { DEFAULT_LANGUAGE } from "utils/constants";
+
+export const LocalesMap = new Map<string, Locale>([
+  ["en", enUS],
+  ["ar", arEG],
+]);
+
+export const LOCALES = [
+  { id: "ar", title: "العربية", iconPath: "/saudi-arabia.svg" },
+  { id: "en", title: "English", iconPath: "/america.svg" },
+];
+
+export function getDirection(_locale: string) {
+  if (_locale === "ar") return "rtl";
+
+  return "ltr";
+}
+
+export const translationResources = {
+  ar: { translation: arabicLang },
+  en: { translation: englishLang },
+};
+
+export const getDefaultLanguage = () => {
+  return (
+    localStorage.getItem(DEFAULT_LANGUAGE) || import.meta.env.VITE_DEFAULT_LANGUAGE
+  );
+};

src/i18n/i18n.ts

@@ -0,0 +1,20 @@
+import i18n from "i18next";
+import { initReactI18next } from "react-i18next";
+import { getDefaultLanguage, translationResources } from "./helper";
+
+i18n.use(initReactI18next).init({
+  //  debug: true,
+  resources: translationResources,
+  returnNull: false, // update the initialization so the behavior matches the type (don't return null)
+  lng: getDefaultLanguage(),
+  supportedLngs: ["ar", "en"],
+  fallbackLng: "en",
+  interpolation: {
+    escapeValue: false, // not needed for react as it escapes by default
+  },
+  react: {
+    useSuspense: true,
+  },
+});
+
+export default i18n;

src/i18n/i18next.d.ts

@@ -0,0 +1,8 @@
+import "i18next";
+
+// declare custom type options so the return is always a string.
+declare module "i18next" {
+  interface CustomTypeOptions {
+    returnNull: false;
+  }
+}