From 9fef149f9c2185c191d1b856d7939449ccc4f1d0 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Fri, 9 Apr 2021 11:30:20 -0700 Subject: Added boolean for user connection status --- src/store/actions/user.ts | 16 ++++++++++++++++ src/store/initialStates.ts | 1 + src/store/reducers/userReducer.ts | 4 ++++ 3 files changed, 21 insertions(+) (limited to 'src/store') diff --git a/src/store/actions/user.ts b/src/store/actions/user.ts index 3ebd4190..0ed57fe6 100644 --- a/src/store/actions/user.ts +++ b/src/store/actions/user.ts @@ -11,6 +11,7 @@ import {getTokenOrLogout} from '../../utils'; import { clearHeaderAndProfileImages, profileCompletionStageUpdated, + setChatClientReady, setIsOnboardedUser, setNewNotificationReceived, setNewVersionAvailable, @@ -233,3 +234,18 @@ export const suggestedPeopleAnimatedTutorialFinished = ( console.log('Error while updating suggested people linked state: ', error); } }; + +export const updateChatClientReady = ( + chatClientReady: boolean, +): ThunkAction, RootState, unknown, Action> => async ( + dispatch, +) => { + try { + dispatch({ + type: setChatClientReady.type, + payload: {chatClientReady}, + }); + } catch (error) { + console.log(error); + } +}; diff --git a/src/store/initialStates.ts b/src/store/initialStates.ts index 02331eb6..546c57a9 100644 --- a/src/store/initialStates.ts +++ b/src/store/initialStates.ts @@ -41,6 +41,7 @@ export const EMPTY_PROFILE_PREVIEW_LIST = []; export const NO_USER_DATA = { user: NO_USER, + chatClientReady: false, profile: NO_PROFILE, avatar: undefined, cover: undefined, diff --git a/src/store/reducers/userReducer.ts b/src/store/reducers/userReducer.ts index 9ff9ba01..0b958cac 100644 --- a/src/store/reducers/userReducer.ts +++ b/src/store/reducers/userReducer.ts @@ -75,6 +75,9 @@ const userDataSlice = createSlice({ state.avatar = ''; state.cover = ''; }, + setChatClientReady: (state, action) => { + state.chatClientReady = action.payload.chatClientReady; + }, }, }); @@ -90,5 +93,6 @@ export const { setReplyPosted, setSuggestedPeopleImage, clearHeaderAndProfileImages, + setChatClientReady, } = userDataSlice.actions; export const userDataReducer = userDataSlice.reducer; -- cgit v1.2.3-70-g09d2 From bdd1ed17600da7b766e2b0fa97ad4cbf01234819 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Fri, 9 Apr 2021 13:46:42 -0700 Subject: removed client ready from redux --- src/components/profile/ProfileBody.tsx | 6 ++-- src/routes/Routes.tsx | 2 +- src/screens/chat/ChatListScreen.tsx | 51 +++++++++++++++------------------- src/store/actions/user.ts | 15 ---------- src/store/initialStates.ts | 1 - src/utils/messages.ts | 4 +-- 6 files changed, 28 insertions(+), 51 deletions(-) (limited to 'src/store') diff --git a/src/components/profile/ProfileBody.tsx b/src/components/profile/ProfileBody.tsx index dc68446b..e23249fa 100644 --- a/src/components/profile/ProfileBody.tsx +++ b/src/components/profile/ProfileBody.tsx @@ -63,7 +63,6 @@ const ProfileBody: React.FC = ({ profile, ); - const {chatClientReady} = useSelector((state: RootState) => state.user); const {chatClient, setChannel} = useContext(ChatContext); const state: RootState = useStore().getState(); @@ -97,8 +96,9 @@ const ProfileBody: React.FC = ({ }; const onPressMessage = async () => { - if (!chatClientReady) { - Alert.alert('Something wrong with chat'); + if (!chatClient.user) { + // TODO: Add refresh control to retry establishing chat connection + Alert.alert('Unable to connect chat'); } const channel = chatClient.channel('messaging', { members: [loggedInUserId, String(userXId)], diff --git a/src/routes/Routes.tsx b/src/routes/Routes.tsx index 173a6a6c..adc6253b 100644 --- a/src/routes/Routes.tsx +++ b/src/routes/Routes.tsx @@ -54,7 +54,7 @@ const Routes: React.FC = () => { if (userId) { fcmService.setUpPushNotifications(); fcmService.sendFcmTokenToServer(); - connectChatAccount(loggedInUserId, chatClient, dispatch); + connectChatAccount(loggedInUserId, chatClient); } }, []); diff --git a/src/screens/chat/ChatListScreen.tsx b/src/screens/chat/ChatListScreen.tsx index dbdb7994..eb886232 100644 --- a/src/screens/chat/ChatListScreen.tsx +++ b/src/screens/chat/ChatListScreen.tsx @@ -31,9 +31,6 @@ interface ChatListScreenProps { */ const ChatListScreen: React.FC = () => { const {chatClient} = useContext(ChatContext); - const chatClientReady = useSelector( - (state: RootState) => state.user.chatClientReady, - ); const state: RootState = useStore().getState(); const loggedInUserId = state.user.user.userId; @@ -65,31 +62,29 @@ const ChatListScreen: React.FC = () => { channel.create(); }} /> - {chatClientReady && ( - - - - filters={memoizedFilters} - options={{ - presence: true, - state: true, - watch: true, - }} - sort={{last_message_at: -1}} - maxUnreadCount={99} - Preview={ChannelPreview} - /> - - - )} + + + + filters={memoizedFilters} + options={{ + presence: true, + state: true, + watch: true, + }} + sort={{last_message_at: -1}} + maxUnreadCount={99} + Preview={ChannelPreview} + /> + + diff --git a/src/store/actions/user.ts b/src/store/actions/user.ts index 0ed57fe6..c7d0d5a7 100644 --- a/src/store/actions/user.ts +++ b/src/store/actions/user.ts @@ -11,7 +11,6 @@ import {getTokenOrLogout} from '../../utils'; import { clearHeaderAndProfileImages, profileCompletionStageUpdated, - setChatClientReady, setIsOnboardedUser, setNewNotificationReceived, setNewVersionAvailable, @@ -235,17 +234,3 @@ export const suggestedPeopleAnimatedTutorialFinished = ( } }; -export const updateChatClientReady = ( - chatClientReady: boolean, -): ThunkAction, RootState, unknown, Action> => async ( - dispatch, -) => { - try { - dispatch({ - type: setChatClientReady.type, - payload: {chatClientReady}, - }); - } catch (error) { - console.log(error); - } -}; diff --git a/src/store/initialStates.ts b/src/store/initialStates.ts index 546c57a9..02331eb6 100644 --- a/src/store/initialStates.ts +++ b/src/store/initialStates.ts @@ -41,7 +41,6 @@ export const EMPTY_PROFILE_PREVIEW_LIST = []; export const NO_USER_DATA = { user: NO_USER, - chatClientReady: false, profile: NO_PROFILE, avatar: undefined, cover: undefined, diff --git a/src/utils/messages.ts b/src/utils/messages.ts index b2162d34..1c83ca9f 100644 --- a/src/utils/messages.ts +++ b/src/utils/messages.ts @@ -1,6 +1,6 @@ import AsyncStorage from '@react-native-community/async-storage'; import moment from 'moment'; -import {updateChatClientReady} from '../store/actions'; +// import {updateChatClientReady} from '../store/actions'; import {AppDispatch} from '../store/configureStore'; import {RootState} from '../store/rootReducer'; import {ChannelGroupedType} from '../types'; @@ -98,9 +98,7 @@ export const connectChatAccount = async ( }, chatToken, ); - dispatch(updateChatClientReady(true)); } catch (err) { - dispatch(updateChatClientReady(false)); console.log('Error while connecting user to Stream: ', err); } }; -- cgit v1.2.3-70-g09d2 From 45041863a432ed5ba02f896f0c4f3c23ae7830ed Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Fri, 9 Apr 2021 14:37:06 -0700 Subject: removed chat client inside userlogin --- src/components/profile/Content.tsx | 2 +- src/screens/onboarding/CategorySelection.tsx | 2 +- src/screens/onboarding/InvitationCodeVerification.tsx | 2 +- src/store/reducers/userReducer.ts | 5 +---- src/utils/users.ts | 10 +--------- 5 files changed, 5 insertions(+), 16 deletions(-) (limited to 'src/store') diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx index 0d2a0331..0052b61d 100644 --- a/src/components/profile/Content.tsx +++ b/src/components/profile/Content.tsx @@ -84,7 +84,7 @@ const Content: React.FC = ({userXId, screenType}) => { const refrestState = async () => { setRefreshing(true); if (!userXId) { - await userLogin(dispatch, loggedInUser, chatClient); + await userLogin(dispatch, loggedInUser); } else { await fetchUserX(dispatch, user, screenType); } diff --git a/src/screens/onboarding/CategorySelection.tsx b/src/screens/onboarding/CategorySelection.tsx index 1407575c..ab5ff3be 100644 --- a/src/screens/onboarding/CategorySelection.tsx +++ b/src/screens/onboarding/CategorySelection.tsx @@ -170,7 +170,7 @@ const CategorySelection: React.FC = ({ dispatch(updateIsOnboardedUser(true)); const token = await getTokenOrLogout(dispatch); await postMomentCategories(selectedCategories, token); - userLogin(dispatch, {userId: userId, username: username}, chatClient); + userLogin(dispatch, {userId: userId, username: username}); } else { dispatch( updateMomentCategories( diff --git a/src/screens/onboarding/InvitationCodeVerification.tsx b/src/screens/onboarding/InvitationCodeVerification.tsx index 774a7a11..6bc0ac9d 100644 --- a/src/screens/onboarding/InvitationCodeVerification.tsx +++ b/src/screens/onboarding/InvitationCodeVerification.tsx @@ -79,7 +79,7 @@ const InvitationCodeVerification: React.FC = ({ const username = route.params.username; await AsyncStorage.setItem('userId', userId); await AsyncStorage.setItem('username', username); - userLogin(dispatch, {userId, username}, chatClient); + userLogin(dispatch, {userId, username}); } else { Alert.alert(ERROR_INVALID_INVITATION_CODE); } diff --git a/src/store/reducers/userReducer.ts b/src/store/reducers/userReducer.ts index 0b958cac..a8789c1d 100644 --- a/src/store/reducers/userReducer.ts +++ b/src/store/reducers/userReducer.ts @@ -75,9 +75,6 @@ const userDataSlice = createSlice({ state.avatar = ''; state.cover = ''; }, - setChatClientReady: (state, action) => { - state.chatClientReady = action.payload.chatClientReady; - }, }, }); @@ -93,6 +90,6 @@ export const { setReplyPosted, setSuggestedPeopleImage, clearHeaderAndProfileImages, - setChatClientReady, + // setChatClientReady, } = userDataSlice.actions; export const userDataReducer = userDataSlice.reducer; diff --git a/src/utils/users.ts b/src/utils/users.ts index ec09198d..7148eb79 100644 --- a/src/utils/users.ts +++ b/src/utils/users.ts @@ -22,7 +22,6 @@ import { ScreenType, UserType, } from './../types/types'; -import {connectChatAccount} from './messages'; const loadData = async (dispatch: AppDispatch, user: UserType) => { await Promise.all([ @@ -43,11 +42,7 @@ const loadData = async (dispatch: AppDispatch, user: UserType) => { * @param dispatch This is the dispatch object from the redux store * @param user The user if at all any */ -export const userLogin = async ( - dispatch: AppDispatch, - user: UserType, - chatClient?, -) => { +export const userLogin = async (dispatch: AppDispatch, user: UserType) => { try { let localUser = {...user}; if (!user.userId) { @@ -67,9 +62,6 @@ export const userLogin = async ( AsyncStorage.setItem('username', user.username), ]); } - if (chatClient) { - connectChatAccount(localUser.userId, chatClient, dispatch); - } await loadData(dispatch, localUser); } catch (error) { console.log(error); -- cgit v1.2.3-70-g09d2 From ad9db5ffd0b2fb6334fd8237e0600a76d25c7053 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Fri, 9 Apr 2021 19:22:30 -0400 Subject: added navigation to profile --- src/components/messages/ChatHeader.tsx | 81 ++++++++++++++++++++++++---------- src/components/profile/ProfileBody.tsx | 16 +++---- src/constants/strings.ts | 3 +- src/screens/chat/ChatScreen.tsx | 3 +- src/store/initialStates.ts | 1 + 5 files changed, 69 insertions(+), 35 deletions(-) (limited to 'src/store') 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 = () => { +const ChatHeader: React.FC = (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 ( - - - {online && } - - - - {member?.user?.first_name} {member?.user?.last_name} - - {lastSeen} - + + + + {online && } + + + + {member?.user?.first_name} {member?.user?.last_name} + + {lastSeen} + + ); }; @@ -41,10 +73,13 @@ const ChatHeader: React.FC = () => { 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 = ({ }; 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; @@ -32,7 +33,7 @@ const ChatScreen: React.FC = () => { // unable to figure out the padding issue, a hacky solution {paddingBottom: isIPhoneX() ? tabbarHeight + 20 : tabbarHeight + 50}, ]}> - + {}} /> 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 = { -- cgit v1.2.3-70-g09d2