import i18n from 'i18next';
import { initReactI18next } from 'react-i18next';
import LanguageDetector from 'i18next-browser-languagedetector';
import Backend from 'i18next-http-backend';

import metaEN from './public/static/locales/en/meta.json';
import metaTW from './public/static/locales/zh-tw/meta.json';
import sidebarEN from './public/static/locales/en/sidebar.json';
import sidebarTW from './public/static/locales/zh-tw/sidebar.json';
import toolbarEN from './public/static/locales/en/toolbar.json';
import toolbarTW from './public/static/locales/zh-tw/toolbar.json';
import dialogEN from './public/static/locales/en/dialog.json';
import dialogTW from './public/static/locales/zh-tw/dialog.json';
import toastEN from './public/static/locales/en/toast.json';
import toastTW from './public/static/locales/zh-tw/toast.json';

const resources = {
  en: {
    meta: metaEN,
    sidebar: sidebarEN,
    toolbar: toolbarEN,
    dialog: dialogEN,
    toast: toastEN,
  },
  'zh-TW': {
    meta: metaTW,
    sidebar: sidebarTW,
    toolbar: toolbarTW,
    dialog: dialogTW,
    toast: toastTW,
  },
};

i18n
  .use(Backend)
  .use(LanguageDetector)
  .use(initReactI18next) // passes i18n down to react-i18next
  .init({
    resources,
    lng: 'en',
    fallbackLng: 'en',
    interpolation: {
      escapeValue: false,
    },
    react: {
      useSuspense: false,
    },
  });

export default i18n;