enh

apps/user-ui/app/(drawer)/(tabs)/home/index.tsx

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