diff --git a/src/components/collections/AddPayment.jsx b/src/components/collections/AddPayment.jsx index 71b87edf..2bc97494 100644 --- a/src/components/collections/AddPayment.jsx +++ b/src/components/collections/AddPayment.jsx @@ -1,11 +1,179 @@ -import React from 'react' +import { zodResolver } from "@hookform/resolvers/zod"; +import React, { useState } from "react"; +import { FormProvider, useForm } from "react-hook-form"; +import { defaultPayment, paymentSchema } from "./collectionSchema"; +import Label from "../common/Label"; +import DatePicker from "../common/DatePicker"; +import { formatDate } from "date-fns"; +import { useCollectionContext } from "../../pages/collections/CollectionPage"; +import { useAddPayment, useCollection } from "../../hooks/useCollections"; +import { formatFigure, localToUtc } from "../../utils/appUtils"; +import { formatUTCToLocalTime } from "../../utils/dateUtils"; +import Avatar from "../common/Avatar"; +import { PaymentHistorySkeleton } from "./CollectionSkeleton"; + +const AddPayment = ({ onClose }) => { + const { addPayment } = useCollectionContext(); + const { data, isLoading, isError, error } = useCollection( + addPayment?.invoiceId + ); + const methods = useForm({ + resolver: zodResolver(paymentSchema), + defaultValues: defaultPayment, + }); + const { + control, + register, + handleSubmit, + reset, + formState: { errors }, + } = methods; + const { mutate: AddPayment, isPending } = useAddPayment(() => { + handleClose(); + }); + const onSubmit = (formData) => { + const payload = { + ...formData, + paymentReceivedDate: localToUtc(formData.paymentReceivedDate), + invoiceId: addPayment.invoiceId, + }; + + AddPayment(payload); + }; + const handleClose = (formData) => { + reset(defaultPayment); + onClose(); + }; -const AddPayment = () => { return ( -
+ Date:{" "} + {formatUTCToLocalTime(payment.paymentReceivedDate)} +
{" "} + + {formatFigure(payment.amount, { + type: "currency", + currency: "INR", + })} + ++ Transaction ID:{" "} + {payment.transactionId} +
+Collection Details
+{data?.title}
+{data?.description}
+Received Payments
+Sr,No | +Transaction ID | +Received Date | +Amount | +Received By | +
---|---|---|---|---|
{index + 1} | +{payment.transactionId} | +{formatUTCToLocalTime(payment.paymentReceivedDate)} | ++ {formatFigure(payment.amount, { + type: "currency", + currency: "INR", + })} + | +
+
+
+ |
+