agora-appbuilder-core 4.0.7 → 4.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/package.json +1 -1
  2. package/template/_package-lock.json +82 -0
  3. package/template/android/app/build.gradle +8 -0
  4. package/template/android/build.gradle +3 -0
  5. package/template/bridge/rtc/webNg/RtcEngine.ts +581 -31
  6. package/template/bridge/rtc/webNg/RtcSurfaceView.tsx +2 -1
  7. package/template/bridge/rtm/web/index.ts +2 -1
  8. package/template/customization-api/customize.ts +29 -10
  9. package/template/index.js +17 -1
  10. package/template/index.web.js +2 -2
  11. package/template/package.json +3 -0
  12. package/template/src/SDKAppWrapper.tsx +44 -2
  13. package/template/src/app-state/useNoiseSupression.native.tsx +6 -0
  14. package/template/src/app-state/useNoiseSupression.tsx +17 -0
  15. package/template/src/auth/AuthProvider.tsx +145 -8
  16. package/template/src/auth/IDPAuth.electron.tsx +2 -1
  17. package/template/src/auth/IDPAuth.tsx +8 -2
  18. package/template/src/auth/openIDPURL.native.tsx +14 -3
  19. package/template/src/auth/useTokenAuth.tsx +7 -1
  20. package/template/src/components/Controls.tsx +2 -1
  21. package/template/src/components/DeviceConfigure.tsx +67 -17
  22. package/template/src/components/Precall.tsx +21 -0
  23. package/template/src/components/RTMConfigure.tsx +188 -24
  24. package/template/src/components/SettingsView.tsx +2 -0
  25. package/template/src/components/Share.tsx +11 -0
  26. package/template/src/components/StorageContext.tsx +32 -2
  27. package/template/src/components/chat-messages/useChatMessages.tsx +65 -5
  28. package/template/src/components/contexts/WaitingRoomContext.tsx +5 -1
  29. package/template/src/components/precall/joinCallBtn.tsx +6 -0
  30. package/template/src/components/precall/usePreCall.tsx +18 -2
  31. package/template/src/components/room-info/useRoomInfo.tsx +28 -25
  32. package/template/src/components/useUserPreference.tsx +13 -2
  33. package/template/src/components/useWakeLock.tsx +18 -4
  34. package/template/src/components/virtual-background/VBCard.tsx +40 -1
  35. package/template/src/components/virtual-background/VButils.native.ts +24 -5
  36. package/template/src/components/virtual-background/VButils.ts +29 -5
  37. package/template/src/components/virtual-background/VideoPreview.tsx +11 -1
  38. package/template/src/components/virtual-background/useVB.native.tsx +19 -3
  39. package/template/src/components/whiteboard/WhiteboardConfigure.tsx +32 -5
  40. package/template/src/components/whiteboard/WhiteboardToolBox.tsx +38 -8
  41. package/template/src/components/whiteboard/WhiteboardView.native.tsx +37 -13
  42. package/template/src/language/useLanguage.tsx +10 -4
  43. package/template/src/logger/AppBuilderLogger.tsx +215 -0
  44. package/template/src/logger/constants.ts +18 -0
  45. package/template/src/logger/transports/agora-transport.native.ts +58 -0
  46. package/template/src/logger/transports/agora-transport.ts +28 -0
  47. package/template/src/logger/transports/customer-transport.ts +115 -0
  48. package/template/src/pages/Create.tsx +27 -2
  49. package/template/src/pages/Endcall.tsx +6 -1
  50. package/template/src/pages/Join.tsx +31 -4
  51. package/template/src/pages/VideoCall.tsx +20 -56
  52. package/template/src/pages/video-call/DefaultLayouts.ts +11 -3
  53. package/template/src/pages/video-call/SidePanelHeader.tsx +12 -2
  54. package/template/src/pages/video-call/VideoCallScreen.tsx +8 -0
  55. package/template/src/pages/video-call/VideoRenderer.tsx +6 -0
  56. package/template/src/rtm/RTMEngine.ts +5 -0
  57. package/template/src/rtm-events-api/Events.ts +70 -16
  58. package/template/src/subComponents/LayoutIconDropdown.tsx +6 -0
  59. package/template/src/subComponents/LocalAudioMute.tsx +13 -3
  60. package/template/src/subComponents/LocalEndCall.tsx +8 -3
  61. package/template/src/subComponents/LocalVideoMute.tsx +15 -1
  62. package/template/src/subComponents/SelectDevice.tsx +111 -3
  63. package/template/src/subComponents/caption/CaptionContainer.tsx +17 -2
  64. package/template/src/subComponents/caption/useSTTAPI.tsx +62 -20
  65. package/template/src/subComponents/caption/useTranscriptDownload.native.ts +35 -5
  66. package/template/src/subComponents/caption/useTranscriptDownload.ts +12 -2
  67. package/template/src/subComponents/chat/ChatParticipants.tsx +6 -0
  68. package/template/src/subComponents/recording/useRecording.tsx +102 -15
  69. package/template/src/subComponents/screenshare/ScreenshareConfigure.native.tsx +33 -2
  70. package/template/src/subComponents/screenshare/ScreenshareConfigure.tsx +18 -2
  71. package/template/src/subComponents/waiting-rooms/useWaitingRoomAPI.ts +26 -0
  72. package/template/src/utils/axiomLogger.ts +2 -1
  73. package/template/src/utils/useCreateRoom.ts +30 -0
  74. package/template/src/utils/useFindActiveSpeaker.ts +43 -0
  75. package/template/src/utils/useFocus.tsx +8 -3
  76. package/template/src/utils/useIsLocalUserSpeaking.ts +19 -3
  77. package/template/src/utils/useJoinRoom.ts +27 -0
  78. package/template/src/utils/useLayout.tsx +9 -3
  79. package/template/src/utils/useSidePanel.tsx +14 -3
@@ -2,6 +2,7 @@ import {Linking, Platform} from 'react-native';
2
2
  import InAppBrowser from 'react-native-inappbrowser-reborn';
3
3
  import {getOriginURL, getPlatformId, AUTH_ENDPOINT_URL} from './config';
4
4
  import RNExitApp from 'react-native-exit-app';
5
+ import {LogSource, logger} from '../logger/AppBuilderLogger';
5
6
 
6
7
  export const getDeepLinkURI = (path = '') => {
7
8
  const scheme = $config.PRODUCT_ID?.toLowerCase();
@@ -20,7 +21,7 @@ export const getIDPAuthLoginURL = () => {
20
21
  )}&platform_id=${getPlatformId()}`;
21
22
  };
22
23
 
23
- export const enableIDPAuth = async (openDeepLink) => {
24
+ export const enableIDPAuth = async openDeepLink => {
24
25
  try {
25
26
  const URL = getIDPAuthLoginURL();
26
27
  if (await InAppBrowser.isAvailable()) {
@@ -38,7 +39,12 @@ export const enableIDPAuth = async (openDeepLink) => {
38
39
  Linking.openURL(URL);
39
40
  }
40
41
  } catch (error) {
41
- console.log(error.message);
42
+ logger.error(
43
+ LogSource.Internals,
44
+ 'AUTH',
45
+ 'failed to open IDP URL native',
46
+ error?.message,
47
+ );
42
48
  }
43
49
  };
44
50
 
@@ -46,6 +52,11 @@ export const exitApp = () => {
46
52
  try {
47
53
  RNExitApp.exitApp();
48
54
  } catch (error) {
49
- console.log('Error on closing the app', error);
55
+ logger.error(
56
+ LogSource.Internals,
57
+ 'AUTH',
58
+ 'Error on closing the app',
59
+ error,
60
+ );
50
61
  }
51
62
  };
@@ -4,6 +4,7 @@ import StorageContext from '../components/StorageContext';
4
4
  import SdkEvents from '../utils/SdkEvents';
5
5
  import isSDK from '../utils/isSDK';
6
6
  import {getPlatformId} from './config';
7
+ import {LogSource, logger} from '../logger/AppBuilderLogger';
7
8
  const REFRESH_TOKEN_DURATION_IN_SEC = 59;
8
9
 
9
10
  const useTokenAuth = () => {
@@ -96,7 +97,12 @@ const useTokenAuth = () => {
96
97
  try {
97
98
  timerRef.current && clearInterval(timerRef.current);
98
99
  } catch (error) {
99
- console.log('debugging error on clearing interval');
100
+ logger.debug(
101
+ LogSource.Internals,
102
+ 'AUTH',
103
+ 'error on clearing interval',
104
+ error,
105
+ );
100
106
  }
101
107
  } else {
102
108
  const decoded = jwt_decode(store.token);
@@ -100,6 +100,7 @@ import {
100
100
  toolbarItemVirtualBackgroundText,
101
101
  toolbarItemWhiteboardText,
102
102
  } from '../language/default-labels/videoCallScreenLabels';
103
+ import {LogSource, logger} from '../logger/AppBuilderLogger';
103
104
  import {useModal} from '../utils/useModal';
104
105
  import ViewRecordingsModal from './recordings/ViewRecordingsModal';
105
106
 
@@ -696,7 +697,7 @@ const MoreButton = () => {
696
697
  await restart(language);
697
698
  }
698
699
  } catch (error) {
699
- console.log('eror in starting stt', error);
700
+ logger.error(LogSource.Internals, 'STT', 'error in starting stt', error);
700
701
  }
701
702
  };
702
703
 
@@ -41,6 +41,7 @@ import {
41
41
  deviceDetectionToastHeading,
42
42
  deviceDetectionToastSubHeading,
43
43
  } from '../language/default-labels/videoCallScreenLabels';
44
+ import {LogSource, logger} from '../logger/AppBuilderLogger';
44
45
 
45
46
  const log = (...args: any[]) => {
46
47
  console.log('[DeviceConfigure] ', ...args);
@@ -161,7 +162,13 @@ const DeviceConfigure: React.FC<Props> = (props: any) => {
161
162
  const refreshDeviceList = useCallback(async (noEmitLog?: boolean) => {
162
163
  let updatedDeviceList: MediaDeviceInfo[];
163
164
  await RtcEngineUnsafe.getDevices(function (devices: deviceInfo[]) {
164
- !noEmitLog && log('Fetching all devices: ', devices);
165
+ !noEmitLog &&
166
+ logger.debug(
167
+ LogSource.Internals,
168
+ 'DEVICE_CONFIGURE',
169
+ 'Fetching all devices: ',
170
+ devices,
171
+ );
165
172
  /**
166
173
  * Some browsers list the same microphone twice with different Id's,
167
174
  * their group Id's match as they are the same physical device.
@@ -183,7 +190,13 @@ const DeviceConfigure: React.FC<Props> = (props: any) => {
183
190
  device.kind == 'audiooutput'),
184
191
  );
185
192
 
186
- !noEmitLog && log('Setting unique devices', updatedDeviceList);
193
+ !noEmitLog &&
194
+ logger.debug(
195
+ LogSource.Internals,
196
+ 'DEVICE_CONFIGURE',
197
+ 'Setting unique devices',
198
+ updatedDeviceList,
199
+ );
187
200
  if (updatedDeviceList.length > 0) {
188
201
  setDeviceList(updatedDeviceList);
189
202
  }
@@ -211,12 +224,20 @@ const DeviceConfigure: React.FC<Props> = (props: any) => {
211
224
  RtcEngineUnsafe.audioDeviceId
212
225
  : //@ts-ignore
213
226
  RtcEngineUnsafe.videoDeviceId;
214
- log(`Agora ${type} Engine is using`, currentDevice);
227
+ logger.debug(
228
+ LogSource.Internals,
229
+ 'DEVICE_CONFIGURE',
230
+ `Agora ${type} Engine is using ${currentDevice}`,
231
+ );
215
232
  } else {
216
233
  currentDevice = localStream[type]
217
234
  ?.getMediaStreamTrack()
218
235
  .getSettings().deviceId;
219
- log(`Agora ${type} Track is using`, currentDevice);
236
+ logger.debug(
237
+ LogSource.Internals,
238
+ 'DEVICE_CONFIGURE',
239
+ `Agora ${type} Track is using ${currentDevice}`,
240
+ );
220
241
  }
221
242
  return currentDevice ?? '';
222
243
  };
@@ -228,7 +249,12 @@ const DeviceConfigure: React.FC<Props> = (props: any) => {
228
249
  * truth.
229
250
  */
230
251
  const syncSelectedDeviceUi = (kind?: deviceKind) => {
231
- log('Refreshing', kind ?? 'all');
252
+ logger.debug(
253
+ LogSource.Internals,
254
+ 'DEVICE_CONFIGURE',
255
+ 'Refreshing',
256
+ kind ?? 'all',
257
+ );
232
258
  switch (kind) {
233
259
  case 'audioinput':
234
260
  let micId = getAgoraTrackDeviceId('audio');
@@ -463,7 +489,11 @@ const DeviceConfigure: React.FC<Props> = (props: any) => {
463
489
  },
464
490
  }[kind];
465
491
 
466
- log(logTag, deviceLogTag, 'Device list populated but none selected');
492
+ logger.debug(
493
+ LogSource.Internals,
494
+ 'DEVICE_CONFIGURE',
495
+ `${logTag} ${deviceLogTag} Device list populated but none selected`,
496
+ );
467
497
 
468
498
  if (sdkDevice?.deviceId && currentDevice) {
469
499
  if (checkDeviceExists(sdkDevice.deviceId, deviceList)) {
@@ -477,13 +507,16 @@ const DeviceConfigure: React.FC<Props> = (props: any) => {
477
507
  currentDevice !== storedDevice &&
478
508
  checkDeviceExists(storedDevice, deviceList)
479
509
  ) {
480
- log(logTag, deviceLogTag, 'Setting to active id', storedDevice);
510
+ logger.debug(
511
+ LogSource.Internals,
512
+ 'DEVICE_CONFIGURE',
513
+ `${logTag} ${deviceLogTag} Setting to active id ${storedDevice}`,
514
+ );
481
515
  setDevice(storedDevice).catch((e: Error) => {
482
- log(
483
- logTag,
484
- deviceLogTag,
485
- 'ERROR:Setting to active id',
486
- storedDevice,
516
+ logger.error(
517
+ LogSource.Internals,
518
+ 'DEVICE_CONFIGURE',
519
+ `ERROR: ${logTag} ${deviceLogTag} Setting to active id ${storedDevice}`,
487
520
  e.message,
488
521
  );
489
522
  });
@@ -503,7 +536,11 @@ const DeviceConfigure: React.FC<Props> = (props: any) => {
503
536
  deviceList.length === 0 ||
504
537
  deviceList.find((device: MediaDeviceInfo) => device.label === '')
505
538
  ) {
506
- log(logTag, 'Empty device list');
539
+ logger.debug(
540
+ LogSource.Internals,
541
+ 'DEVICE_CONFIGURE',
542
+ `${logTag} Empty device list`,
543
+ );
507
544
  refreshDeviceList();
508
545
  }
509
546
  }, [rtc, store, deviceList]);
@@ -533,8 +570,12 @@ const DeviceConfigure: React.FC<Props> = (props: any) => {
533
570
  },
534
571
  }[changedDevice.kind];
535
572
 
536
- log(logTag, changedDeviceData);
537
-
573
+ logger.debug(
574
+ LogSource.Internals,
575
+ 'DEVICE_CONFIGURE',
576
+ `${logTag}`,
577
+ changedDeviceData,
578
+ );
538
579
  if (currentDevice === 'default') {
539
580
  // const previousDefaultDevice = previousDeviceList.find(
540
581
  // (device) => device.deviceId === 'default',
@@ -658,7 +699,11 @@ const DeviceConfigure: React.FC<Props> = (props: any) => {
658
699
  },
659
700
  }[kind];
660
701
 
661
- log(logtag, kind, 'setting to', deviceId);
702
+ logger.debug(
703
+ LogSource.Internals,
704
+ 'DEVICE_CONFIGURE',
705
+ `${logtag} ${kind} setting to ${deviceId}`,
706
+ );
662
707
 
663
708
  const handleQueue = () => {
664
709
  if (queueRef.current.length > 0) {
@@ -673,7 +718,12 @@ const DeviceConfigure: React.FC<Props> = (props: any) => {
673
718
  return new Promise<void>((res, rej) => {
674
719
  if (mutexRef.current) {
675
720
  const e = new Error(logtag + ' Change already in progress');
676
- log('DeviceConfigure:', logtag, 'Error setting', kind, e.message);
721
+ logger.debug(
722
+ LogSource.Internals,
723
+ 'DEVICE_CONFIGURE',
724
+ `${logtag} Error setting ${kind}`,
725
+ e.message,
726
+ );
677
727
  rej(e);
678
728
  return;
679
729
  }
@@ -58,6 +58,7 @@ import {
58
58
  precallYouAreJoiningAsHeading,
59
59
  settingsPanelHeading,
60
60
  } from '../language/default-labels/precallScreenLabels';
61
+ import {LogSource, logger} from '../logger/AppBuilderLogger';
61
62
 
62
63
  const JoinRoomInputView = ({isDesktop}) => {
63
64
  const {rtcProps} = useContext(PropsContext);
@@ -322,6 +323,20 @@ const Precall = () => {
322
323
  }
323
324
  });
324
325
 
326
+ useEffect(() => {
327
+ logger.log(
328
+ LogSource.Internals,
329
+ 'PRECALL_SCREEN',
330
+ `User has landed on precall room with role as ${
331
+ rtcProps.role === ClientRoleType.ClientRoleAudience
332
+ ? 'AUDIENCE'
333
+ : 'HOST'
334
+ } and the mode of this call as ${
335
+ $config.EVENT_MODE ? 'LIVE' : 'COMMUNICATION'
336
+ }`,
337
+ );
338
+ }, []);
339
+
325
340
  useEffect(() => {
326
341
  if (isJoinDataFetched) {
327
342
  new Promise(res =>
@@ -330,6 +345,12 @@ const Precall = () => {
330
345
  res(devices);
331
346
  }),
332
347
  ).then((devices: MediaDeviceInfo[]) => {
348
+ logger.log(
349
+ LogSource.Internals,
350
+ 'PRECALL_SCREEN',
351
+ 'fetching available devices',
352
+ devices,
353
+ );
333
354
  SDKEvents.emit('ready-to-join', meetingTitle, devices);
334
355
  });
335
356
  }