Resolved bulk printing & status for printing items. IO-690

client/src/components/print-center-item/print-center-item.component.jsx

@@ -1,5 +1,6 @@
 import { MailOutlined, PrinterOutlined } from "@ant-design/icons";
-import React from "react";
+import { Spin } from "antd";
+import React, { useState } from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { setEmailOptions } from "../../redux/email/email.actions";
@@ -22,8 +23,10 @@ export function PrintCenterItemComponent({
   bodyshop,
   disabled,
 }) {
+  const [loading, setLoading] = useState(false);
   const { context } = printCenterModal;
   const renderToNewWindow = async () => {
+    setLoading(true);
     await GenerateDocument(
       {
         name: item.key,
@@ -32,6 +35,7 @@ export function PrintCenterItemComponent({
       {},
       "p"
     );
+    setLoading(false);
   };
 
   if (disabled) return <li className="print-center-item">{item.title} </li>;
@@ -51,6 +55,7 @@ export function PrintCenterItemComponent({
           );
         }}
       />
+      {loading && <Spin size="small" />}
     </li>
   );
 }

client/src/components/print-center-speed-print/print-center-speed-print.component.jsx

@@ -1,11 +1,11 @@
 import { Button, List, Typography } from "antd";
-import React from "react";
+import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import { GenerateDocument } from "../../utils/RenderTemplate";
+import { GenerateDocuments } from "../../utils/RenderTemplate";
 import { TemplateList } from "../../utils/TemplateConstants";
 
 const mapStateToProps = createStructuredSelector({
@@ -16,26 +16,19 @@ const mapDispatchToProps = (dispatch) => ({
 });
 
 export function PrintCenterSpeedPrint({ bodyshop, jobId }) {
+  const [loading, setLoading] = useState(false);
   const { speedprint } = bodyshop;
   const { t } = useTranslation();
 
-  const renderTemplate = async (templateKey) => {
-    logImEXEvent("speed_print_template_render");
-
-    GenerateDocument(
-      {
-        name: templateKey,
-        variables: { id: jobId },
-      },
-      {},
-      "p"
-    );
-  };
-
-  const renderAllTemplates = (templateKeys) => {
+  const renderAllTemplates = async (templateKeys) => {
     logImEXEvent("speed_print_render_all_templates");
-
-    templateKeys.forEach((templateKey) => renderTemplate(templateKey));
+    setLoading(true);
+    await GenerateDocuments(
+      templateKeys.map((key) => {
+        return { name: key, variables: { id: jobId } };
+      })
+    );
+    setLoading(false);
   };
 
   return (
@@ -50,7 +43,10 @@ export function PrintCenterSpeedPrint({ bodyshop, jobId }) {
         renderItem={(sp) => (
           <List.Item
             actions={[
-              <Button onClick={() => renderAllTemplates(sp.templates)}>
+              <Button
+                loading={loading}
+                onClick={() => renderAllTemplates(sp.templates)}
+              >
                 Print All
               </Button>,
             ]}

client/src/components/shop-template-test-render/shop-template-test-render.component.jsx

@@ -50,7 +50,7 @@ export function ShopTemplateTestRender({
             view: inlineHtml.data,
             context: { ...contextData, bodyshop: bodyshop },
           });
-          displayTemplateInWindowNoprint(renderResponse.data);
+        //  displayTemplateInWindowNoprint(renderResponse.data);
 
           setLoading(false);
         } catch (error) {

client/src/components/time-tickets-summary-employees/time-tickets-summary-employees.component.jsx

@@ -1,16 +1,14 @@
-import React from "react";
-import { Statistic, Space, List, Button, Typography } from "antd";
-import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
-import { useTranslation } from "react-i18next";
+import { Button, List, Space, Statistic, Typography } from "antd";
 import moment from "moment";
-import RenderTemplate, {
-  displayTemplateInWindow,
-} from "../../utils/RenderTemplate";
-import { TemplateList } from "../../utils/TemplateConstants";
+import React from "react";
+import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import { onlyUnique } from "../../utils/arrayHelper";
+import { GenerateDocument } from "../../utils/RenderTemplate";
+import { TemplateList } from "../../utils/TemplateConstants";
+import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -68,15 +66,14 @@ export function TimeTicketsSummaryEmployees({
   });
 
   const handlePrintEmployeeTicket = async (empId) => {
-    alert("Missing Key!");
-    const html = await RenderTemplate(
+    GenerateDocument(
       {
         name: TemplateList().time_tickets_by_employee.key,
         variables: { id: empId, start: startDate, end: endDate },
       },
-      bodyshop
+      {},
+      "p"
     );
-    displayTemplateInWindow(html);
   };
 
   return (