ref(notifications): move join notification firing to notifications feature

This commit is contained in:
Leonard Kim 2019-06-25 15:25:43 -07:00 committed by virtuacoplenny
parent 3195a449ca
commit 979b773c3c
4 changed files with 110 additions and 86 deletions

View File

@ -1,5 +1,3 @@
import throttle from 'lodash/throttle';
import { set } from '../redux'; import { set } from '../redux';
import { NOTIFICATION_TIMEOUT, showNotification } from '../../notifications'; import { NOTIFICATION_TIMEOUT, showNotification } from '../../notifications';
@ -449,73 +447,3 @@ export function pinParticipant(id) {
} }
}; };
} }
/**
* An array of names of participants that have joined the conference. The array
* is replaced with an empty array as notifications are displayed.
*
* @private
* @type {string[]}
*/
let joinedParticipantsNames = [];
/**
* A throttled internal function that takes the internal list of participant
* names, {@code joinedParticipantsNames}, and triggers the display of a
* notification informing of their joining.
*
* @private
* @type {Function}
*/
const _throttledNotifyParticipantConnected = throttle(dispatch => {
const joinedParticipantsCount = joinedParticipantsNames.length;
let notificationProps;
if (joinedParticipantsCount >= 3) {
notificationProps = {
titleArguments: {
name: joinedParticipantsNames[0],
count: joinedParticipantsCount - 1
},
titleKey: 'notify.connectedThreePlusMembers'
};
} else if (joinedParticipantsCount === 2) {
notificationProps = {
titleArguments: {
first: joinedParticipantsNames[0],
second: joinedParticipantsNames[1]
},
titleKey: 'notify.connectedTwoMembers'
};
} else if (joinedParticipantsCount) {
notificationProps = {
titleArguments: {
name: joinedParticipantsNames[0]
},
titleKey: 'notify.connectedOneMember'
};
}
if (notificationProps) {
dispatch(
showNotification(notificationProps, NOTIFICATION_TIMEOUT));
}
joinedParticipantsNames = [];
}, 500, { leading: false });
/**
* Queues the display of a notification of a participant having connected to
* the meeting. The notifications are batched so that quick consecutive
* connection events are shown in one notification.
*
* @param {string} displayName - The name of the participant that connected.
* @returns {Function}
*/
export function showParticipantJoinedNotification(displayName) {
joinedParticipantsNames.push(displayName);
return dispatch => _throttledNotifyParticipantConnected(dispatch);
}

View File

@ -20,8 +20,7 @@ import {
localParticipantJoined, localParticipantJoined,
localParticipantLeft, localParticipantLeft,
participantLeft, participantLeft,
participantUpdated, participantUpdated
showParticipantJoinedNotification
} from './actions'; } from './actions';
import { import {
DOMINANT_SPEAKER_CHANGED, DOMINANT_SPEAKER_CHANGED,
@ -118,15 +117,7 @@ MiddlewareRegistry.register(store => next => action => {
case PARTICIPANT_JOINED: { case PARTICIPANT_JOINED: {
_maybePlaySounds(store, action); _maybePlaySounds(store, action);
const result = _participantJoinedOrUpdated(store, next, action); return _participantJoinedOrUpdated(store, next, action);
const { participant: p } = action;
if (!p.local) {
store.dispatch(showParticipantJoinedNotification(getParticipantDisplayName(store.getState, p.id)));
}
return result;
} }
case PARTICIPANT_LEFT: case PARTICIPANT_LEFT:

View File

@ -1,5 +1,9 @@
// @flow // @flow
import throttle from 'lodash/throttle';
import type { Dispatch } from 'redux';
import { import {
CLEAR_NOTIFICATIONS, CLEAR_NOTIFICATIONS,
HIDE_NOTIFICATION, HIDE_NOTIFICATION,
@ -7,7 +11,7 @@ import {
SHOW_NOTIFICATION SHOW_NOTIFICATION
} from './actionTypes'; } from './actionTypes';
import { NOTIFICATION_TYPE } from './constants'; import { NOTIFICATION_TIMEOUT, NOTIFICATION_TYPE } from './constants';
/** /**
* Clears (removes) all the notifications. * Clears (removes) all the notifications.
@ -102,3 +106,73 @@ export function showWarningNotification(props: Object) {
appearance: NOTIFICATION_TYPE.WARNING appearance: NOTIFICATION_TYPE.WARNING
}); });
} }
/**
* An array of names of participants that have joined the conference. The array
* is replaced with an empty array as notifications are displayed.
*
* @private
* @type {string[]}
*/
let joinedParticipantsNames = [];
/**
* A throttled internal function that takes the internal list of participant
* names, {@code joinedParticipantsNames}, and triggers the display of a
* notification informing of their joining.
*
* @private
* @type {Function}
*/
const _throttledNotifyParticipantConnected = throttle((dispatch: Dispatch<any>) => {
const joinedParticipantsCount = joinedParticipantsNames.length;
let notificationProps;
if (joinedParticipantsCount >= 3) {
notificationProps = {
titleArguments: {
name: joinedParticipantsNames[0],
count: joinedParticipantsCount - 1
},
titleKey: 'notify.connectedThreePlusMembers'
};
} else if (joinedParticipantsCount === 2) {
notificationProps = {
titleArguments: {
first: joinedParticipantsNames[0],
second: joinedParticipantsNames[1]
},
titleKey: 'notify.connectedTwoMembers'
};
} else if (joinedParticipantsCount) {
notificationProps = {
titleArguments: {
name: joinedParticipantsNames[0]
},
titleKey: 'notify.connectedOneMember'
};
}
if (notificationProps) {
dispatch(
showNotification(notificationProps, NOTIFICATION_TIMEOUT));
}
joinedParticipantsNames = [];
}, 500, { leading: false });
/**
* Queues the display of a notification of a participant having connected to
* the meeting. The notifications are batched so that quick consecutive
* connection events are shown in one notification.
*
* @param {string} displayName - The name of the participant that connected.
* @returns {Function}
*/
export function showParticipantJoinedNotification(displayName: string) {
joinedParticipantsNames.push(displayName);
return (dispatch: Dispatch<any>) => _throttledNotifyParticipantConnected(dispatch);
}

View File

@ -1,9 +1,40 @@
/* @flow */ /* @flow */
import { getCurrentConference } from '../base/conference'; import { getCurrentConference } from '../base/conference';
import { StateListenerRegistry } from '../base/redux'; import {
PARTICIPANT_JOINED,
getParticipantDisplayName
} from '../base/participants';
import { MiddlewareRegistry, StateListenerRegistry } from '../base/redux';
import { clearNotifications } from './actions'; import {
clearNotifications,
showParticipantJoinedNotification
} from './actions';
/**
* Middleware that captures actions to display notifications.
*
* @param {Store} store - The redux store.
* @returns {Function}
*/
MiddlewareRegistry.register(store => next => action => {
const result = next(action);
switch (action.type) {
case PARTICIPANT_JOINED: {
const { participant: p } = action;
if (!p.local) {
store.dispatch(showParticipantJoinedNotification(
getParticipantDisplayName(store.getState, p.id)
));
}
}
}
return result;
});
/** /**
* StateListenerRegistry provides a reliable way to detect the leaving of a * StateListenerRegistry provides a reliable way to detect the leaving of a