стр пополнения берёт недостающую сумму из боковой корзины

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<boolean>(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 } });
     }
 

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<boolean>(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) {

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<DiffMoneyType>((set) => ({
+    diffMoney: 0,
+    setNewDiff: (diff: number) => set({diffMoney: diff})
+  }));