title: Error: I18nextWithTranslation suspended while rendering, but no fallback UI was specified
body: <p>I am trying to get I18N working using react-i18next. I am following the steps provided <a href="https://react.i18next.com/latest/using-with-hooks" rel="noreferrer">here</a> as close as possible. I have tried for several hours with lots of googling around and have not yet discovered what I am doing wrong. Any help is appreciated.</p>
  
  <p>I am getting this Error stack trace:</p>
  
  <pre><code>    Exception has occurred: Error
  Error: I18nextWithTranslation suspended while rendering, but no fallback UI was specified.
  
  Add a &lt;Suspense fallback=...&gt; component higher in the tree to provide a loading indicator or placeholder to display.
      in I18nextWithTranslation (created by App)
      in App
      in Router (created by BrowserRouter)
      in BrowserRouter
      in CookiesProvider
      at throwException (https://localhost:3000/cgadmin-react-primeng/dist/bundle.js:45969:13)
      at renderRoot (https://localhost:3000/cgadmin-react-primeng/dist/bundle.js:47147:11)
      at performWorkOnRoot (https://localhost:3000/cgadmin-react-primeng/dist/bundle.js:48000:7)
      at performWork (https://localhost:3000/cgadmin-react-primeng/dist/bundle.js:47912:7)
      at performSyncWork (https://localhost:3000/cgadmin-react-primeng/dist/bundle.js:47886:3)
      at requestWork (https://localhost:3000/cgadmin-react-primeng/dist/bundle.js:47755:5)
      at scheduleWork (https://localhost:3000/cgadmin-react-primeng/dist/bundle.js:47569:5)
      at scheduleRootUpdate (https://localhost:3000/cgadmin-react-primeng/dist/bundle.js:48230:3)
      at updateContainerAtExpirationTime (https://localhost:3000/cgadmin-react-primeng/dist/bundle.js:48258:10)
      at updateContainer (https://localhost:3000/cgadmin-react-primeng/dist/bundle.js:48315:10)
  </code></pre>
  
  <p>I have a Suspense with fallback at the very top level:</p>
  
  <pre><code>import React, { Suspense } from 'react';
  import ReactDOM from "react-dom";
  import { CookiesProvider } from 'react-cookie';
  import App from "./App.js";
  import { BrowserRouter } from "react-router-dom";
  // import i18n (needs to be bundled ;)) 
  import './i18n';
  
  ReactDOM.render(
    &lt;CookiesProvider&gt;
      &lt;BrowserRouter basename="/cgadmin-react-primeng/"&gt;
        &lt;Suspense fallback={&lt;Loader /&gt;}&gt;
          &lt;App /&gt;
        &lt;/Suspense&gt;
      &lt;/BrowserRouter&gt;
    &lt;/CookiesProvider&gt;, 
    document.getElementById("root")
  );
  
  const Loader = () =&gt; (
    &lt;div&gt;loading...&lt;/div&gt;
  );
  </code></pre>
  
  <p>I am not using hooks, but rather the HOC recomended for use with classes on the App class like this:</p>
  
  <pre><code>export default withTranslation()(App);
  </code></pre>