карточки при наличии привилегии предлагают запросить создание квиза

2024-08-21 17:57:09 +03:00 · 2024-08-21 17:57:09 +03:00 · 27a428e515
commit 27a428e515
parent b7f2ee2e86
7 changed files with 123 additions and 54 deletions
--- a/package.json
+++ b/package.json
@ -16,7 +16,7 @@
        "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
        "@emotion/react": "^11.10.5",
        "@emotion/styled": "^11.10.5",
-        "@frontend/kitui": "^1.0.85",
+        "@frontend/kitui": "^1.0.86",
        "@mui/icons-material": "^5.10.14",
        "@mui/material": "^5.10.14",
        "@mui/x-date-pickers": "^7.13.0",
--- a/src/index.tsx
+++ b/src/index.tsx
@ -36,6 +36,8 @@ import {
  setUser,
  setUserAccount,
  useUserStore,
+  OriginalUserSquizAccount,
+  setQuizUserAccount
 } from "./stores/user";
 import TariffConstructor from "./pages/TariffConstructor/TariffConstructor";
 import {
@ -57,10 +59,8 @@ import OutdatedLink from "@root/pages/auth/OutdatedLink";
 import { verify } from "./pages/AccountSettings/helper";
 import AfterPay from "./pages/AfterPay";
 import { PageNotFound } from "./pages/PageNotFound";
-import { setSiteReadyPayCart, useNotEnoughMoneyAmount } from "@stores/notEnoughMoneyAmount"
+import { useNotEnoughMoneyAmount } from "@stores/notEnoughMoneyAmount"
 import { usePipeSubscriber } from "./utils/hooks/usePipeSubscriber";
-import moment from "moment";
-import { payCart } from "./api/cart";
 import { useAfterPay } from "./utils/hooks/useAutoPay";
 import { LocalizationProvider } from "@mui/x-date-pickers";

@ -70,10 +70,7 @@ const localeText =
  ruRU.components.MuiLocalizationProvider.defaultProps.localeText;
 const App = () => {
  const location = useLocation();
-  const user = useUserStore(state => state.user);
-  const userAccount = useUserStore(state => state.userAccount);
  const userId = useUserStore(state => state.userId);
-  const siteReadyPayCart = useNotEnoughMoneyAmount(state => state.siteReadyPayCart);
  const navigate = useNavigate();
  useUserFetcher({
    url: process.env.REACT_APP_DOMAIN + `/user/${userId}`,
@ -104,6 +101,21 @@ const App = () => {
    },
  });

+  useUserAccountFetcher<OriginalUserSquizAccount>({
+    url: `${process.env.REACT_APP_DOMAIN}/squiz/account/get`,
+    userId,
+    onNewUserAccount: setQuizUserAccount,
+    onError: (error) => {
+      const errorMessage = getMessageFromFetchError(error);
+      if (errorMessage) {
+        enqueueSnackbar(errorMessage);
+        clearUserData();
+        clearAuthToken();
+        navigate("/signin");
+      }
+    },
+  });
+
  usePipeSubscriber()

  verify(userId);
--- a/src/pages/Tariffs/ModalRequestCreate.tsx
+++ b/src/pages/Tariffs/ModalRequestCreate.tsx
@ -94,7 +94,11 @@ export const ModalRequestCreate = ({
    if (isSending) return (
        <Modal
            open={open}
-            onClose={onClose}
+            onClose={() => {
+                onClose()
+                setIsSending(false)
+            }}
+            
        >
            <Box sx={{
                position: 'absolute' as 'absolute',
@ -171,7 +175,7 @@ export const ModalRequestCreate = ({
                            sx={{
                                fontSize: "18px",
                                padding: "20px",
-                                color: "#F2F3F7",
+                                color: "rgb(154, 154, 175)",
                                borderRadius: "10px 10px 0 0"
                            }}
                        >
@ -277,6 +281,13 @@ export const ModalRequestCreate = ({
                                        ampm={false}
                                        value={values.time}
                                        views={['hours', 'minutes']} format="hh:mm"
+                                        sx={{
+                                            border: "#c4c4c4 1px solid",
+                                            borderRadius: "4px",
+                                            "& .MuiInputBase-root": {
+                                                display: "flex"
+                                            }
+                                        }}
                                    />

                                </Box>
@ -292,6 +303,8 @@ export const ModalRequestCreate = ({
                                        disabled={isSubmitting}
                                        sx={{
                                            py: "12px",
+                                            bgcolor: "rgb(126, 42, 234)",
+                                            borderRadius: "8px",
                                            "&:hover": {
                                                backgroundColor: "#581CA7",
                                            },
--- a/src/pages/Tariffs/TariffCard.tsx
+++ b/src/pages/Tariffs/TariffCard.tsx
@ -15,11 +15,12 @@ interface Props {
    text?: string;
  };
  price?: ReactNode;
+  sendRequestToCreate?: () => void;
 }

-export default function TariffCard({ icon, headerText, text, sx, price, buttonProps, discount }: Props) {
-    const theme = useTheme();
-    const isMobile = useMediaQuery(theme.breakpoints.down(600));
+export default function TariffCard({ icon, headerText, text, sx, price, buttonProps, discount, sendRequestToCreate }: Props) {
+  const theme = useTheme();
+  const isMobile = useMediaQuery(theme.breakpoints.down(600));
  return (
    <Box
      sx={{
@ -79,20 +80,20 @@ export default function TariffCard({ icon, headerText, text, sx, price, buttonPr
          </Box>
        )}
      </Box>
-       {/* <Tooltip title={<Typography>{headerText}</Typography>} placement="top"> */}
-        <Typography
-          variant="h5"
-          sx={{
-            mt: "14px",
-            mb: "10px",
-            textOverflow: "ellipsis",
-            overflow: "hidden",
-            whiteSpace: "nowrap",
-            width: "100%",
-          }}
-        >
-          {headerText}
-        </Typography>
+      {/* <Tooltip title={<Typography>{headerText}</Typography>} placement="top"> */}
+      <Typography
+        variant="h5"
+        sx={{
+          mt: "14px",
+          mb: "10px",
+          textOverflow: "ellipsis",
+          overflow: "hidden",
+          whiteSpace: "nowrap",
+          width: "100%",
+        }}
+      >
+        {headerText}
+      </Typography>
      {/* </Tooltip>
      <Tooltip
        title={text.map((line, index) => (
@ -100,29 +101,47 @@ export default function TariffCard({ icon, headerText, text, sx, price, buttonPr
        ))}
        placement="top"
      > */}
-        <Box
-          sx={{
-            width: "100%",
-            mb: "auto",
-          }}
-        >
-            <Typography sx={{ overflow: "hidden", textOverflow: "ellipsis" }}>
-              {text}
-            </Typography>
-        </Box>
+      <Box
+        sx={{
+          width: "100%",
+          mb: "auto",
+        }}
+      >
+        <Typography sx={{ overflow: "hidden", textOverflow: "ellipsis" }}>
+          {text}
+        </Typography>
+      </Box>
      {/* </Tooltip> */}
-      {buttonProps && (
-        <Button
-          onClick={buttonProps.onClick}
-          variant="pena-outlined-purple"
-          sx={{
-            mt: "10px",
-            ...buttonProps.sx,
-          }}
-        >
-          {buttonProps.text}
-        </Button>
-      )}
+      <Box
+
+        sx={{
+          display: "flex",
+          width: "100%",
+          alignItems: "center",
+        }}>
+        {buttonProps && (
+          <Button
+            onClick={buttonProps.onClick}
+            variant="pena-outlined-purple"
+            sx={{
+              mt: "10px",
+              ...buttonProps.sx,
+            }}
+          >
+            {buttonProps.text}
+          </Button>
+        )}
+        {Boolean(sendRequestToCreate) && (
+          <Button
+            sx={{
+              ml: "30px"
+            }}
+            onClick={sendRequestToCreate}
+          >
+            Запросить
+          </Button>
+        )}
+      </Box>
    </Box>
  );
 }
--- a/src/pages/Tariffs/TariffsPage.tsx
+++ b/src/pages/Tariffs/TariffsPage.tsx
@ -51,7 +51,8 @@ function TariffPage() {
  const purchasesAmount =
    useUserStore((state) => state.userAccount?.wallet.spent) ?? 0;
  const userId = useUserStore((state) => state.user?._id) ?? "";
-  const userPrivilegies = useUserStore(store => store);
+  const userPrivilegies = useUserStore(store => store.quizUserAccount?.privileges);
+  console.log(userPrivilegies)//quizManual.amount > 0
  const discounts = useDiscounts(userId);
  const isUserNko =
    useUserStore((state) => state.userAccount?.status) === "nko";
@ -89,6 +90,7 @@ function TariffPage() {
    filteredTariffs: Tariff[],
    addFreeTariff = false
  ) => {
+    const isCC = userPrivilegies?.quizManual?.amount !== undefined && userPrivilegies?.quizManual?.amount > 0
    const tariffElements = filteredTariffs
      .filter((tariff) => tariff.privileges.length > 0)
      .map((tariff, index) => {
@ -98,7 +100,7 @@ function TariffPage() {
          purchasesAmount,
          currentTariffs ?? [],
          isUserNko,
-          userId
+          userId,
        );

        return (
@ -127,6 +129,7 @@ function TariffPage() {
              text: "Выбрать",
              onClick: () => handleTariffItemClick(tariff._id),
            }}
+            sendRequestToCreate={() => setIsRequestCreate(true)}
            headerText={tariff.name}
            text={tariff.description || ""}
            price={
--- a/src/stores/user.ts
+++ b/src/stores/user.ts
@ -16,6 +16,14 @@ import { patchCurrency, deleteCart, patchCart } from "@root/api/cart"
 import { User, UserAccount, UserName, getInitials, patchUserAccount } from "@frontend/kitui"
 import { cancelPayCartProcess, setNotEnoughMoneyAmount, setSiteReadyPayCart, useNotEnoughMoneyAmount } from "./notEnoughMoneyAmount";

+type Privilege = {
+	amount: number;
+	created_at: string;
+	id: string;
+	privilege_id: string;
+	privilege_name: string;
+  };
+
 interface UserStore {
 	userId: string | null;
 	user: User | null;
@ -29,8 +37,19 @@ interface UserStore {
 	documentsUrl: UserDocumentsUrl;
 	comment: string;
 	initials: string;
+	quizUserAccount: OriginalUserSquizAccount | null;
 }

+
+export type OriginalUserSquizAccount = {
+	created_at: string;
+	deleted: boolean;
+	email: string;
+	id: string;
+	privileges: Record<string, Privilege>;
+	privilege_name: string;
+  };
+
 const defaultFieldValues = {
 	value: "",
 	error: null,
@ -58,6 +77,7 @@ const initialState: UserStore = {
 	userId: null,
 	user: null,
 	userAccount: null,
+	quizUserAccount: null,
 	settingsFields: { ...defaultFields },
 	verificationStatus: VerificationStatus.NOT_VERIFICATED,
 	verificationType: "juridical",
@ -151,6 +171,8 @@ export const setUserAccount = (user: UserAccount) =>
 		}
 	)

+export const setQuizUserAccount = (quizUserAccount: OriginalUserSquizAccount) => useUserStore.setState({ quizUserAccount });
+
 export const setNewNames = (name: UserName) =>
 	useUserStore.setState(
 		produce<UserStore>((state) => {
--- a/yarn.lock
+++ b/yarn.lock
@ -1633,10 +1633,10 @@
  resolved "https://registry.yarnpkg.com/@floating-ui/utils/-/utils-0.2.1.tgz#16308cea045f0fc777b6ff20a9f25474dd8293d2"
  integrity sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q==

-"@frontend/kitui@^1.0.85":
-  version "1.0.85"
-  resolved "https://penahub.gitlab.yandexcloud.net/api/v4/projects/21/packages/npm/@frontend/kitui/-/@frontend/kitui-1.0.85.tgz#1a384c9ff3314175c1ba3d35d0979da7026a21ab"
-  integrity sha1-GjhMn/MxQXXBuj010JedpwJqIas=
+"@frontend/kitui@^1.0.86":
+  version "1.0.86"
+  resolved "https://penahub.gitlab.yandexcloud.net/api/v4/projects/21/packages/npm/@frontend/kitui/-/@frontend/kitui-1.0.86.tgz#03a56b99403b62810134f3d7da01ea3fc8cc4f7f"
+  integrity sha1-A6VrmUA7YoEBNPPX2gHqP8jMT38=
  dependencies:
    immer "^10.0.2"
    reconnecting-eventsource "^1.6.2"