some bug fixed

src/components/JoinedGroupCard.tsx

@@ -29,12 +29,15 @@ interface JoinedGroupCardProps {
   hasPaid?: boolean;              // whether user has already paid
 }
 
-const formatDate = (dateArray: [number, number, number] | null): string => {
-  if (!dateArray) return 'N/A';
-  const date = new Date(dateArray[0], dateArray[1] - 1, dateArray[2]);
-  return date.toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' });
+const formatDate = (dateStr: string | null): string => {
+  if (!dateStr) return 'N/A';
+
+  const [year, month, day] = dateStr.split('-');
+  return `${day}-${month}-${year}`;
 };
 
+
+
 const getStatusStyle = (status: JoinedGroup['status']) => {
   switch (status) {
     case 'ACTIVE':
@@ -67,6 +70,9 @@ export const JoinedGroupCard: FC<JoinedGroupCardProps> = ({ item, onViewPress, h
   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 });
@@ -126,18 +132,29 @@ export const JoinedGroupCard: FC<JoinedGroupCardProps> = ({ item, onViewPress, h
       {/* Footer with Dates & Buttons */}
       <View style={styles.footer}>
         <Text style={styles.dateText}>
-          {formatDate(item.startDate)} - {formatDate(item.endDate)}
+          {formatDate(item.startDate)} to {formatDate(item.endDate)}
         </Text>
         {/* Add Pay / Paid button here */}
-        {hasPaid ? (
+        {/* {hasPaid ? (
           <View style={styles.paidButton}>
             <Text style={styles.paidButtonText}>Paid</Text>
           </View>
         ) : (
+          
           <TouchableOpacity style={styles.payButton} onPress={onPayPress}>
-            <Text style={styles.payButtonText}>{loading ? 'Loading...' : 'Pay'}</Text>
+            <Text style={styles.payButtonText}>{loading ? 'Loading...' : ' Pay'}</Text>
           </TouchableOpacity>
-        )}
+        )} */}
+        {
+          hasPaid && <View style={styles.paidButton}>
+            <Text style={styles.paidButtonText}>Paid</Text>
+          </View>
+        }
+        {
+          item.status !== 'COMPLETED' && <TouchableOpacity style={styles.payButton} onPress={onPayPress}>
+            <Text style={styles.payButtonText}>{loading ? 'Loading...' : ' Pay'}</Text>
+          </TouchableOpacity>
+        }
       </View>
     </TouchableOpacity>
   );