48 lines
No EOL
1.7 KiB
TypeScript
48 lines
No EOL
1.7 KiB
TypeScript
import { Pressable, StyleSheet, Text, View } from 'react-native'
|
|
import React from 'react'
|
|
import { FontAwesome, Feather } from '@expo/vector-icons';
|
|
import { useNavigation } from '@react-navigation/native';
|
|
|
|
|
|
const HomeHeader = () => {
|
|
const navigation = useNavigation();
|
|
|
|
const date = new Date();
|
|
const hours = date.getHours();
|
|
let message;
|
|
|
|
if (hours < 12) {
|
|
message = <Text>Good Morning ☀</Text>;
|
|
} else if (hours < 18) {
|
|
message = <Text>Good Afternoon ☀</Text>;
|
|
} else {
|
|
message = <Text>Good Evening </Text>;
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<View style={{marginTop: 20, paddingHorizontal: 20, paddingVertical: 10}}>
|
|
<View>
|
|
<Text style={{fontSize: 30, fontWeight: 600}}>{message}</Text>
|
|
</View>
|
|
<View style={{marginTop: 30, flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between'}}>
|
|
<Pressable onPress={() => navigation.navigate('inbox')} style={{flexDirection: 'row', gap: 5, alignItems: 'flex-end'}}>
|
|
<Feather name="mail" size={24} color="gray" /><Text style={{fontSize: 16}}>Inbox</Text>
|
|
</Pressable>
|
|
<Pressable onPress={() => navigation.navigate('profile')}>
|
|
<FontAwesome name="user-circle-o" size={24} color="gray" />
|
|
</Pressable>
|
|
</View>
|
|
</View>
|
|
<View style={{height: 1, backgroundColor: "#B4B4B8", shadowColor: '#B4B4B8', shadowOffset: { width: 0, height: 1 }, shadowOpacity: 0.5, shadowRadius: 1, }}></View>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default HomeHeader
|
|
|
|
const styles = StyleSheet.create({
|
|
Emoji:{
|
|
padding: 20
|
|
}
|
|
}) |