forward ready in hoc, renderprop

i18next · Feb 14, 2019 · a46263e · a46263e
1 parent dcb7ea4
commit a46263e
Show file tree

Hide file tree

Showing 9 changed files with 32 additions and 21 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,7 @@
+### 10.1.1
+
+- forward ready state in withTranslation, Translation
+
 ### 10.1.0
 
 - better naming for Wrappers in HOC for easier use of react debugger in console

diff --git a/example/test-jest/__mocks__/react-i18next.js b/example/test-jest/__mocks__/react-i18next.js
@@ -21,15 +21,16 @@ const renderNodes = reactNodes => {
     if (hasChildren(child)) {
       const inner = renderNodes(getChildren(child));
       return React.cloneElement(child, { ...child.props, key: i }, inner);
-    } if (typeof child === 'object' && !isElement) {
+    }
+    if (typeof child === 'object' && !isElement) {
       return Object.keys(child).reduce((str, childKey) => `${str}${child[childKey]}`, '');
     }
 
     return child;
   });
 };
 
-const useMock = [k=>k, {}];
+const useMock = [k => k, {}];
 useMock.t = k => k;
 useMock.i18n = {};
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-i18next",
-  "version": "10.1.0",
+  "version": "10.1.1",
   "description": "Internationalization for react done right. Using the i18next i18n ecosystem.",
   "main": "dist/commonjs/index.js",
   "types": "src/index.d.ts",

diff --git a/react-i18next.js b/react-i18next.js
@@ -658,7 +658,7 @@
 
     if (!i18n) {
       warnOnce('You will need pass in an i18next instance by using i18nextReactModule');
-      const retNotReady = [k => k, {}];
+      const retNotReady = [k => k, {}, true];
 
       retNotReady.t = k => k;
 
@@ -729,13 +729,15 @@
     return function Extend(WrappedComponent) {
       function I18nextWithTranslation(props) {
         const _useTranslation = useTranslation(ns, props),
-              _useTranslation2 = _slicedToArray(_useTranslation, 2),
+              _useTranslation2 = _slicedToArray(_useTranslation, 3),
               t = _useTranslation2[0],
-              i18n = _useTranslation2[1];
+              i18n = _useTranslation2[1],
+              ready = _useTranslation2[2];
 
         return React__default.createElement(WrappedComponent, _objectSpread({}, props, {
           t,
-          i18n
+          i18n,
+          tReady: ready
         }));
       }
 
@@ -749,14 +751,15 @@
           options = _objectWithoutProperties(props, ["ns", "children"]);
 
     const _useTranslation = useTranslation(ns, options),
-          _useTranslation2 = _slicedToArray(_useTranslation, 2),
+          _useTranslation2 = _slicedToArray(_useTranslation, 3),
           t = _useTranslation2[0],
-          i18n = _useTranslation2[1];
+          i18n = _useTranslation2[1],
+          ready = _useTranslation2[2];
 
     return children(t, {
       i18n,
       lng: i18n.language
-    });
+    }, ready);
   }
 
   function I18nextProvider(_ref) {

diff --git a/react-i18next.min.js b/react-i18next.min.js
diff --git a/src/Translation.js b/src/Translation.js
@@ -3,10 +3,14 @@ import { useTranslation } from './useTranslation';
 
 export function Translation(props) {
   const { ns, children, ...options } = props;
-  const [t, i18n] = useTranslation(ns, options);
+  const [t, i18n, ready] = useTranslation(ns, options);
 
-  return children(t, {
-    i18n,
-    lng: i18n.language,
-  });
+  return children(
+    t,
+    {
+      i18n,
+      lng: i18n.language,
+    },
+    ready,
+  );
 }
diff --git a/src/useTranslation.js b/src/useTranslation.js
@@ -16,7 +16,7 @@ export function useTranslation(ns, props = {}) {
   if (i18n && !i18n.reportNamespaces) i18n.reportNamespaces = new ReportNamespaces();
   if (!i18n) {
     warnOnce('You will need pass in an i18next instance by using i18nextReactModule');
-    const retNotReady = [k => k, {}];
+    const retNotReady = [k => k, {}, true];
     retNotReady.t = k => k;
     retNotReady.i18n = {};
     retNotReady.ready = true;

diff --git a/src/withTranslation.js b/src/withTranslation.js
@@ -4,12 +4,13 @@ import { useTranslation } from './useTranslation';
 export function withTranslation(ns) {
   return function Extend(WrappedComponent) {
     function I18nextWithTranslation(props) {
-      const [t, i18n] = useTranslation(ns, props);
+      const [t, i18n, ready] = useTranslation(ns, props);
 
       return React.createElement(WrappedComponent, {
         ...props,
         t,
         i18n,
+        tReady: ready,
       });
     }
 

diff --git a/test/typescript/examples.test.tsx b/test/typescript/examples.test.tsx
@@ -21,9 +21,7 @@ function MyComponent() {
 
 // Component using the Trans component without children (Self-closing)
 function MyComponentWithoutChildren() {
-  return (
-    <Trans i18nKey="description.part1" />
-  );
+  return <Trans i18nKey="description.part1" />;
 }
 
 // page uses the hook