автооткрытие модалки запроса после удачного и неудачного покупки тарифа на создание. хранение инфо об этом

src/pages/Tariffs/Tariffs.tsx

@@ -40,6 +40,7 @@ import { getTariffs } from "@api/tariff";
 import type { Discount } from "@model/discounts";
 import { Other } from "./pages/Other";
 import { ModalRequestCreate } from "./ModalRequestCreate";
+import { cancelCC, useCC } from "@/stores/cc";
 
 const StepperText: Record<string, string> = {
   day: "Тарифы на время",
@@ -64,6 +65,7 @@ function TariffPage() {
   const [selectedItem, setSelectedItem] = useState<TypePages>("day");
   const { isTestServer } = useDomainDefine();
   const [promocodeField, setPromocodeField] = useState<string>("");
+  const cc = useCC(store => store.cc)
 
   const getTariffsList = async (): Promise<Tariff[]> => {
     const tariffsList: Tariff[] = [];
@@ -116,6 +118,12 @@ function TariffPage() {
     get();
   }, []);
 
+  useEffect(() => {
+    if (cc) {
+      setIsRequestCreate(true)
+      cancelCC()
+    }
+  }, [])
   if (!user || !tariffs || !discounts) return <LoadingPage />;
 
   const openModalHC = (tariffInfo: any) => setOpenModal(tariffInfo);
@@ -144,6 +152,7 @@ function TariffPage() {
         let cashDif = Number(payError.split(":")[1]);
         var link = document.createElement("a");
         link.href = `https://${isTestServer ? "s" : ""}hub.pena.digital/quizpayment?action=squizpay&dif=${cashDif}&data=${token}&userid=${userId}`;
+        if (cc) link.href = link.href + "cc=true"//после покупки тарифа и возвращения будем знать что надо открыть модалку
         document.body.appendChild(link);
         link.click();
         return;
@@ -161,6 +170,9 @@ function TariffPage() {
       Number(data.wallet.cash) / 100,
     );
 
+    //cc - пометка что мы хотим заказать квиз. Если хотели, то открываем модалку
+    if (cc) setIsRequestCreate(true)
+    cancelCC()//но в любом случае в конце перехотим
     enqueueSnackbar("Тариф успешно приобретён");
 
     //Развращаем товары в корзину
@@ -213,6 +225,7 @@ function TariffPage() {
     setIsRequestCreate(true)
   }
 
+
   return (
     <>
       <Container
@@ -430,6 +443,7 @@ const outCart = (cart: string[]) => {
 
       if (deleteError) {
         console.error(deleteError);
+        cancelCC()//мы хотели открыть модалку после покупки тарифа на создание квиза, но не вышло и модалку не откроем
 
         return;
       }

src/pages/Tariffs/pages/Other.tsx

@@ -24,8 +24,7 @@ export const Other = ({
     const theme = useTheme()
     const isTablet = useMediaQuery(theme.breakpoints.down(1000));
 const sendRequestToCreate = userPrivilegies?.quizManual.amount > 0 ? startRequestCreate : undefined
-console.log("sendRequestToCreate")
-console.log(sendRequestToCreate)
+
     switch (selectedItem) {
         case "hide":
             const filteredBadgeTariffs = tariffs.filter((tariff) => {
@@ -79,7 +78,8 @@ console.log(sendRequestToCreate)
                     user,
                     discounts,
                     openModalHC,
-                    sendRequestToCreate
+                    sendRequestToCreate,
+                    true
                 )}
             </Box>
         default:

src/pages/Tariffs/tariffsUtils/createTariffElements.tsx

@@ -4,6 +4,7 @@ import NumberIcon from "@icons/NumberIcon";
 import { currencyFormatter } from "./currencyFormatter";
 import FreeTariffCard from "./FreeTariffCard";
 import { Typography } from "@mui/material";
+import { startCC } from "@/stores/cc";
 
 export const createTariffElements = (
   filteredTariffs: Tariff[],
@@ -11,7 +12,8 @@ export const createTariffElements = (
   user: any,
   discounts: any,
   onclick: any,
-  sendRequestToCreate?: () => void
+  sendRequestToCreate?: () => void,
+  cc?: boolean
 ) => {
   const tariffElements = filteredTariffs
     .filter((tariff) => tariff.privileges.length > 0)
@@ -31,9 +33,9 @@ export const createTariffElements = (
           discount={
             priceBeforeDiscounts - priceAfterDiscounts
               ? `${(
-                  (priceBeforeDiscounts - priceAfterDiscounts) /
-                  (Math.trunc(priceBeforeDiscounts) / 100)
-                ).toFixed(0)}%`
+                (priceBeforeDiscounts - priceAfterDiscounts) /
+                (Math.trunc(priceBeforeDiscounts) / 100)
+              ).toFixed(0)}%`
               : ""
           }
           icon={
@@ -45,11 +47,13 @@ export const createTariffElements = (
           }
           buttonProps={{
             text: "Купить",
-            onClick: () =>
+            onClick: () => {
+              if (cc) startCC() //пометка что это запрос на создание квиза
               onclick({
                 id: tariff._id,
                 price: Math.trunc(priceAfterDiscounts) / 100,
-              }),
+              })
+            }
           }}
           sendRequestToCreate={sendRequestToCreate}
           headerText={tariff.name}

src/stores/cc.ts

@@ -0,0 +1,25 @@
+import { create } from "zustand";
+import { devtools } from "zustand/middleware";
+
+interface CartStore {
+    cc: boolean
+}
+const initialState: CartStore = {
+    cc: false
+}
+
+//Была попытка оплатить корзину. Тут записанна недостающая сумма.
+export const useCC = create<CartStore>()(
+    devtools(
+        (get, set) => initialState,
+        {
+            name: "cc",
+            enabled: process.env.NODE_ENV === "development",
+            trace: true,
+            actionsBlacklist: "rejected",
+        }
+    )
+);
+
+export const cancelCC = () => useCC.setState({ cc: false });
+export const startCC = () => useCC.setState({ cc: true });

src/utils/hooks/useAutoPay.ts

@@ -3,8 +3,9 @@ import { useUserStore } from "@/stores/user";
 import moment from "moment";
 import { enqueueSnackbar } from "notistack";
 import { useEffect } from "react";
-import { useNavigate, useSearchParams } from "react-router-dom";
+import { redirect, useNavigate, useSearchParams } from "react-router-dom";
 import { calcTimeOfReadyPayCart, cancelPayCartProcess, startPayCartProcess, useNotEnoughMoneyAmount } from "@/stores/notEnoughMoneyAmount";
+import { startCC } from "@/stores/cc";
 
 export const useAfterPay = () => {
   const navigate = useNavigate();
@@ -15,6 +16,7 @@ export const useAfterPay = () => {
 
   const purpose = searchParams.get("purpose");
   const paymentUserId = searchParams.get("userid");
+  const currentCC = searchParams.get("cc");
 
 
   useEffect(() => {
@@ -22,18 +24,20 @@ export const useAfterPay = () => {
     if (paymentUserId && paymentUserId === userId) {
 
       if (purpose === "paycart") {
-      setSearchParams({}, { replace: true });
+        setSearchParams({}, { replace: true });
+        if (currentCC) { startCC() }
         (async () => {
 
           //Проверяем можем ли мы оплатить корзину здесь и сейчас
           const [, payCartError] = await cartApi.pay();
-          console.log("попытка оплаты не удалась")
 
           if (payCartError) {
+            console.log("попытка оплаты не удалась")
             //Не получилось купить корзину. Ставим флаг, что сайт в состоянии ожидания пополнения счёта для оплаты
             startPayCartProcess(paymentUserId)
           } else {
             enqueueSnackbar("Товары успешно приобретены")
+            if (currentCC) navigate("tariffs")
             cancelPayCartProcess()
           }
         })()