managment screen upadte

src/components/JoinedGroupCard.tsx

@@ -0,0 +1,43 @@
+// src/components/JoinedGroupCard.tsx
+
+import React, { FC } from 'react';
+import { View, Text, StyleSheet } from 'react-native';
+import { JoinedGroup } from '../types';
+
+interface JoinedGroupCardProps {
+  item: JoinedGroup;
+}
+
+export const JoinedGroupCard: FC<JoinedGroupCardProps> = ({ item }) => (
+  <View style={styles.card}>
+    <View>
+      <Text style={styles.cardTitle}>{item.groupName}</Text>
+      <Text style={styles.cardSubtitle}>Created by {item.createdBy}</Text>
+    </View>
+  </View>
+);
+
+const styles = StyleSheet.create({
+  card: {
+    backgroundColor: '#fff',
+    borderRadius: 12,
+    padding: 16,
+    marginBottom: 12,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    elevation: 2,
+    shadowColor: '#000',
+    shadowOpacity: 0.05,
+    shadowRadius: 4,
+  },
+  cardTitle: {
+    fontSize: 17,
+    fontWeight: 'bold',
+    color: '#343a40',
+  },
+  cardSubtitle: {
+    fontSize: 14,
+    color: '#6c757d',
+  },
+});