import { useEffect, useState } from "react";
import { useQueryClient } from "@tanstack/react-query";
import { getSiteInfo } from "../api/site";
import { getIpList } from "../api/ip";
import { ENDPOINT } from "../config";
import { getCookie } from "../lib";

const siteId = getCookie("site-id-key") ?? "";

const ClientIpGuard = ({
  currentPath,
  children,
}: {
  currentPath?: string;
  children: React.ReactNode;
}) => {
  const queryClient = useQueryClient();
  const [clientIp, setClientIp] = useState("");
  const [isAllowed, setIsAllowed] = useState(true);

  useEffect(() => {
    (async () => {
      const response = await fetch("https://api.ipify.org?format=json");
      const data = await response.json();
      if (!data?.ip) return;
      setClientIp(data.ip);
    })();
  }, []);

  useEffect(() => {
    (async () => {
      if (!siteId || !clientIp) return;

      const siteInfo = await queryClient.ensureQueryData({
        queryKey: [ENDPOINT.CMS_SERVICE.SITES, siteId],
        queryFn: () => getSiteInfo(siteId),
      });

      if (siteInfo.siteKndCd === "O") return;

      const { content: ipList } = await getIpList({
        siteId,
        prmYn: "Y",
      });

      const allowedClientIp = ipList.some((ip) => ip.ipAddr === clientIp);
      setIsAllowed(allowedClientIp);
    })();
  }, [queryClient, clientIp, currentPath]);

  if (!isAllowed) {
    alert("허용되지 않은 IP로 접근하였습니다.");
    return <></>;
  }

  return <>{children}</>;
};

export { ClientIpGuard };