import { Box, Typography } from "@mui/material";
import { clearUserData, OriginalUserAccount, setUserAccount, useUserStore } from "@root/user";
import { clearAuthToken, getMessageFromFetchError } from "@frontend/kitui";
import { enqueueSnackbar } from "notistack";
import { useUserAccountFetcher } from "@utils/hooks/useUserAccountFetcher";
import { useNavigate } from "react-router-dom";
import moment from "moment";

export default function AvailablePrivilege() {
  const user = useUserStore();
  const userPrivileges = user.userAccount?.privileges;
  const userId = useUserStore((state) => state.userId);
  const navigate = useNavigate();
  useUserAccountFetcher<OriginalUserAccount>({
    url: `${process.env.REACT_APP_DOMAIN}/squiz/account/get`,
    userId,
    onNewUserAccount: setUserAccount,
    onError: (error) => {
      const errorMessage = getMessageFromFetchError(error);
      if (errorMessage) {
        enqueueSnackbar(errorMessage);
        clearUserData();
        clearAuthToken();
        navigate("/signin");
      }
    },
  });
  const DayForm = ["день", "дня", "дней"];
  function declOfNum(n: number, text_forms: string[]) {
    n = Math.abs(n) % 100;
    var n1 = n % 10;
    if (n > 10 && n < 20) {
      return text_forms[2];
    }
    if (n1 > 1 && n1 < 5) {
      return text_forms[1];
    }
    if (n1 == 1) {
      return text_forms[0];
    }
    return text_forms[2];
  }
  const quizUnlimTime = userPrivileges?.quizUnlimTime?.amount || 0;
  const quizCnt = userPrivileges?.quizCnt?.amount || 0;
  const squizHideBadge = userPrivileges?.squizHideBadge?.amount || 0;

  //Где дни - amount - это на сколько дней выдан безлимит. т.е. не сколько осталось, а на сколько дней выдано
  function getCramps(amount: number, created_at: string) {
    if (created_at.length === 0) return 0;
    const currentDate = moment();

    return Number((moment(moment(created_at).add(amount, "days").diff(currentDate)).unix() / 86400).toFixed(1));
  }
  const quizUnlimDays = getCramps(quizUnlimTime, userPrivileges?.quizUnlimTime?.created_at || "");
  const squizBadgeDays = getCramps(squizHideBadge, userPrivileges?.squizHideBadge?.created_at || "");

  return (
    <Box
      sx={{
        padding: "20px",
        backgroundColor: "#9A9AAF17",
        width: "100%",
        borderRadius: "12px",
        display: "flex",
        gap: "20px",
        flexWrap: "wrap",
      }}
    >
      <Typography
        variant={"body1"}
        sx={{ color: "#9A9AAF" }}
      >
        Вам доступно:
      </Typography>
      <Typography
        variant={"body1"}
        sx={{ color: "#4D4D4D" }}
      >
        Безлимитные заявки:{" "}
        <strong>
          {quizUnlimDays < 0 ? 0
            :
            quizUnlimDays > 0 && quizUnlimDays < 1
              ? "последний день"
              : `${Math.trunc(quizUnlimDays)} ${declOfNum(Math.trunc(quizUnlimDays), DayForm)}`}
        </strong>
      </Typography>
      {quizCnt > 0 && (
        <Typography
          variant={"body1"}
          sx={{ color: "#4D4D4D" }}
        >
          Заявки: <strong>{quizCnt} шт.</strong>
        </Typography>
      )}
      {squizHideBadge > 0 && (
        <Typography
          variant={"body1"}
          sx={{ color: "#4D4D4D" }}
        >
          Скрытие логотипа PenaQuiz:{" "}
          <strong>
            {squizBadgeDays > 0 && squizBadgeDays < 1
              ? "последний день"
              : `${Math.trunc(squizBadgeDays)} ${declOfNum(Math.trunc(squizBadgeDays), DayForm)}`}
          </strong>
        </Typography>
      )}
    </Box>
  );
}
