diff --git a/src/components/UserSubscription/ProcessedPayment.jsx b/src/components/UserSubscription/ProcessedPayment.jsx index 06d2b0ce..b389f840 100644 --- a/src/components/UserSubscription/ProcessedPayment.jsx +++ b/src/components/UserSubscription/ProcessedPayment.jsx @@ -28,7 +28,6 @@ const ProcessedPayment = ({ const { details: client, planId: selectedPlanId,frequency } = useSelector( (store) => store.localVariables.selfTenant ); - console.log(frequency) const [selectedPlan, setSelectedPlan] = useState(null); const [currentPlan, setCurrentPlan] = useState(null); const [failPayment, setFailPayment] = useState(null); @@ -144,7 +143,7 @@ const ProcessedPayment = ({ ); } return ( -
+
@@ -309,7 +308,7 @@ const ProcessedPayment = ({
Email:
-
{client.email}
+
{client.email}
Contact Number: @@ -357,7 +356,7 @@ const ProcessedPayment = ({ className="btn btn-label-primary d-flex align-items-center me-2" onClick={() => ProcessToPayment(currentPlan?.price)} > - {isPending ? "Please Wait..." : "Processed To Payment"} + {isPending ? Please Wait... : "Processed To Payment"}
diff --git a/src/components/UserSubscription/VerifiedPayment.jsx b/src/components/UserSubscription/VerifiedPayment.jsx index 1a8f7d53..693ae0df 100644 --- a/src/components/UserSubscription/VerifiedPayment.jsx +++ b/src/components/UserSubscription/VerifiedPayment.jsx @@ -1,23 +1,86 @@ import React, { useEffect, useState } from "react"; import GlobalModel from "../common/GlobalModel"; import Invoice from "./Invoice"; +import { useSelector } from "react-redux"; +import { blockUI, unblockUI } from "../../utils/blockUI"; -const VerifiedPayment = ({ onNext, responsePayment }) => { +import { error } from "pdf-lib"; +import { useSelfGetSubscription } from "../../hooks/useAuth"; + + +const VerifiedPayment = ({ responsePayment, setStepStatus }) => { const [isGenerateInvoice, setIsGenerateInvoice] = useState(false); -useEffect(() => { - if (responsePayment?.success) { - onNext(); - } -}, [responsePayment]); - if (responsePayment) { + + const { tenantEnquireId, paymentDetailId, planId } = useSelector( + (store) => store.localVariables.selfTenant + ); + + const { + mutate: getSubscription, + isPending, + isError, + isSuccess, + error, + } = useSelfGetSubscription( + () => { + unblockUI(); + setStepStatus?.((prev) => ({ ...prev, 5: "success" })); + }, + () => { + unblockUI(); + setStepStatus?.((prev) => ({ ...prev, 5: "failed" })); + } + ); + + useEffect(() => { + if (responsePayment?.success) { + const payload = { tenantEnquireId, paymentDetailId, planId }; + getSubscription(payload); + } + }, [responsePayment]); + + + if (isError) { return (
-

Verifying payment...

+ className="bg-danger p-3 rounded-circle mb-3 d-flex align-items-center justify-content-center" + style={{ width: "70px", height: "70px" }} + > + +
+ +

Subscription Generation Failed!

+

+ Unfortunately, your subscription transaction could not be completed. +

+ + + +
+ Error Details: +
+              {JSON.stringify(error, null, 2)}
+            
+
+
+
+ ); + } + + + if (isPending) { + return ( +
+
+
+

Verifying Payment...

Please wait while we verify your transaction. Do not refresh or close this page. @@ -27,8 +90,8 @@ useEffect(() => { ); } - if (!responsePayment?.success) { - + + if (isSuccess) { return (

{isGenerateInvoice && ( @@ -39,28 +102,29 @@ useEffect(() => { )} +
- + Payment Successful!
-

+

Thank you for your payment. Your subscription has been successfully activated.

-
- - A Set Password link has been sent to your registered email address . - Please check your inbox . - -
+
+ + A Set Password link has been sent to your + registered email address. Please check your inbox. + +
-
+
Go to Dashboard @@ -79,3 +143,5 @@ useEffect(() => { }; export default VerifiedPayment; + + diff --git a/src/hooks/useAuth.jsx b/src/hooks/useAuth.jsx index ed45725e..11558b8a 100644 --- a/src/hooks/useAuth.jsx +++ b/src/hooks/useAuth.jsx @@ -16,6 +16,7 @@ import { import { removeSession } from "../utils/authUtils.js"; import showToast from "../services/toastService.tsx"; import eventBus from "../services/eventBus.js"; +import { blockUI } from "../utils/blockUI.js"; // ----------------------------Modal-------------------------- @@ -39,7 +40,7 @@ export const useSubscription = (frequency) => { const resp = await AuthRepository.getSubscription(frequency); return resp.data; }, - enabled: frequency !== null && frequency !== undefined + enabled: frequency !== null && frequency !== undefined, }); }; @@ -88,18 +89,53 @@ export const useCreateSelfTenant = (onSuccessCallBack, onFailureCallBack) => { return resp.data; }, onSuccess: (response, variables) => { - dispatch( setSelfTenant({ tenantEnquireId: response?.id, planId: null, - details:response + details: response, }) ); if (onSuccessCallBack) onSuccessCallBack(response); }, onError: (error) => { - showToast("Somthing worng went happend", "error"); + showToast( + `${error?.response?.data?.errors || ""} ${ + error?.response?.data?.message || "" + } ${error?.response?.data?.statusCode || ""}`.trim() || + error?.message || + "Something went wrong, please try again!", + "error" + ); + + if (onFailureCallBack) onFailureCallBack(); + }, + }); +}; + +export const useSelfGetSubscription = ( + onSuccessCallBack, + onFailureCallBack +) => { + const dispatch = useDispatch(); + return useMutation({ + mutationFn: async (payload) => { + blockUI(); + const resp = await AuthRepository.selfCreateSubscription(payload); + return resp.data; + }, + onSuccess: (response, variables) => { + if (onSuccessCallBack) onSuccessCallBack(response); + }, + onError: (error) => { + showToast( + `${error?.response?.data?.errors || ""} ${ + error?.response?.data?.message || "" + } ${error?.response?.data?.statusCode || ""}`.trim() || + error?.message || + "Something went wrong, please try again!", + "error" + ); if (onFailureCallBack) onFailureCallBack(); }, }); diff --git a/src/hooks/usePayment.jsx b/src/hooks/usePayment.jsx index bfe19fe8..fcbf44d1 100644 --- a/src/hooks/usePayment.jsx +++ b/src/hooks/usePayment.jsx @@ -1,8 +1,9 @@ import { useMutation, useQueryClient } from "@tanstack/react-query"; import { PaymentRepository } from "../repositories/PaymentRepository"; import showToast from "../services/toastService"; -import { useSelector } from "react-redux"; +import { useDispatch, useSelector } from "react-redux"; import { blockUI, unblockUI } from "../utils/blockUI"; +import { setSelfTenant } from "../slices/localVariablesSlice"; export const removeRazorpayArtifacts=()=> { try { @@ -56,11 +57,13 @@ const closeRazorpayPopup=()=> { export const useVerifyPayment = (onSuccessCallBack, onFailureCallBack) => { const client = useQueryClient(); + const dispatch = useDispatch() return useMutation({ mutationFn: (payload) => PaymentRepository.verifyPayment(payload), onSuccess: (data) => { + dispatch(setSelfTenant({ paymentDetailId: data?.data?.id })); if (onSuccessCallBack) onSuccessCallBack(data); }, diff --git a/src/pages/Home/MakeSubscription.jsx b/src/pages/Home/MakeSubscription.jsx index 1995fe03..12456155 100644 --- a/src/pages/Home/MakeSubscription.jsx +++ b/src/pages/Home/MakeSubscription.jsx @@ -97,10 +97,9 @@ const MakeSubscription = () => { name: "Verified", component: () => ( { - setStepStatus((prev) => ({ ...prev, 5: "success" })) - }} - responsePayment={responsePayment} + responsePayment={responsePayment} + setStepStatus={setStepStatus} + /> ), }, diff --git a/src/repositories/AuthRepository.jsx b/src/repositories/AuthRepository.jsx index 81c677b3..61cbc1d6 100644 --- a/src/repositories/AuthRepository.jsx +++ b/src/repositories/AuthRepository.jsx @@ -12,7 +12,9 @@ const AuthRepository = { sendMail: (data) => api.postPublic("/api/auth/sendmail", data), getSubscription: (frequency) => api.getPublic(`/api/market/list/subscription-plan?frequency=${frequency}`), - createSuscription:(data)=>api.post(`/api/Tenant/self/create`,data), + createSuscription: (data) => api.post(`/api/Tenant/self/create`, data), // this will put entry inside enquiry table + selfCreateSubscription: (data) => + api.post(`/api/Tenant/self/subscription`, data), // Protected routes (require auth token) logout: (data) => api.post("/api/auth/logout", data), diff --git a/src/slices/localVariablesSlice.jsx b/src/slices/localVariablesSlice.jsx index f80780bd..fba4390c 100644 --- a/src/slices/localVariablesSlice.jsx +++ b/src/slices/localVariablesSlice.jsx @@ -37,6 +37,7 @@ const localVariablesSlice = createSlice({ planId: null, details:null, frequency:null, + paymentDetailId:null }, }, reducers: { @@ -111,6 +112,7 @@ const localVariablesSlice = createSlice({ state.selfTenant.details = action.payload.details ?? state.selfTenant.details; state.selfTenant.frequency = action.payload.frequency ?? state.selfTenant.frequency; + state.selfTenant.paymentDetailId = action.payload.paymentDetailId ?? state.selfTenant.paymentDetailId; }, }, });