diff options
Diffstat (limited to 'src')
18 files changed, 118 insertions, 1 deletions
diff --git a/src/assets/navigationIcons/chat-clicked.png b/src/assets/navigationIcons/chat-clicked.png Binary files differnew file mode 100644 index 00000000..f62b4cf5 --- /dev/null +++ b/src/assets/navigationIcons/chat-clicked.png diff --git a/src/assets/navigationIcons/chat-clicked@2x.png b/src/assets/navigationIcons/chat-clicked@2x.png Binary files differnew file mode 100644 index 00000000..4ce0f46a --- /dev/null +++ b/src/assets/navigationIcons/chat-clicked@2x.png diff --git a/src/assets/navigationIcons/chat-clicked@3x.png b/src/assets/navigationIcons/chat-clicked@3x.png Binary files differnew file mode 100644 index 00000000..bd3a1352 --- /dev/null +++ b/src/assets/navigationIcons/chat-clicked@3x.png diff --git a/src/assets/navigationIcons/chat-notifications.png b/src/assets/navigationIcons/chat-notifications.png Binary files differnew file mode 100644 index 00000000..cffb5751 --- /dev/null +++ b/src/assets/navigationIcons/chat-notifications.png diff --git a/src/assets/navigationIcons/chat-notifications@2x.png b/src/assets/navigationIcons/chat-notifications@2x.png Binary files differnew file mode 100644 index 00000000..22ae62db --- /dev/null +++ b/src/assets/navigationIcons/chat-notifications@2x.png diff --git a/src/assets/navigationIcons/chat-notifications@3x.png b/src/assets/navigationIcons/chat-notifications@3x.png Binary files differnew file mode 100644 index 00000000..98b1073d --- /dev/null +++ b/src/assets/navigationIcons/chat-notifications@3x.png diff --git a/src/assets/navigationIcons/chat.png b/src/assets/navigationIcons/chat.png Binary files differnew file mode 100644 index 00000000..cffb5751 --- /dev/null +++ b/src/assets/navigationIcons/chat.png diff --git a/src/assets/navigationIcons/chat@2x.png b/src/assets/navigationIcons/chat@2x.png Binary files differnew file mode 100644 index 00000000..22ae62db --- /dev/null +++ b/src/assets/navigationIcons/chat@2x.png diff --git a/src/assets/navigationIcons/chat@3x.png b/src/assets/navigationIcons/chat@3x.png Binary files differnew file mode 100644 index 00000000..98b1073d --- /dev/null +++ b/src/assets/navigationIcons/chat@3x.png diff --git a/src/components/common/NavigationIcon.tsx b/src/components/common/NavigationIcon.tsx index 1a9934f2..5128f3da 100644 --- a/src/components/common/NavigationIcon.tsx +++ b/src/components/common/NavigationIcon.tsx @@ -14,7 +14,8 @@ interface NavigationIconProps extends TouchableOpacityProps { | 'Upload' | 'Notifications' | 'Profile' - | 'SuggestedPeople'; + | 'SuggestedPeople' + | 'Chat'; disabled?: boolean; newIcon?: boolean; } @@ -44,6 +45,13 @@ const NavigationIcon = (props: NavigationIconProps) => { : require('../../assets/navigationIcons/notifications.png') : require('../../assets/navigationIcons/notifications-clicked.png'); break; + case 'Chat': + imgSrc = props.disabled + ? props.newIcon + ? require('../../assets/navigationIcons/chat-notifications.png') + : require('../../assets/navigationIcons/chat.png') + : require('../../assets/navigationIcons/chat-clicked.png'); + break; case 'Profile': imgSrc = props.disabled ? require('../../assets/navigationIcons/profile.png') diff --git a/src/routes/main/MainStackNavigator.tsx b/src/routes/main/MainStackNavigator.tsx index 9b089634..021c0688 100644 --- a/src/routes/main/MainStackNavigator.tsx +++ b/src/routes/main/MainStackNavigator.tsx @@ -92,6 +92,8 @@ export type MainStackParams = { screenType: ScreenType; }; SPWelcomeScreen: {}; + ChatList: undefined; + Chat: undefined; }; export const MainStack = createStackNavigator<MainStackParams>(); diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx index d855f0df..8068b893 100644 --- a/src/routes/main/MainStackScreen.tsx +++ b/src/routes/main/MainStackScreen.tsx @@ -29,6 +29,8 @@ import { SuggestedPeopleUploadPictureScreen, SuggestedPeopleWelcomeScreen, SettingsScreen, + ChatListScreen, + ChatScreen, } from '../../screens'; import MutualBadgeHolders from '../../screens/suggestedPeople/MutualBadgeHolders'; import {ScreenType} from '../../types'; @@ -85,6 +87,8 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => { return 'Notifications'; case ScreenType.SuggestedPeople: return 'SuggestedPeople'; + case ScreenType.Chat: + return 'ChatList'; } })(); @@ -294,6 +298,16 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => { ...headerBarOptions('white', ''), }} /> + <MainStack.Screen + name="ChatList" + component={ChatListScreen} + options={{headerTitle: 'Chats'}} + /> + <MainStack.Screen + name="Chat" + component={ChatScreen} + options={{headerShown: true}} + /> </MainStack.Navigator> ); }; diff --git a/src/routes/tabs/NavigationBar.tsx b/src/routes/tabs/NavigationBar.tsx index e9208525..9b8427e7 100644 --- a/src/routes/tabs/NavigationBar.tsx +++ b/src/routes/tabs/NavigationBar.tsx @@ -54,6 +54,8 @@ const NavigationBar: React.FC = () => { disabled={!focused} /> ); + case 'Chat': + return <NavigationIcon tab="Chat" disabled={!focused} />; case 'Profile': return <NavigationIcon tab="Profile" disabled={!focused} />; case 'SuggestedPeople': @@ -93,6 +95,11 @@ const NavigationBar: React.FC = () => { initialParams={{screenType: ScreenType.Notifications}} /> <Tabs.Screen + name="Chat" + component={MainStackScreen} + initialParams={{screenType: ScreenType.Chat}} + /> + <Tabs.Screen name="Profile" component={MainStackScreen} initialParams={{screenType: ScreenType.Profile}} diff --git a/src/screens/chat/ChatListScreen.tsx b/src/screens/chat/ChatListScreen.tsx new file mode 100644 index 00000000..c49c790d --- /dev/null +++ b/src/screens/chat/ChatListScreen.tsx @@ -0,0 +1,48 @@ +import React from 'react'; +import {View, StyleSheet, Text, TouchableOpacity} from 'react-native'; +import {StackNavigationProp} from '@react-navigation/stack'; + +import {MainStackParams} from '../../routes'; + +type ChatListScreenNavigationProp = StackNavigationProp< + MainStackParams, + 'ChatList' +>; +interface ChatListScreenProps { + navigation: ChatListScreenNavigationProp; +} +/* + * Screen that displays all of the user's active conversations. + */ +const ChatListScreen: React.FC<ChatListScreenProps> = ({navigation}) => { + return ( + <View style={styles.container}> + <Text style={styles.placeholder}>I am the chat list.</Text> + <TouchableOpacity + style={styles.button} + onPress={() => navigation.navigate('Chat')}> + <Text>Let's go to a conversation!</Text> + </TouchableOpacity> + </View> + ); +}; + +const styles = StyleSheet.create({ + container: { + flex: 1, + justifyContent: 'center', + alignItems: 'center', + }, + placeholder: { + fontSize: 14, + fontWeight: 'bold', + marginBottom: 10, + }, + button: { + backgroundColor: '#CCE4FC', + padding: 15, + borderRadius: 5, + }, +}); + +export default ChatListScreen; diff --git a/src/screens/chat/ChatScreen.tsx b/src/screens/chat/ChatScreen.tsx new file mode 100644 index 00000000..af83f504 --- /dev/null +++ b/src/screens/chat/ChatScreen.tsx @@ -0,0 +1,34 @@ +import React from 'react'; +import {View, StyleSheet, Text} from 'react-native'; +import {StackNavigationProp} from '@react-navigation/stack'; + +import {MainStackParams} from '../../routes'; + +type ChatScreenNavigationProp = StackNavigationProp<MainStackParams, 'Chat'>; +interface ChatScreenProps { + navigation: ChatScreenNavigationProp; +} +/* + * Screen that displays all of the user's active conversations. + */ +const ChatScreen: React.FC<ChatScreenProps> = () => { + return ( + <View style={styles.container}> + <Text style={styles.placeholder}>I am a chat!</Text> + </View> + ); +}; + +const styles = StyleSheet.create({ + container: { + flex: 1, + justifyContent: 'center', + alignItems: 'center', + }, + placeholder: { + fontSize: 14, + fontWeight: 'bold', + }, +}); + +export default ChatScreen; diff --git a/src/screens/chat/index.ts b/src/screens/chat/index.ts new file mode 100644 index 00000000..d2ccb02b --- /dev/null +++ b/src/screens/chat/index.ts @@ -0,0 +1,2 @@ +export {default as ChatListScreen} from './ChatListScreen'; +export {default as ChatScreen} from './ChatScreen'; diff --git a/src/screens/index.ts b/src/screens/index.ts index 50ada3d1..44ae4b52 100644 --- a/src/screens/index.ts +++ b/src/screens/index.ts @@ -5,3 +5,4 @@ export * from './search'; export * from './suggestedPeople'; export * from './suggestedPeopleOnboarding'; export * from './badge'; +export * from './chat'; diff --git a/src/types/types.ts b/src/types/types.ts index 766bf798..e7acd6e0 100644 --- a/src/types/types.ts +++ b/src/types/types.ts @@ -142,6 +142,7 @@ export enum ScreenType { Search, Notifications, SuggestedPeople, + Chat, } /** |