Merged in feature/IO-2298-payment-export (pull request #809)

IO-2298 added mark for export button on payment

Approved-by: Patrick Fic

client/src/components/payment-mark-export-button/payment-mark-export-button-component.jsx

@@ -0,0 +1,100 @@
+import React from "react";
+import { Button, notification } from "antd";
+import { useMutation } from "@apollo/client";
+import { useTranslation } from "react-i18next";
+import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
+import { setModalContext } from "../../redux/modals/modals.actions";
+import { connect } from "react-redux";
+import { UPDATE_PAYMENT } from "../../graphql/payments.queries";
+import { selectCurrentUser } from "../../redux/user/user.selectors";
+import { createStructuredSelector } from "reselect";
+
+const mapStateToProps = createStructuredSelector({
+  currentUser: selectCurrentUser,
+});
+
+const mapDispatchToProps = (dispatch) => ({
+  setPaymentContext: (context) =>
+    dispatch(setModalContext({ context: context, modal: "payment" })),
+});
+
+const PaymentMarkForExportButton = ({
+  bodyshop,
+  payment,
+  refetch,
+  setPaymentContext,
+  currentUser,
+}) => {
+  const { t } = useTranslation();
+  const [insertExportLog, { loading: exportLogLoading }] =
+    useMutation(INSERT_EXPORT_LOG);
+  const [updatePayment, { loading: updatePaymentLoading }] =
+    useMutation(UPDATE_PAYMENT);
+
+  const handleClick = async () => {
+    const today = new Date();
+
+    await insertExportLog({
+      variables: {
+        logs: [
+          {
+            bodyshopid: bodyshop.id,
+            paymentid: payment.id,
+            successful: true,
+            useremail: currentUser.email,
+          },
+        ],
+      },
+    });
+
+    const paymentUpdateResponse = await updatePayment({
+      variables: {
+        paymentId: payment.id,
+        payment: {
+          exportedat: today,
+        },
+      },
+    });
+
+    if (!!!paymentUpdateResponse.errors) {
+      notification.open({
+        type: "success",
+        key: "paymentsuccessmarkforexport",
+        message: t("payments.successes.markexported"),
+      });
+
+      if (refetch) refetch();
+
+      setPaymentContext({
+        actions: {
+          refetch,
+        },
+        context: {
+          ...payment,
+          exportedat: today,
+        },
+      });
+    } else {
+      notification["error"]({
+        message: t("payments.errors.exporting", {
+          error: JSON.stringify(paymentUpdateResponse.error),
+        }),
+      });
+    }
+  };
+
+  return (
+    <Button
+      onClick={handleClick}
+      loading={exportLogLoading || updatePaymentLoading}
+      disabled={!!payment.exportedat}
+    >
+      {t("payments.labels.markforexport")}
+    </Button>
+  );
+};
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(PaymentMarkForExportButton);

client/src/components/payment-modal/payment-modal.container.jsx

@@ -19,8 +19,8 @@ import {
 import { GenerateDocument } from "../../utils/RenderTemplate";
 import { TemplateList } from "../../utils/TemplateConstants";
 import PaymentForm from "../payment-form/payment-form.component";
-import PaymentExportButton from "../payment-export-button/payment-export-button.component";
 import PaymentReexportButton from "../payment-reexport-button/payment-reexport-button.component";
+import PaymentMarkForExportButton from "../payment-mark-export-button/payment-mark-export-button-component";
 
 const mapStateToProps = createStructuredSelector({
   paymentModal: selectPayment,
@@ -180,10 +180,9 @@ function PaymentModalContainer({
     >
       <Space>
         <PaymentReexportButton payment={context} refetch={actions.refetch} />
-        <PaymentExportButton
+        <PaymentMarkForExportButton
           bodyshop={bodyshop}
-          paymentId={context.id}
-          disabled={!!context.exportedat}
+          payment={context}
           refetch={actions.refetch}
         />
       </Space>

client/src/components/payment-reexport-button/payment-reexport-button.component.jsx

@@ -29,7 +29,7 @@ const PaymentReexportButton = ({ payment, refetch, setPaymentContext }) => {
       notification.open({
         type: "success",
         key: "paymentsuccessexport",
-        message: t("payments.successes.reexported"),
+        message: t("payments.successes.markreexported"),
       });
 
       if (refetch) refetch();
@@ -58,7 +58,7 @@ const PaymentReexportButton = ({ payment, refetch, setPaymentContext }) => {
       loading={loading}
       disabled={!payment.exportedat}
     >
-      {t("bills.labels.markforreexport")}
+      {t("payments.labels.markforreexport")}
     </Button>
   );
 };

client/src/translations/en_us/common.json

@@ -2219,11 +2219,11 @@
 				"title": "Payments",
 				"totalpayments": "Total Payments",
 				"markforexport": "Mark for Export",
-				"markforreexport": "Mark for Reexport"
+				"markforreexport": "Mark for Re-export"
 			},
 			"successes": {
 				"exported": "Payment(s) exported successfully.",
-				"reexported": "Payment Re-exported successfully",
+				"markreexported": "Payment marked for re-export successfully",
 				"markexported": "Payment(s) marked exported.",
 				"payment": "Payment created successfully. ",
 				"stripe": "Credit card transaction charged successfully."