I18n config

Backoffice apps can share one i18next instance across app, backoffice, and UI namespaces.

import { createInstance } from 'i18next';
import {
  backofficeReactI18nResources,
  type BackofficeI18nConfig,
} from '@plumile/backoffice-react';
import enUi from '@plumile/ui/i18n/locales/en/ui.json' with { type: 'json' };
import frUi from '@plumile/ui/i18n/locales/fr/ui.json' with { type: 'json' };

import enApp from './locales/en/app.json' with { type: 'json' };
import frApp from './locales/fr/app.json' with { type: 'json' };

const instance = createInstance();

export const i18n: BackofficeI18nConfig = {
  instance,
  fallbackLng: 'en',
  useLanguageDetector: true,
  resources: {
    en: {
      app: enApp,
      shared: backofficeReactI18nResources.en.shared,
      ui: enUi,
    },
    fr: {
      app: frApp,
      shared: backofficeReactI18nResources.fr.shared,
      ui: frUi,
    },
  },
  initOptions: {
    ns: ['app', 'shared', 'ui'],
    defaultNS: 'app',
    supportedLngs: ['en', 'fr'],
    nonExplicitSupportedLngs: true,
  },
};

If the app updates document.documentElement.lang, subscribe to i18next language changes in the same config module.