CircleCollect/circle-collect
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

themed style

Browse Source
This commit is contained in:
Jaanu423
2025-09-26 18:08:48 +05:30
parent 87872f1df1
commit 3f49c28371
8 changed files with 311 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/screens/GroupScreen.tsx
+29 -16
View File
@@ -27,8 +27,6 @@ import { ApiResponse } from "./home/UserProfileStatus";
import * as Keychain from "react-native-keychain";
const { width } = Dimensions.get('window');
// --- Types ---
interface Group {
id: string;
@@ -39,6 +37,7 @@ interface Group {
contributionAmount: number;
cycleType: string;
createdByName: string;
imageBlob: string
}
// --- UI Components ---
@@ -48,16 +47,25 @@ const GroupCard = ({ item, onJoin, onView, isGrid }: { item: Group; onJoin: (gro
return (
<View style={cardStyle}>
<Text style={styles.groupName} numberOfLines={1}>{item.groupName}</Text>
<Text style={styles.groupDescription} numberOfLines={isGrid ? 2 : 1}>{item.description}</Text>
<View style={{ flex: 1, flexDirection: 'row', justifyContent: 'space-between' }}>
<View>
<Text style={styles.groupName} numberOfLines={1}>{item.groupName}</Text>
<Text style={styles.groupDescription} numberOfLines={isGrid ? 2 : 1}>{item.description}</Text>
</View>
<Image
source={{ uri: item?.imageBlob !== null ? `data:image/jpeg;base64${item?.imageBlob}` : `https://i.pravatar.cc/150?u=${item.id}` }}
style={{ width: 50, borderWidth: 1, height: 50, borderColor: colors.pastelGreen, borderRadius: 25 }}
/>
</View>
<View style={styles.groupMeta}>
<Text style={styles.groupMetaText}>{item.currentParticipants}/{item.maxParticipants} Members</Text>
<Text style={styles.groupMetaText}>{item.cycleType}</Text>
</View>
<View style={styles.buttonContainer}>
<TouchableOpacity style={styles.viewButton} onPress={() => onView(item)}>
{/* <TouchableOpacity style={styles.viewButton} onPress={() => onView(item)}>
<Text style={styles.viewButtonText}>View</Text>
</TouchableOpacity>
</TouchableOpacity> */}
<TouchableOpacity
style={[styles.joinButton, isFull && styles.joinButtonDisabled]}
onPress={() => onJoin(item.id)}
@@ -70,15 +78,19 @@ const GroupCard = ({ item, onJoin, onView, isGrid }: { item: Group; onJoin: (gro
);
};
const FeaturedGroupCard = ({ item }: { item: Group }) => (
<View style={styles.featuredCard}>
<Image source={{ uri: `https://i.pravatar.cc/150?u=${item.id}` }} style={styles.featuredImage} />
<View style={styles.featuredContent}>
<Text style={styles.featuredName} numberOfLines={1}>{item.groupName}</Text>
<Text style={styles.featuredCreator}>by {item.createdByName}</Text>
const FeaturedGroupCard = ({ item }: { item: Group }) => {
console.log("image item : ", item)
console.log("image view : ", `data:image/jpeg;base64${item?.imageBlob}`)
return (
<View style={styles.featuredCard}>
<Image source={{ uri: item?.imageBlob !== null ? `data:image/jpeg;base64${item?.imageBlob}` : `https://i.pravatar.cc/150?u=${item.id}` }} style={styles.featuredImage} />
<View style={styles.featuredContent}>
<Text style={styles.featuredName} numberOfLines={1}>{item.groupName}</Text>
<Text style={styles.featuredCreator}>by {item.createdByName}</Text>
</View>
</View>
</View>
);
)
};
export default function GroupScreen() {
const [activeTab, setActiveTab] = useState("Public");
@@ -114,6 +126,7 @@ export default function GroupScreen() {
}
};
const fetchJoinedGroups = async () => {
if (loading) return;
setLoading(true);
@@ -166,7 +179,7 @@ export default function GroupScreen() {
Alert.alert("Error", "An unexpected error occurred.");
}
};
const userStatus = async () => {
try {
const credentials = await Keychain.getGenericPassword();
@@ -264,7 +277,7 @@ export default function GroupScreen() {
refreshControl={
<RefreshControl refreshing={refreshing} onRefresh={onRefresh} />
}
// ListFooterComponent={<ActivityIndicator size={'large'} color={colors.Group} />}
// ListFooterComponent={<ActivityIndicator size={'large'} color={colors.Group} />}
/>
);
};