import React, { useState } from 'react'
import Cookies from "js-cookie";
import { useRouter } from "next/router";
import toast, { Toaster } from 'react-hot-toast';
import { AiFillHeart, AiOutlineHeart } from "react-icons/ai";
import axios from 'axios';
import { useSelector , useDispatch } from 'react-redux';
import { RootState } from '@/Redux/store';
import { setFavorites } from '@/Redux/productFiltersSlice';
import { motion } from 'framer-motion';
import { userActivity } from '../commonFunctions/userActivity';
import { message } from 'antd';

const FavoritesIcon = (props:any) => {

    const router = useRouter();
    const dispatch = useDispatch();
    
    const [itemID,setItemID] = useState(props.itemId);

    const favorites = useSelector((state: RootState) => state.productFilter.favorites);

    const isFavorite = favorites.some((favorite:any) => favorite.productId === itemID);

    const _loggedIn_user = useSelector((state: RootState) => state.user.user);

    const successNotify = () => toast.success('Added Successfully !')
    const errorNotify = (msg:string) => toast.error("You are not logged in, Please login first.")
    // console.log("isFav : ",isFavorite,itemID)
    // console.log("Fav Store : ",favorites)

    const authToken = Cookies.get("jazz_token");

    const axiosInstance = axios.create({
      baseURL: "https://api.jazzagain.com/public/index.php",
      headers: {
        authorization: `Bearer ${authToken}`,
      },
    });

    const getAllUploads = async () => {
      try {
        
        let allUploads: any[] = [];
        let currentPage = 1; // Start from the first page
        let totalPages = 1; // Initialize totalPages with 1 to enter the loop
    
        // Fetch data until currentPage exceeds totalPages
        while (currentPage <= totalPages) {
          const response = await axiosInstance.get(`/api/user/ProductBySeller?page=${currentPage}`);
          const data = response.data.products;
          allUploads = allUploads.concat(data.data);
          totalPages = data.pagination.total_pages;
          currentPage++;
        }

        return allUploads;
      
      } catch (error) {
        console.error("Error fetching uploads:", error);
        toast.error("Error fetching uploads");
      } finally {
      }
    };
    
    
    const handleAddFavoriteClick = async (itemId: string) => {
      try {

        const authToken = Cookies.get('jazz_token');

        if(!authToken){
          localStorage.setItem('favItem', JSON.stringify(itemId))
          console.log("favItemID", itemId)
          message.error('You are not Logged in. Please login first')
          return router.push('/auth/login')
        }

        userActivity(_loggedIn_user?._id,'website','favorites page',{
          purchase:'added to favorites'
        }, navigator.userAgent)

        
        // Fetch all uploads to check if the item belongs to the logged-in user
        const _my_products = await getAllUploads();
        console.log("_my_products", _my_products);
    
        // Check if any of the user's products have a userId matching the itemId
        const isOwnProduct = _my_products?.some(product => product._id === itemId);

        // console.log(isOwnProduct,itemId,_my_products[0]?.userId)
    
        if (isOwnProduct) {
          // Prevents users from adding their own products as favorites
          console.log("Attempt to operate on own product");
          return toast.error("You can't add your own product!");
        }
    
        // If the product does not belong to the user, proceed with adding to favorites
        
        const config = {
          headers: {
            authorization: `Bearer ${authToken}`,
          },
        };
    
        const data = {
          productId: itemId,
        };
    
        axios.post('https://api.jazzagain.com/public/index.php/api/user/saveFavourite', data, config)
          .then((response) => {
            if (response) successNotify();
            axiosInstance
              .get("/api/user/getFavourite")
              .then((response) => {
                console.log("favs", response.data);
                dispatch(setFavorites(response.data.products));
              })
              .catch((error) => {
                console.error("Error fetching data:", error);
              });
          })
          .catch((error) => {
            errorNotify(error.response.data.message)
            router.push('/auth/login');
          });
      } catch (error) {
        toast.error("Error processing request");
      }
    };
    

  const handleRemoveFavoriteClick = async(itemId: string) => {

    userActivity(_loggedIn_user?._id,'website','favorites page',{
      purchase:'remove from favorites'
    }, navigator.userAgent)

    const authToken = Cookies.get('jazz_token');

    const config = {
      headers: {
        authorization: `Bearer ${authToken}`,
      },
    };
    
    const data = {
      productId: itemId,
    };
  
    axios.post('https://api.jazzagain.com/public/index.php/api/user/removeFavourite',data,config)
    .then((response)=>{
      if(response) toast.success("Removed from Wishlist !");
      axiosInstance
      .get("/api/user/getFavourite")
      .then((response) => {
        dispatch(setFavorites(response.data.products));
      })
      .catch((error) => {
        console.error("Error fetching data:", error);
      });
    })
    .catch((error)=>{
      errorNotify(error.response.data.message)
    })

  };

  
  return (
    <>
    {isFavorite ? (
      // <div>

      //   <AiFillHeart
      //     size={30}
      //     className="text-[#FF332B] inline m-2 mx-[2rem] cursor-pointer"
      //     onClick={(e) => {
      //       e.stopPropagation();
      //       handleRemoveFavoriteClick(itemID);
      //     }}
      //   />
      // </div>
          <motion.div
          initial={{ scale: 1 }}
          whileHover={{ scale: 1.2 }}
          transition={{ duration: 0.3 }} 
        >
          <AiFillHeart
          size={30}
          className="text-[#FF332B] inline m-2 my-4 cursor-pointer"
          onClick={(e:any) => {
            e.stopPropagation();
            handleRemoveFavoriteClick(itemID);
          }}
        />
        </motion.div>
    ) : (
      <motion.div
      initial={{ scale: 1 }}
      whileHover={{ scale: 1.2 }}
      transition={{ duration: 0.3 }}
      >
      <AiOutlineHeart
        size={30}
        className="text-[#FF332B] inline m-2 my-4 cursor-pointer"
        onClick={(e:any) => {
          e.stopPropagation();
          handleAddFavoriteClick(itemID);
        }}
      />
      </motion.div>
    )}
    </>
      // <AiOutlineHeart size={35} className="text-[#FF332B] inline m-2 mx-[2rem] cursor-pointer" 
      //   onClick={(e) => {
      //   e.stopPropagation();
      //   handleFavoriteClick(itemID);
      //   }}
      // />
  )
}

export default FavoritesIcon