This commit is contained in:
shafi54 2026-01-28 01:00:27 +05:30
parent 400ba61866
commit 4e54a8c6ee

View file

@ -113,7 +113,7 @@ export default function Dashboard() {
const [stickyBarLayout, setStickyBarLayout] = useState({ y: 0, height: 0 }); const [stickyBarLayout, setStickyBarLayout] = useState({ y: 0, height: 0 });
const [whiteSectionLayout, setWhiteSectionLayout] = useState({ y: 0 }); const [whiteSectionLayout, setWhiteSectionLayout] = useState({ y: 0 });
const [displayedProducts, setDisplayedProducts] = useState<any[]>([]); const [displayedProducts, setDisplayedProducts] = useState<any[]>([]);
const [page, setPage] = useState(1); const [endIndex, setEndIndex] = useState(10);
const [hasMore, setHasMore] = useState(true); const [hasMore, setHasMore] = useState(true);
const [isLoadingMore, setIsLoadingMore] = useState(false); const [isLoadingMore, setIsLoadingMore] = useState(false);
const { backgroundColor } = useStatusBarStore(); const { backgroundColor } = useStatusBarStore();
@ -136,51 +136,21 @@ export default function Dashboard() {
const { data: slotsData } = trpc.user.slots.getSlotsWithProducts.useQuery(); const { data: slotsData } = trpc.user.slots.getSlotsWithProducts.useQuery();
const products = productsData?.products || []; const products = productsData?.products || [];
// Function to load more products
const loadMoreProducts = () => {
if (!hasMore || isLoadingMore) return;
setIsLoadingMore(true);
const batchSize = 10;
const startIndex = page * batchSize;
const endIndex = startIndex + batchSize;
// Get the next batch of products
const nextBatchRaw = products.slice(startIndex, endIndex);
// Filter products to only include those with available slots
const nextBatch = nextBatchRaw.filter(product => {
const slot = getQuickestSlot(product.id);
return slot !== null && slot !== undefined;
});
if (nextBatch.length > 0) {
setDisplayedProducts(prev => [...prev, ...nextBatch]);
setPage(prev => page + 1);
setHasMore(endIndex < products.length);
} else {
setHasMore(false);
}
setIsLoadingMore(false);
};
// Initialize with the first batch of products (only those with available slots) // Initialize with the first batch of products (only those with available slots)
React.useEffect(() => { React.useEffect(() => {
if (products.length > 0 && displayedProducts.length === 0) { if (products.length > 0 && displayedProducts.length === 0) {
const initialBatchRaw = products.slice(0, 10); const initialBatchRaw = products;
// Filter to include only products with available slots // Filter to include only products with available slots
const initialBatch = initialBatchRaw.filter(product => { const initialBatch = initialBatchRaw.filter(product => {
const slot = getQuickestSlot(product.id); const slot = getQuickestSlot(product.id);
return slot !== null && slot !== undefined; return slot !== null && slot !== undefined && !product.isOutOfStock;
}); });
setDisplayedProducts(initialBatch); setDisplayedProducts(initialBatch);
setHasMore(products.length > 10); setHasMore(products.length > 10);
setPage(1); setEndIndex(10);
} }
}, [productsData]); }, [productsData]);
@ -266,7 +236,7 @@ export default function Dashboard() {
if (layoutMeasurement.height + contentOffset.y >= contentSize.height - paddingToBottom) { if (layoutMeasurement.height + contentOffset.y >= contentSize.height - paddingToBottom) {
// Load more products when reaching near the end // Load more products when reaching near the end
if (!isLoadingMore && hasMore) { if (!isLoadingMore && hasMore) {
loadMoreProducts(); // loadMoreProducts();
} }
} }
}} }}
@ -600,6 +570,7 @@ export default function Dashboard() {
{/* Product List */} {/* Product List */}
<MyFlatList <MyFlatList
// data={products}
data={displayedProducts} data={displayedProducts}
keyExtractor={(item) => item.id.toString()} keyExtractor={(item) => item.id.toString()}
numColumns={2} numColumns={2}
@ -617,16 +588,16 @@ export default function Dashboard() {
} }
showDeliveryInfo={true} showDeliveryInfo={true}
miniView={false} miniView={false}
// nullIfNotAvailable={true}
key={item.id} key={item.id}
/> />
</View> </View>
)} )}
onEndReached={() => { // onEndReached={() => {
if (!isLoadingMore && hasMore) { // if (!isLoadingMore && hasMore) {
loadMoreProducts(); // loadMoreProducts();
} // }
}} // }}
onEndReachedThreshold={0.5} onEndReachedThreshold={0.5}
ListFooterComponent={ ListFooterComponent={
isLoadingMore ? ( isLoadingMore ? (