Added speedprint rework to checklist. IO-709

client/src/components/job-checklist/components/job-checklist-template-item/job-checklist-template-item.component.jsx

@@ -1,16 +0,0 @@
-import React from "react";
-import { PrinterFilled } from "@ant-design/icons";
-import { useTranslation } from "react-i18next";
-
-export default function JobChecklistTemplateItem({
-  templateKey,
-  renderTemplate,
-}) {
-  const { t } = useTranslation();
-  return (
-    <div>
-      {t(`printcenter.jobs.${templateKey}`)}
-      <PrinterFilled onClick={() => renderTemplate(templateKey)} />
-    </div>
-  );
-}

client/src/components/job-checklist/components/job-checklist-template-list/job-checklist-template-list.component.jsx

@@ -1,18 +1,26 @@
-import { Button } from "antd";
-import React from "react";
+import { PrinterFilled } from "@ant-design/icons";
+import { Button, List } from "antd";
+import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useParams } from "react-router-dom";
 import { logImEXEvent } from "../../../../firebase/firebase.utils";
-import { GenerateDocument } from "../../../../utils/RenderTemplate";
-import JobIntakeTemplateItem from "../job-checklist-template-item/job-checklist-template-item.component";
+import {
+  GenerateDocument,
+  GenerateDocuments,
+} from "../../../../utils/RenderTemplate";
+import { TemplateList } from "../../../../utils/TemplateConstants";
+const TemplateListGenerated = TemplateList();
 
 export default function JobIntakeTemplateList({ templates }) {
   const { jobId } = useParams();
   const { t } = useTranslation();
+  const [loading, setLoading] = useState(false);
+
   const renderTemplate = async (templateKey) => {
+    setLoading(true);
     logImEXEvent("job_checklist_template_render");
 
-    GenerateDocument(
+    await GenerateDocument(
       {
         name: templateKey,
         variables: { id: jobId },
@@ -20,27 +28,50 @@ export default function JobIntakeTemplateList({ templates }) {
       {},
       "p"
     );
+    setLoading(false);
   };
 
-  const renderAllTemplates = () => {
-    logImEXEvent("job_checklist_render_all_templates");
-
-    templates.forEach((template) => renderTemplate(template));
+  const renderAllTemplates = async () => {
+    logImEXEvent("checklist_render_all_templates");
+    setLoading(true);
+    console.log("templates :>> ", templates);
+    await GenerateDocuments(
+      templates.map((key) => {
+        return { name: key, variables: { id: jobId } };
+      })
+    );
+    setLoading(false);
   };
 
   return (
     <div>
-      {t("intake.labels.printpack")}
-      <Button onClick={renderAllTemplates}>
+      <Button onClick={renderAllTemplates} loading={loading}>
         {t("checklist.actions.printall")}
       </Button>
-      {templates.map((template) => (
-        <JobIntakeTemplateItem
-          key={template}
-          templateKey={template}
-          renderTemplate={renderTemplate}
-        />
-      ))}
+      <List
+        itemLayout="horizontal"
+        dataSource={templates}
+        renderItem={(template) => (
+          <List.Item
+            actions={[
+              <Button
+                loading={loading}
+                onClick={() => renderTemplate(template)}
+              >
+                <PrinterFilled />
+              </Button>,
+            ]}
+          >
+            <List.Item.Meta
+              title={
+                TemplateListGenerated[template] &&
+                TemplateListGenerated[template].title
+              }
+              // description={renderTemplateList(template.templates)}
+            />
+          </List.Item>
+        )}
+      />
     </div>
   );
 }

client/src/components/job-checklist/job-checklist.component.jsx

@@ -6,11 +6,11 @@ export default function JobIntakeComponent({ checklistConfig, type, job }) {
   const { form, templates } = checklistConfig;
 
   return (
-    <Row>
-      <Col span={12}>
+    <Row gutter={[48, 48]}>
+      <Col span={6}>
         <JobChecklistTemplateList templates={templates} type={type} />
       </Col>
-      <Col span={12}>
+      <Col span={18}>
         <JobChecklistForm formItems={form} type={type} job={job} />
       </Col>
     </Row>