late fee added

src/screens/home/user-home/GroupDetails.tsx

@@ -15,7 +15,7 @@ import colors from "../../../components/colors";
 import { Ionicons } from "@react-native-vector-icons/ionicons";
 import Header from "../../../components/common/Header";
 import { apiCall } from "../../../utils/ApiHelper";
-import { CONTRIBUTE, GROUP_ALL_MEMBER } from "../../../utils/ApiUrls";
+import { BASE_URL, CONTRIBUTE, GROUP_ALL_MEMBER } from "../../../utils/ApiUrls";
 import ContributionScreen from "../../ContributionScreen";
 
 // Define type for a member
@@ -108,10 +108,20 @@ const GroupDetails = () => {
 
     const confirmPayment = async () => {
         try {
+            const res = await apiCall(`${BASE_URL}payments/contribute/${group?.id}?amount=${group?.collected}`, 'POST') as any
+            console.log("payment response : ", res)
+            if (res.status) {
+                ToastAndroid.show('Payment done!', ToastAndroid.SHORT)
+            }
+            if (res.status === 400) {
+                ToastAndroid.show(res?.data?.message || 'Payment done!', ToastAndroid.SHORT)
 
+            }
         } catch (error) {
-
+            console.log("payment error : ", error)
         }
+
+
     }
     const renderMember = ({ item, index }: { item: any; index: number }) => (
         <View

src/screens/home/user-home/UserHome.tsx

@@ -7,6 +7,8 @@ import {
     TouchableOpacity,
     Alert,
     RefreshControl,
+    ScrollView,
+    Button,
 } from "react-native";
 import { useNavigation } from "@react-navigation/native";
 import type { NativeStackNavigationProp } from "@react-navigation/native-stack";
@@ -15,6 +17,7 @@ import colors from "../../../components/colors";
 import { Ionicons } from "@react-native-vector-icons/ionicons";
 import { GET_JOINED_GROUP_URL } from "../../../utils/ApiUrls";
 import * as Keychain from "react-native-keychain";
+import AnimatedCard from "../../../components/common/AnimatedCard";
 
 type NavigationProp = NativeStackNavigationProp<
     RootStackParamList,
@@ -47,13 +50,12 @@ const UserHome = () => {
         0
     );
 
-
-
     const onRefresh = async () => {
         setRefreshing(true)
         await handleGroup()
         setRefreshing(false)
     }
+
     const handleGroup = async () => {
         try {
             setLoading(true)
@@ -120,9 +122,9 @@ const UserHome = () => {
     };
 
     return (
-        <View>
+        <>
             {/* Stats */}
-            <View style={[styles.statsRow, { marginVertical: 24 }]}>
+            <View style={[styles.statsRow, { marginTop:12 }]}>
                 <View style={styles.statBox}>
                     <Text style={styles.statValue}>{totalGroups}</Text>
                     <Text style={styles.statLabel}>Groups Joined</Text>
@@ -132,6 +134,10 @@ const UserHome = () => {
                     <Text style={styles.statLabel}>Cycle Contribution</Text>
                 </View>
             </View>
+            {/* <Button title="Transaction List" onPress={()=>navigation.navigate('TransactionList')}/> */}
+            <AnimatedCard
+            
+                onPress={() => navigation.navigate("TransactionList")} title={"transaction list"}  iconName="calculator-outline"  subtitle="View your transaction history"        />
 
             {/* Groups List */}
             <Text style={styles.sectionTitle}>Your Groups</Text>
@@ -143,7 +149,7 @@ const UserHome = () => {
                 onRefresh={onRefresh}
                 refreshing={refreshing}
             />
-        </View>
+        </>
     );
 };