From 53aa64e9ea7e1df4c352e57b8b007b8b114f36cb Mon Sep 17 00:00:00 2001 From: nflnkr Date: Thu, 4 Apr 2024 11:27:06 +0300 Subject: [PATCH] include cart tariffs in tariff price calculation --- src/api/tariff.ts | 32 +++++++++++++++ src/pages/Tariffs/Tariffs.tsx | 41 ++++++++++--------- .../tariffsUtils/createTariffElements.tsx | 3 +- src/utils/hooks/useCartTariffs.ts | 16 ++++++++ 4 files changed, 71 insertions(+), 21 deletions(-) create mode 100644 src/api/tariff.ts create mode 100644 src/utils/hooks/useCartTariffs.ts diff --git a/src/api/tariff.ts b/src/api/tariff.ts new file mode 100644 index 00000000..e934b2b9 --- /dev/null +++ b/src/api/tariff.ts @@ -0,0 +1,32 @@ +import { Tariff, makeRequest } from "@frontend/kitui"; + +const apiUrl = process.env.REACT_APP_DOMAIN + "/strator"; + +export async function getTariffArray(tariffIds: string[] | undefined) { + if (!tariffIds) return null; + + const responses = await Promise.allSettled( + tariffIds.map((tariffId) => + makeRequest({ + url: `${apiUrl}/tariff/${tariffId}`, + method: "get", + useToken: true, + }), + ), + ); + + const tariffs: Tariff[] = []; + + responses.forEach((response) => { + switch (response.status) { + case "fulfilled": { + tariffs.push(response.value); + break; + } + case "rejected": + break; + } + }); + + return tariffs; +} diff --git a/src/pages/Tariffs/Tariffs.tsx b/src/pages/Tariffs/Tariffs.tsx index 5f52a165..5d1f4f0b 100644 --- a/src/pages/Tariffs/Tariffs.tsx +++ b/src/pages/Tariffs/Tariffs.tsx @@ -1,10 +1,9 @@ -import { Link, useLocation, useNavigate } from "react-router-dom"; +import { logout } from "@api/auth"; +import { activatePromocode } from "@api/promocode"; import type { Tariff } from "@frontend/kitui"; import { clearAuthToken, makeRequest, useToken } from "@frontend/kitui"; -import { useEffect, useState } from "react"; +import ArrowLeft from "@icons/questionsPage/arrowLeft"; import type { GetTariffsResponse } from "@model/tariff"; -import { logout } from "@api/auth"; - import { Box, Button, @@ -16,20 +15,21 @@ import { useMediaQuery, useTheme, } from "@mui/material"; -import { enqueueSnackbar } from "notistack"; -import { withErrorBoundary } from "react-error-boundary"; -import { createTariffElements } from "./tariffsUtils/createTariffElements"; -import Logotip from "../../pages/Landing/images/icons/QuizLogo"; -import { LogoutButton } from "@ui_kit/LogoutButton"; -import { clearUserData, useUserStore } from "@root/user"; -import ArrowLeft from "@icons/questionsPage/arrowLeft"; -import { currencyFormatter } from "./tariffsUtils/currencyFormatter"; -import { Tabs } from "./Tabs"; -import { cleanAuthTicketData } from "@root/ticket"; -import { useDomainDefine } from "@utils/hooks/useDomainDefine"; -import CollapsiblePromocodeField from "./CollapsiblePromocodeField"; -import { activatePromocode } from "@api/promocode"; import { clearQuizData } from "@root/quizes/store"; +import { cleanAuthTicketData } from "@root/ticket"; +import { clearUserData, useUserStore } from "@root/user"; +import { LogoutButton } from "@ui_kit/LogoutButton"; +import { useCartTariffs } from "@utils/hooks/useCartTariffs"; +import { useDomainDefine } from "@utils/hooks/useDomainDefine"; +import { enqueueSnackbar } from "notistack"; +import { useEffect, useState } from "react"; +import { withErrorBoundary } from "react-error-boundary"; +import { Link, useNavigate } from "react-router-dom"; +import Logotip from "../../pages/Landing/images/icons/QuizLogo"; +import CollapsiblePromocodeField from "./CollapsiblePromocodeField"; +import { Tabs } from "./Tabs"; +import { createTariffElements } from "./tariffsUtils/createTariffElements"; +import { currencyFormatter } from "./tariffsUtils/currencyFormatter"; const StepperText: Record = { count: "Тарифы на объём", @@ -43,13 +43,11 @@ function TariffPage() { const isTablet = useMediaQuery(theme.breakpoints.down(1000)); const isMobile = useMediaQuery(theme.breakpoints.down(600)); const userId = useUserStore((state) => state.userId); - const location = useLocation(); const navigate = useNavigate(); - + const cartTariffs = useCartTariffs(); const [tariffs, setTariffs] = useState([]); const [user, setUser] = useState(); const [discounts, setDiscounts] = useState(); - const [cartTariffMap, setCartTariffMap] = useState(); const [openModal, setOpenModal] = useState({}); const [cash, setCash] = useState("0"); const [selectedItem, setSelectedItem] = useState<"count" | "day">("count"); @@ -280,6 +278,7 @@ function TariffPage() { user, discounts, openModalHC, + cartTariffs ?? [], )} {selectedItem === "count" && createTariffElements( @@ -288,6 +287,7 @@ function TariffPage() { user, discounts, openModalHC, + cartTariffs ?? [], )} {selectedItem === "dop" && ( <> @@ -309,6 +309,7 @@ function TariffPage() { user, discounts, openModalHC, + cartTariffs ?? [], )} diff --git a/src/pages/Tariffs/tariffsUtils/createTariffElements.tsx b/src/pages/Tariffs/tariffsUtils/createTariffElements.tsx index 722dcdb7..86911c61 100644 --- a/src/pages/Tariffs/tariffsUtils/createTariffElements.tsx +++ b/src/pages/Tariffs/tariffsUtils/createTariffElements.tsx @@ -11,6 +11,7 @@ export const createTariffElements = ( user: any, discounts: any, onclick: any, + cartTariffs: Tariff[], ) => { const tariffElements = filteredTariffs .filter((tariff) => tariff.privileges.length > 0) @@ -19,7 +20,7 @@ export const createTariffElements = ( tariff, discounts, user.wallet.spent, - [], + cartTariffs, user.isUserNko, user.id, ); diff --git a/src/utils/hooks/useCartTariffs.ts b/src/utils/hooks/useCartTariffs.ts new file mode 100644 index 00000000..0cf1c65c --- /dev/null +++ b/src/utils/hooks/useCartTariffs.ts @@ -0,0 +1,16 @@ +import { getTariffArray } from "@api/tariff"; +import { useUserStore } from "@root/user"; +import useSWR from "swr"; + +export function useCartTariffs() { + const cartTariffIds = useUserStore((state) => state.customerAccount?.cart); + const { data } = useSWR( + ["cartTariffs", cartTariffIds], + (key) => getTariffArray(key[1]), + { + keepPreviousData: true, + }, + ); + + return data; +}