From 1b16d75dc75f76091f2b9218879c8eec21a8cadf Mon Sep 17 00:00:00 2001
From: Patrick Fic <patrick@thinkimex.com>
Date: Tue, 19 Mar 2024 08:52:30 -0700
Subject: [PATCH] IO-2687 Delay template load to wait for translations.

---
 .../parts-dispatch-table.component.jsx        | 19 ++++++-----
 client/src/translations/i18n.js               | 33 ++++++++++++-------
 client/src/utils/RenderTemplate.js            |  7 +++-
 3 files changed, 37 insertions(+), 22 deletions(-)

diff --git a/client/src/components/parts-dispatch-table/parts-dispatch-table.component.jsx b/client/src/components/parts-dispatch-table/parts-dispatch-table.component.jsx
index 103dba636..1be7491da 100644
--- a/client/src/components/parts-dispatch-table/parts-dispatch-table.component.jsx
+++ b/client/src/components/parts-dispatch-table/parts-dispatch-table.component.jsx
@@ -34,19 +34,20 @@ export function PartDispatchTableComponent({
     // const selectedBill = search.billid;
     const [searchText, setSearchText] = useState("");
 
-    const Templates = TemplateList("job_special");
+    const Templates = TemplateList("job_special", job);
 
     const {refetch} = billsQuery;
 
     const recordActions = (record) => (
-        <Space wrap>
-            <PrintWrapperComponent
-                templateObject={{
-                    name: Templates.parts_dispatch.key,
-                    variables: {id: record.id},
-                }}
-            />
-        </Space>
+      <Space wrap>
+        <PrintWrapperComponent
+          templateObject={{
+            name: Templates.parts_dispatch.key,
+            variables: { id: record.id },
+          }}
+          messageObject={{ subject: Templates.parts_dispatch.subject }}
+        />
+      </Space>
     );
     const columns = [
         {
diff --git a/client/src/translations/i18n.js b/client/src/translations/i18n.js
index 12173a881..13c362124 100644
--- a/client/src/translations/i18n.js
+++ b/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;
diff --git a/client/src/utils/RenderTemplate.js b/client/src/utils/RenderTemplate.js
index 3295f33ce..c878246f1 100644
--- a/client/src/utils/RenderTemplate.js
+++ b/client/src/utils/RenderTemplate.js
@@ -14,7 +14,12 @@ const server = import.meta.env.VITE_APP_REPORTS_SERVER_URL;
 
 jsreport.serverUrl = server;
 
-const Templates = TemplateList();
+let Templates;
+export function GenerateTemplates(){
+  //Required as a part of the transition to Vite.
+  //Previous method had the template hash generating before translations loaded, resulting in empty files. 
+  Templates = TemplateList()
+}
 
 export default async function RenderTemplate(
     templateObject,