added refund and sms feature

client/src/components/payment-expanded-row/payment-expanded-row.component.jsx

@@ -1,10 +1,22 @@
-import React from "react";
-import { useQuery } from "@apollo/client";
-import { QUERY_PAYMENT_RESPONSE_BY_PAYMENT_ID } from "../../graphql/payment_response.queries";
-import { Descriptions } from "antd";
+import React, { useState } from "react";
+import { useMutation, useQuery } from "@apollo/client";
+import {
+  GET_REFUNDABLE_AMOUNT_BY_JOBID,
+  INSERT_PAYMENT_RESPONSE,
+  QUERY_PAYMENT_RESPONSE_BY_PAYMENT_ID,
+} from "../../graphql/payment_response.queries";
+import { Button, Descriptions, InputNumber, Modal } from "antd";
 import moment from "moment";
+import axios from "axios";
+import { INSERT_NEW_PAYMENT } from "../../graphql/payments.queries";
+
+const { confirm } = Modal;
 
 const PaymentExpandedRowComponent = ({ record }) => {
+  const [refundAmount, setRefundAmount] = useState(0);
+  const [insertPayment] = useMutation(INSERT_NEW_PAYMENT);
+  const [insertPaymentResponse] = useMutation(INSERT_PAYMENT_RESPONSE);
+
   const { loading, error, data } = useQuery(
     QUERY_PAYMENT_RESPONSE_BY_PAYMENT_ID,
     {
@@ -16,12 +28,79 @@ const PaymentExpandedRowComponent = ({ record }) => {
     }
   );
 
+  const { data: refundable_amount } = useQuery(GET_REFUNDABLE_AMOUNT_BY_JOBID, {
+    variables: {
+      jobid: record.jobid,
+    },
+  });
+
+  const insertPayments = async (payment_response, refund_response) => {
+    await insertPayment({
+      variables: {
+        paymentInput: {
+          amount: -refund_response.data.amount,
+          transactionid: payment_response.response.receiptelements.transid,
+          payer: record.payer,
+          type: "Refund",
+          jobid: payment_response.jobid,
+          date: moment(Date.now()),
+        },
+      },
+      update(cache, { data }) {
+        cache.modify({
+          id: cache.identify({
+            id: payment_response.jobid,
+            __typename: "jobs",
+          }),
+          fields: {
+            payments(payments) {
+              return [...data.insert_payments.returning, ...payments];
+            },
+          },
+        });
+      },
+    });
+
+    await insertPaymentResponse({
+      variables: {
+        paymentResponse: {
+          amount: -refund_response.data.amount,
+          bodyshopid: payment_response.bodyshopid,
+          paymentid: payment_response.paymentid,
+          jobid: payment_response.jobid,
+          declinereason: "Refund",
+          ext_paymentid: payment_response.ext_paymentid,
+          successful: true,
+          response: refund_response.data,
+        },
+      },
+    });
+  };
+
+  const showConfirm = (payment_response) => {
+    confirm({
+      title: "Do you want to refund payment?",
+      content:
+        "The payment will be refunded. Click OK to confirm and Cancel to dismiss.",
+      async onOk() {
+        const refundResponse = await axios.post("/intellipay/payment_refund", {
+          amount: refundAmount,
+          paymentid: payment_response.ext_paymentid,
+        });
+
+        insertPayments(payment_response, refundResponse);
+      },
+      onCancel() {},
+    });
+  };
+
   if (loading) return null;
 
   if (error) return <p>Error loading data. Please Reload</p>;
 
   const payment_response = data.payment_response[0];
-  console.log("Record", record);
+  const max_refundable_amount =
+    refundable_amount.payment_response_aggregate.aggregate.sum.amount;
 
   return (
     <div>
@@ -32,7 +111,7 @@ const PaymentExpandedRowComponent = ({ record }) => {
       >
         <Descriptions.Item label="Payer">{record.payer}</Descriptions.Item>
         <Descriptions.Item label="Payer Name">
-          {payment_response.response.nameOnCard}
+          {payment_response?.response?.nameOnCard ?? ""}
         </Descriptions.Item>
         <Descriptions.Item label="Amount">{record.amount}</Descriptions.Item>
         <Descriptions.Item label="Date of Payment">
@@ -42,11 +121,24 @@ const PaymentExpandedRowComponent = ({ record }) => {
           {record.transactionid}
         </Descriptions.Item>
         <Descriptions.Item label="Payment Reference ID">
-          {payment_response.response.paymentreferenceid}
+          {payment_response?.response?.paymentreferenceid ?? ""}
         </Descriptions.Item>
         <Descriptions.Item label="Payment Type">
           {record.type}
         </Descriptions.Item>
+        {payment_response && (
+          <Descriptions.Item label="Refund Amount">
+            <InputNumber
+              onChange={setRefundAmount}
+              max={max_refundable_amount}
+              min={0}
+            />
+
+            <Button onClick={() => showConfirm(payment_response)}>
+              Refund Payment
+            </Button>
+          </Descriptions.Item>
+        )}
       </Descriptions>
     </div>
   );