diff --git a/src/components/Drawers.tsx b/src/components/Drawers.tsx index ab88653..0a94792 100644 --- a/src/components/Drawers.tsx +++ b/src/components/Drawers.tsx @@ -20,6 +20,7 @@ import { withErrorBoundary } from "react-error-boundary"; import { handleComponentError } from "@root/utils/handleComponentError"; import ErrorOutlineIcon from "@mui/icons-material/ErrorOutline"; import { setNotEnoughMoneyAmount, useCartStore } from "@root/stores/cart"; +import { useDiffMoney } from "@root/stores/diffMoney"; function Drawers() { const [openNotificationsModal, setOpenNotificationsModal] = useState(false); @@ -35,6 +36,7 @@ function Drawers() { const userAccount = useUserStore((state) => state.userAccount); const tickets = useTicketStore((state) => state.tickets); const notEnoughMoneyAmount = useCartStore(state => state.notEnoughMoneyAmount); + const { setNewDiff } = useDiffMoney() const notificationsCount = tickets.filter( ({ user, top_message }) => user !== top_message.user_id && top_message.shown.me !== 1 @@ -67,6 +69,9 @@ function Drawers() { function handleReplenishWallet() { setIsDrawerOpen(false); + if (location.pathname.includes("/payment")) { + setNewDiff(notEnoughMoneyAmount) + } navigate("/payment", { state: { notEnoughMoneyAmount } }); } diff --git a/src/pages/Payment/Payment.tsx b/src/pages/Payment/Payment.tsx index e2e17f9..88bb214 100644 --- a/src/pages/Payment/Payment.tsx +++ b/src/pages/Payment/Payment.tsx @@ -25,13 +25,15 @@ import { currencyFormatter } from "@root/utils/currencyFormatter"; import { useHistoryTracker } from "@root/utils/hooks/useHistoryTracker"; import { cardShadow } from "@root/utils/theme"; import { enqueueSnackbar } from "notistack"; -import { useLayoutEffect, useState } from "react"; +import { useEffect, useLayoutEffect, useState } from "react"; import { useLocation, useNavigate } from "react-router-dom"; import CollapsiblePromocodeField from "./CollapsiblePromocodeField"; import PaymentMethodCard from "./PaymentMethodCard"; import { SorryModal } from "./SorryModal"; import { WarnModal } from "./WarnModal"; import { mutate } from "swr"; +import { useCartStore } from "@root/stores/cart"; +import { useDiffMoney } from "@root/stores/diffMoney"; type PaymentMethod = { label: string; @@ -66,11 +68,14 @@ export default function Payment() { const [fromSquiz, setIsFromSquiz] = useState(false); const location = useLocation(); console.log("location", location); + console.log("location", location.state); const verificationStatus = useUserStore((state) => state.verificationStatus); const userId = useUserStore((state) => state.userId); const navigate = useNavigate(); const handleCustomBackNavigation = useHistoryTracker(); + const {diffMoney, setNewDiff} = useDiffMoney() + const notEnoughMoneyAmount = (location.state?.notEnoughMoneyAmount as number) ?? 0; @@ -78,6 +83,14 @@ export default function Payment() { bigDecimal.multiply(parseFloat(paymentValueField), 100) ); + useEffect(() => { + console.log(diffMoney) + if (diffMoney > 0) { + setNewDiff(0) + setPaymentValueField((diffMoney / 100).toString()) + } + }, [diffMoney]) + useLayoutEffect(() => { setPaymentValueField((notEnoughMoneyAmount / 100).toString()); const params = new URLSearchParams(window.location.search); @@ -89,7 +102,7 @@ export default function Payment() { navigate(`/payment`, { replace: true, }); - }, []); + }, [ ]); async function handleChoosePaymentClick() { if (!selectedPaymentMethod) { diff --git a/src/stores/diffMoney.ts b/src/stores/diffMoney.ts new file mode 100644 index 0000000..2e3a49a --- /dev/null +++ b/src/stores/diffMoney.ts @@ -0,0 +1,14 @@ +import { HistoryRecord, HistoryRecord2 } from "@root/api/history"; +import { create } from "zustand"; +import { devtools, persist } from "zustand/middleware"; + + +type DiffMoneyType = { + diffMoney: number; + setNewDiff: (diff: number) => void +}; + +export const useDiffMoney = create((set) => ({ + diffMoney: 0, + setNewDiff: (diff: number) => set({diffMoney: diff}) + }));