feat: Payment userid param

src/index.tsx

@@ -189,7 +189,10 @@ const App = () => {
         <Route path="/quizpayment" element={<QuizPayment />} />
         <Route element={<Docs />}>
           <Route path={"/docs/oferta"} element={<Oferta />} />
-          <Route path="/docs/ofertaQuizDevelop" element={<OfertaQuizDevelop />} />
+          <Route
+            path="/docs/ofertaQuizDevelop"
+            element={<OfertaQuizDevelop />}
+          />
           <Route path={"/docs/privacy"} element={<PrivacyPolicy />} />
         </Route>
         <Route path="/afterpay" element={<AfterPay />} />
@@ -209,7 +212,7 @@ root.render(
       <CssBaseline />
       <SnackbarProvider />
       <App />
-      <CheckFastlink/>
+      <CheckFastlink />
     </BrowserRouter>
   </ThemeProvider>
   // </React.StrictMode>

src/pages/AfterPay/index.tsx

@@ -1,105 +1,121 @@
-import { Box, Button, Typography, useTheme, useMediaQuery } from "@mui/material";
+import {
+  Box,
+  Button,
+  Typography,
+  useTheme,
+  useMediaQuery,
+} from "@mui/material";
 import { payCart } from "@root/api/cart";
+import { useUserStore } from "@root/stores/user";
 import wallet_icon from "@root/assets/Icons/ColorWallet.svg";
 import { Link } from "react-router-dom";
 
-
 const MINUTE = 1000 * 60;
 
 const { domain, pathname } = (() => {
-    const params = new URLSearchParams(window.location.search);
+  const params = new URLSearchParams(window.location.search);
-    const from = params.get("from") || "hub";
+  const from = params.get("from") || "hub";
 
-    const purpose = params.get("purpose");
+  const purpose = params.get("purpose");
 
-    if (purpose === "paycart" || from === "quiz") {
+  if (purpose === "paycart" || from === "quiz") {
-        let tryCount = 0;
+    let tryCount = 0;
-    
-        const payCartPendingRequestDeadline = localStorage.getItem("payCartPendingRequestDeadline");
-        const deadline = payCartPendingRequestDeadline
-            ? Number(payCartPendingRequestDeadline)
-            : Date.now() + 20 * MINUTE;
 
-        localStorage.setItem("payCartPendingRequestDeadline", deadline.toString());
+    const payCartPendingRequestDeadline = localStorage.getItem(
+      "payCartPendingRequestDeadline"
+    );
+    const deadline = payCartPendingRequestDeadline
+      ? Number(payCartPendingRequestDeadline)
+      : Date.now() + 20 * MINUTE;
 
-        tryPayCart();
+    localStorage.setItem("payCartPendingRequestDeadline", deadline.toString());
 
-        async function tryPayCart() {
+    tryPayCart();
-            tryCount += 1;
-      
-            const [, payCartError] = await payCart();
 
-            if (!payCartError || Date.now() > deadline) {
+    async function tryPayCart() {
-                localStorage.removeItem("payCartPendingRequestDeadline");
+      tryCount += 1;
-                return;
-            }
 
-            setTimeout(tryPayCart, tryCount > 10 ? MINUTE / 60 : MINUTE / 6);
+      const [, payCartError] = await payCart();
-        }
+
+      if (!payCartError || Date.now() > deadline) {
+        localStorage.removeItem("payCartPendingRequestDeadline");
+        return;
+      }
+
+      setTimeout(tryPayCart, tryCount > 10 ? MINUTE / 60 : MINUTE / 6);
     }
+  }
 
-    const host = window.location.hostname;
+  const host = window.location.hostname;
-    return {
+  return {
-        domain: (host.includes("s") ? "s" : "") + from,
+    domain: (host.includes("s") ? "s" : "") + from,
-        pathname: from === "hub" ? "/tariffs" : "/list"
+    pathname: from === "hub" ? "/tariffs" : "/list",
-    };
+  };
 })();
 
 export default () => {
-    const theme = useTheme();
+  const theme = useTheme();
-    const phone = useMediaQuery(theme.breakpoints.down(375));
+  const phone = useMediaQuery(theme.breakpoints.down(375));
-    const redirectUrl = new URL(`https://${domain}.pena.digital${pathname}`);
+  const userId = useUserStore((state) => state.user?._id);
-    redirectUrl.searchParams.append("afterpay", "true");
+  const redirectUrl = new URL(`https://${domain}.pena.digital${pathname}`);
+  redirectUrl.searchParams.append("afterpay", "true");
+  redirectUrl.searchParams.append("userid", userId ?? "");
 
-    return (
+  return (
+    <Box
+      sx={{
+        width: "100vw",
+        height: "100vh",
+        p: phone ? "76px 16px" : "117px 0 0 0",
+      }}
+    >
+      <Box
+        sx={{
+          display: "flex",
+          flexDirection: "column",
+          alignItems: "center",
+        }}
+      >
         <Box
-            sx={{
+          component="img"
-                width: "100vw",
+          src={wallet_icon}
-                height: "100vh",
+          sx={{
-                p: phone ? "76px 16px" : "117px 0 0 0"
+            width: phone ? "338px" : "auto",
-            }}
+            height: phone ? "215px" : "auto",
+            mb: "60px",
+          }}
+        />
+        <Typography
+          sx={{
+            fontSize: phone ? "24px" : "36px",
+            fontWeight: 500,
+            lineHeight: "28.44px",
+            textAlign: "center",
+            mb: "10px",
+          }}
         >
-            <Box
+          Спасибо за оплату!
-                sx={{
+        </Typography>
-                    display: "flex",
+        <Typography
-                    flexDirection: "column",
+          sx={{
-                    alignItems: "center"
+            fontSize: "18px",
-                }}
+            lineHeight: "21.33px",
-            >
+            textAlign: "center",
-                <Box
+            color: theme.palette.gray.dark,
-                    component="img"
+            mb: "30px",
-                    src={wallet_icon}
+          }}
-                    sx={{
+        >
-                        width: phone ? "338px" : "auto",
+          Ваш платеж принят и в течение 10 минут товары будут зачислены
-                        height: phone ? "215px" : "auto",
+        </Typography>
-                        mb: "60px"
+        <Button
-                    }}
+          component={Link}
-                />
+          to={redirectUrl.toString()}
-                <Typography
+          replace={true}
-                    sx={{
+          variant="pena-contained-dark"
-                        fontSize: phone ? "24px" : "36px",
+        >
-                        fontWeight: 500,
+          На главную
-                        lineHeight: "28.44px",
+        </Button>
-                        textAlign: "center",
+      </Box>
-                        mb: "10px"
+    </Box>
-                    }}
+  );
-                >Спасибо за оплату!</Typography>
-                <Typography
-                    sx={{
-                        fontSize: "18px",
-                        lineHeight: "21.33px",
-                        textAlign: "center",
-                        color: theme.palette.gray.dark,
-                        mb: "30px"
-                    }}
-                >Ваш платеж принят и в течение 10 минут товары будут зачислены</Typography>
-                <Button
-                    component={Link}
-                    to={redirectUrl.toString()}
-                    replace={true}
-                    variant="pena-contained-dark"
-                >На главную</Button>
-            </Box>
-        </Box >
-    );
 };

src/pages/QuizPayment/QuizPayment.tsx

@@ -50,7 +50,7 @@ export default function QuizPayment() {
   useEffect(
     function redirectIfSignedIn() {
       if (!first && user?._id === userId)
-        navigate(`/payment?action=${action}&dif=${dif}`, { replace: true });
+        navigate(`/payment?action=${action}&dif=${dif}&user=${userId}`, { replace: true });
     },
     [navigate, user]
   );