Remove: app withTracker

bigbluebutton-html5/imports/ui/Types/user.ts

@@ -94,6 +94,7 @@ export interface User {
   guestStatus: string;
   joinErrorCode: string;
   joinErrorMessage: string;
+  inactivityWarningDisplay: boolean;
   joined: boolean;
   loggedOut: boolean;
   mobile?: boolean;

bigbluebutton-html5/imports/ui/components/app/component.jsx

@@ -50,6 +50,7 @@ import PresentationUploaderToastContainer from '/imports/ui/components/presentat
 import BreakoutJoinConfirmationContainerGraphQL from '../breakout-join-confirmation/breakout-join-confirmation-graphql/component';
 import FloatingWindowContainer from '/imports/ui/components/floating-window/container';
 import ChatAlertContainerGraphql from '../chat/chat-graphql/alert/component';
+import { notify } from '/imports/ui/services/notification';
 
 // [move settings]
 const MOBILE_MEDIA = 'only screen and (max-width: 40em)';
@@ -224,7 +225,6 @@ class App extends Component {
 
   componentDidUpdate(prevProps) {
     const {
-      notify,
       currentUserEmoji,
       currentUserAway,
       currentUserRaiseHand,

bigbluebutton-html5/imports/ui/components/app/container.jsx

@@ -4,11 +4,10 @@ import Auth from '/imports/ui/services/auth';
 import Users from '/imports/api/users';
 import Meetings from '/imports/api/meetings';
 import AudioCaptionsLiveContainer from '/imports/ui/components/audio/audio-graphql/audio-captions/live/component';
-import { notify } from '/imports/ui/services/notification';
 import getFromUserSettings from '/imports/ui/services/users-settings';
 import deviceInfo from '/imports/utils/deviceInfo';
 import MediaService from '/imports/ui/components/media/service';
-import { isPresentationEnabled, isExternalVideoEnabled } from '/imports/ui/services/features';
+import { isPresentationEnabled, isExternalVideoEnabled, useIsScreenSharingEnabled } from '/imports/ui/services/features';
 import useCurrentUser from '/imports/ui/core/hooks/useCurrentUser';
 import useMeeting from '/imports/ui/core/hooks/useMeeting';
 import { ACTIONS, LAYOUT_TYPE, PRESENTATION_AREA } from '/imports/ui/components/layout/enums';
@@ -21,42 +20,77 @@ import {
 } from '../layout/context';
 import { SET_SYNC_WITH_PRESENTER_LAYOUT, SET_LAYOUT_PROPS } from './mutations';
 
-import {
-  getBreakoutRooms,
-} from './service';
-
 import App from './component';
 import useUserChangedLocalSettings from '../../services/settings/hooks/useUserChangedLocalSettings';
 import { PINNED_PAD_SUBSCRIPTION } from '../notes/queries';
 import connectionStatus from '../../core/graphql/singletons/connectionStatus';
 import useDeduplicatedSubscription from '../../core/hooks/useDeduplicatedSubscription';
 import VideoStreamsState from '../video-provider/video-provider-graphql/state';
-import { useIsSharing, useSharingContentType } from '../screenshare/service';
 import useSettings from '../../services/settings/hooks/useSettings';
 import { SETTINGS } from '../../services/settings/enums';
 import { useStorageKey } from '../../services/storage/hooks';
 import useMuteMicrophone from '../audio/audio-graphql/hooks/useMuteMicrophone';
 
+const currentUserEmoji = (currentUser) => (currentUser
+  ? {
+    status: currentUser.reactionEmoji,
+    changedAt: currentUser.emojiTime,
+  }
+  : {
+    status: 'none',
+    changedAt: null,
+  }
+);
+
 const AppContainer = (props) => {
+  const LAYOUT_CONFIG = window.meetingClientSettings.public.layout;
   const layoutType = useRef(null);
 
   const {
     actionsbar,
-    pushLayoutMeeting,
     currentUserId,
     shouldShowScreenshare: propsShouldShowScreenshare,
     presentationRestoreOnUpdate,
     isModalOpen,
-    meetingLayout,
-    meetingLayoutUpdatedAt,
-    meetingPresentationIsOpen,
-    isMeetingLayoutResizing,
-    meetingLayoutCameraPosition,
-    meetingLayoutFocusedCamera,
-    meetingLayoutVideoRate,
     ...otherProps
   } = props;
 
+  const {
+    viewScreenshare,
+  } = useSettings(SETTINGS.DATA_SAVING);
+
+  const {
+    data: currentUser,
+  } = useCurrentUser((u) => ({
+    away: u.away,
+    reactionEmoji: u.reactionEmoji,
+    approved: 1,
+    raiseHand: u.raiseHand,
+    userId: u.userId,
+    role: u.role,
+    inactivityWarningDisplay: u.inactivityWarningDisplay,
+    presenter: u.presenter,
+  }));
+
+  const {
+    data: currentMeeting,
+  } = useMeeting((m) => ({
+    layout: m.layout,
+    componentsFlags: m.componentsFlags,
+  }));
+
+  const meetingLayout = LAYOUT_TYPE[currentMeeting?.layout.currentLayoutType];
+  const meetingLayoutUpdatedAt = new Date(currentMeeting?.layout.updatedAt).getTime();
+  const meetingPresentationIsOpen = !currentMeeting?.layout.presentationMinimized;
+
+  const {
+    propagateLayout: pushLayoutMeeting,
+    cameraDockIsResizing: isMeetingLayoutResizing,
+    cameraDockPlacement: meetingLayoutCameraPosition,
+    cameraDockAspectRatio: meetingLayoutVideoRate,
+    cameraWithFocus: meetingLayoutFocusedCamera,
+  } = (currentMeeting?.layout || {});
+
   const isLargeFont = useStorageKey('isLargeFont');
   const ignorePollNotifications = useStorageKey('ignorePollNotifications');
 
@@ -70,9 +104,6 @@ const AppContainer = (props) => {
     darkTheme,
     fontSize = '16px',
   } = useSettings(SETTINGS.APPLICATION);
-  const {
-    viewScreenshare,
-  } = useSettings(SETTINGS.DATA_SAVING);
 
   const sidebarContent = layoutSelectInput((i) => i.sidebarContent);
   const genericComponent = layoutSelectInput((i) => i.genericComponent);
@@ -166,10 +197,6 @@ const AppContainer = (props) => {
     });
   };
 
-  const { data: currentMeeting } = useMeeting((m) => ({
-    componentsFlags: m.componentsFlags,
-  }));
-
   const isSharingVideo = currentMeeting?.componentsFlags.hasExternalVideo;
 
   useEffect(() => {
@@ -207,22 +234,39 @@ const AppContainer = (props) => {
     return enforceLayout && layoutTypes.includes(enforceLayout) ? enforceLayout : null;
   };
 
-  const shouldShowScreenshare = propsShouldShowScreenshare
+  const shouldShowScreenshare = (viewScreenshare || isPresenter);
-    && (viewScreenshare || isPresenter);
   const shouldShowPresentation = (!shouldShowScreenshare && !isSharedNotesPinned
     && !shouldShowExternalVideo && !shouldShowGenericComponent
     && (presentationIsOpen || presentationRestoreOnUpdate)) && isPresentationEnabled();
 
   if (!currentUserData) return null;
 
-  return currentUserId
+  const customStyleUrl = getFromUserSettings('bbb_custom_style_url', false)
+  || window.meetingClientSettings.public.app.customStyleUrl;
+
+  return currentUser?.userId
     ? (
       <App
         {...{
+          presentationRestoreOnUpdate: getFromUserSettings(
+            'bbb_force_restore_presentation_on_new_events',
+            window.meetingClientSettings.public.presentation.restoreOnUpdate,
+          ),
+          hidePresentationOnJoin: getFromUserSettings('bbb_hide_presentation_on_join', LAYOUT_CONFIG.hidePresentationOnJoin),
+          hideActionsBar: getFromUserSettings('bbb_hide_actions_bar', false),
+          hideNavBar: getFromUserSettings('bbb_hide_nav_bar', false),
+          customStyle: getFromUserSettings('bbb_custom_style', false),
+          isPhone: deviceInfo.isPhone,
+          isRTL: document.documentElement.getAttribute('dir') === 'rtl',
+          currentUserEmoji: currentUserEmoji(currentUser),
+          currentUserAway: currentUser.away,
+          currentUserRaiseHand: currentUser.raiseHand,
+          currentUserId: currentUser.userId,
+          User: currentUser,
+          customStyleUrl,
           connected,
           actionsBarStyle,
           captionsStyle,
-          currentUserId,
           setPushLayout,
           setMeetingLayout,
           meetingLayout,
@@ -277,108 +321,4 @@ const AppContainer = (props) => {
     : null;
 };
 
-const currentUserEmoji = (currentUser) => (currentUser
+export default AppContainer;
-  ? {
-    status: currentUser.emoji,
-    changedAt: currentUser.emojiTime,
-  }
-  : {
-    status: 'none',
-    changedAt: null,
-  }
-);
-
-const AppTracker = withTracker((props) => {
-  const {
-    viewScreenshare,
-    isScreenSharing,
-    screenSharingContentType,
-  } = props;
-  const currentUser = Users.findOne(
-    { userId: Auth.userID },
-    {
-      fields:
-      {
-        approved: 1, emoji: 1, raiseHand: 1, away: 1, userId: 1, role: 1, inactivityCheck: 1,
-      },
-    },
-  );
-
-  const meetingLayoutObj = Meetings
-    .findOne({ meetingId: Auth.meetingID }) || {};
-
-  const { layout } = meetingLayoutObj;
-
-  const {
-    propagateLayout: pushLayoutMeeting,
-    cameraDockIsResizing: isMeetingLayoutResizing,
-    cameraDockPlacement: meetingLayoutCameraPosition,
-    cameraDockAspectRatio: meetingLayoutVideoRate,
-    cameraWithFocus: meetingLayoutFocusedCamera,
-  } = layout;
-  const meetingLayout = LAYOUT_TYPE[layout.currentLayoutType];
-  const meetingLayoutUpdatedAt = new Date(layout.updatedAt).getTime();
-
-  const meetingPresentationIsOpen = !layout.presentationMinimized;
-  const shouldShowScreenshare = MediaService.shouldShowScreenshare(
-    viewScreenshare,
-    isScreenSharing,
-    screenSharingContentType,
-  );
-  let customStyleUrl = getFromUserSettings('bbb_custom_style_url', false);
-
-  const CUSTOM_STYLE_URL = window.meetingClientSettings.public.app.customStyleUrl;
-
-  if (!customStyleUrl && CUSTOM_STYLE_URL) {
-    customStyleUrl = CUSTOM_STYLE_URL;
-  }
-
-  const LAYOUT_CONFIG = window.meetingClientSettings.public.layout;
-
-  return {
-    audioCaptions: <AudioCaptionsLiveContainer />,
-    hasBreakoutRooms: getBreakoutRooms().length > 0,
-    customStyle: getFromUserSettings('bbb_custom_style', false),
-    customStyleUrl,
-    notify,
-    isPhone: deviceInfo.isPhone,
-    isRTL: document.documentElement.getAttribute('dir') === 'rtl',
-    currentUserEmoji: currentUserEmoji(currentUser),
-    currentUserAway: currentUser.away,
-    currentUserRaiseHand: currentUser.raiseHand,
-    currentUserId: currentUser?.userId,
-    meetingLayout,
-    meetingLayoutUpdatedAt,
-    meetingPresentationIsOpen,
-    isMeetingLayoutResizing,
-    meetingLayoutCameraPosition,
-    meetingLayoutFocusedCamera,
-    meetingLayoutVideoRate,
-    pushLayoutMeeting,
-    shouldShowScreenshare,
-    presentationRestoreOnUpdate: getFromUserSettings(
-      'bbb_force_restore_presentation_on_new_events',
-      window.meetingClientSettings.public.presentation.restoreOnUpdate,
-    ),
-    hidePresentationOnJoin: getFromUserSettings('bbb_hide_presentation_on_join', LAYOUT_CONFIG.hidePresentationOnJoin),
-    hideActionsBar: getFromUserSettings('bbb_hide_actions_bar', false),
-    hideNavBar: getFromUserSettings('bbb_hide_nav_bar', false),
-    User: currentUser,
-  };
-})(AppContainer);
-
-// TODO: Remove this
-// Temporary component until we remove all trackers
-export default (props) => {
-  const isScreenSharing = useIsSharing();
-  const screenSharingContentType = useSharingContentType();
-  return (
-    <AppTracker
-      {...{
-        ...props,
-        isScreenSharing,
-        screenSharingContentType,
-      }}
-    />
-  );
-};