Begin work on speed print menu. BOD-229

client/src/components/payment-form/payment-form.component.jsx

@@ -66,7 +66,7 @@ export function PaymentFormComponent({
       </Form.Item>
 
       <Form.Item
-        label={t("payments.labels.type")}
+        label={t("payments.fields.type")}
         name="type"
         rules={[
           {

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

@@ -7,9 +7,10 @@ import { toggleModalVisible } from "../../redux/modals/modals.actions";
 import { selectPrintCenter } from "../../redux/modals/modals.selectors";
 import {
   selectBodyshop,
-  selectCurrentUser,
+  selectCurrentUser
 } from "../../redux/user/user.selectors";
 import PrintCenterItem from "../print-center-item/print-center-item.component";
+import PrintCenterSpeedPrint from "../print-center-speed-print/print-center-speed-print.component";
 import JobsReports from "./print-center-jobs.list";
 
 const mapStateToProps = createStructuredSelector({
@@ -17,17 +18,19 @@ const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
   printCenterModal: selectPrintCenter,
 });
+
 const mapDispatchToProps = (dispatch) => ({
   setEmailOptions: (e) => dispatch(setEmailOptions(e)),
   toggleModalVisible: () => dispatch(toggleModalVisible("printCenter")),
 });
-export function PrintCenterJobsComponent({ printCenterModal }) {
-  const { id: jobId } = printCenterModal.context;
 
+export function PrintCenterJobsComponent({ bodyshop, printCenterModal }) {
+  const { id: jobId } = printCenterModal.context;
   const JobsReportsList = JobsReports(null);
 
   return (
     <div>
+      <PrintCenterSpeedPrint job={jobId} />
       <Collapse accordion>
         {JobsReportsList.map((section) => (
           <Collapse.Panel key={section.key} header={section.title}>

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

@@ -0,0 +1,58 @@
+import React from "react";
+
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+import { logImEXEvent } from "../../firebase/firebase.utils";
+import RenderTemplate, {
+  displayTemplateInWindow,
+} from "../../utils/RenderTemplate";
+import { Button } from "antd";
+
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop, //currentUser: selectCurrentUser
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+
+export function PrintCenterSpeedPrint({ bodyshop, job }) {
+  const { speedprint } = bodyshop;
+
+  const renderTemplate = async (templateKey) => {
+    logImEXEvent("speed_print_template_render");
+
+    const html = await RenderTemplate(
+      {
+        name: templateKey,
+        variables: { id: job.id },
+      },
+      bodyshop
+    );
+    displayTemplateInWindow(html);
+  };
+
+  const renderAllTemplates = (templateKeys) => {
+    logImEXEvent("speed_print_render_all_templates");
+
+    templateKeys.forEach((templateKey) => renderTemplate(templateKey));
+  };
+
+  return (
+    <div>
+      {speedprint.map((sp) => (
+        <div>
+          {JSON.stringify(sp)}
+          <Button onClick={() => renderAllTemplates(sp.templates)}>
+            Print All
+          </Button>
+        </div>
+      ))}
+    </div>
+  );
+}
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(PrintCenterSpeedPrint);