Skip to content

Commit 1a848ca

Browse files
meeting bug fix
1 parent 1d3335a commit 1a848ca

File tree

17 files changed

+201
-65
lines changed

17 files changed

+201
-65
lines changed
30.6 KB
Binary file not shown.

src/components/Headers/BackHeader/BackHeader.tsx

Lines changed: 32 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,12 @@ interface props {
1111
rightIcon?: string;
1212
onRightPress?: () => void;
1313
centerText?: string;
14+
centerTextColor?: string;
15+
leftIconColor?: string;
16+
rightIconColor?: string;
17+
rightLeftIcon?: string;
18+
rightLeftIconColor?: string;
19+
onPressRightLeftIcon?: () => void;
1420
}
1521

1622
const BackHeader = (props: props) => {
@@ -27,26 +33,43 @@ const BackHeader = (props: props) => {
2733
<Icon
2834
name={props.leftIcon}
2935
style={styles.icon}
30-
fill={theme === 'dark' ? 'white' : 'black'}
36+
fill={props.leftIconColor}
3137
/>
3238
</TouchableOpacity>
3339
)}
3440
{props.centerText && (
3541
<View
3642
style={[styles.textView, {width: props.rightIcon ? '75%' : '85%'}]}>
37-
<Text category="h5" style={[styles.centerText]}>
43+
<Text
44+
category="h5"
45+
style={[styles.centerText, {color: props.centerTextColor}]}>
3846
{props.centerText}
3947
</Text>
4048
</View>
4149
)}
4250
{props.rightIcon && (
43-
<TouchableOpacity onPress={props.onRightPress} style={styles.rightView}>
44-
<Icon
45-
name={props.rightIcon}
46-
style={styles.rightIcon}
47-
fill={theme === 'dark' ? 'white' : 'black'}
48-
/>
49-
</TouchableOpacity>
51+
<View style={{flexDirection: 'row'}}>
52+
{props.rightLeftIcon && (
53+
<TouchableOpacity
54+
onPress={props.onPressRightLeftIcon}
55+
style={[styles.rightView, {marginRight: 10}]}>
56+
<Icon
57+
name={props.rightLeftIcon}
58+
style={styles.rightIcon}
59+
fill={props.rightLeftIconColor}
60+
/>
61+
</TouchableOpacity>
62+
)}
63+
<TouchableOpacity
64+
onPress={props.onRightPress}
65+
style={styles.rightView}>
66+
<Icon
67+
name={props.rightIcon}
68+
style={styles.rightIcon}
69+
fill={props.rightIconColor}
70+
/>
71+
</TouchableOpacity>
72+
</View>
5073
)}
5174
</View>
5275
);

src/components/Messages/VideoChat.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,7 @@ const VideoChat = (props: props) => {
150150
props1,
151151
appTheme === 'dark'
152152
? theme['color-basic-900']
153-
: theme['color-basic-600'],
153+
: theme['color-basic-300'],
154154
)
155155
}
156156
renderSend={(props2) =>
@@ -168,10 +168,10 @@ const VideoChat = (props: props) => {
168168
renderBubble={(props4) =>
169169
renderBubble(
170170
props4,
171-
appTheme === 'dark'
172-
? theme['color-basic-700']
173-
: theme['color-basic-400'],
174171
theme['color-primary-default'],
172+
appTheme === 'dark'
173+
? theme['color-basic-200']
174+
: theme['color-basic-600'],
175175
)
176176
}
177177
renderActions={(props5) => renderAction(props5)}

src/components/Modals/MeetInfo/MeetInfo.tsx

Lines changed: 25 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,8 @@ import {
1616
} from '../../../constants/Fonts/Fonts';
1717
import FullDivider from '../../Divider/FullDivider';
1818
import {VideoStreamParams} from '../../../models/Meeting/CreateMeeting/interface';
19+
import Clipboard from '@react-native-clipboard/clipboard';
20+
import Toast from 'react-native-toast-message';
1921

2022
interface props {
2123
modalVisible: boolean;
@@ -31,9 +33,27 @@ const MeetInfo = (props: props) => {
3133
(reduxState: RootState) => reduxState.ThemeReducer.theme,
3234
);
3335

34-
const renderIcon = (props: any) => (
35-
<TouchableWithoutFeedback onPress={() => console.log('Copied')}>
36-
<Icon {...props} name="copy-outline" />
36+
const onPressCopy = (text: string) => {
37+
Clipboard.setString(text);
38+
Toast.show({
39+
type: 'success',
40+
text1: 'Copied!',
41+
position: 'top',
42+
visibilityTime: 300,
43+
});
44+
};
45+
46+
const renderIdIcon = (iconProps: any) => (
47+
<TouchableWithoutFeedback
48+
onPress={() => onPressCopy(props.meetConfig.meetId)}>
49+
<Icon {...iconProps} name="copy-outline" />
50+
</TouchableWithoutFeedback>
51+
);
52+
53+
const renderPassIcon = (iconProps: any) => (
54+
<TouchableWithoutFeedback
55+
onPress={() => onPressCopy(props.meetConfig.password)}>
56+
<Icon {...iconProps} name="copy-outline" />
3757
</TouchableWithoutFeedback>
3858
);
3959

@@ -78,15 +98,15 @@ const MeetInfo = (props: props) => {
7898
<Input
7999
label="Baithak Id"
80100
style={styles.input}
81-
accessoryRight={renderIcon}
101+
accessoryRight={renderIdIcon}
82102
disabled={true}
83103
placeholder={props.meetConfig.meetId}
84104
size="large"
85105
/>
86106
<Input
87107
label="Password"
88108
style={styles.input}
89-
accessoryRight={renderIcon}
109+
accessoryRight={renderPassIcon}
90110
disabled={true}
91111
placeholder={props.meetConfig.password}
92112
size="large"

src/components/Modals/Settings/Settings.tsx

Lines changed: 11 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -5,30 +5,28 @@ import Modal from 'react-native-modal';
55
import {useDispatch, useSelector} from 'react-redux';
66
import {RootState} from '../../../store/rootReducer';
77
import {RALEWAY_BOLD, RALEWAY_MEDIUM} from '../../../constants/Fonts/Fonts';
8-
import {optionProp} from '../../../models/Meeting/CreateMeeting/interface';
9-
import {useState} from 'react';
108
import FullDivider from '../../Divider/FullDivider';
11-
import {writeAsync} from '../../../utils/Firestore/write';
9+
import {updateThemeRemotely} from '../../../store/theme/actionCreator/updateTheme';
1210

1311
interface props {
1412
uid: string;
1513
modalVisible: boolean;
1614
onBackDropPress: () => void;
17-
theme: 'light' | 'dark';
1815
}
1916

2017
const Settings = (props: props) => {
2118
const styles = useStyleSheet(themedStyles);
22-
const [theme, setThemeState] = useState<'light' | 'dark'>(props.theme);
19+
const theme = useSelector(
20+
(reduxState: RootState) => reduxState.ThemeReducer.theme,
21+
);
22+
const storeDispatch = useDispatch();
2323

24-
const changeTheme = async () => {
25-
try {
26-
const changedTheme = theme === 'dark' ? 'light' : 'dark';
27-
setThemeState(changedTheme);
28-
await writeAsync('users', props.uid, {theme: changedTheme}, true);
29-
} catch (error) {
30-
console.log('Error in updating theme', error);
31-
}
24+
const changeTheme = () => {
25+
const themeAction = updateThemeRemotely(
26+
theme === 'dark' ? 'light' : 'dark',
27+
props.uid,
28+
);
29+
storeDispatch(themeAction);
3230
};
3331

3432
return (

src/components/Modals/VideoMessage/VideoMessage.tsx

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ import {Baithak} from '../../../models/Meeting/CreateMeeting/interface';
66
import BackHeader from '../../Headers/BackHeader/BackHeader';
77
import useGetMeetMssg from '../../../hooks/Messages/Meeting/useGetMeetMssg';
88
import VideoChat from '../../Messages/VideoChat';
9+
import {useSelector} from 'react-redux';
10+
import {RootState} from '../../../store/rootReducer';
911

1012
interface props {
1113
baithak: Baithak | undefined;
@@ -15,8 +17,17 @@ interface props {
1517

1618
const VideoMessage = (props: props) => {
1719
if (!props.baithak) return null;
20+
21+
const theme = useSelector(
22+
(reduxState: RootState) => reduxState.ThemeReducer.theme,
23+
);
24+
25+
const firebaseUser = useSelector(
26+
(reduxState: RootState) => reduxState.UserReducer.firebaseUser,
27+
);
28+
1829
const {messages, handleSend, isMoreLoading, loadMore, lastDoc} =
19-
useGetMeetMssg(props.baithak);
30+
useGetMeetMssg(props.baithak, firebaseUser);
2031

2132
const styles = useStyleSheet(themedStyles);
2233
return (
@@ -36,6 +47,8 @@ const VideoMessage = (props: props) => {
3647
leftIcon="arrow-back-outline"
3748
onLeftPress={props.onBackDropPress}
3849
centerText="Messages"
50+
leftIconColor={theme === 'dark' ? 'white' : 'black'}
51+
centerTextColor={theme === 'dark' ? 'white' : 'black'}
3952
/>
4053
</View>
4154
<VideoChat

src/hooks/Meeting/useStartMeeting.ts

Lines changed: 29 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ import {getShareMessage} from '../../utils/Meeting/Methods/getShareMessage';
1919
import Toast from 'react-native-toast-message';
2020
import {getBaithakPartiFromAgoraId} from '../../utils/Messages/Meeting/utils';
2121
import Sound from 'react-native-sound';
22+
import {getRemoteUserByAgoraId} from '../../utils/User/Methods/getRemoteUser';
2223

2324
interface props {
2425
appId: string;
@@ -42,6 +43,7 @@ const useStartMeeting = (
4243
const [showParticipants, toogleParticipants] = useState<boolean>(false);
4344
const [speakerOff, toogleSpeaker] = useState<boolean>(false);
4445
const [inVideoOff, toogleInVideoOff] = useState<boolean>(false);
46+
const [flashOn, toggleFlash] = useState<boolean>(false);
4547

4648
let engine = useRef<RtcEngine | null>(null);
4749
let sound = useRef<Sound | null>(
@@ -110,6 +112,19 @@ const useStartMeeting = (
110112
}
111113
});
112114

115+
// Listen for the UserOffline callback.
116+
// This callback occurs when the remote user gets cutt off the channel.
117+
engine.current?.addListener('UserOffline', (uid, elapsed) => {
118+
const user = getRemoteUserByAgoraId(uid);
119+
if (user && user.name) {
120+
Toast.show({
121+
type: 'info',
122+
text1: `${user.name} left the Baithak`,
123+
position: 'top',
124+
});
125+
}
126+
});
127+
113128
// Listen for the JoinChannelSuccess callback.
114129
// This callback occurs when the local user successfully joins the channel.
115130
engine.current?.addListener(
@@ -120,9 +135,6 @@ const useStartMeeting = (
120135
} else {
121136
await onMemberJoinMeet(meetConfig, firebaseUser);
122137
}
123-
124-
sound.current?.play();
125-
126138
setJoinSucceed(true);
127139
toggleModal(false);
128140
},
@@ -148,6 +160,7 @@ const useStartMeeting = (
148160
});
149161
});
150162
} catch (err) {
163+
engine.current?.destroy();
151164
console.log('Error in initialize RTC', err);
152165
toggleModal(false);
153166
navigation.goBack();
@@ -195,7 +208,8 @@ const useStartMeeting = (
195208
//Make the camera to flash on
196209
const onCamerFlashOn = () => {
197210
if (engine.current) {
198-
engine.current?.setCameraTorchOn(true);
211+
engine.current?.setCameraTorchOn(!flashOn);
212+
toggleFlash(!flashOn);
199213
}
200214
};
201215

@@ -212,7 +226,7 @@ const useStartMeeting = (
212226
toogleSpeaker(!speakerOff);
213227
Toast.show({
214228
type: 'info',
215-
text1: `Incoming Audios are ${speakerOff ? 'On' : 'Off'}!`,
229+
text1: `Incoming Audios are ${speakerOff ? 'Off' : 'On'}!`,
216230
position: 'top',
217231
});
218232
if (menuOpen) setMenuOpen(!menuOpen);
@@ -226,7 +240,7 @@ const useStartMeeting = (
226240
toogleInVideoOff(!inVideoOff);
227241
Toast.show({
228242
type: 'info',
229-
text1: `Incoming Videos are ${inVideoOff ? 'On' : 'Off'}!`,
243+
text1: `Incoming Videos are ${inVideoOff ? 'Off' : 'On'}!`,
230244
position: 'top',
231245
});
232246
if (menuOpen) setMenuOpen(!menuOpen);
@@ -292,9 +306,13 @@ const useStartMeeting = (
292306
};
293307

294308
const onShare = async () => {
295-
if (menuOpen) setMenuOpen(!menuOpen);
296-
if (meetInfo) toogleMeetInfo(!meetInfo);
297-
const result = Share.share({message: getShareMessage(baithak)});
309+
try {
310+
if (menuOpen) setMenuOpen(!menuOpen);
311+
if (meetInfo) toogleMeetInfo(!meetInfo);
312+
await Share.share({message: getShareMessage(baithak)});
313+
} catch (error) {
314+
console.log('Error in sharing', error);
315+
}
298316
};
299317

300318
return {
@@ -324,6 +342,8 @@ const useStartMeeting = (
324342
onPressSpeaker,
325343
inVideoOff,
326344
onPressInVideo,
345+
flashOn,
346+
onCamerFlashOn,
327347
};
328348
};
329349

src/hooks/Messages/Meeting/useGetMeetMssg.ts

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,9 @@ import {debounce} from 'lodash';
1010
import {getTime} from '../../../utils/Miscellaneous/utils';
1111
import Toast from 'react-native-toast-message';
1212
import Sound from 'react-native-sound';
13+
import {UserInterface} from '../../../models/User/User';
1314

14-
const useGetMeetMssg = (Baithak: Baithak) => {
15+
const useGetMeetMssg = (Baithak: Baithak, firebaseUser: UserInterface) => {
1516
const [messages, setMessages] = useState<IMessage[]>([]);
1617
const [lastDoc, setLastDoc] = useState<FirebaseFirestoreTypes.DocumentData>();
1718
const [isMoreLoading, setIsMoreLoading] = useState<boolean>(false);
@@ -97,8 +98,9 @@ const useGetMeetMssg = (Baithak: Baithak) => {
9798

9899
useEffect(() => {
99100
if (lastMessage) {
100-
const user = getBaithakPartiFromUid(lastMessage.uid, Baithak);
101-
if (lastMessage.uid !== user._id) {
101+
const lastMessgageUser = getBaithakPartiFromUid(lastMessage.uid, Baithak);
102+
103+
if (lastMessage.uid !== firebaseUser.uid) {
102104
sound.current = new Sound('message.mp3', Sound.MAIN_BUNDLE, (error) => {
103105
if (error) {
104106
console.log('Error in playing message sound', error);
@@ -110,9 +112,10 @@ const useGetMeetMssg = (Baithak: Baithak) => {
110112

111113
Toast.show({
112114
type: 'success',
113-
text1: user.name,
115+
text1: lastMessgageUser.name ? lastMessgageUser.name : 'Someone',
114116
text2: lastMessage.text,
115117
position: 'bottom',
118+
bottomOffset: 100,
116119
});
117120
}
118121
}

src/hooks/auth/useAuth.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import useFirestore from '../Firestore/useFirestore';
1818
import Toast from 'react-native-toast-message';
1919
import {updateTheme} from '../../store/theme/actionCreator/updateTheme';
2020
import {getRemoteTheme, getTheme} from '../../utils/User/Methods/getTheme';
21+
import {DEFAULT_AVATAR} from '../../constants/Images/Images';
2122

2223
const useAuth = () => {
2324
const [firebaseUserRef, setFirebaseUserRef] = useState<
@@ -52,8 +53,8 @@ const useAuth = () => {
5253
Platform.OS,
5354
getTheme(),
5455
user.email ? user.email : '[email protected]',
55-
user.displayName ? user.displayName : undefined,
56-
user.photoURL ? user.photoURL : undefined,
56+
user.displayName ? user.displayName : 'Robot',
57+
user.photoURL ? user.photoURL : DEFAULT_AVATAR,
5758
false,
5859
);
5960
Toast.show({
@@ -67,8 +68,8 @@ const useAuth = () => {
6768
await updateUserObjOnAuth(
6869
user.uid,
6970
Platform.OS,
70-
user.displayName ? user.displayName : undefined,
71-
user.phoneNumber ? user.phoneNumber : undefined,
71+
user.displayName ? user.displayName : 'Robot',
72+
user.phoneNumber ? user.phoneNumber : DEFAULT_AVATAR,
7273
user.email ? user.email : '[email protected]',
7374
user.photoURL ? user.photoURL : '',
7475
);

0 commit comments

Comments
 (0)