Add ready/tReady type definitions

[traverse]

Adds missing type definitions for the ready return value of the useTranslation hook and the tReady prop added by the withTranslation HOC, fixes #751.

[coveralls]

Coverage remained the same at 91.282% when pulling 5463e19 on traverse:patch-1 into 9042b09 on i18next:master.

[rosskevin]

Please add usage example to test/typescript to prevent regressions

[traverse]

@rosskevin do you mean something like the following in examples.test.tsx:

// Component that uses ready to wait until translations are loaded because useSuspense is set to false
function ComponentNotUsingSuspense() {
  const { t, ready } = useTranslation();
  return (
    <div>
      {ready && t('key1')}
    </div>
  );
}

// Class based component that uses tReady to wait until translations are loaded because useSuspense is set to false
class ClassComponentNotUsingSuspense extends React.Component<WithTranslation> {
  render() {
    const { t, tReady } = this.props;
    return <h2>{tReady && t('title')}</h2>;
  }
}

If there's anything that you want worded or named differently let me know.

[rosskevin]

@traverse you can add both of those, but be sure to exercise them (just add them inside a closure):

function suspenseUsage() {
    // components code here

   // exercise components code
   return (
        <div>
            <ComponentNotUsingSuspense />
            <ClassComponentNotUsingSuspense />
         </div>
    )
}

[traverse]

@rosskevin Ok will do, thanks!

[jamuhl]

@traverse any update on this?

[traverse]

@jamuhl sorry about not giving an update on this, I was quite pressed for time last week and was bedridden over the weekend 🤒. I'm going to be spending some time on this today.

[traverse]

@rosskevin any idea why the CI build might be failing? The tests are running fine locally 🤔

[rosskevin]

@traverse - it seems bizarre. I have tracked down dtslint to be relying on TypeScript@next, which might reveal the error on ci and not local. We are currently testing with the release of 3.3.3.

I'm looking into why dtslint is on next - because I believe that is a nightly build.

❯❯ npm list typescript                                                                                                                                                                                                                                            ✘ 1 
[email protected] /Users/kross/projects/react-i18next
├─┬ [email protected]
│ └── [email protected] 
└── [email protected] 

[rosskevin]

Issue microsoft/dtslint#159

[rosskevin]

@traverse this all looks good locally, I agree. I tried several things, all with full rebuilds, all which succeed locally but only fail on travis.

@jamuh I don't have much confidence in travis at this point. I checked and there are no caches configured so I'm not sure what else to do there. My assumption at this point is that any change in this repo (even non-ts) is going to fail on travis due to some environmental situation there.

I'm happy to merge this without travis success but worried that we will see more of the same. Thoughts?

[traverse]

@rosskevin I'm not sure if it would work in this case and if there's something similar for NPM but with Yarn you can use resolutions to overwrite specific dependency versions.

[rosskevin]

@traverse I tested with typescript next locally and it works, so it isn't a version conflict. Something on Travis.

[traverse]

@rosskevin It's also quite weird it's failing to find both withTranslation and WithTranslation but is finding useTranslation I'd assume it would either find none or all.

[jamuhl]

Same on circleci: https://circleci.com/gh/i18next/react-i18next/8

[jamuhl]

Failed local at my place too: ef1ee56 fixes it

[jamuhl]

https://circleci.com/gh/i18next/react-i18next/9

[jamuhl]

published in [email protected]

[traverse]

@jamuhl I think that #769 removed some things from examples.test.tsx maybe that's why it was failing in weird ways? It seems that way at least 🤔