import { useState, useCallback } from "react";
// import { ImageGalleryAPI } from "../repositories/ImageGalleyRepository";
import { ImageGalleryAPI } from "../repositories/ImageGalleryAPI";

// const PAGE_SIZE = 10;

// const useImageGallery = (selectedProjectId) => {
//   const [images, setImages] = useState([]);
//   const [allImagesData, setAllImagesData] = useState([]);
//   const [pageNumber, setPageNumber] = useState(1);
//   const [hasMore, setHasMore] = useState(true);
//   const [loading, setLoading] = useState(false);
//   const [loadingMore, setLoadingMore] = useState(false);

//   const fetchImages = useCallback(async (page = 1, filters = {}, reset = false) => {
//     if (!selectedProjectId) return;

//     try {
//       if (page === 1) {
//         setLoading(true);
//       } else {
//         setLoadingMore(true);
//       }

//       const res = await ImageGalleryAPI.ImagesGet(
//         selectedProjectId,
//         filters,
//         page,
//         PAGE_SIZE
//       );

//       const newBatches = res.data || [];
//       const receivedCount = newBatches.length;

//       setImages((prev) => {
//         if (page === 1 || reset) return newBatches;
//         const uniqueNew = newBatches.filter(
//           (batch) => !prev.some((b) => b.batchId === batch.batchId)
//         );
//         return [...prev, ...uniqueNew];
//       });

//       setAllImagesData((prev) => {
//         if (page === 1 || reset) return newBatches;
//         const uniqueAll = newBatches.filter(
//           (batch) => !prev.some((b) => b.batchId === batch.batchId)
//         );
//         return [...prev, ...uniqueAll];
//       });

//       setHasMore(receivedCount === PAGE_SIZE);
//     } catch (error) {
//       console.error("Error fetching images:", error);
//       if (page === 1) {
//         setImages([]);
//         setAllImagesData([]);
//       }
//       setHasMore(false);
//     } finally {
//       setLoading(false);
//       setLoadingMore(false);
//     }
//   }, [selectedProjectId]);

//   const resetGallery = useCallback(() => {
//     setImages([]);
//     setAllImagesData([]);
//     setPageNumber(1);
//     setHasMore(true);
//   }, []);

//   return {
//     images,
//     allImagesData,
//     pageNumber,
//     setPageNumber,
//     hasMore,
//     loading,
//     loadingMore,
//     fetchImages,
//     resetGallery,
//   };
// };

// export default useImageGallery;
import { useInfiniteQuery } from "@tanstack/react-query";


const PAGE_SIZE = 10;

const useImageGallery = (selectedProjectId, filters) => {
  const hasFilters = filters && Object.values(filters).some(
    value => Array.isArray(value) ? value.length > 0 : value !== null && value !== ""
  );

  return useInfiniteQuery({
    queryKey: ["imageGallery", selectedProjectId, hasFilters ? filters : null],
    enabled: !!selectedProjectId,
    getNextPageParam: (lastPage, allPages) => {
      if (!lastPage?.data?.length) return undefined;
      return allPages.length + 1;
    },
    queryFn: async ({ pageParam = 1 }) => {
      const res = await ImageGalleryAPI.ImagesGet(
        selectedProjectId,
        hasFilters ? filters : undefined,
        pageParam,
        PAGE_SIZE
      );
      return res;
    },
  });
};

export default useImageGallery;