Skip to content

E
EmidWife-New
Commit 00b60a06 authored by Malsha Jayakody's avatar Malsha Jayakody
Browse files
Options

create user profile

parent 828c667b
Hide whitespace changes
Inline Side-by-side
Showing with 351 additions and 130 deletions
src/constants/colors.js
View file @ 00b60a06
...@@ -21,4 +21,5 @@ export default { ...@@ -21,4 +21,5 @@ export default {
purple_new: '#AC87C5', purple_new: '#AC87C5',
pink_new: '#FF8080', pink_new: '#FF8080',
pastal_blue: '#7469B6', pastal_blue: '#7469B6',
red: '#DC143C',
}; };
src/constants/imgs.js
View file @ 00b60a06
...@@ -16,7 +16,6 @@ export default { ...@@ -16,7 +16,6 @@ export default {
sk_15: require('../assets/sk_15.png'), sk_15: require('../assets/sk_15.png'),
sk_16: require('../assets/sk_16.png'), sk_16: require('../assets/sk_16.png'),
//games //games
game_img_1: require('../assets/game_img_1.png'), game_img_1: require('../assets/game_img_1.png'),
game_img_2: require('../assets/game_img_2.png'), game_img_2: require('../assets/game_img_2.png'),
...@@ -66,4 +65,5 @@ export default { ...@@ -66,4 +65,5 @@ export default {
home_page: require('../assets/home_page.png'), home_page: require('../assets/home_page.png'),
well_being: require('../assets/games/wellBeing.jpg'), well_being: require('../assets/games/wellBeing.jpg'),
motherWithMidWife: require('../assets/games/motherAndMidWife.jpg'), motherWithMidWife: require('../assets/games/motherAndMidWife.jpg'),
user_profile_image: require('../assets/user_profile.png'),
}; };
src/constants/routes.js
View file @ 00b60a06
...@@ -2,7 +2,7 @@ export default { ...@@ -2,7 +2,7 @@ export default {
LOGIN: 'Login', LOGIN: 'Login',
REGISTER: 'Register', REGISTER: 'Register',
FORGOT_PASSWORD: 'Forgot_Password', FORGOT_PASSWORD: 'Forgot_Password',
PROFILE: 'UserProfile',
HOME: 'Home', HOME: 'Home',
HOME_TAB: 'Home_Tab', HOME_TAB: 'Home_Tab',
......
src/navigations/AuthNavigator.js
View file @ 00b60a06
import React, {useState, useEffect} from 'react'; import React, {useState, useEffect} from 'react';
import { createStackNavigator } from '@react-navigation/stack'; import {createStackNavigator} from '@react-navigation/stack';
import Login from '../screens/auth/Login'; import Login from '../screens/auth/Login';
import Register from '../screens/auth/Register'; import Register from '../screens/auth/Register';
import ForgotPassword from '../screens/auth/ForgotPassword'; import ForgotPassword from '../screens/auth/ForgotPassword';
// import { Login, Register, ForgotPassword} from '../screens'; // import { Login, Register, ForgotPassword} from '../screens';
import { ROUTES } from "../constants" import {ROUTES} from '../constants';
import BottomTabNavigator from './BottomTabNavigator' import BottomTabNavigator from './BottomTabNavigator';
const Stack = createStackNavigator(); const Stack = createStackNavigator();
import AsyncStorage from '@react-native-async-storage/async-storage'; import AsyncStorage from '@react-native-async-storage/async-storage';
import ProfileNavigator from './ProfileNavigator';
function AuthNavigator() { function AuthNavigator() {
const [isLoggedIn, setIsLoggedIn] = useState(false);
const [isLoggedIn, setIsLoggedIn] = useState(false); useEffect(() => {
// Check if the user is already logged in
checkLoggedInStatus();
}, []);
useEffect(() => { const checkLoggedInStatus = async () => {
// Check if the user is already logged in try {
checkLoggedInStatus(); // Example: Check if a token or user data exists in AsyncStorage
}, []); const userData = await AsyncStorage.getItem('userData');
if (userData) {
const checkLoggedInStatus = async () => { setIsLoggedIn(true);
try { }
// Example: Check if a token or user data exists in AsyncStorage } catch (error) {
const userData = await AsyncStorage.getItem('userData'); console.error('Error checking logged in status:', error);
if (userData) { }
setIsLoggedIn(true); };
} return (
} catch (error) { // <Stack.Navigator
console.error('Error checking logged in status:', error); // screenOptions={{
} // headerBackTitleVisible: false
}; // }}
return ( // initialRouteName={ROUTES.LOGIN}
// <Stack.Navigator // >
// screenOptions={{ // <Stack.Screen
// headerBackTitleVisible: false // options={{
// }} // headerShown: false
// initialRouteName={ROUTES.LOGIN} // }}
// > // name={ROUTES.LOGIN} component={Login}
// <Stack.Screen // />
// options={{ // <Stack.Screen
// headerShown: false // options={{
// }} // headerShown: false,
// name={ROUTES.LOGIN} component={Login} // headerBackTitleVisible: false
// /> // }}
// <Stack.Screen // name={ROUTES.REGISTER} component={Register}
// options={{ // />
// headerShown: false, // <Stack.Screen
// headerBackTitleVisible: false // name={ROUTES.FORGOT_PASSWORD} component={ForgotPassword}
// }} // />
// name={ROUTES.REGISTER} component={Register} // <Stack.Screen options={{
// /> // headerShown: false,
// <Stack.Screen // headerBackTitleVisible: false
// name={ROUTES.FORGOT_PASSWORD} component={ForgotPassword} // }}
// /> // name={ROUTES.HOME} component={BottomTabNavigator} />
// <Stack.Screen options={{ // </Stack.Navigator>
// headerShown: false, <Stack.Navigator
// headerBackTitleVisible: false screenOptions={{
// }} headerBackTitleVisible: false,
// name={ROUTES.HOME} component={BottomTabNavigator} /> }}
// </Stack.Navigator> initialRouteName={ROUTES.LOGIN}>
<Stack.Navigator {isLoggedIn ? (
screenOptions={{ <>
headerBackTitleVisible: false <Stack.Screen
options={{
headerShown: false,
}}
name={ROUTES.HOME}
component={BottomTabNavigator}
/>
<Stack.Screen
options={{
headerShown: false,
}}
name={ROUTES.PROFILE}
component={ProfileNavigator}
/>
</>
) : (
<>
<Stack.Screen
options={{
headerShown: false,
}}
name={ROUTES.LOGIN}
component={Login}
/>
<Stack.Screen
options={{
headerShown: false,
headerBackTitleVisible: false,
}}
name={ROUTES.REGISTER}
component={Register}
/>
<Stack.Screen
name={ROUTES.FORGOT_PASSWORD}
component={ForgotPassword}
/>
<Stack.Screen
options={{
headerShown: false,
}}
name={ROUTES.HOME}
component={BottomTabNavigator}
/>
<Stack.Screen
options={{
headerShown: false,
}} }}
initialRouteName={ROUTES.LOGIN} name={ROUTES.PROFILE}
> component={ProfileNavigator}
{isLoggedIn ? ( />
<Stack.Screen </>
options={{ )}
headerShown: false </Stack.Navigator>
}} );
name={ROUTES.HOME}
component={BottomTabNavigator}
/>
) : (
<>
<Stack.Screen
options={{
headerShown: false
}}
name={ROUTES.LOGIN}
component={Login}
/>
<Stack.Screen
options={{
headerShown: false,
headerBackTitleVisible: false
}}
name={ROUTES.REGISTER}
component={Register}
/>
<Stack.Screen
name={ROUTES.FORGOT_PASSWORD}
component={ForgotPassword}
/>
<Stack.Screen
options={{
headerShown: false
}}
name={ROUTES.HOME}
component={BottomTabNavigator}
/>
</>
)}
</Stack.Navigator>
);
} }
export default AuthNavigator; export default AuthNavigator;
\ No newline at end of file
src/navigations/GameNavigator.js
View file @ 00b60a06
...@@ -51,7 +51,7 @@ function GameNavigator() { ...@@ -51,7 +51,7 @@ function GameNavigator() {
headerBackTitleVisible: false, headerBackTitleVisible: false,
headerShown: false, headerShown: false,
}} }}
initialRouteName={ROUTES.EXERCISE_MAIN_MENU}> initialRouteName={ROUTES.GAME_HOME}>
<Stack.Screen name={ROUTES.GAME_WELCOME} component={WelcomePageGame} /> <Stack.Screen name={ROUTES.GAME_WELCOME} component={WelcomePageGame} />
<Stack.Screen <Stack.Screen
name={ROUTES.GAME_QUIZ_OPTIONS} name={ROUTES.GAME_QUIZ_OPTIONS}
......
src/navigations/ProfileNavigator.js 0 → 100644
View file @ 00b60a06
import React from 'react';
import {createStackNavigator} from '@react-navigation/stack';
import {ROUTES} from '../constants';
import UserProfile from '../screens/auth/ProfilePage';
const Stack = createStackNavigator();
function ProfileNavigator() {
return (
<Stack.Navigator
screenOptions={{
headerBackTitleVisible: false,
headerShown: false,
}}
initialRouteName={ROUTES.HOME}>
<Stack.Screen name={ROUTES.PROFILE} component={UserProfile} />
</Stack.Navigator>
);
}
export default ProfileNavigator;
src/screens/auth/ProfilePage.js 0 → 100644
View file @ 00b60a06
import React, {useState, useEffect} from 'react';
import {StyleSheet, View, Text, Image, TouchableOpacity} from 'react-native';
import Icon from 'react-native-vector-icons/Ionicons';
import {COLORS, IMGS, ROUTES} from '../../constants';
import LinearGradient from 'react-native-linear-gradient';
import {Formik} from 'formik';
// import {getUserDetails} from '../../services/auth/index';
const UserProfile = ({navigation}) => {
const [userDetails, setUserDetails] = useState(null);
const [error, setError] = useState(null);
// const handleFetchDetails = async () => {
// try {
// const email = 'user@example.com'; // This should be dynamically sourced, perhaps from user state or AsyncStorage
// const details = await getUserDetails(email);
// setUserDetails(details.data);
// } catch (err) {
// setError('Failed to fetch details');
// console.error(err);
// }
// };
console.log(userDetails, 'userDetails');
// useEffect(() => {
// handleFetchDetails();
// }, []);
return (
<LinearGradient
style={styles.container}
colors={[COLORS.dark_purple, COLORS.white, COLORS.pink]}>
<View style={styles.profileHeader}>
<Image source={IMGS.user_profile_image} style={styles.profileImage} />
<Text style={styles.name}>
{userDetails?.name ? userDetails?.name : 'Malsha Geethmi'}
</Text>
</View>
<View style={styles.infoContainer}>
<View style={styles.infoItem}>
<Text style={styles.infoLabel}>Email</Text>
<Text style={styles.infoContent}>
{userDetails?.email ? userDetails?.email : 'malsha@gmail.com'}
</Text>
</View>
<View style={styles.infoItem}>
<Text style={styles.infoLabel}>Age</Text>
<Text style={styles.infoContent}>
{userDetails?.age ? userDetails?.age : '24'}
</Text>
</View>
<View style={styles.infoItem}>
<Text style={styles.infoLabel}>Week</Text>
<Text style={styles.infoContent}>
{userDetails?.week ? userDetails?.week : '14'}
</Text>
</View>
</View>
<TouchableOpacity
style={styles.button}
onPress={() => navigation.navigate(ROUTES.FORGOT_PASSWORD)}>
<View style={styles.new}>
<Icon
name="key"
size={30}
color={COLORS.white}
style={styles.icon1}
/>
<Text style={styles.buttonText}>Change Password</Text>
</View>
</TouchableOpacity>
<TouchableOpacity style={styles.button2}>
<Text style={styles.buttonText2}>LOGOUT</Text>
</TouchableOpacity>
</LinearGradient>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: COLORS.pastalBlue,
alignItems: 'center',
paddingTop: 50,
},
profileHeader: {
backgroundColor: 'white',
width: '90%',
borderRadius: 20,
alignItems: 'center',
marginBottom: 20,
paddingVertical: 20,
},
profileImage: {
width: 80,
height: 80,
borderRadius: 40,
marginBottom: 10,
},
name: {
fontSize: 18,
fontWeight: 'bold',
color: COLORS.navyBlue,
},
phoneNumber: {
fontSize: 16,
color: 'gray',
},
infoContainer: {
width: '90%',
backgroundColor: 'white',
borderRadius: 20,
paddingVertical: 10,
},
infoItem: {
flexDirection: 'row',
justifyContent: 'space-between',
paddingHorizontal: 20,
paddingVertical: 10,
},
infoLabel: {
fontWeight: 'bold',
color: 'gray',
},
infoContent: {
color: 'black',
},
button: {
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
backgroundColor: COLORS.purple_new,
borderRadius: 20,
width: '90%',
padding: 15,
marginVertical: 5,
marginTop: 40,
},
button2: {
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
backgroundColor: COLORS.red,
borderRadius: 20,
width: '90%',
padding: 15,
marginVertical: 5,
marginTop: 230,
},
buttonText: {
textAlign: 'center',
fontSize: 18,
color: COLORS.white,
fontWeight: 'bold',
},
buttonText2: {
textAlign: 'center',
fontSize: 20,
color: COLORS.white,
fontWeight: 'bold',
},
icon1: {
justifyContent: 'flex-start',
display: 'flex',
},
new: {
marginRight: 90,
flexDirection: 'row',
gap: 20,
},
});
export default UserProfile;
src/screens/home/Home.js
View file @ 00b60a06
import React from 'react'; import React from 'react';
import {Image, TouchableOpacity, Text, View} from 'react-native'; import {Image, TouchableOpacity, Text, View} from 'react-native';
import {COLORS, IMGS} from '../../constants'; import {COLORS, IMGS, ROUTES} from '../../constants';
import LinearGradient from 'react-native-linear-gradient'; import LinearGradient from 'react-native-linear-gradient';
import Icon from 'react-native-vector-icons/Ionicons';
const Home = () => { const Home = ({navigation}) => {
return ( return (
<LinearGradient <LinearGradient
style={{ style={{
...@@ -22,7 +23,16 @@ const Home = () => { ...@@ -22,7 +23,16 @@ const Home = () => {
}} }}
/> />
</View> </View>
<TouchableOpacity
style={{
position: 'absolute',
top: 25, // Adjust top and right values as needed
right: 20,
zIndex: 5, // Ensure the icon is on top of other elements
}}
onPress={() => navigation.navigate(ROUTES.PROFILE)}>
<Icon name="person-circle-sharp" size={35} color={COLORS.black} />
</TouchableOpacity>
<View <View
style={{ style={{
paddingHorizontal: 67, paddingHorizontal: 67,
...@@ -50,31 +60,6 @@ const Home = () => { ...@@ -50,31 +60,6 @@ const Home = () => {
}}> }}>
e-MidWife e-MidWife
</Text> </Text>
{/* <View style={{marginTop: 1}}>
<TouchableOpacity
style={{
backgroundColor: COLORS.purple_new,
borderColor: COLORS.purple_new,
height: 50,
marginBottom: 50,
justifyContent: 'center',
alignItems: 'center',
borderRadius: 14,
width: '100%',
zIndex: 3,
elevation: 10,
}}
onPress={() => navigation.navigate(ROUTES.GAME_QUIZ_OPTIONS)}
>
<Text
medium
center
style={{color: 'white', fontSize: 24, fontWeight: 'bold'}}>
Start
</Text>
</TouchableOpacity>
</View> */}
</View> </View>
</View> </View>
</LinearGradient> </LinearGradient>
......
src/screens/home/game/QuizScore.js
View file @ 00b60a06
...@@ -98,7 +98,7 @@ const QuizScoreDisplayPage = ({route, navigation}) => { ...@@ -98,7 +98,7 @@ const QuizScoreDisplayPage = ({route, navigation}) => {
style={styles.button} style={styles.button}
onPress={handleChooseGamePress}> onPress={handleChooseGamePress}>
<Text bold medium center style={styles.buttonText}> <Text bold medium center style={styles.buttonText}>
Let's Improve Mental Well-Being How to Improve Mental Well-Being
</Text> </Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
......
src/services/auth/index.js
View file @ 00b60a06
...@@ -40,3 +40,29 @@ export let signup = async (name, password, email, age, week) => { ...@@ -40,3 +40,29 @@ export let signup = async (name, password, email, age, week) => {
return error; return error;
} }
}; };
// getUserDetails API Call
// export const getUserDetails = async email => {
// try {
// const token = await AsyncStorage.getItem('userToken'); // Assuming you store token after login
// let response = await axios.get(
// `${BASE_PATH}/user-details?email=${encodeURIComponent(email)}`,
// {
// headers: {
// Authorization: `Bearer ${token}`, // Assuming you use Bearer token for authentication
// },
// },
// );
// console.log('userDetails', response.data);
// if (response.data.success === true) {
// await AsyncStorage.setItem(
// 'userDetails',
// JSON.stringify(response.data.data),
// );
// }
// return response.data;
// } catch (error) {
// console.error('Failed to fetch user details', error);
// throw error; // You might want to handle this differently depending on your error handling strategy
// }
// };
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment