replace lodash debounce

bigbluebutton-html5/imports/api/voice-users/server/publishers.js

@@ -3,7 +3,7 @@ import { Meteor } from 'meteor/meteor';
 import Logger from '/imports/startup/server/logger';
 import AuthTokenValidation, { ValidationStates } from '/imports/api/auth-token-validation';
 import ejectUserFromVoice from './methods/ejectUserFromVoice';
-import _ from 'lodash';
+import { debounce } from 'radash';
 
 function voiceUser() {
   const tokenValidation = AuthTokenValidation.findOne({ connectionId: this.connection.id });
@@ -29,7 +29,7 @@ function voiceUser() {
 
   Logger.debug('Publishing Voice User', { meetingId, requesterUserId });
 
-  this._session.socket.on('close', _.debounce(onCloseConnection, 100));
+  this._session.socket.on('close', debounce({ delay: 100 }, onCloseConnection));
   return VoiceUsers.find({ meetingId });
 }
 

bigbluebutton-html5/imports/ui/components/audio/service.js

@@ -1,6 +1,7 @@
 import Users from '/imports/api/users';
 import Auth from '/imports/ui/services/auth';
-import { debounce, throttle } from 'lodash';
+import { throttle } from 'lodash';
+import { debounce } from 'radash';
 import AudioManager from '/imports/ui/services/audio-manager';
 import Meetings from '/imports/api/meetings';
 import { makeCall } from '/imports/ui/services/api';
@@ -122,7 +123,7 @@ export default {
   joinListenOnly: () => AudioManager.joinListenOnly(),
   joinMicrophone: () => AudioManager.joinMicrophone(),
   joinEchoTest: () => AudioManager.joinEchoTest(),
-  toggleMuteMicrophone: debounce(toggleMuteMicrophone, 500, { leading: true, trailing: false }),
+  toggleMuteMicrophone: debounce({ delay: 500 }, toggleMuteMicrophone),
   changeInputDevice: (inputDeviceId) => AudioManager.changeInputDevice(inputDeviceId),
   changeInputStream: (newInputStream) => { AudioManager.inputStream = newInputStream; },
   liveChangeInputDevice: (inputDeviceId) => AudioManager.liveChangeInputDevice(inputDeviceId),

bigbluebutton-html5/imports/ui/components/chat/time-window-list/component.jsx

@@ -2,7 +2,7 @@ import React, { PureComponent } from 'react';
 import { findDOMNode } from 'react-dom';
 import PropTypes from 'prop-types';
 import { defineMessages, injectIntl } from 'react-intl';
-import _ from 'lodash';
+import { debounce } from 'radash';
 import { AutoSizer,CellMeasurer, CellMeasurerCache } from 'react-virtualized';
 import Styled from './styles';
 import ChatLogger from '/imports/ui/components/chat/chat-logger/ChatLogger';
@@ -53,7 +53,7 @@ class TimeWindowList extends PureComponent {
       },
     });
     this.userScrolledBack = false;
-    this.handleScrollUpdate = _.debounce(this.handleScrollUpdate.bind(this), 150);
+    this.handleScrollUpdate = debounce({ delay: 150 }, this.handleScrollUpdate.bind(this));
     this.rowRender = this.rowRender.bind(this);
     this.forceCacheUpdate = this.forceCacheUpdate.bind(this);
     this.systemMessagesResized = {};

bigbluebutton-html5/imports/ui/components/chat/time-window-list/time-window-chat-item/message-chat-item/component.jsx

@@ -1,6 +1,6 @@
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
-import _ from 'lodash';
+import { debounce } from 'radash';
 import fastdom from 'fastdom';
 import { injectIntl } from 'react-intl';
 import ChatLogger from '/imports/ui/components/chat/chat-logger/ChatLogger';
@@ -41,7 +41,7 @@ class MessageChatItem extends PureComponent {
 
     this.ticking = false;
 
-    this.handleMessageInViewport = _.debounce(this.handleMessageInViewport.bind(this), 50);
+    this.handleMessageInViewport = debounce({ delay: 50 }, this.handleMessageInViewport.bind(this));
   }
 
   componentDidMount() {

bigbluebutton-html5/imports/ui/components/external-video-player/component.jsx

@@ -21,6 +21,7 @@ import ArcPlayer from '/imports/ui/components/external-video-player/custom-playe
 import PeerTubePlayer from '/imports/ui/components/external-video-player/custom-players/peertube';
 import { ACTIONS } from '/imports/ui/components/layout/enums';
 import { uniqueId } from '/imports/utils/string-utils';
+import { throttle } from 'radash';
 
 import Styled from './styles';
 
@@ -47,6 +48,7 @@ const SYNC_INTERVAL_SECONDS = 5;
 const THROTTLE_INTERVAL_SECONDS = 0.5;
 const AUTO_PLAY_BLOCK_DETECTION_TIMEOUT_SECONDS = 5;
 const ALLOW_FULLSCREEN = Meteor.settings.public.app.allowFullscreen;
+const THROTTLE_RELOAD_INTERVAL = 5000;
 
 Styled.VideoPlayer.addCustomPlayer(PeerTubePlayer);
 Styled.VideoPlayer.addCustomPlayer(ArcPlayer);
@@ -143,7 +145,7 @@ class VideoPlayer extends Component {
     this.registerVideoListeners = this.registerVideoListeners.bind(this);
     this.autoPlayBlockDetected = this.autoPlayBlockDetected.bind(this);
     this.handleFirstPlay = this.handleFirstPlay.bind(this);
-    this.handleReload = this.handleReload.bind(this);
+    this.handleReload = throttle({ interval: THROTTLE_RELOAD_INTERVAL }, this.handleReload.bind(this));
     this.handleOnProgress = this.handleOnProgress.bind(this);
     this.handleOnReady = this.handleOnReady.bind(this);
     this.handleOnPlay = this.handleOnPlay.bind(this);

bigbluebutton-html5/imports/ui/components/nav-bar/talking-indicator/container.jsx

@@ -2,7 +2,7 @@ import React, { useContext } from 'react';
 import { withTracker } from 'meteor/react-meteor-data';
 import VoiceUsers from '/imports/api/voice-users';
 import Auth from '/imports/ui/services/auth';
-import { debounce } from 'lodash';
+import { debounce } from 'radash';
 import TalkingIndicator from './component';
 import { makeCall } from '/imports/ui/services/api';
 import { meetingIsBreakout } from '/imports/ui/components/app/service';
@@ -80,7 +80,7 @@ export default withTracker(() => {
     }
   }
 
-  const muteUser = debounce((id) => {
+  const muteUser = debounce({ delay: TALKING_INDICATOR_MUTE_INTERVAL }, (id) => {
     const user = VoiceUsers.findOne({ meetingId, intId: id }, {
       fields: {
         muted: 1,
@@ -88,7 +88,7 @@ export default withTracker(() => {
     });
     if (user.muted) return;
     makeCall('toggleVoice', id);
-  }, TALKING_INDICATOR_MUTE_INTERVAL, { leading: true, trailing: false });
+  });
 
   return {
     talkers,

bigbluebutton-html5/imports/ui/components/polling/service.js

@@ -1,6 +1,6 @@
 import { makeCall } from '/imports/ui/services/api';
 import Polls from '/imports/api/polls';
-import { debounce } from 'lodash';
+import { debounce } from 'radash';
 
 const MAX_CHAR_LENGTH = 5;
 
@@ -43,8 +43,8 @@ const mapPolls = () => {
     },
     pollExists: true,
     amIRequester,
-    handleVote: debounce(handleVote, 500, { leading: true, trailing: false }),
-    handleTypedVote: debounce(handleTypedVote, 500, { leading: true, trailing: false }),
+    handleVote: debounce({ delay: 500 }, handleVote),
+    handleTypedVote: debounce({ delay: 500 }, handleTypedVote),
   };
 };
 

bigbluebutton-html5/imports/ui/components/reload-button/component.jsx

@@ -1,13 +1,6 @@
 import React from 'react';
-import _ from 'lodash';
 import Styled from './styles';
 
-const DEBOUNCE_TIMEOUT = 5000;
-const DEBOUNCE_OPTIONS = {
-  leading: true,
-  trailing: false,
-};
-
 const ReloadButtonComponent = ({
   handleReload,
   label,
@@ -16,7 +9,7 @@ const ReloadButtonComponent = ({
     <Styled.ReloadButton
       color="primary"
       icon="refresh"
-      onClick={_.debounce(handleReload, DEBOUNCE_TIMEOUT, DEBOUNCE_OPTIONS)}
+      onClick={handleReload}
       label={label}
       hideLabel
     />

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { defineMessages, injectIntl } from 'react-intl';
 import PropTypes from 'prop-types';
-import _ from 'lodash';
+import { debounce } from 'radash';
 import FullscreenButtonContainer from '/imports/ui/components/common/fullscreen-button/container';
 import SwitchButtonContainer from './switch-button/container';
 import Styled from './styles';
@@ -101,12 +101,10 @@ class ScreenshareComponent extends React.Component {
     this.onSwitched = this.onSwitched.bind(this);
     this.handleOnVolumeChanged = this.handleOnVolumeChanged.bind(this);
     this.handleOnMuted = this.handleOnMuted.bind(this);
-    this.debouncedDispatchScreenShareSize = _.debounce(
-      this.dispatchScreenShareSize,
-      SCREEN_SIZE_DISPATCH_INTERVAL,
-      { leading: false, trailing: true },
+    this.debouncedDispatchScreenShareSize = debounce(
+      { delay: SCREEN_SIZE_DISPATCH_INTERVAL },
+      this.dispatchScreenShareSize
     );
-
     this.volume = getVolume();
     this.mobileHoverSetTimeout = null;
     this.mediaFlowMonitor = null;

bigbluebutton-html5/imports/ui/components/user-list/chat-list-item/component.jsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import { defineMessages, injectIntl } from 'react-intl';
-import _ from 'lodash';
+import { debounce } from 'radash';
 import withShortcutHelper from '/imports/ui/components/shortcut-help/service';
 import Styled from './styles';
 import UserAvatar from '/imports/ui/components/user-avatar/component';
@@ -14,9 +14,9 @@ const PUBLIC_CHAT_KEY = CHAT_CONFIG.public_id;
 
 let globalAppplyStateToProps = () => {};
 
-const throttledFunc = _.debounce(() => {
+const throttledFunc = debounce({ delay: DEBOUNCE_TIME }, () => {
   globalAppplyStateToProps();
-}, DEBOUNCE_TIME, { trailing: true, leading: true });
+});
 
 const intlMessages = defineMessages({
   titlePublic: {

bigbluebutton-html5/imports/ui/components/user-list/service.js

@@ -8,7 +8,6 @@ import Auth from '/imports/ui/services/auth';
 import Storage from '/imports/ui/services/storage/session';
 import { EMOJI_STATUSES } from '/imports/utils/statuses';
 import { makeCall } from '/imports/ui/services/api';
-import _ from 'lodash';
 import KEY_CODES from '/imports/utils/keyCodes';
 import AudioService from '/imports/ui/components/audio/service';
 import VideoService from '/imports/ui/components/video-provider/service';
@@ -20,7 +19,7 @@ import { notify } from '/imports/ui/services/notification';
 import { FormattedMessage } from 'react-intl';
 import { getDateString } from '/imports/utils/string-utils';
 import { indexOf, without } from '/imports/utils/array-utils';
-import { isEmpty } from 'radash';
+import { isEmpty, throttle } from 'radash';
 
 const CHAT_CONFIG = Meteor.settings.public.chat;
 const PUBLIC_CHAT_ID = CHAT_CONFIG.public_id;
@@ -465,12 +464,12 @@ const normalizeEmojiName = (emoji) => (
   emoji in EMOJI_STATUSES ? EMOJI_STATUSES[emoji] : emoji
 );
 
-const setEmojiStatus = _.debounce((userId, emoji) => {
+const setEmojiStatus = throttle({ interval: 1000 }, (userId, emoji) => {
   const statusAvailable = (Object.keys(EMOJI_STATUSES).includes(emoji));
   return statusAvailable
     ? makeCall('setEmojiStatus', Auth.userID, emoji)
     : makeCall('setEmojiStatus', userId, 'none');
-}, 1000, { leading: true, trailing: false });
+});
 
 const clearAllEmojiStatus = (users) => {
   users.forEach((user) => makeCall('setEmojiStatus', user.userId, 'none'));

bigbluebutton-html5/imports/ui/components/video-provider/component.jsx

@@ -3,7 +3,7 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import ReconnectingWebSocket from 'reconnecting-websocket';
 import { defineMessages, injectIntl } from 'react-intl';
-import _ from 'lodash';
+import { debounce } from 'radash';
 import VideoService from './service';
 import VideoListContainer from './video-list/container';
 import {
@@ -150,10 +150,9 @@ class VideoProvider extends Component {
     this.onWsClose = this.onWsClose.bind(this);
     this.onWsMessage = this.onWsMessage.bind(this);
     this.updateStreams = this.updateStreams.bind(this);
-    this.debouncedConnectStreams = _.debounce(
-      this.connectStreams,
-      VideoService.getPageChangeDebounceTime(),
-      { leading: false, trailing: true },
+    this.debouncedConnectStreams = debounce(
+      { delay: VideoService.getPageChangeDebounceTime() },
+      this.connectStreams
     );
     this.startVirtualBackgroundByDrop = this.startVirtualBackgroundByDrop.bind(this);
   }

bigbluebutton-html5/imports/ui/components/video-provider/service.js

@@ -16,7 +16,7 @@ import VideoPreviewService from '../video-preview/service';
 import Storage from '/imports/ui/services/storage/session';
 import BBBStorage from '/imports/ui/services/storage';
 import logger from '/imports/startup/client/logger';
-import _ from 'lodash';
+import { debounce } from 'radash';
 import { partition } from '/imports/utils/array-utils';
 import {
   getSortingMethod,
@@ -840,6 +840,7 @@ class VideoService {
   }
 
   applyCameraProfile (peer, profileId) {
+    console.log('apply camera profile')
     const profile = CAMERA_PROFILES.find((targetProfile) => targetProfile.id === profileId);
 
     // When this should be skipped:
@@ -1005,10 +1006,9 @@ export default {
   onBeforeUnload: () => videoService.onBeforeUnload(),
   notify: message => notify(message, 'error', 'video'),
   updateNumberOfDevices: devices => videoService.updateNumberOfDevices(devices),
-  applyCameraProfile: _.debounce(
-    videoService.applyCameraProfile.bind(videoService),
-    CAMERA_QUALITY_THR_DEBOUNCE,
-    { leading: false, trailing: true },
+  applyCameraProfile: debounce(
+    { delay: CAMERA_QUALITY_THR_DEBOUNCE }, 
+    videoService.applyCameraProfile.bind(videoService)
   ),
   getThreshold: (numberOfPublishers) => videoService.getThreshold(numberOfPublishers),
   isPaginationEnabled: () => videoService.isPaginationEnabled(),

bigbluebutton-html5/imports/ui/components/video-provider/video-button/component.jsx

@@ -6,7 +6,7 @@ import { defineMessages, injectIntl } from 'react-intl';
 import Styled from './styles';
 import { validIOSVersion } from '/imports/ui/components/app/service';
 import deviceInfo from '/imports/utils/deviceInfo';
-import { debounce } from 'lodash';
+import { debounce } from 'radash';
 import BBBMenu from '/imports/ui/components/common/menu/component';
 import { isVirtualBackgroundsEnabled } from '/imports/ui/services/features';
 import Button from '/imports/ui/components/common/button/component';
@@ -85,7 +85,7 @@ const JoinVideoButton = ({
   const exitVideo = () => isDesktopSharingCamera && (!VideoService.isMultipleCamerasEnabled()
     || shouldEnableWebcamSelectorButton);
 
-  const handleOnClick = debounce(() => {
+  const handleOnClick = debounce({ delay: JOIN_VIDEO_DELAY_MILLISECONDS }, () => {
     if (!validIOSVersion()) {
       return VideoService.notify(intl.formatMessage(intlMessages.iOSWarning));
     }
@@ -102,7 +102,7 @@ const JoinVideoButton = ({
           mountVideoPreview(isMobileSharingCamera);
         }
     }
-  }, JOIN_VIDEO_DELAY_MILLISECONDS);
+  });
 
   const handleOpenAdvancedOptions = (props) => {
     mountVideoPreview(isDesktopSharingCamera, props);