integrated etender biding detail

2026-01-07 17:59:56 +05:30
parent ce40aa388f
commit 860d70d86e
23 changed files with 1758 additions and 525 deletions
@@ -1,6 +1,5 @@
-import React, { useState, useCallback, memo } from 'react';
+import React, { useState, useCallback, memo, useEffect } from 'react';
 import { View, Text, StyleSheet, FlatList, RefreshControl, ActivityIndicator } from 'react-native';
-import LiveTenderTile from './LiveTenderTile';
 import { useNavigation } from '@react-navigation/native';
 import moment from 'moment';
 import { useFetchPurchaseTender } from '../../Services/BBPS/Hooks';
@@ -12,6 +11,8 @@ import { Skelton } from '../../Component/Index';
 import { allBooleanProps } from './types/types';
 import FilterModal from './Modal/FilterModal';
 import colors from '../../Constant/Color';
+import Animated, { FadeInDown, FadeOutUp } from 'react-native-reanimated';
+import NavigationString from '../../Constant/NavigationString';


 const PurchaseTenderAllList = () => {
@@ -19,28 +20,22 @@ const PurchaseTenderAllList = () => {
    const Dispatch = useDispatch()

    const [allBoolean, setAllBoolean] = useState<allBooleanProps>({ isShowFilter: false })
-    const [page, setPage] = useState(1);
-    const { data: data, isPending, isFetching } = useFetchPurchaseTender(page);
+    const { data, fetchNextPage, hasNextPage, isFetchingNextPage, isLoading, isRefetching, refetch }: any = useFetchPurchaseTender();
+    const [showRefreshBanner, setShowRefreshBanner] = useState(false);

-    console.log("data my data : ", data);
-    const [allData, setAllData] = useState<any[]>([]);
+    useEffect(() => {
+        if (isRefetching) {
+            setShowRefreshBanner(true);
+        } else {
+            const timer = setTimeout(() => {
+                setShowRefreshBanner(false);
+            }, 1000);
+
+            return () => clearTimeout(timer);
+        }
+    }, [isRefetching]);
    const format = 'DD-MM-YYYY HH:mm:ss';

-    const tenderList = data?.data || [];
-    const totalCount = data?.totalCount || 0;
-
-    // Append new page data
-    React.useEffect(() => {
-        if (tenderList.length) {
-            setAllData(prev => {
-                const merged = [...prev, ...tenderList];
-                const unique = merged.filter(
-                    (v, i, a) => a.findIndex(t => t.tenderId === v.tenderId) === i
-                );
-                return unique;
-            });
-        }
-    }, [tenderList]);
    function isTenderActive(item: any): boolean {
        const now = moment();
        const start = moment(item?.keyDates?.TenderBidding?.startDateTime, format);
@@ -59,51 +54,88 @@ const PurchaseTenderAllList = () => {

        return now.isAfter(end);
    }
-    console.log(allBoolean);
-
-    const loadMore = () => {
-        if (allData.length < totalCount && !isFetching) {
-            setPage(prev => prev + 1);
+    const loadMore = useCallback(() => {
+        if (hasNextPage && !isFetchingNextPage) {
+            fetchNextPage();
        }
-    };
-      const renderFooter = () => {
-    if (!isFetching) return null;
-    return (
-      <ActivityIndicator
-        size="small"
-        color={colors.primary}
-        style={{ marginVertical: 16 }}
-      />
-    );
-  };
+    }, [hasNextPage, isFetchingNextPage]);

-  console.log("all data : ", allData)
+
+    const renderFooter = useCallback(() => {
+        if (!isFetchingNextPage) return null;
+        return (
+            <View style={{ paddingVertical: 12 }}>
+                <ActivityIndicator size="small" color={colors.primary} />
+            </View>
+        );
+    }, [isFetchingNextPage]);
+    
    return (
        <View style={{ flex: 1 }}>
            <SearchInput onChange={() => { }} placeholder='Search....' filterPress={() => { setAllBoolean((prev: any) => ({ ...prev, isShowFilter: !prev.isShowFilter })) }} />
-            {isPending ? <Skelton /> : <FlatList
-                data={allData || []}
-                keyExtractor={(_, index) => index.toString()}
-                showsVerticalScrollIndicator={false}
-                contentContainerStyle={{ paddingBottom: 200, paddingHorizontal: 10 }}
-                renderItem={({ item, index }) => (
-                    <PurchaseTenderTile
-                        item={item}
-                        onPressDetails={() => {
-                            navigation.navigate('TenderDetail', { item, onAddToPurchase: () => { }, routeFrom: 'PurchasedTender' });
+
+            {showRefreshBanner && (
+                <Animated.View
+                    entering={FadeInDown.duration(200)}
+                    exiting={FadeOutUp.duration(500)}
+                    style={{
+                        alignSelf: 'center',
+                        flexDirection: 'row',
+                        alignItems: 'center',
+                        gap: 8,
+                        paddingVertical: 8,
+                        paddingHorizontal: 14,
+                        marginTop: 6,
+                        borderRadius: 20,
+                        backgroundColor: '#FFFFFF',
+                        shadowColor: '#000',
+                        shadowOpacity: 0.06,
+                        shadowRadius: 8,
+                        shadowOffset: { width: 0, height: 3 },
+                        elevation: 4,
+                        zIndex: 10, // Ensure it stays on top
+                        position: 'absolute',
+                        top: 60, // Adjust based on your SearchInput height
+                    }}
+                >
+                    <ActivityIndicator size="small" color={colors.primary} />
+                    <Text
+                        style={{
+                            fontSize: 13,
+                            color: '#374151',
+                            fontWeight: '500',
                        }}
-                        onStartBidding={() => {
-                            Dispatch(setTender(item))
-                            // navigation.navigate(NavigationString, { data: item })
-                        }}
-                        buttonEnable={isTenderActive(item)}
-                        isTenderEnd={isTenderEnd(item)}
-                    />
-                )}
-                onEndReached={loadMore}
-                onEndReachedThreshold={0.6}
-                ListFooterComponent={renderFooter}
-            />}
+                    >
+                        Refreshing tenders
+                    </Text>
+                </Animated.View>
+            )}
+            {isLoading ? <Skelton />
+                : <FlatList
+                    data={data?.result ?? []}
+                    keyExtractor={(item) => String(item.tenderId || item.id)}
+                    showsVerticalScrollIndicator={false}
+                    contentContainerStyle={{ paddingBottom: 200, paddingHorizontal: 10 }}
+                    renderItem={({ item, index }) => (
+                        <PurchaseTenderTile
+                            item={item}
+                            onPressDetails={() => {
+                                navigation.navigate('TenderDetail', { item, onAddToPurchase: () => { }, routeFrom: 'PurchasedTender' });
+                            }}
+                            onStartBidding={() => {
+                                Dispatch(setTender(item))
+                                navigation.navigate(NavigationString.TenderBidding, { data: item })
+                            }}
+                            buttonEnable={isTenderActive(item)}
+                            isTenderEnd={isTenderEnd(item)}
+                        />
+                    )}
+                    onEndReached={loadMore}
+                    onEndReachedThreshold={0.6}
+                    ListFooterComponent={renderFooter}
+                    refreshing={isRefetching}
+                    onRefresh={refetch}
+                />}


            {allBoolean.isShowFilter && <View style={{ flex: 1 }}>