aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/components/messages/ChatHeader.tsx81
-rw-r--r--src/components/profile/ProfileBody.tsx16
-rw-r--r--src/constants/strings.ts3
-rw-r--r--src/screens/chat/ChatScreen.tsx3
-rw-r--r--src/store/initialStates.ts1
5 files changed, 69 insertions, 35 deletions
diff --git a/src/components/messages/ChatHeader.tsx b/src/components/messages/ChatHeader.tsx
index 2bc096ec..67a7f1fe 100644
--- a/src/components/messages/ChatHeader.tsx
+++ b/src/components/messages/ChatHeader.tsx
@@ -1,39 +1,71 @@
+import {useNavigation} from '@react-navigation/native';
import React, {useContext} from 'react';
import {Image, StyleSheet, View} from 'react-native';
import {Text} from 'react-native-animatable';
-import {useStore} from 'react-redux';
+import {TouchableOpacity} from 'react-native-gesture-handler';
+import {useDispatch, useStore} from 'react-redux';
import {ChatContext} from '../../App';
-import {ChatHeaderHeight, normalize, StatusBarHeight} from '../../utils';
+import {ScreenType} from '../../types';
+import {
+ ChatHeaderHeight,
+ fetchUserX,
+ normalize,
+ StatusBarHeight,
+ userXInStore,
+} from '../../utils';
import {formatLastSeenText, getMember, isOnline} from '../../utils/messages';
-type ChatHeaderProps = {};
+type ChatHeaderProps = {
+ screenType: ScreenType;
+};
-const ChatHeader: React.FC<ChatHeaderProps> = () => {
+const ChatHeader: React.FC<ChatHeaderProps> = (props) => {
+ const {screenType} = props;
const {channel} = useContext(ChatContext);
+ const dispatch = useDispatch();
+ const navigation = useNavigation();
const state = useStore().getState();
const member = getMember(channel, state);
const online = isOnline(member?.user?.last_active);
const lastSeen = formatLastSeenText(member?.user?.last_active);
+ const toProfile = async () => {
+ if (member && member.user && member.user.username) {
+ if (!userXInStore(state, screenType, member.user.id)) {
+ await fetchUserX(
+ dispatch,
+ {userId: member.user.id, username: member.user.username},
+ screenType,
+ );
+ }
+ navigation.navigate('Profile', {
+ userXId: member.user.id,
+ screenType,
+ });
+ }
+ };
+
return (
<View style={styles.container}>
- <View>
- <Image
- style={styles.avatar}
- source={
- member
- ? {uri: member.user?.thumbnail_url}
- : require('../../assets/images/avatar-placeholder.png')
- }
- />
- {online && <View style={styles.online} />}
- </View>
- <View style={styles.content}>
- <Text style={styles.name} numberOfLines={1}>
- {member?.user?.first_name} {member?.user?.last_name}
- </Text>
- <Text style={styles.lastSeen}>{lastSeen}</Text>
- </View>
+ <TouchableOpacity style={styles.tappables} onPress={toProfile}>
+ <View>
+ <Image
+ style={styles.avatar}
+ source={
+ member
+ ? {uri: member.user?.thumbnail_url}
+ : require('../../assets/images/avatar-placeholder.png')
+ }
+ />
+ {online && <View style={styles.online} />}
+ </View>
+ <View style={styles.content}>
+ <Text style={styles.name} numberOfLines={1}>
+ {member?.user?.first_name} {member?.user?.last_name}
+ </Text>
+ <Text style={styles.lastSeen}>{lastSeen}</Text>
+ </View>
+ </TouchableOpacity>
</View>
);
};
@@ -41,10 +73,13 @@ const ChatHeader: React.FC<ChatHeaderProps> = () => {
const styles = StyleSheet.create({
container: {
height: ChatHeaderHeight - StatusBarHeight,
- flexDirection: 'row',
- alignItems: 'center',
paddingLeft: '15%',
},
+ tappables: {
+ alignItems: 'center',
+ flexDirection: 'row',
+ width: '100%',
+ },
avatar: {
width: normalize(40),
height: normalize(40),
diff --git a/src/components/profile/ProfileBody.tsx b/src/components/profile/ProfileBody.tsx
index 00532507..527036f6 100644
--- a/src/components/profile/ProfileBody.tsx
+++ b/src/components/profile/ProfileBody.tsx
@@ -22,6 +22,7 @@ import {RootState} from '../../store/rootReducer';
import {ScreenType} from '../../types';
import {
connectChatAccount,
+ createChannel,
getUserAsProfilePreviewType,
SCREEN_HEIGHT,
SCREEN_WIDTH,
@@ -30,6 +31,8 @@ import {FriendsButton, BasicButton} from '../common';
import ToggleButton from './ToggleButton';
import {ChatContext} from '../../App';
import {useNavigation} from '@react-navigation/core';
+import {ChatListScreen} from '../../screens';
+import {ERROR_UNABLE_CONNECT_CHAT} from '../../constants/strings';
interface ProfileBodyProps {
onLayout: (event: LayoutChangeEvent) => void;
@@ -97,19 +100,12 @@ const ProfileBody: React.FC<ProfileBodyProps> = ({
};
const onPressMessage = async () => {
- let connected: boolean = await connectChatAccount(
- loggedInUserId,
- chatClient,
- );
- if (connected) {
- const channel = chatClient.channel('messaging', {
- members: [loggedInUserId, String(userXId)],
- });
- channel.create();
+ if (chatClient.user && userXId) {
+ const channel = await createChannel(loggedInUserId, userXId, chatClient);
setChannel(channel);
navigation.navigate('Chat');
} else {
- Alert.alert('Something wrong with chat');
+ Alert.alert(ERROR_UNABLE_CONNECT_CHAT);
}
};
diff --git a/src/constants/strings.ts b/src/constants/strings.ts
index 94f5552f..bdb94fba 100644
--- a/src/constants/strings.ts
+++ b/src/constants/strings.ts
@@ -9,6 +9,7 @@ export const ERROR_AUTHENTICATION = 'An error occurred during authentication. Pl
export const ERROR_BADGES_EXCEED_LIMIT = 'You can\'t have more than 5 badges!';
export const ERROR_CATEGORY_CREATION = 'There was a problem creating your categories. Please refresh and try again.';
export const ERROR_CATEGORY_UPDATE = 'There was a problem updating your categories. Please refresh and try again';
+export const ERROR_CHAT_CONNECTION = `Unable to establish chat connection`;
export const ERROR_DELETE_CATEGORY = 'There was a problem while deleting category. Please try again';
export const ERROR_DELETE_MOMENT = 'Unable to delete moment, please try again later!';
export const ERROR_DELETED_OBJECT = 'Oh sad! Looks like the comment / moment was deleted by the user';
@@ -35,7 +36,6 @@ export const ERROR_PROFILE_CREATION_SHORT = 'Profile creation failed πŸ˜“';
export const ERROR_PROFILE_UPDATE_SHORT = 'Profile update failed. πŸ˜”';
export const ERROR_PWD_ACCOUNT = (str: string) => `Please make sure that the email / username entered is registered with us. You may contact our customer support at ${str}`;
export const ERROR_REGISTRATION = (str: string) => `Registration failed πŸ˜”, ${str}`;
-export const ERROR_CHAT_CONNECTION = `Unable to establish chat connection`;
export const ERROR_SELECT_BIRTHDAY = 'Please select your birthday';
export const ERROR_SELECT_CLASS_YEAR = 'Please select your Class Year';
export const ERROR_SELECT_GENDER = 'Please select your gender';
@@ -45,6 +45,7 @@ export const ERROR_SOMETHING_WENT_WRONG = 'Oh dear, don’t worry someone will b
export const ERROR_SOMETHING_WENT_WRONG_REFRESH = "Ha, looks like this one's on us, please refresh and try again";
export const ERROR_SOMETHING_WENT_WRONG_RELOAD = "You broke it, Just kidding! we don't know what happened... Please reload the app and try again";
export const ERROR_TWILIO_SERVER_ERROR = 'mhm, looks like that is an invalid phone number or our servers are down, please try again in a few mins';
+export const ERROR_UNABLE_CONNECT_CHAT = 'Unable to connect chat';
export const ERROR_UNABLE_TO_FIND_PROFILE = 'We were unable to find this profile. Please check username and try again';
export const ERROR_UNABLE_TO_VIEW_PROFILE = 'Unable to view this profile';
export const ERROR_UPLOAD = 'An error occurred while uploading. Please try again!';
diff --git a/src/screens/chat/ChatScreen.tsx b/src/screens/chat/ChatScreen.tsx
index 59c53c99..1554274d 100644
--- a/src/screens/chat/ChatScreen.tsx
+++ b/src/screens/chat/ChatScreen.tsx
@@ -12,6 +12,7 @@ import {
import {ChatContext} from '../../App';
import ChatHeader from '../../components/messages/ChatHeader';
import {MainStackParams} from '../../routes';
+import {ScreenType} from '../../types';
import {isIPhoneX} from '../../utils';
type ChatScreenNavigationProp = StackNavigationProp<MainStackParams, 'Chat'>;
@@ -32,7 +33,7 @@ const ChatScreen: React.FC<ChatScreenProps> = () => {
// unable to figure out the padding issue, a hacky solution
{paddingBottom: isIPhoneX() ? tabbarHeight + 20 : tabbarHeight + 50},
]}>
- <ChatHeader />
+ <ChatHeader screenType={ScreenType.Chat} />
<Chat client={chatClient}>
<Channel channel={channel} keyboardVerticalOffset={0}>
<MessageList onThreadSelect={() => {}} />
diff --git a/src/store/initialStates.ts b/src/store/initialStates.ts
index 02331eb6..7fd3ac5a 100644
--- a/src/store/initialStates.ts
+++ b/src/store/initialStates.ts
@@ -117,6 +117,7 @@ export const EMPTY_SCREEN_TO_USERS_LIST: Record<
[ScreenType.Search]: EMPTY_USERX_LIST,
[ScreenType.Notifications]: EMPTY_USERX_LIST,
[ScreenType.SuggestedPeople]: EMPTY_USERX_LIST,
+ [ScreenType.Chat]: EMPTY_USERX_LIST,
};
export const INITIAL_CATEGORIES_STATE = {