check status

src/components/JoinedGroupCard.tsx

@@ -2,7 +2,7 @@ import React, { FC } from 'react';
 import { View, Text, StyleSheet, TouchableOpacity, ToastAndroid } from 'react-native';
 import colors from './colors';
 import { useNavigation } from '@react-navigation/native';
-import { BASE_URL } from '../utils/ApiUrls';
+import { BASE_URL, CONTRIBUTE } from '../utils/ApiUrls';
 import { apiCall } from '../utils/ApiHelper';
 
 interface JoinedGroup {
@@ -65,13 +65,14 @@ export const JoinedGroupCard: FC<JoinedGroupCardProps> = ({ item, onViewPress, h
   const statusStyle = getStatusStyle(item.status);
   const navigation = useNavigation<any>();
   const [loading, setLoading] = React.useState(false);
+  const [payable, setPayable] = React.useState<any>();
 
   const onPayPress = async () => {
     // Navigate to payment screen or handle payment logic
     // navigation.navigate('PaymentScreen', { groupId: item.id, amount: item.contributionAmount });
     setLoading(true);
     try {
-      const res = await apiCall(`${BASE_URL}payments/contribute/${item?.id}?amount=${item?.contributionAmount}`, 'POST') as any;
+      const res = await apiCall(`${BASE_URL}payments/contribute/${item?.id}?amount=${payable?.totalPayable}`, 'POST') as any;
       console.log('payment res ', res)
       if (res.status === 200 || res.status === 201 || res.statusCode === 200) {
         ToastAndroid.show('Payment done!', ToastAndroid.SHORT);
@@ -83,6 +84,18 @@ export const JoinedGroupCard: FC<JoinedGroupCardProps> = ({ item, onViewPress, h
       setLoading(false);
     }
   };
+
+  const handleContribution = async () => {
+    try {
+      const res = await apiCall(`${CONTRIBUTE}${item.id}/calculate-contribution`, 'GET') as any;
+      setPayable(res.data);
+    } catch (error) {
+      console.log("Error in handleContribution: ", error);
+    }
+  };
+  React.useEffect(() => {
+    handleContribution();
+  }, []);
   return (
     <TouchableOpacity style={styles.card} onPress={() => navigation.navigate("GroupDetails", { item, color: colors.black })}>
       {/* Header */}
@@ -104,6 +117,12 @@ export const JoinedGroupCard: FC<JoinedGroupCardProps> = ({ item, onViewPress, h
           <Text style={styles.infoValue}>{item.cycleType}</Text>
         </View>
       </View>
+      {payable?.effectiveLateFee && (
+        <>
+          <Text style={{ marginBottom: 8, fontSize: 14, color: '#050911ff' }}>Total Payable: ₹{payable?.totalPayable.toLocaleString('en-IN')}</Text>
+          <Text style={{ marginBottom: 8, fontSize: 14, color: '#050911ff' }}>Effective Late Fee : ₹{payable?.effectiveLateFee.toLocaleString('en-IN')}</Text>
+        </>
+      )}
       {/* Footer with Dates & Buttons */}
       <View style={styles.footer}>
         <Text style={styles.dateText}>