IO-2687 Delay template load to wait for translations.

client/src/translations/i18n.js

@@ -4,6 +4,7 @@ import { initReactI18next } from 'react-i18next';
 import en_Translation from './en_us/common.json';
 import es_Translation from './es/common.json';
 import fr_Translation from './fr/common.json';
+import { GenerateTemplates } from '../utils/RenderTemplate';
 
 // the translations
 // (tip move them in a JSON file and import them)
@@ -13,19 +14,27 @@ const resources = {
   'es-MX': es_Translation,
 };
 i18n
-  .use(initReactI18next)
   .use(LanguageDetector) // passes i18n down to react-i18next
-  .init({
-    resources,
-    //lng: "en",
-    detection: {},
-    fallbackLng: 'en-US',
-    debug: import.meta.env.DEV,
-    //keySeparator: false, // we do not use keys in form messages.welcome
-    interpolation: {
-      escapeValue: false, // react already safes from xss
-      skipOnVariables: false,
+  .use(initReactI18next)
+  .init(
+    {
+      resources,
+      //lng: "en",
+      detection: {},
+      fallbackLng: 'en-US',
+      debug: import.meta.env.DEV,
+      react: {
+        useSuspense: true,
+      },
+      //keySeparator: false, // we do not use keys in form messages.welcome
+      interpolation: {
+        escapeValue: false, // react already safes from xss
+        skipOnVariables: false,
+      },
     },
-  });
+    (error) => {
+      GenerateTemplates();
+    }
+  );
 
 export default i18n;