i18next not working with languageDetector and i18next-http-backend

i18next not working when passing multiple modules like i18next-http-backend and react-i18next and @os-team/i18next-react-native-language-detector

here is the sample code

    i18n
  .use(RNLanguageDetector)
  .use(initReactI18next)
  .use(Backend)
  .init(
    {
      compatibilityJSON: 'v3',
      fallbackLng: 'en',
      supportedLngs: ['en', 'ar'],
      load: 'languageOnly',
      // ns: ['translations'],
      // defaultNS: 'translations',
      ns: ['common'],
      defaultNS: 'common',
      debug: true,
      interpolation: {
        escapeValue: false,
        formatSeparator: ',',
      },
      react: {
        useSuspense: true,
      },
      backend: {
        crossDomain: false,
        withCredentials: false,
        overrideMimeType: false,
        // loadPath: '${SERVER_APTH}/{{lng}}.json',
        request: function (options, url, payload, callback) {
          console.log('Request here to get from API');
        },
        reloadInterval: false,
        allowMultiLoading: true,
      },     
      initImmediate: false,
    },
    (error, t) => {
      console.log('loading complete');
      console.log('Error', error);
    },
  );

i18n.languages = ['en', 'ar'];

i18n.on('languageChanged', nextLng => {
  console.log('Changed', nextLng);
});

Also tried with custom language detector

const languageDetector = {
  type: 'languageDetector',
  async: true,
  detect: cb => {
    console.log('Tagging here');
    cb('en');
  },
  init: () => {},
  cacheUserLanguage: () => {},
};

custom language detector work when i comment backend: { ... } section.

I need to store changed language and get translations according to it.

for changing i'm using

i18n.changeLanguage(nextLocale);

Where nextLocale will be "en" or "ar"