simplify i18n

web/src/App/Sidebar.jsx

@@ -20,7 +20,7 @@ import { AppSidebarStyle } from './style'
 
 export default function Sidebar({ isDrawerOpen, setIsDonationDialogOpen }) {
   // eslint-disable-next-line no-unused-vars
-  const { t, i18n } = useTranslation('translations')
+  const { t } = useTranslation()
   return (
     <AppSidebarStyle isDrawerOpen={isDrawerOpen}>
       <List>

web/src/components/About.jsx

@@ -13,7 +13,7 @@ import { useTranslation } from 'react-i18next'
 export default function AboutDialog() {
   const [open, setOpen] = useState(false)
   // eslint-disable-next-line no-unused-vars
-  const { t, i18n } = useTranslation('translations')
+  const { t } = useTranslation()
   return (
     <div>
       <ListItem button key='Settings' onClick={() => setOpen(true)}>

web/src/components/Add/index.jsx

@@ -12,7 +12,7 @@ export default function AddDialogButton() {
   const handleClickOpen = () => setIsDialogOpen(true)
   const handleClose = () => setIsDialogOpen(false)
   // eslint-disable-next-line no-unused-vars
-  const { t, i18n } = useTranslation('translations')
+  const { t } = useTranslation()
   return (
     <div>
       <ListItem button key='Add' onClick={handleClickOpen}>

web/src/components/Donate/DonateDialog.jsx

@@ -13,7 +13,7 @@ const donateFrame =
 
 export default function DonateDialog({ onClose }) {
   // eslint-disable-next-line no-unused-vars
-  const { t, i18n } = useTranslation('translations')
+  const { t } = useTranslation()
   return (
     <Dialog open onClose={onClose} aria-labelledby='form-dialog-title' fullWidth>
       <DialogTitle id='form-dialog-title'>{t('Donate')}</DialogTitle>

web/src/components/RemoveAll.jsx

@@ -36,7 +36,7 @@ export default function RemoveAll() {
   const closeDialog = () => setOpen(false)
   const openDialog = () => setOpen(true)
   // eslint-disable-next-line no-unused-vars
-  const { t, i18n } = useTranslation('translations')
+  const { t } = useTranslation()
   return (
     <>
       <ListItem button key={t('RemoveAll')} onClick={openDialog}>

web/src/components/Settings.jsx

@@ -29,7 +29,7 @@ export default function SettingsDialog() {
     axios.post(settingsHost(), { action: 'set', sets })
   }
   // eslint-disable-next-line no-unused-vars
-  const { t, i18n } = useTranslation('translations')
+  const { t } = useTranslation()
 
   useEffect(() => {
     axios

web/src/components/TorrentCard/index.jsx

@@ -18,7 +18,7 @@ const Transition = forwardRef((props, ref) => <Slide direction='up' ref={ref} {.
 
 export default function Torrent({ torrent }) {
   // eslint-disable-next-line no-unused-vars
-  const { t, i18n } = useTranslation('translations')
+  const { t } = useTranslation()
   const [isDetailedInfoOpened, setIsDetailedInfoOpened] = useState(false)
   const [isDeleteTorrentOpened, setIsDeleteTorrentOpened] = useState(false)
 

web/src/components/Upload.jsx

@@ -15,7 +15,7 @@ export default function UploadDialog() {
     axios.post(torrentUploadHost(), data)
   }
   // eslint-disable-next-line no-unused-vars
-  const { t, i18n } = useTranslation('translations')
+  const { t } = useTranslation()
   return (
     <div>
       <label htmlFor='raised-button-file'>

web/src/index.jsx

@@ -3,34 +3,32 @@ import ReactDOM from 'react-dom'
 import { I18nextProvider } from 'react-i18next'
 import i18n from 'i18next'
 import LanguageDetector from 'i18next-browser-languagedetector'
-import XHR from 'i18next-xhr-backend'
 
 import './index.css'
 import App from './App'
-import translationEng from './locales/en/translation.json'
-import translationRus from './locales/ru/translation.json'
 
-i18n
-  .use(XHR)
-  .use(LanguageDetector)
-  .init({
-    lng: 'ru', // default
-    fallbackLng: 'en', // use en if detected lng is not available
-    keySeparator: false, // we do not use keys in form messages.welcome
-    interpolation: {
-      escapeValue: false, // react already safes from xss
+i18n.use(LanguageDetector).init({
+  lng: 'ru', // default
+  fallbackLng: 'en', // use en if detected lng is not available
+  keySeparator: false, // we do not use keys in form messages.welcome
+  interpolation: {
+    escapeValue: false, // react already safes from xss
+  },
+  resources: {
+    en: {
+      // eslint-disable-next-line global-require
+      translations: require('./locales/en/translation.json'),
     },
-    resources: {
-      en: {
-        translations: translationEng,
-      },
-      ru: {
-        translations: translationRus,
-      },
+    ru: {
+      // eslint-disable-next-line global-require
+      translations: require('./locales/ru/translation.json'),
     },
-    ns: ['translations'],
-    defaultNS: 'translations',
-  })
+  },
+  ns: ['translations'],
+  defaultNS: 'translations',
+})
+
+i18n.languages = ['en', 'ru']
 
 ReactDOM.render(
   <StrictMode>