Add missing I18nextProvider interface to typings (#721)

* Add missing I18nextProvider interface to typings * remove old props * change ClassComponent to FunctionComponent * add usage test
i18next · Feb 7, 2019 · 6065af7 · 6065af7
1 parent 032f900
commit 6065af7
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 0 deletions.
diff --git a/src/index.d.ts b/src/index.d.ts
@@ -72,6 +72,12 @@ export function withTranslation(
   component: React.ComponentType<P>,
 ) => React.ComponentType<Omit<P, keyof WithTranslation>>;
 
+export interface I18nextProviderProps {
+  i18n: i18next.i18n;
+}
+
+export const I18nextProvider: React.FunctionComponent<I18nextProviderProps>;
+
 export interface TranslationProps {
   children: (
     t: i18next.TFunction,

diff --git a/test/typescript/I18nextProvider.test.tsx b/test/typescript/I18nextProvider.test.tsx
@@ -0,0 +1,31 @@
+import i18n from 'i18next';
+import * as React from 'react';
+import { I18nextProvider, initReactI18next } from 'react-i18next';
+
+i18n.use(initReactI18next).init({
+  fallbackLng: 'en',
+
+  // have a common namespace used around the full app
+  ns: ['translations'],
+  defaultNS: 'translations',
+
+  debug: true,
+
+  interpolation: {
+    escapeValue: false, // not needed for react!!
+  },
+
+  react: {
+    wait: true,
+  },
+});
+
+function test() {
+  return (
+    <React.Suspense fallback={<p>Loading</p>}>
+      <I18nextProvider i18n={i18n}>
+        <h1>Foo</h1>
+      </I18nextProvider>
+    </React.Suspense>
+  );
+}