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;