From 209245187f713c7e9703deb146d04858edeea1f9 Mon Sep 17 00:00:00 2001
From: swtmply <delosreyesjohnallen@gmail.com>
Date: Thu, 25 May 2023 01:28:22 +0800
Subject: [PATCH 1/2] IO-2298 added export buttons on payments

---
 .../job-payments/job-payments.component.jsx   |  2 +-
 .../payment-modal/payment-modal.container.jsx | 25 +++++++++-
 .../payment-reexport-button.component.jsx     | 49 +++++++++++++++++++
 .../payment-list-paginated.component.jsx      |  2 +-
 client/src/translations/en_us/common.json     |  5 +-
 5 files changed, 79 insertions(+), 4 deletions(-)
 create mode 100644 client/src/components/payment-reexport-button/payment-reexport-button.component.jsx

diff --git a/client/src/components/job-payments/job-payments.component.jsx b/client/src/components/job-payments/job-payments.component.jsx
index a67ed047b..f13d57bbe 100644
--- a/client/src/components/job-payments/job-payments.component.jsx
+++ b/client/src/components/job-payments/job-payments.component.jsx
@@ -99,7 +99,7 @@ export function JobPayments({
       render: (text, record) => (
         <Space wrap>
           <Button
-            disabled={record.exportedat}
+            // disabled={record.exportedat}
             onClick={() => {
               setPaymentContext({
                 actions: { refetch: refetch },
diff --git a/client/src/components/payment-modal/payment-modal.container.jsx b/client/src/components/payment-modal/payment-modal.container.jsx
index a2e7e37fe..c9263769a 100644
--- a/client/src/components/payment-modal/payment-modal.container.jsx
+++ b/client/src/components/payment-modal/payment-modal.container.jsx
@@ -1,6 +1,6 @@
 import { useMutation } from "@apollo/client";
 
-import { Button, Form, Modal, notification } from "antd";
+import { Button, Form, Modal, notification, Space } from "antd";
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -19,6 +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";
 
 const mapStateToProps = createStructuredSelector({
   paymentModal: selectPayment,
@@ -176,12 +178,33 @@ function PaymentModalContainer({
         </span>
       }
     >
+      <Space>
+        <PaymentReexportButton
+          payment={context}
+          refetch={() => {
+            toggleModalVisible();
+
+            return actions.refetch;
+          }}
+        />
+        <PaymentExportButton
+          bodyshop={bodyshop}
+          paymentId={context.id}
+          disabled={!!context.exportedat}
+          refetch={() => {
+            toggleModalVisible();
+
+            return actions.refetch;
+          }}
+        />
+      </Space>
       <Form
         onFinish={handleFinish}
         autoComplete={"off"}
         form={form}
         layout="vertical"
         initialValues={context || {}}
+        disabled={context.exportedat}
       >
         <PaymentForm form={form} />
       </Form>
diff --git a/client/src/components/payment-reexport-button/payment-reexport-button.component.jsx b/client/src/components/payment-reexport-button/payment-reexport-button.component.jsx
new file mode 100644
index 000000000..a7830ec4b
--- /dev/null
+++ b/client/src/components/payment-reexport-button/payment-reexport-button.component.jsx
@@ -0,0 +1,49 @@
+import React from "react";
+import { Button, notification } from "antd";
+import { useTranslation } from "react-i18next";
+import { UPDATE_PAYMENT } from "../../graphql/payments.queries";
+import { useMutation } from "@apollo/client";
+
+const PaymentReexportButton = ({ payment, refetch }) => {
+  const { t } = useTranslation();
+  const [updatePayment, { loading }] = useMutation(UPDATE_PAYMENT);
+
+  const handleClick = async () => {
+    const paymentUpdateResponse = await updatePayment({
+      variables: {
+        paymentId: payment.id,
+        payment: {
+          exportedat: null,
+        },
+      },
+    });
+
+    if (!!!paymentUpdateResponse.errors) {
+      notification.open({
+        type: "success",
+        key: "paymentsuccessexport",
+        message: t("payments.successes.reexported"),
+      });
+
+      if (refetch) refetch();
+    } else {
+      notification["error"]({
+        message: t("payments.errors.exporting", {
+          error: JSON.stringify(paymentUpdateResponse.error),
+        }),
+      });
+    }
+  };
+
+  return (
+    <Button
+      onClick={handleClick}
+      loading={loading}
+      disabled={!payment.exportedat}
+    >
+      {t("bills.labels.markforreexport")}
+    </Button>
+  );
+};
+
+export default PaymentReexportButton;
diff --git a/client/src/components/payments-list-paginated/payment-list-paginated.component.jsx b/client/src/components/payments-list-paginated/payment-list-paginated.component.jsx
index d34b56f9c..8337c89f8 100644
--- a/client/src/components/payments-list-paginated/payment-list-paginated.component.jsx
+++ b/client/src/components/payments-list-paginated/payment-list-paginated.component.jsx
@@ -156,7 +156,7 @@ export function PaymentsListPaginated({
       render: (text, record) => (
         <Space>
           <Button
-            disabled={record.exportedat}
+            // disabled={record.exportedat}
             onClick={async () => {
               let apolloResults;
               if (search.search) {
diff --git a/client/src/translations/en_us/common.json b/client/src/translations/en_us/common.json
index e35eae607..d1c6c27ce 100644
--- a/client/src/translations/en_us/common.json
+++ b/client/src/translations/en_us/common.json
@@ -2217,10 +2217,13 @@
 				"new": "New Payment",
 				"signup": "Please contact support to sign up for electronic payments.",
 				"title": "Payments",
-				"totalpayments": "Total Payments"
+				"totalpayments": "Total Payments",
+				"markforexport": "Mark for Export",
+				"markforreexport": "Mark for Reexport"
 			},
 			"successes": {
 				"exported": "Payment(s) exported successfully.",
+				"reexported": "Payment Re-exported successfully",
 				"markexported": "Payment(s) marked exported.",
 				"payment": "Payment created successfully. ",
 				"stripe": "Credit card transaction charged successfully."

From 3c4902f71f7631308b43b206190d9fd69515c28f Mon Sep 17 00:00:00 2001
From: swtmply <delosreyesjohnallen@gmail.com>
Date: Fri, 26 May 2023 00:48:28 +0800
Subject: [PATCH 2/2] IO-2298 removed import destructure and added context
 reload

---
 .../payment-modal/payment-modal.container.jsx | 17 +++------------
 .../payment-reexport-button.component.jsx     | 21 +++++++++++++++++--
 2 files changed, 22 insertions(+), 16 deletions(-)

diff --git a/client/src/components/payment-modal/payment-modal.container.jsx b/client/src/components/payment-modal/payment-modal.container.jsx
index c9263769a..28c47c30c 100644
--- a/client/src/components/payment-modal/payment-modal.container.jsx
+++ b/client/src/components/payment-modal/payment-modal.container.jsx
@@ -19,7 +19,7 @@ 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 PaymentExportButton from "../payment-export-button/payment-export-button.component";
 import PaymentReexportButton from "../payment-reexport-button/payment-reexport-button.component";
 
 const mapStateToProps = createStructuredSelector({
@@ -179,23 +179,12 @@ function PaymentModalContainer({
       }
     >
       <Space>
-        <PaymentReexportButton
-          payment={context}
-          refetch={() => {
-            toggleModalVisible();
-
-            return actions.refetch;
-          }}
-        />
+        <PaymentReexportButton payment={context} refetch={actions.refetch} />
         <PaymentExportButton
           bodyshop={bodyshop}
           paymentId={context.id}
           disabled={!!context.exportedat}
-          refetch={() => {
-            toggleModalVisible();
-
-            return actions.refetch;
-          }}
+          refetch={actions.refetch}
         />
       </Space>
       <Form
diff --git a/client/src/components/payment-reexport-button/payment-reexport-button.component.jsx b/client/src/components/payment-reexport-button/payment-reexport-button.component.jsx
index a7830ec4b..c24d2eab1 100644
--- a/client/src/components/payment-reexport-button/payment-reexport-button.component.jsx
+++ b/client/src/components/payment-reexport-button/payment-reexport-button.component.jsx
@@ -3,8 +3,15 @@ import { Button, notification } from "antd";
 import { useTranslation } from "react-i18next";
 import { UPDATE_PAYMENT } from "../../graphql/payments.queries";
 import { useMutation } from "@apollo/client";
+import { setModalContext } from "../../redux/modals/modals.actions";
+import { connect } from "react-redux";
 
-const PaymentReexportButton = ({ payment, refetch }) => {
+const mapDispatchToProps = (dispatch) => ({
+  setPaymentContext: (context) =>
+    dispatch(setModalContext({ context: context, modal: "payment" })),
+});
+
+const PaymentReexportButton = ({ payment, refetch, setPaymentContext }) => {
   const { t } = useTranslation();
   const [updatePayment, { loading }] = useMutation(UPDATE_PAYMENT);
 
@@ -26,6 +33,16 @@ const PaymentReexportButton = ({ payment, refetch }) => {
       });
 
       if (refetch) refetch();
+
+      setPaymentContext({
+        actions: {
+          refetch,
+        },
+        context: {
+          ...payment,
+          exportedat: null,
+        },
+      });
     } else {
       notification["error"]({
         message: t("payments.errors.exporting", {
@@ -46,4 +63,4 @@ const PaymentReexportButton = ({ payment, refetch }) => {
   );
 };
 
-export default PaymentReexportButton;
+export default connect(null, mapDispatchToProps)(PaymentReexportButton);