import { Tariff, calcTariffPrice } from "@frontend/kitui";
import TariffCard from "./TariffCard";
import NumberIcon from "@icons/NumberIcon";
import { currencyFormatter } from "./currencyFormatter";
import FreeTariffCard from "./FreeTariffCard";
import { Typography } from "@mui/material";

export const createTariffElements = (
  filteredTariffs: Tariff[],
  addFreeTariff = false,
  user: any,
  discounts: any,
  onclick: any,
) => {
  console.log("я карточка и я получила скидки ", discounts)
  calcTariffPrice(
    {
      "_id": "6606f2241747c1eea800bb67",
      "name": "1 месяц",
      "description": "Скрытие логотипа \"Pena\" во всех quiz на 1 месяц",
      "price": 0,
      "order": 0,
      "isCustom": false,
      "privileges": [
          {
              "name": "Скрытие шильдика в опроснике",
              "privilegeId": "squizHideBadge",
              "serviceKey": "squiz",
              "description": "Количество дней скрытия шильдика в опроснике",
              "type": "day",
              "value": "день",
              "price": 16700,
              "amount": 30
          }
      ],
      "isDeleted": false,
      "createdAt": "2024-03-29T16:53:56.191Z",
      "updatedAt": "2024-03-29T16:53:56.191Z"
  },
  discounts,
  user.wallet.spent,
  [],
  false,
  user.id,
  )
  const tariffElements = filteredTariffs
    .filter((tariff) => tariff.privileges.length > 0)
    .map((tariff, index) => {
      const { priceBeforeDiscounts, priceAfterDiscounts } = calcTariffPrice(
        tariff,
        discounts,
        2752015,
        [],
        false,
        "661970ac059f40a30ab24c92",
      );

      return (
        <TariffCard
          key={tariff._id}
          discount={
            priceBeforeDiscounts - priceAfterDiscounts
              ? `${(
                  (priceBeforeDiscounts - priceAfterDiscounts) /
                  (priceBeforeDiscounts / 100)
                ).toFixed(0)}%`
              : ""
          }
          icon={
            <NumberIcon
              number={index + 1}
              color={"#7e2aea"}
              backgroundColor={"#EEE4FC"}
            />
          }
          buttonProps={{
            text: "Выбрать",
            onClick: () =>
              onclick({
                id: tariff._id,
                price: priceAfterDiscounts / 100,
              }),
          }}
          headerText={tariff.name}
          text={tariff.privileges.map((p) => `${p.name} - ${p.amount}`)}
          price={
            <>
              {priceBeforeDiscounts !== priceAfterDiscounts && (
                <Typography
                  sx={{
                    textDecorationLine: "line-through",
                    color: "#FB5607",
                    fontSize: "15px",
                    lineHeight: "21px",
                  }}
                >
                  {currencyFormatter.format(priceBeforeDiscounts / 100)}
                </Typography>
              )}
              <Typography
                sx={{
                  fontWeight: 500,
                  fontSize: "20px",
                  lineHeight: "24px",
                  color: "#4D4D4D",
                }}
              >
                {currencyFormatter.format(priceAfterDiscounts / 100)}
              </Typography>
            </>
          }
        />
      );
    });

  if (addFreeTariff) {
    if (tariffElements.length < 6)
      tariffElements.push(<FreeTariffCard key="free_tariff_card" />);
    else tariffElements.splice(5, 0, <FreeTariffCard key="free_tariff_card" />);
  }

  return tariffElements;
};