Added email constants template + fixed email settings for parts order modal

client/src/components/parts-order-modal/parts-order-modal.component.jsx

@@ -1,5 +1,5 @@
 import { DeleteFilled } from "@ant-design/icons";
-import { DatePicker, Form, Input } from "antd";
+import { DatePicker, Form, Input, Radio } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import VendorSearchSelect from "../vendor-search-select/vendor-search-select.component";
@@ -93,14 +93,13 @@ export default function PartsOrderModalComponent({
           );
         }}
       </Form.List>
+      <Radio.Group
+        defaultValue={sendType}
+        onChange={e => setSendType(e.target.value)}
+      >
+        <Radio value={"e"}>{t("parts_orders.labels.email")}</Radio>
+        <Radio value={"p"}>{t("parts_orders.labels.print")}</Radio>
+      </Radio.Group>
     </div>
   );
 }
-
-// <Radio.Group
-// defaultValue={sendType}
-// onChange={e => setSendType(e.target.value)}
-// >
-// <Radio value={"e"}>{t("parts_orders.labels.email")}</Radio>
-// <Radio value={"p"}>{t("parts_orders.labels.print")}</Radio>
-// </Radio.Group>

client/src/components/parts-order-modal/parts-order-modal.container.jsx

@@ -1,6 +1,6 @@
 import { useMutation, useQuery } from "@apollo/react-hooks";
 import { Form, Modal, notification } from "antd";
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -9,10 +9,7 @@ import { REPORT_QUERY_PARTS_ORDER_BY_PK } from "../../emails/templates/parts-ord
 import { UPDATE_JOB_LINE_STATUS } from "../../graphql/jobs-lines.queries";
 import { INSERT_NEW_PARTS_ORDERS } from "../../graphql/parts-orders.queries";
 import { QUERY_ALL_VENDORS_FOR_ORDER } from "../../graphql/vendors.queries";
-import {
-  setEmailOptions,
-  toggleEmailOverlayVisible
-} from "../../redux/email/email.actions";
+import { setEmailOptions } from "../../redux/email/email.actions";
 import { toggleModalVisible } from "../../redux/modals/modals.actions";
 import { selectPartsOrder } from "../../redux/modals/modals.selectors";
 import {
@@ -22,26 +19,25 @@ import {
 import AlertComponent from "../alert/alert.component";
 import LoadingSpinner from "../loading-spinner/loading-spinner.component";
 import PartsOrderModalComponent from "./parts-order-modal.component";
+import { EmailSettings } from "../../emails/constants";
+
 const mapStateToProps = createStructuredSelector({
   currentUser: selectCurrentUser,
   bodyshop: selectBodyshop,
   partsOrderModal: selectPartsOrder
 });
+
 const mapDispatchToProps = dispatch => ({
   setEmailOptions: e => dispatch(setEmailOptions(e)),
-  toggleEmailOverlayVisible: () => dispatch(toggleEmailOverlayVisible()),
   toggleModalVisible: () => dispatch(toggleModalVisible("partsOrder"))
 });
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(function PartsOrderModalContainer({
+
+export function PartsOrderModalContainer({
   partsOrderModal,
   toggleModalVisible,
   currentUser,
   bodyshop,
-  setEmailOptions,
-  toggleEmailOverlayVisible
+  setEmailOptions
 }) {
   const { t } = useTranslation();
 
@@ -54,7 +50,6 @@ export default connect(
   const sendType = sendTypeState[0];
 
   const { loading, error, data } = useQuery(QUERY_ALL_VENDORS_FOR_ORDER, {
-    fetchPolicy: "network-only",
     skip: !visible
   });
   const [insertPartOrder] = useMutation(INSERT_NEW_PARTS_ORDERS);
@@ -88,17 +83,17 @@ export default connect(
             toggleModalVisible();
 
             if (sendType === "e") {
-              //Show the email modal and set the data.
-
               //TODO Remove hardcoding
               setEmailOptions({
                 messageOptions: {
                   from: {
-                    name: "Kavia Autobdoy",
-                    address: "noreply@bodyshop.app"
+                    name: bodyshop.shopname || EmailSettings.fromNameDefault,
+                    address: EmailSettings.fromAddress
                   },
-                  to: "patrickwf@gmail.com",
-                  replyTo: "snaptsoft@gmail.com"
+                  to:
+                    data.vendors.filter(item => item.id === values.id)[0] ||
+                    null,
+                  replyTo: bodyshop.shopname || null
                 },
                 template: PartsOrderEmailTemplate,
                 queryConfig: [
@@ -110,7 +105,6 @@ export default connect(
                   }
                 ]
               });
-              //toggleEmailOverlayVisible();
             }
           })
           .catch(error => {
@@ -144,6 +138,12 @@ export default connect(
       return acc;
     }, []);
 
+  useEffect(() => {
+    if (visible && !!linesToOrder) {
+      form.resetFields();
+    }
+  }, [visible, linesToOrder, form]);
+
   return (
     <Modal
       visible={visible}
@@ -151,6 +151,7 @@ export default connect(
       width="90%"
       onOk={() => form.submit()}
       destroyOnClose
+      forceRender
     >
       {error ? <AlertComponent message={error.message} type="error" /> : null}
       <LoadingSpinner loading={loading}>
@@ -168,4 +169,9 @@ export default connect(
       </LoadingSpinner>
     </Modal>
   );
-});
+}
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(PartsOrderModalContainer);

client/src/emails/constants.js

@@ -0,0 +1,4 @@
+export const EmailSettings = {
+  fromNameDefault: "Bodyshop.app",
+  fromAddress: "noreply@bodyshop.app"
+};