diff --git a/src/screens/GroupScreen.tsx b/src/screens/GroupScreen.tsx index 20be00f..d32bae4 100644 --- a/src/screens/GroupScreen.tsx +++ b/src/screens/GroupScreen.tsx @@ -59,7 +59,7 @@ export default function GroupScreen() { }; return ( - + {/* --- Header and Segmented Control --- */} Your Groups diff --git a/src/screens/home/Home.tsx b/src/screens/home/Home.tsx index 83bdb99..ebe88cf 100644 --- a/src/screens/home/Home.tsx +++ b/src/screens/home/Home.tsx @@ -1,17 +1,170 @@ -import { StyleSheet, Text, View } from 'react-native' -import React from 'react' -import AppView from '../../components/AppView' -import UserProfileStatus from './UserProfileStatus' -import colors from '../../components/colors' +import React from "react"; +import { + StyleSheet, + Text, + View, + TextInput, + TouchableOpacity, + FlatList, + Image, +} from "react-native"; +import AppView from "../../components/AppView"; +import UserProfileStatus from "./UserProfileStatus"; +import colors from "../../components/colors"; +import {Ionicons} from "@react-native-vector-icons/ionicons"; + +const dummyChats = [ + { id: "1", name: "Amit Sharma", lastMessage: "Sent ₹500", avatar: "https://i.pravatar.cc/100?img=1" }, + { id: "2", name: "Sneha Patel", lastMessage: "Requested ₹200", avatar: "https://i.pravatar.cc/100?img=2" }, + { id: "3", name: "Group Savings", lastMessage: "Target reached 🎉", avatar: "https://i.pravatar.cc/100?img=3" }, +]; const Home = () => { return ( - - - - ) -} + + + {/* Header */} + + Hello, Pooja 👋 + + + + -export default Home + {/* Status */} + -const styles = StyleSheet.create({}) \ No newline at end of file + {/* Search Bar */} + + + + + + {/* Quick Actions */} + + + + Send + + + + Request + + + + History + + + + {/* Recent Chats / Transactions */} + Recent Activity + item.id} + renderItem={({ item }) => ( + + + + {item.name} + {item.lastMessage} + + + + )} + /> + + + ); +}; + +export default Home; + +const styles = StyleSheet.create({ + container: { + flex: 1, + // padding: 16, + }, + header: { + flexDirection: "row", + justifyContent: "space-between", + alignItems: "center", + marginBottom: 12, + }, + greeting: { + fontSize: 22, + fontWeight: "600", + color: colors.textDark, + }, + searchContainer: { + flexDirection: "row", + alignItems: "center", + backgroundColor: colors.white, + borderRadius: 12, + paddingHorizontal: 12, + marginVertical: 10, + height: 45, + shadowColor: "#000", + shadowOpacity: 0.05, + shadowRadius: 5, + elevation: 2, + }, + searchInput: { + flex: 1, + marginLeft: 8, + color: colors.textDark, + }, + quickActions: { + flexDirection: "row", + justifyContent: "space-between", + marginVertical: 16, + }, + actionButton: { + alignItems: "center", + flex: 1, + }, + actionText: { + marginTop: 6, + fontSize: 14, + color: colors.textDark, + }, + sectionTitle: { + fontSize: 18, + fontWeight: "600", + marginVertical: 10, + color: colors.textDark, + }, + chatItem: { + flexDirection: "row", + alignItems: "center", + backgroundColor: colors.white, + padding: 12, + borderRadius: 12, + marginBottom: 10, + shadowColor: "#000", + shadowOpacity: 0.05, + shadowRadius: 4, + elevation: 1, + }, + avatar: { + width: 45, + height: 45, + borderRadius: 22, + marginRight: 12, + }, + chatInfo: { + flex: 1, + }, + chatName: { + fontSize: 16, + fontWeight: "500", + color: colors.textDark, + }, + chatMessage: { + fontSize: 14, + color: colors.textLight, + }, +}); diff --git a/src/screens/home/UserProfileStatus.tsx b/src/screens/home/UserProfileStatus.tsx index 2e00de8..d3f4a4d 100644 --- a/src/screens/home/UserProfileStatus.tsx +++ b/src/screens/home/UserProfileStatus.tsx @@ -104,7 +104,7 @@ const UserProfileStatus: React.FC = () => { return ( - Welcome Back 👋 + {/* Welcome Back 👋 */} Profile Status @@ -174,7 +174,7 @@ const styles = StyleSheet.create({ elevation: 3, shadowOpacity: 0.1, shadowRadius: 6, - marginBottom: 20, + // marginBottom: 20, }, cardTitle: { fontSize: 18, diff --git a/src/screens/profile/Profile.tsx b/src/screens/profile/Profile.tsx index 6399bd9..90f5e83 100644 --- a/src/screens/profile/Profile.tsx +++ b/src/screens/profile/Profile.tsx @@ -267,7 +267,7 @@ const Profile = () => { if (fetching || !user) { return ( - + Loading profile... ); @@ -281,7 +281,7 @@ const Profile = () => { User Profile - + { onPress={handleUpdateImage} icon={imageUpdating ? undefined : "cloud-upload"} style={styles.updateImageButton} - buttonBackground="#6366f1" + buttonBackground={colors.Profile} /> @@ -334,7 +334,7 @@ const Profile = () => { - + Name {user.firstName} {user.lastName} @@ -342,7 +342,7 @@ const Profile = () => { - + Email {user.email || "Not provided"} @@ -350,7 +350,7 @@ const Profile = () => { - + Mobile {user.mobile || "Not provided"} @@ -358,7 +358,7 @@ const Profile = () => { - + Username {user.username} @@ -366,7 +366,7 @@ const Profile = () => { - + Address {user.address || "Not provided"} @@ -374,7 +374,7 @@ const Profile = () => { - + Gender {user.gender || "Not specified"} @@ -382,7 +382,7 @@ const Profile = () => { - + Role {user.role || "User"} @@ -395,7 +395,7 @@ const Profile = () => { onPress={() => setEditing(true)} icon="create" style={styles.editButton} - buttonBackground="#6366f1" + buttonBackground={colors.Profile} /> ) : ( @@ -480,7 +480,7 @@ const Profile = () => { const styles = StyleSheet.create({ container: { flex: 1, - backgroundColor: colors.pastelBlue, + // backgroundColor: colors.pastelBlue, paddingBottom: '30%', }, loadingContainer: { diff --git a/src/screens/setting/Setting.tsx b/src/screens/setting/Setting.tsx index 397133b..1526ee2 100644 --- a/src/screens/setting/Setting.tsx +++ b/src/screens/setting/Setting.tsx @@ -5,7 +5,7 @@ import colors from '../../components/colors' const Setting = () => { return ( - + Setting )