From 962e65937871d5e0be5e72ff92fbfbb0f384be50 Mon Sep 17 00:00:00 2001
From: Oleksandr Zhurbenko <xaerok.od.ua@gmail.com>
Date: Sun, 7 Jan 2018 20:44:42 -0800
Subject: [PATCH] Switched the components from deprecated method to
---
.../imports/startup/client/base.jsx | 6 +-
.../imports/ui/components/about/container.jsx | 4 +-
.../ui/components/actions-bar/container.jsx | 14 ++--
.../imports/ui/components/app/container.jsx | 6 +-
.../audio/audio-controls/container.jsx | 24 +++----
.../audio/audio-modal/container.jsx | 68 +++++++++---------
.../components/audio/audio-test/container.jsx | 6 +-
.../imports/ui/components/audio/container.jsx | 6 +-
.../imports/ui/components/chat/container.jsx | 6 +-
.../chat/notification/container.jsx | 6 +-
.../components/closed-captions/container.jsx | 6 +-
.../logout-confirmation/container.jsx | 13 ++--
.../imports/ui/components/media/container.jsx | 6 +-
.../imports/ui/components/modal/container.jsx | 7 +-
.../ui/components/nav-bar/container.jsx | 8 +--
.../notifications-bar/container.jsx | 16 +++--
.../ui/components/polling/container.jsx | 26 ++++---
.../ui/components/presentation/container.jsx | 6 +-
.../presentation/cursor/container.jsx | 25 ++++---
.../cursor-wrapper-container/container.jsx | 11 ++-
.../presentation-overlay/container.jsx | 6 +-
.../presentation-toolbar/container.jsx | 9 +--
.../presentation-uploader/container.jsx | 6 +-
.../ui/components/screenshare/container.jsx | 15 ++--
.../ui/components/settings/container.jsx | 31 ++++-----
.../submenus/application/container.jsx | 12 ++--
.../submenus/closed-captions/container.jsx | 21 +++---
.../imports/ui/components/toast/container.jsx | 6 +-
.../ui/components/user-list/container.jsx | 6 +-
.../ui/components/video-dock/container.jsx | 27 +++-----
.../ui/components/video-dock/service.js | 13 ++--
.../video-dock/video-menu/component.jsx | 69 ++++++++++---------
.../video-dock/video-menu/container.jsx | 6 +-
.../reactive-annotation/container.jsx | 6 +-
.../whiteboard/annotation-group/container.jsx | 6 +-
.../whiteboard/annotations/text/container.jsx | 6 +-
.../whiteboard-overlay/container.jsx | 6 +-
.../whiteboard-toolbar/container.jsx | 8 +--
38 files changed, 257 insertions(+), 272 deletions(-)
mode change 100755 => 100644 bigbluebutton-html5/imports/ui/components/video-dock/video-menu/component.jsx
mode change 100755 => 100644 bigbluebutton-html5/imports/ui/components/video-dock/video-menu/container.jsx
diff --git a/bigbluebutton-html5/imports/startup/client/base.jsx b/bigbluebutton-html5/imports/startup/client/base.jsx
index 38f5625705..94c8f38fd0 100644
--- a/bigbluebutton-html5/imports/startup/client/base.jsx
+++ b/bigbluebutton-html5/imports/startup/client/base.jsx
@@ -1,5 +1,5 @@
import React, { Component } from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import { withRouter } from 'react-router';
import PropTypes from 'prop-types';
import Auth from '/imports/ui/services/auth';
@@ -87,7 +87,7 @@ const SUBSCRIPTIONS_NAME = [
'slides', 'captions', 'breakouts', 'voiceUsers', 'whiteboard-multi-user', 'screenshare',
];
-const BaseContainer = withRouter(createContainer(({ params, router }) => {
+const BaseContainer = withRouter(withTracker(({ params, router }) => {
if (params.errorCode) return params;
if (!Auth.loggedIn) {
@@ -110,6 +110,6 @@ const BaseContainer = withRouter(createContainer(({ params, router }) => {
locale: Settings.application.locale,
subscriptionsReady: subscriptionsHandlers.every(handler => handler.ready()),
};
-}, Base));
+})(Base));
export default BaseContainer;
diff --git a/bigbluebutton-html5/imports/ui/components/about/container.jsx b/bigbluebutton-html5/imports/ui/components/about/container.jsx
index ea2dc8fb96..6999424fe6 100644
--- a/bigbluebutton-html5/imports/ui/components/about/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/about/container.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import AboutComponent from './component';
@@ -16,4 +16,4 @@ const getClientBuildInfo = function () {
};
};
-export default createContainer(() => getClientBuildInfo(), AboutContainer);
+export default withTracker(() => getClientBuildInfo())(AboutContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx
index 7465303e68..a753c2cf52 100644
--- a/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx
@@ -1,21 +1,21 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import ActionsBar from './component';
import Service from './service';
import VideoService from '../video-dock/service';
-import ScreenshareService from '../screenshare/service';
+import { shareScreen, unshareScreen, isVideoBroadcasting } from '../screenshare/service';
const ActionsBarContainer = props => <ActionsBar {...props} />;
-export default createContainer(() => ({
+export default withTracker(() => ({
isUserPresenter: Service.isUserPresenter(),
emojiList: Service.getEmojiList(),
emojiSelected: Service.getEmoji(),
handleEmojiChange: Service.setEmoji,
handleExitVideo: () => VideoService.exitVideo(),
handleJoinVideo: () => VideoService.joinVideo(),
- handleShareScreen: () => ScreenshareService.shareScreen(),
- handleUnshareScreen: () => ScreenshareService.unshareScreen(),
- isVideoBroadcasting: () => ScreenshareService.isVideoBroadcasting(),
+ handleShareScreen: () => shareScreen(),
+ handleUnshareScreen: () => unshareScreen(),
+ isVideoBroadcasting: () => isVideoBroadcasting(),
-}), ActionsBarContainer);
+}))(ActionsBarContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/app/container.jsx b/bigbluebutton-html5/imports/ui/components/app/container.jsx
index 97e71e99e6..05d1ef72c9 100644
--- a/bigbluebutton-html5/imports/ui/components/app/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/app/container.jsx
@@ -1,5 +1,5 @@
import React, { cloneElement } from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import { withRouter } from 'react-router';
import { defineMessages, injectIntl } from 'react-intl';
import PropTypes from 'prop-types';
@@ -72,7 +72,7 @@ const AppContainer = (props) => {
);
};
-export default withRouter(injectIntl(withModalMounter(createContainer(({ router, intl, baseControls }) => {
+export default withRouter(injectIntl(withModalMounter(withTracker(({ router, intl, baseControls }) => {
const currentUser = Users.findOne({ userId: Auth.userID });
const isMeetingBreakout = meetingIsBreakout();
@@ -117,7 +117,7 @@ export default withRouter(injectIntl(withModalMounter(createContainer(({ router,
closedCaption: getCaptionsStatus() ? <ClosedCaptionsContainer /> : null,
fontSize: getFontSize(),
};
-}, AppContainer))));
+})(AppContainer))));
AppContainer.defaultProps = defaultProps;
AppContainer.propTypes = propTypes;
diff --git a/bigbluebutton-html5/imports/ui/components/audio/audio-controls/container.jsx b/bigbluebutton-html5/imports/ui/components/audio/audio-controls/container.jsx
index 83c595cb06..51578831f3 100644
--- a/bigbluebutton-html5/imports/ui/components/audio/audio-controls/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/audio/audio-controls/container.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import { withModalMounter } from '/imports/ui/components/modal/service';
import AudioControls from './component';
import AudioModalContainer from '../audio-modal/container';
@@ -7,14 +7,14 @@ import Service from '../service';
const AudioControlsContainer = props => <AudioControls {...props} />;
-export default withModalMounter(createContainer(({ mountModal }) =>
- ({
- mute: Service.isConnected() && !Service.isListenOnly() && !Service.isEchoTest(),
- unmute: Service.isConnected() && !Service.isListenOnly() && Service.isMuted(),
- join: Service.isConnected() && !Service.isEchoTest(),
- disable: Service.isConnecting() || Service.isHangingUp(),
- glow: Service.isTalking() && !Service.isMuted(),
- handleToggleMuteMicrophone: () => Service.toggleMuteMicrophone(),
- handleJoinAudio: () => mountModal(<AudioModalContainer />),
- handleLeaveAudio: () => Service.exitAudio(),
- }), AudioControlsContainer));
+export default withModalMounter(withTracker(({ mountModal }) =>
+ ({
+ mute: Service.isConnected() && !Service.isListenOnly() && !Service.isEchoTest(),
+ unmute: Service.isConnected() && !Service.isListenOnly() && Service.isMuted(),
+ join: Service.isConnected() && !Service.isEchoTest(),
+ disable: Service.isConnecting() || Service.isHangingUp(),
+ glow: Service.isTalking() && !Service.isMuted(),
+ handleToggleMuteMicrophone: () => Service.toggleMuteMicrophone(),
+ handleJoinAudio: () => mountModal(<AudioModalContainer />),
+ handleLeaveAudio: () => Service.exitAudio(),
+ }))(AudioControlsContainer));
diff --git a/bigbluebutton-html5/imports/ui/components/audio/audio-modal/container.jsx b/bigbluebutton-html5/imports/ui/components/audio/audio-modal/container.jsx
index 543fe3e91b..b69051954f 100644
--- a/bigbluebutton-html5/imports/ui/components/audio/audio-modal/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/audio/audio-modal/container.jsx
@@ -1,41 +1,41 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import { withModalMounter } from '/imports/ui/components/modal/service';
import AudioModal from './component';
import Service from '../service';
const AudioModalContainer = props => <AudioModal {...props} />;
-export default withModalMounter(createContainer(({ mountModal }) =>
- ({
- closeModal: () => {
- if (!Service.isConnecting()) mountModal(null);
- },
- joinMicrophone: () =>
- new Promise((resolve, reject) => {
- Service.transferCall().then(() => {
- mountModal(null);
- resolve();
- }).catch(() => {
- Service.exitAudio();
- reject();
- });
- }),
- joinListenOnly: () => Service.joinListenOnly().then(() => mountModal(null)),
- leaveEchoTest: () => {
- if (!Service.isEchoTest()) {
- return Promise.resolve();
- }
- return Service.exitAudio();
- },
- changeInputDevice: inputDeviceId => Service.changeInputDevice(inputDeviceId),
- changeOutputDevice: outputDeviceId => Service.changeOutputDevice(outputDeviceId),
- joinEchoTest: () => Service.joinEchoTest(),
- exitAudio: () => Service.exitAudio(),
- isConnecting: Service.isConnecting(),
- isConnected: Service.isConnected(),
- isEchoTest: Service.isEchoTest(),
- inputDeviceId: Service.inputDeviceId(),
- outputDeviceId: Service.outputDeviceId(),
- showPermissionsOvelay: Service.isWaitingPermissions(),
- }), AudioModalContainer));
+export default withModalMounter(withTracker(({ mountModal }) =>
+ ({
+ closeModal: () => {
+ if (!Service.isConnecting()) mountModal(null);
+ },
+ joinMicrophone: () =>
+ new Promise((resolve, reject) => {
+ Service.transferCall().then(() => {
+ mountModal(null);
+ resolve();
+ }).catch(() => {
+ Service.exitAudio();
+ reject();
+ });
+ }),
+ joinListenOnly: () => Service.joinListenOnly().then(() => mountModal(null)),
+ leaveEchoTest: () => {
+ if (!Service.isEchoTest()) {
+ return Promise.resolve();
+ }
+ return Service.exitAudio();
+ },
+ changeInputDevice: inputDeviceId => Service.changeInputDevice(inputDeviceId),
+ changeOutputDevice: outputDeviceId => Service.changeOutputDevice(outputDeviceId),
+ joinEchoTest: () => Service.joinEchoTest(),
+ exitAudio: () => Service.exitAudio(),
+ isConnecting: Service.isConnecting(),
+ isConnected: Service.isConnected(),
+ isEchoTest: Service.isEchoTest(),
+ inputDeviceId: Service.inputDeviceId(),
+ outputDeviceId: Service.outputDeviceId(),
+ showPermissionsOvelay: Service.isWaitingPermissions(),
+ }))(AudioModalContainer));
diff --git a/bigbluebutton-html5/imports/ui/components/audio/audio-test/container.jsx b/bigbluebutton-html5/imports/ui/components/audio/audio-test/container.jsx
index 8e74d4fb66..58e1f0501c 100644
--- a/bigbluebutton-html5/imports/ui/components/audio/audio-test/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/audio/audio-test/container.jsx
@@ -1,15 +1,15 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import Service from '/imports/ui/components/audio/service';
import AudioTest from './component';
const AudioTestContainer = props => <AudioTest {...props} />;
-export default createContainer(() => ({
+export default withTracker(() => ({
outputDeviceId: Service.outputDeviceId(),
handlePlayAudioSample: (deviceId) => {
const sound = new Audio('resources/sounds/audioSample.mp3');
if (deviceId && sound.setSinkId) sound.setSinkId(deviceId);
sound.play();
},
-}), AudioTestContainer);
+}))(AudioTestContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/audio/container.jsx b/bigbluebutton-html5/imports/ui/components/audio/container.jsx
index b8f2a9c19e..27371ff45c 100644
--- a/bigbluebutton-html5/imports/ui/components/audio/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/audio/container.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import { withModalMounter } from '/imports/ui/components/modal/service';
import { injectIntl, defineMessages } from 'react-intl';
import PropTypes from 'prop-types';
@@ -56,7 +56,7 @@ const AudioContainer = props => <Audio {...props} />;
let didMountAutoJoin = false;
-export default withModalMounter(injectIntl(createContainer(({ mountModal, intl }) => {
+export default withModalMounter(injectIntl(withTracker(({ mountModal, intl }) => {
const APP_CONFIG = Meteor.settings.public.app;
const { autoJoinAudio } = APP_CONFIG;
@@ -95,7 +95,7 @@ export default withModalMounter(injectIntl(createContainer(({ mountModal, intl }
didMountAutoJoin = true;
},
};
-}, AudioContainer)));
+})(AudioContainer)));
AudioContainer.propTypes = propTypes;
AudioContainer.defaultProps = defaultProps;
diff --git a/bigbluebutton-html5/imports/ui/components/chat/container.jsx b/bigbluebutton-html5/imports/ui/components/chat/container.jsx
index 088af86a6c..c1ce94ae16 100644
--- a/bigbluebutton-html5/imports/ui/components/chat/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/container.jsx
@@ -1,6 +1,6 @@
import React from 'react';
import { defineMessages, injectIntl } from 'react-intl';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import Chat from './component';
import ChatService from './service';
@@ -34,7 +34,7 @@ const ChatContainer = props =>
</Chat>
);
-export default injectIntl(createContainer(({ params, intl }) => {
+export default injectIntl(withTracker(({ params, intl }) => {
const chatID = params.chatID || PUBLIC_CHAT_KEY;
let messages = [];
@@ -116,4 +116,4 @@ export default injectIntl(createContainer(({ params, intl }) => {
handleReadMessage: timestamp => ChatService.updateUnreadMessage(chatID, timestamp),
},
};
-}, ChatContainer));
+})(ChatContainer));
diff --git a/bigbluebutton-html5/imports/ui/components/chat/notification/container.jsx b/bigbluebutton-html5/imports/ui/components/chat/notification/container.jsx
index ade6871a4c..b195501cf0 100644
--- a/bigbluebutton-html5/imports/ui/components/chat/notification/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/notification/container.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import UserListService from '/imports/ui/components/user-list/service';
import Settings from '/imports/ui/services/settings';
import ChatNotification from './component';
@@ -8,7 +8,7 @@ const ChatNotificationContainer = props => (
<ChatNotification {...props} />
);
-export default createContainer(() => {
+export default withTracker(() => {
const AppSettings = Settings.application;
const openChats = UserListService.getOpenChats();
@@ -17,4 +17,4 @@ export default createContainer(() => {
disableNotify: !AppSettings.chatPushNotifications,
openChats,
};
-}, ChatNotificationContainer);
+})(ChatNotificationContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/closed-captions/container.jsx b/bigbluebutton-html5/imports/ui/components/closed-captions/container.jsx
index a8da014e7c..d6c03fb2a8 100644
--- a/bigbluebutton-html5/imports/ui/components/closed-captions/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/closed-captions/container.jsx
@@ -1,10 +1,10 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import ClosedCaptionsService from './service';
import ClosedCaptions from './component';
const ClosedCaptionsContainer = props => (
<ClosedCaptions {...props} />
- );
+);
-export default createContainer(() => ClosedCaptionsService.getCCData(), ClosedCaptionsContainer);
+export default withTracker(() => ClosedCaptionsService.getCCData())(ClosedCaptionsContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/logout-confirmation/container.jsx b/bigbluebutton-html5/imports/ui/components/logout-confirmation/container.jsx
index 3dbc153b43..f9faba90e4 100644
--- a/bigbluebutton-html5/imports/ui/components/logout-confirmation/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/logout-confirmation/container.jsx
@@ -1,6 +1,6 @@
import React from 'react';
import { meetingIsBreakout } from '/imports/ui/components/app/service';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import LogoutConfirmation from './component';
import {
isModerator,
@@ -11,10 +11,7 @@ const LogoutConfirmationContainer = props => (
<LogoutConfirmation {...props} />
);
-export default createContainer(() => {
- return {
- showEndMeeting: !meetingIsBreakout() &&
- isModerator(),
- handleEndMeeting: endMeeting,
- }
-}, LogoutConfirmationContainer);
+export default withTracker(() => ({
+ showEndMeeting: !meetingIsBreakout() && isModerator(),
+ handleEndMeeting: endMeeting,
+}))(LogoutConfirmationContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/media/container.jsx b/bigbluebutton-html5/imports/ui/components/media/container.jsx
index 119567f8a1..d56e6b0ec7 100644
--- a/bigbluebutton-html5/imports/ui/components/media/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/media/container.jsx
@@ -1,5 +1,5 @@
import React, { Component } from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import Media from './component';
import MediaService from './service';
import PresentationAreaContainer from '../presentation/container';
@@ -52,7 +52,7 @@ class MediaContainer extends Component {
MediaContainer.defaultProps = defaultProps;
-export default createContainer(() => {
+export default withTracker(() => {
const data = {};
data.currentPresentation = MediaService.getPresentationInfo();
@@ -71,4 +71,4 @@ export default createContainer(() => {
}
return data;
-}, MediaContainer);
+})(MediaContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/modal/container.jsx b/bigbluebutton-html5/imports/ui/components/modal/container.jsx
index beeed571db..a1bbd0ed66 100644
--- a/bigbluebutton-html5/imports/ui/components/modal/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/modal/container.jsx
@@ -1,8 +1,5 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import { getModal } from './service';
-export default createContainer(
- () => ({ modalComponent: getModal() }),
- ({ modalComponent }) => modalComponent,
-);
+export default withTracker(() => ({ modalComponent: getModal() }))(({ modalComponent }) => modalComponent);
diff --git a/bigbluebutton-html5/imports/ui/components/nav-bar/container.jsx b/bigbluebutton-html5/imports/ui/components/nav-bar/container.jsx
index 47ba92261c..13e0a1cbd5 100644
--- a/bigbluebutton-html5/imports/ui/components/nav-bar/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/nav-bar/container.jsx
@@ -1,5 +1,5 @@
-import React, { Component } from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import React from 'react';
+import { withTracker } from 'meteor/react-meteor-data';
import { withRouter } from 'react-router';
import Meetings from '/imports/api/meetings';
import Auth from '/imports/ui/services/auth';
@@ -18,7 +18,7 @@ const NavBarContainer = ({ children, ...props }) => (
</NavBar>
);
-export default withRouter(createContainer(({ location, router }) => {
+export default withRouter(withTracker(({ location, router }) => {
let meetingTitle;
let meetingRecorded;
@@ -69,4 +69,4 @@ export default withRouter(createContainer(({ location, router }) => {
}
},
};
-}, NavBarContainer));
+})(NavBarContainer));
diff --git a/bigbluebutton-html5/imports/ui/components/notifications-bar/container.jsx b/bigbluebutton-html5/imports/ui/components/notifications-bar/container.jsx
index 8383ca6749..4c03cf309b 100644
--- a/bigbluebutton-html5/imports/ui/components/notifications-bar/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/notifications-bar/container.jsx
@@ -1,5 +1,5 @@
import { Meteor } from 'meteor/meteor';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import React from 'react';
import { defineMessages, injectIntl } from 'react-intl';
import _ from 'lodash';
@@ -108,7 +108,7 @@ const startCounter = (sec, set, get, interval) => {
}, 1000);
};
-export default injectIntl(createContainer(({ intl }) => {
+export default injectIntl(withTracker(({ intl }) => {
const { status, connected, retryTime } = Meteor.status();
const data = {};
@@ -150,10 +150,12 @@ export default injectIntl(createContainer(({ intl }) => {
const roomRemainingTime = currentBreakout.timeRemaining;
if (!timeRemainingInterval && roomRemainingTime) {
- timeRemainingInterval = startCounter(roomRemainingTime,
- setTimeRemaining,
- getTimeRemaining,
- timeRemainingInterval);
+ timeRemainingInterval = startCounter(
+ roomRemainingTime,
+ setTimeRemaining,
+ getTimeRemaining,
+ timeRemainingInterval,
+ );
}
} else if (timeRemainingInterval) {
clearInterval(timeRemainingInterval);
@@ -178,4 +180,4 @@ export default injectIntl(createContainer(({ intl }) => {
data.color = 'primary';
return data;
-}, NotificationsBarContainer));
+})(NotificationsBarContainer));
diff --git a/bigbluebutton-html5/imports/ui/components/polling/container.jsx b/bigbluebutton-html5/imports/ui/components/polling/container.jsx
index 02541c21d6..f3ea1cba73 100644
--- a/bigbluebutton-html5/imports/ui/components/polling/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/polling/container.jsx
@@ -1,15 +1,25 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import PropTypes from 'prop-types';
+import { withTracker } from 'meteor/react-meteor-data';
import PollingService from './service';
import PollingComponent from './component';
-const PollingContainer = ({
- pollExists, poll, handleVote, ...props
-}) => {
- if (!pollExists) return null;
- return <PollingComponent poll={poll} handleVote={handleVote} {...props} />;
+const propTypes = {
+ pollExists: PropTypes.bool.isRequired,
};
-export default createContainer(() => {
+
+const PollingContainer = ({ pollExists, ...props }) => {
+ if (pollExists) {
+ return (
+ <PollingComponent {...props} />
+ );
+ }
+ return null;
+};
+
+PollingContainer.propTypes = propTypes;
+
+export default withTracker(() => {
const data = PollingService.mapPolls();
return data;
-}, PollingContainer);
+})(PollingContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/presentation/container.jsx b/bigbluebutton-html5/imports/ui/components/presentation/container.jsx
index a45c819198..0c66ef27d8 100644
--- a/bigbluebutton-html5/imports/ui/components/presentation/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/presentation/container.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import PresentationAreaService from './service';
import PresentationArea from './component';
@@ -7,8 +7,8 @@ const PresentationAreaContainer = props => (
<PresentationArea {...props} />
);
-export default createContainer(() => ({
+export default withTracker(() => ({
currentSlide: PresentationAreaService.getCurrentSlide(),
userIsPresenter: PresentationAreaService.isPresenter(),
multiUser: PresentationAreaService.getMultiUserStatus(),
-}), PresentationAreaContainer);
+}))(PresentationAreaContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/presentation/cursor/container.jsx b/bigbluebutton-html5/imports/ui/components/presentation/cursor/container.jsx
index 0059880163..0aeff9aed4 100644
--- a/bigbluebutton-html5/imports/ui/components/presentation/cursor/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/presentation/cursor/container.jsx
@@ -1,6 +1,6 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import CursorService from './service';
import Cursor from './component';
@@ -40,30 +40,29 @@ class CursorContainer extends Component {
}
return null;
}
-
}
-export default createContainer((params) => {
+export default withTracker((params) => {
const { cursorId } = params;
const cursor = CursorService.getCurrentCursor(cursorId);
- let cursorX = -1;
- let cursorY = -1;
- let userName = '';
if (cursor) {
- cursorX = cursor.x;
- cursorY = cursor.y;
- userName = cursor.userName;
+ const { x: cursorX, y: cursorY, userName } = cursor;
+ return {
+ cursorX,
+ cursorY,
+ userName,
+ };
}
return {
- cursorX,
- cursorY,
- userName,
+ cursorX: -1,
+ cursorY: -1,
+ userName: '',
};
-}, CursorContainer);
+})(CursorContainer);
CursorContainer.propTypes = {
diff --git a/bigbluebutton-html5/imports/ui/components/presentation/cursor/cursor-wrapper-container/container.jsx b/bigbluebutton-html5/imports/ui/components/presentation/cursor/cursor-wrapper-container/container.jsx
index 96c2d724d8..9f4da4e8d0 100644
--- a/bigbluebutton-html5/imports/ui/components/presentation/cursor/cursor-wrapper-container/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/presentation/cursor/cursor-wrapper-container/container.jsx
@@ -1,7 +1,7 @@
/*
The purpose of this wrapper is to fetch an array of active cursor iDs only
and map them to the CursorContainer.
- The reason for this is that Meteor tracks only the properties defined inside createContainer
+ The reason for this is that Meteor tracks only the properties defined inside withTracker
and if we fetch the whole array of Cursors right away (let's say in the multi-user mode),
then the whole array would be re-rendered every time one of the Cursors is changed.
@@ -13,7 +13,7 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import CursorWrapperService from './service';
import CursorContainer from '../container';
@@ -35,12 +35,11 @@ const CursorWrapperContainer = ({ presenterCursorId, multiUserCursorIds, ...rest
cursorId={cursorId._id}
presenter={false}
{...rest}
- />),
- )}
+ />))}
</g>
);
-export default createContainer(() => {
+export default withTracker(() => {
const { presenterCursorId, multiUserCursorIds } = CursorWrapperService.getCurrentCursorIds();
const isMultiUser = CursorWrapperService.getMultiUserStatus();
@@ -49,7 +48,7 @@ export default createContainer(() => {
multiUserCursorIds,
isMultiUser,
};
-}, CursorWrapperContainer);
+})(CursorWrapperContainer);
CursorWrapperContainer.propTypes = {
diff --git a/bigbluebutton-html5/imports/ui/components/presentation/presentation-overlay/container.jsx b/bigbluebutton-html5/imports/ui/components/presentation/presentation-overlay/container.jsx
index 6600b4ab97..89f5e39c6f 100644
--- a/bigbluebutton-html5/imports/ui/components/presentation/presentation-overlay/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/presentation/presentation-overlay/container.jsx
@@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import PresentationOverlayService from './service';
import PresentationOverlay from './component';
@@ -10,9 +10,9 @@ const PresentationOverlayContainer = ({ children, ...rest }) => (
</PresentationOverlay>
);
-export default createContainer(() => ({
+export default withTracker(() => ({
updateCursor: PresentationOverlayService.updateCursor,
-}), PresentationOverlayContainer);
+}))(PresentationOverlayContainer);
PresentationOverlayContainer.propTypes = {
children: PropTypes.node,
diff --git a/bigbluebutton-html5/imports/ui/components/presentation/presentation-toolbar/container.jsx b/bigbluebutton-html5/imports/ui/components/presentation/presentation-toolbar/container.jsx
index e414e27505..6de339c075 100644
--- a/bigbluebutton-html5/imports/ui/components/presentation/presentation-toolbar/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/presentation/presentation-toolbar/container.jsx
@@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import PresentationToolbarService from './service';
import PresentationToolbar from './component';
@@ -25,7 +25,7 @@ const PresentationToolbarContainer = (props) => {
return null;
};
-export default createContainer((params) => {
+export default withTracker((params) => {
const data = PresentationToolbarService.getSlideData(params);
const {
@@ -45,15 +45,12 @@ export default createContainer((params) => {
PresentationToolbarService.skipToSlide(event),
},
};
-}, PresentationToolbarContainer);
+})(PresentationToolbarContainer);
PresentationToolbarContainer.propTypes = {
// Number of current slide being displayed
currentSlideNum: PropTypes.number.isRequired,
- // PresentationId of the current presentation
- presentationId: PropTypes.string.isRequired,
-
// Is the user a presenter
userIsPresenter: PropTypes.bool.isRequired,
diff --git a/bigbluebutton-html5/imports/ui/components/presentation/presentation-uploader/container.jsx b/bigbluebutton-html5/imports/ui/components/presentation/presentation-uploader/container.jsx
index e90e66b849..abcac9f716 100644
--- a/bigbluebutton-html5/imports/ui/components/presentation/presentation-uploader/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/presentation/presentation-uploader/container.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import Service from './service';
import PresentationUploader from './component';
@@ -8,7 +8,7 @@ const PresentationUploaderContainer = props => (
<PresentationUploader {...props} />
);
-export default createContainer(() => {
+export default withTracker(() => {
const PRESENTATION_CONFIG = Meteor.settings.public.presentation;
const currentPresentations = Service.getPresentations();
@@ -24,4 +24,4 @@ export default createContainer(() => {
PRESENTATION_CONFIG.uploadEndpoint,
),
};
-}, PresentationUploaderContainer);
+})(PresentationUploaderContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/screenshare/container.jsx b/bigbluebutton-html5/imports/ui/components/screenshare/container.jsx
index 37a2ba3c6f..b10659a3db 100644
--- a/bigbluebutton-html5/imports/ui/components/screenshare/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/screenshare/container.jsx
@@ -1,25 +1,26 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import { isVideoBroadcasting, presenterScreenshareHasEnded,
presenterScreenshareHasStarted } from './service';
import ScreenshareComponent from './component';
class ScreenshareContainer extends React.Component {
+ componentWillUnmount() {
+ this.props.presenterScreenshareHasEnded();
+ }
+
render() {
if (this.props.isVideoBroadcasting()) {
return <ScreenshareComponent {...this.props} />;
}
- }
- componentWillUnmount() {
- this.props.presenterScreenshareHasEnded();
+ return null;
}
-
}
-export default createContainer(() => ({
+export default withTracker(() => ({
isVideoBroadcasting,
presenterScreenshareHasStarted,
presenterScreenshareHasEnded,
-}), ScreenshareContainer);
+}))(ScreenshareContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/settings/container.jsx b/bigbluebutton-html5/imports/ui/components/settings/container.jsx
index b5ff6d69bf..2fe0599d97 100644
--- a/bigbluebutton-html5/imports/ui/components/settings/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/settings/container.jsx
@@ -1,25 +1,20 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import { createContainer } from 'meteor/react-meteor-data';
-import Settings from './component';
+import React from 'react';
+import { withTracker } from 'meteor/react-meteor-data';
import SettingsService from '/imports/ui/services/settings';
+import Settings from './component';
import {
- getClosedCaptionLocales,
- getUserRoles,
- updateSettings,
- getAvailableLocales,
- } from './service';
+ getClosedCaptionLocales,
+ getUserRoles,
+ updateSettings,
+ getAvailableLocales,
+} from './service';
-class SettingsContainer extends Component {
- render() {
- return (
- <Settings {...this.props} />
- );
- }
-}
+const SettingsContainer = props => (
+ <Settings {...props} />
+);
-export default createContainer(() => ({
+export default withTracker(() => ({
audio: SettingsService.audio,
video: SettingsService.video,
application: SettingsService.application,
@@ -29,4 +24,4 @@ export default createContainer(() => ({
locales: getClosedCaptionLocales(),
availableLocales: getAvailableLocales(),
isModerator: getUserRoles() === 'MODERATOR',
-}), SettingsContainer);
+}))(SettingsContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/settings/submenus/application/container.jsx b/bigbluebutton-html5/imports/ui/components/settings/submenus/application/container.jsx
index 3320793888..b9011514dd 100644
--- a/bigbluebutton-html5/imports/ui/components/settings/submenus/application/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/settings/submenus/application/container.jsx
@@ -1,15 +1,15 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import Application from './component';
-const ApplicationContainer = props => (
+const ApplicationContainer = ({ children, ...props }) => (
<Application {...props}>
- {props.children}
+ {children}
</Application>
- );
+);
-export default createContainer(() => ({
+export default withTracker(() => ({
fontSizes: [
'12px',
'14px',
@@ -17,4 +17,4 @@ export default createContainer(() => ({
'18px',
'20px',
],
-}), ApplicationContainer);
+}))(ApplicationContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/settings/submenus/closed-captions/container.jsx b/bigbluebutton-html5/imports/ui/components/settings/submenus/closed-captions/container.jsx
index 53979f9292..e3d5c8861f 100644
--- a/bigbluebutton-html5/imports/ui/components/settings/submenus/closed-captions/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/settings/submenus/closed-captions/container.jsx
@@ -1,17 +1,12 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import { createContainer } from 'meteor/react-meteor-data';
+import React from 'react';
+import { withTracker } from 'meteor/react-meteor-data';
import ClosedCaptionsMenu from './component';
import Service from './service';
-class ClosedCaptionsMenuContainer extends Component {
- render() {
- return (
- <ClosedCaptionsMenu {...this.props}>
- {this.props.children}
- </ClosedCaptionsMenu>
- );
- }
-}
+const ClosedCaptionsMenuContainer = ({ children, ...props }) => (
+ <ClosedCaptionsMenu {...props}>
+ {children}
+ </ClosedCaptionsMenu>
+);
-export default createContainer(() => Service.getClosedCaptionSettings(), ClosedCaptionsMenuContainer);
+export default withTracker(() => Service.getClosedCaptionSettings(), ClosedCaptionsMenuContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/toast/container.jsx b/bigbluebutton-html5/imports/ui/components/toast/container.jsx
index b34b095fc8..f40b8b427a 100644
--- a/bigbluebutton-html5/imports/ui/components/toast/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/toast/container.jsx
@@ -1,7 +1,7 @@
import React from 'react';
import Breakouts from '/imports/api/breakouts';
import { ToastContainer as Toastify } from 'react-toastify';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import { defineMessages, injectIntl } from 'react-intl';
import injectNotify from '/imports/ui/components/toast/inject-notify/component';
@@ -38,7 +38,7 @@ class ToastContainer extends React.Component {
}
}
-export default injectIntl(injectNotify(createContainer(({ notify, intl }) => {
+export default injectIntl(injectNotify(withTracker(({ notify, intl }) => {
Breakouts.find().observeChanges({
removed() {
notify(intl.formatMessage(intlMessages.toastBreakoutRoomEnded), 'info', 'rooms');
@@ -71,4 +71,4 @@ export default injectIntl(injectNotify(createContainer(({ notify, intl }) => {
closeOnClick: true,
pauseOnHover: true,
};
-}, ToastContainer)));
+})(ToastContainer)));
diff --git a/bigbluebutton-html5/imports/ui/components/user-list/container.jsx b/bigbluebutton-html5/imports/ui/components/user-list/container.jsx
index 4d8063c9ed..eb9c26cff0 100644
--- a/bigbluebutton-html5/imports/ui/components/user-list/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/user-list/container.jsx
@@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import { meetingIsBreakout } from '/imports/ui/components/app/service';
import Meetings from '/imports/api/meetings';
import Service from './service';
@@ -81,7 +81,7 @@ const UserListContainer = (props) => {
UserListContainer.propTypes = propTypes;
UserListContainer.defaultProps = defaultProps;
-export default createContainer(({ params }) => ({
+export default withTracker(({ params }) => ({
users: Service.getUsers(),
meeting: Meetings.findOne({}),
currentUser: Service.getCurrentUser(),
@@ -99,4 +99,4 @@ export default createContainer(({ params }) => ({
toggleVoice: Service.toggleVoice,
changeRole: Service.changeRole,
roving: Service.roving,
-}), UserListContainer);
+}))(UserListContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/video-dock/container.jsx b/bigbluebutton-html5/imports/ui/components/video-dock/container.jsx
index a92bbb3d09..d4eb1e7140 100644
--- a/bigbluebutton-html5/imports/ui/components/video-dock/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/video-dock/container.jsx
@@ -1,25 +1,16 @@
-import React, { Component } from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
-
+import React from 'react';
+import { withTracker } from 'meteor/react-meteor-data';
import VideoDock from './component';
import VideoService from './service';
-class VideoDockContainer extends Component {
- constructor(props) {
- super(props);
- }
-
- render() {
- return (
- <VideoDock {...this.props}>
- {this.props.children}
- </VideoDock>
- );
- }
-}
+const VideoDockContainer = ({ children, ...props }) => (
+ <VideoDock {...props}>
+ {children}
+ </VideoDock>
+);
-export default createContainer(() => ({
+export default withTracker(() => ({
sendUserShareWebcam: VideoService.sendUserShareWebcam,
sendUserUnshareWebcam: VideoService.sendUserUnshareWebcam,
users: VideoService.getAllUsers(),
-}), VideoDockContainer);
+}))(VideoDockContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/video-dock/service.js b/bigbluebutton-html5/imports/ui/components/video-dock/service.js
index 5d778fca8f..284b3a15b2 100644
--- a/bigbluebutton-html5/imports/ui/components/video-dock/service.js
+++ b/bigbluebutton-html5/imports/ui/components/video-dock/service.js
@@ -1,16 +1,15 @@
import { makeCall } from '/imports/ui/services/api';
import Users from '/imports/api/users';
-import { createContainer } from 'meteor/react-meteor-data';
const joinVideo = () => {
- var joinVideoEvent = new Event('joinVideo');
+ const joinVideoEvent = new Event('joinVideo');
document.dispatchEvent(joinVideoEvent);
-}
+};
const exitVideo = () => {
- var exitVideoEvent = new Event('exitVideo');
+ const exitVideoEvent = new Event('exitVideo');
document.dispatchEvent(exitVideoEvent);
-}
+};
const sendUserShareWebcam = (stream) => {
makeCall('userShareWebcam', stream);
@@ -20,9 +19,7 @@ const sendUserUnshareWebcam = (stream) => {
makeCall('userUnshareWebcam', stream);
};
-const getAllUsers = () => {
- return Users.find().fetch();
-}
+const getAllUsers = () => Users.find().fetch();
export default {
sendUserShareWebcam, sendUserUnshareWebcam, joinVideo, exitVideo, getAllUsers,
diff --git a/bigbluebutton-html5/imports/ui/components/video-dock/video-menu/component.jsx b/bigbluebutton-html5/imports/ui/components/video-dock/video-menu/component.jsx
old mode 100755
new mode 100644
index 7d08e37f35..6d729bdbd3
--- a/bigbluebutton-html5/imports/ui/components/video-dock/video-menu/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/video-dock/video-menu/component.jsx
@@ -1,7 +1,7 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import PropTypes from 'prop-types';
import Button from '/imports/ui/components/button/component';
-import { defineMessages, injectIntl } from 'react-intl';
+import { defineMessages, injectIntl, intlShape } from 'react-intl';
const intlMessages = defineMessages({
joinVideo: {
@@ -14,43 +14,48 @@ const intlMessages = defineMessages({
},
});
-class JoinVideoOptions extends React.Component {
- render() {
- const {
- intl,
- isSharingVideo,
- handleJoinVideo,
- handleCloseVideo,
- } = this.props;
-
- if (isSharingVideo) {
- return (
- <Button
- onClick={handleCloseVideo}
- label={intl.formatMessage(intlMessages.leaveVideo)}
- hideLabel
- aria-label={intl.formatMessage(intlMessages.leaveVideo)}
- color={'danger'}
- icon={'video'}
- size={'lg'}
- circle
- />
- );
- }
+const JoinVideoOptions = (props) => {
+ const {
+ intl,
+ isSharingVideo,
+ handleJoinVideo,
+ handleCloseVideo,
+ } = props;
+ if (isSharingVideo) {
return (
<Button
- onClick={handleJoinVideo}
- label={intl.formatMessage(intlMessages.joinVideo)}
+ onClick={handleCloseVideo}
+ label={intl.formatMessage(intlMessages.leaveVideo)}
hideLabel
- aria-label={intl.formatMessage(intlMessages.joinVideo)}
- color={'primary'}
- icon={'video_off'}
- size={'lg'}
+ aria-label={intl.formatMessage(intlMessages.leaveVideo)}
+ color="danger"
+ icon="video"
+ size="lg"
circle
/>
);
}
-}
+
+ return (
+ <Button
+ onClick={handleJoinVideo}
+ label={intl.formatMessage(intlMessages.joinVideo)}
+ hideLabel
+ aria-label={intl.formatMessage(intlMessages.joinVideo)}
+ color="primary"
+ icon="video_off"
+ size="lg"
+ circle
+ />
+ );
+};
+
+JoinVideoOptions.propTypes = {
+ intl: intlShape.isRequired,
+ isSharingVideo: PropTypes.bool.isRequired,
+ handleJoinVideo: PropTypes.func.isRequired,
+ handleCloseVideo: PropTypes.func.isRequired,
+};
export default injectIntl(JoinVideoOptions);
diff --git a/bigbluebutton-html5/imports/ui/components/video-dock/video-menu/container.jsx b/bigbluebutton-html5/imports/ui/components/video-dock/video-menu/container.jsx
old mode 100755
new mode 100644
index da7d5517f5..e90d3e1799
--- a/bigbluebutton-html5/imports/ui/components/video-dock/video-menu/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/video-dock/video-menu/container.jsx
@@ -1,15 +1,15 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import JoinVideoOptions from './component';
import VideoMenuService from './service';
const JoinVideoOptionsContainer = props => (<JoinVideoOptions {...props} />);
-export default createContainer((params) => {
+export default withTracker((params) => {
const isSharingVideo = VideoMenuService.isSharingVideo();
return {
isSharingVideo,
handleJoinVideo: params.handleJoinVideo,
handleCloseVideo: params.handleCloseVideo,
};
-}, JoinVideoOptionsContainer);
+})(JoinVideoOptionsContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/whiteboard/annotation-factory/reactive-annotation/container.jsx b/bigbluebutton-html5/imports/ui/components/whiteboard/annotation-factory/reactive-annotation/container.jsx
index 9124ab46ec..51c5b5be59 100644
--- a/bigbluebutton-html5/imports/ui/components/whiteboard/annotation-factory/reactive-annotation/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/whiteboard/annotation-factory/reactive-annotation/container.jsx
@@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import ReactiveAnnotationService from './service';
import ReactiveAnnotation from './component';
@@ -19,14 +19,14 @@ const ReactiveAnnotationContainer = (props) => {
return null;
};
-export default createContainer((params) => {
+export default withTracker((params) => {
const { shapeId } = params;
const annotation = ReactiveAnnotationService.getAnnotationById(shapeId);
return {
annotation,
};
-}, ReactiveAnnotationContainer);
+})(ReactiveAnnotationContainer);
ReactiveAnnotationContainer.propTypes = {
annotation: PropTypes.objectOf(PropTypes.oneOfType([
diff --git a/bigbluebutton-html5/imports/ui/components/whiteboard/annotation-group/container.jsx b/bigbluebutton-html5/imports/ui/components/whiteboard/annotation-group/container.jsx
index 53f3fecc97..1c697b061f 100644
--- a/bigbluebutton-html5/imports/ui/components/whiteboard/annotation-group/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/whiteboard/annotation-group/container.jsx
@@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import AnnotationGroupService from './service';
import AnnotationGroup from './component';
@@ -12,14 +12,14 @@ const AnnotationGroupContainer = props => (
/>
);
-export default createContainer((params) => {
+export default withTracker((params) => {
const { whiteboardId } = params;
const annotationsInfo = AnnotationGroupService.getCurrentAnnotationsInfo(whiteboardId);
return {
annotationsInfo,
};
-}, AnnotationGroupContainer);
+})(AnnotationGroupContainer);
AnnotationGroupContainer.propTypes = {
// initial width and height of the slide; required to calculate the annotations' coordinates
diff --git a/bigbluebutton-html5/imports/ui/components/whiteboard/annotations/text/container.jsx b/bigbluebutton-html5/imports/ui/components/whiteboard/annotations/text/container.jsx
index b58769135e..e910f81acb 100644
--- a/bigbluebutton-html5/imports/ui/components/whiteboard/annotations/text/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/whiteboard/annotations/text/container.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import TextShapeService from './service';
import TextDrawComponent from './component';
@@ -7,7 +7,7 @@ const TextDrawContainer = props => (
<TextDrawComponent {...props} />
);
-export default createContainer((params) => {
+export default withTracker((params) => {
const isPresenter = TextShapeService.isPresenter();
const isMultiUser = TextShapeService.getMultiUserStatus();
const activeTextShapeId = TextShapeService.activeTextShapeId();
@@ -21,4 +21,4 @@ export default createContainer((params) => {
setTextShapeValue: TextShapeService.setTextShapeValue,
resetTextShapeActiveId: TextShapeService.resetTextShapeActiveId,
};
-}, TextDrawContainer);
+})(TextDrawContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/whiteboard/whiteboard-overlay/container.jsx b/bigbluebutton-html5/imports/ui/components/whiteboard/whiteboard-overlay/container.jsx
index 6db90e5968..d9580c9a81 100644
--- a/bigbluebutton-html5/imports/ui/components/whiteboard/whiteboard-overlay/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/whiteboard/whiteboard-overlay/container.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import PropTypes from 'prop-types';
import WhiteboardOverlayService from './service';
import WhiteboardOverlay from './component';
@@ -13,13 +13,13 @@ const WhiteboardOverlayContainer = (props) => {
return null;
};
-export default createContainer(() => ({
+export default withTracker(() => ({
sendAnnotation: WhiteboardOverlayService.sendAnnotation,
setTextShapeActiveId: WhiteboardOverlayService.setTextShapeActiveId,
resetTextShapeSession: WhiteboardOverlayService.resetTextShapeSession,
drawSettings: WhiteboardOverlayService.getWhiteboardToolbarValues(),
userId: WhiteboardOverlayService.getCurrentUserId(),
-}), WhiteboardOverlayContainer);
+}))(WhiteboardOverlayContainer);
WhiteboardOverlayContainer.propTypes = {
diff --git a/bigbluebutton-html5/imports/ui/components/whiteboard/whiteboard-toolbar/container.jsx b/bigbluebutton-html5/imports/ui/components/whiteboard/whiteboard-toolbar/container.jsx
index 7c48c619b3..ed45e4208d 100644
--- a/bigbluebutton-html5/imports/ui/components/whiteboard/whiteboard-toolbar/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/whiteboard/whiteboard-toolbar/container.jsx
@@ -1,13 +1,13 @@
import React from 'react';
-import { createContainer } from 'meteor/react-meteor-data';
+import { withTracker } from 'meteor/react-meteor-data';
import WhiteboardToolbarService from './service';
import WhiteboardToolbar from './component';
const WhiteboardToolbarContainer = props => (
<WhiteboardToolbar {...props} />
- );
+);
-export default createContainer(() => ({
+export default withTracker(() => ({
actions: {
undoAnnotation: WhiteboardToolbarService.undoAnnotation,
clearWhiteboard: WhiteboardToolbarService.clearWhiteboard,
@@ -23,4 +23,4 @@ export default createContainer(() => ({
textShapeActiveId: WhiteboardToolbarService.getTextShapeActiveId(),
multiUser: WhiteboardToolbarService.getMultiUserStatus(),
isPresenter: WhiteboardToolbarService.isPresenter(),
-}), WhiteboardToolbarContainer);
+}))(WhiteboardToolbarContainer);
--
GitLab