homePage update

src/components/JoinedGroupCard.tsx

@@ -3,6 +3,7 @@
 import React, { FC } from 'react';
 import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
 import colors from './colors';
+import { useNavigation } from '@react-navigation/native';
 
 // Update the type to match the full data structure
 interface JoinedGroup {
@@ -63,9 +64,10 @@ const getStatusStyle = (status: JoinedGroup['status']) => {
 export const JoinedGroupCard: FC<JoinedGroupCardProps> = ({ item, onViewPress }) => {
   const progress = (item.currentParticipants / item.maxParticipants) * 100;
   const statusStyle = getStatusStyle(item.status);
+  const navigation = useNavigation<any>()
 
   return (
-    <View style={styles.card}>
+    <TouchableOpacity style={styles.card} onPress={()=> navigation.navigate("GroupDetails", {item, color:colors.Settings})}>
       {/* Header */}
       <View style={styles.header}>
         <Text style={styles.groupName}>{item.groupName}</Text>
@@ -107,7 +109,7 @@ export const JoinedGroupCard: FC<JoinedGroupCardProps> = ({ item, onViewPress })
             <Text style={styles.viewButtonText}>View</Text>
         </TouchableOpacity>
       </View>
-    </View>
+    </TouchableOpacity>
   );
 };