You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

actions.js 8.8KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313
  1. // @flow
  2. import throttle from 'lodash/throttle';
  3. import type { Dispatch } from 'redux';
  4. import { NOTIFICATIONS_ENABLED, getFeatureFlag } from '../base/flags';
  5. import { getParticipantCount } from '../base/participants/functions';
  6. import {
  7. CLEAR_NOTIFICATIONS,
  8. HIDE_NOTIFICATION,
  9. HIDE_RAISE_HAND_NOTIFICATIONS,
  10. SET_NOTIFICATIONS_ENABLED,
  11. SHOW_NOTIFICATION
  12. } from './actionTypes';
  13. import {
  14. NOTIFICATION_TIMEOUT_TYPE,
  15. NOTIFICATION_TIMEOUT,
  16. NOTIFICATION_TYPE,
  17. SILENT_JOIN_THRESHOLD,
  18. SILENT_LEFT_THRESHOLD
  19. } from './constants';
  20. /**
  21. * Function that returns notification timeout value based on notification timeout type.
  22. *
  23. * @param {string} type - Notification type.
  24. * @param {Object} notificationTimeouts - Config notification timeouts.
  25. * @returns {number}
  26. */
  27. function getNotificationTimeout(type: ?string, notificationTimeouts: ?Object) {
  28. if (type === NOTIFICATION_TIMEOUT_TYPE.SHORT) {
  29. return notificationTimeouts?.short ?? NOTIFICATION_TIMEOUT.SHORT;
  30. } else if (type === NOTIFICATION_TIMEOUT_TYPE.MEDIUM) {
  31. return notificationTimeouts?.medium ?? NOTIFICATION_TIMEOUT.MEDIUM;
  32. } else if (type === NOTIFICATION_TIMEOUT_TYPE.LONG) {
  33. return notificationTimeouts?.long ?? NOTIFICATION_TIMEOUT.LONG;
  34. }
  35. return NOTIFICATION_TIMEOUT.STICKY;
  36. }
  37. /**
  38. * Clears (removes) all the notifications.
  39. *
  40. * @returns {{
  41. * type: CLEAR_NOTIFICATIONS
  42. * }}
  43. */
  44. export function clearNotifications() {
  45. return {
  46. type: CLEAR_NOTIFICATIONS
  47. };
  48. }
  49. /**
  50. * Removes the notification with the passed in id.
  51. *
  52. * @param {string} uid - The unique identifier for the notification to be
  53. * removed.
  54. * @returns {{
  55. * type: HIDE_NOTIFICATION,
  56. * uid: string
  57. * }}
  58. */
  59. export function hideNotification(uid: string) {
  60. return {
  61. type: HIDE_NOTIFICATION,
  62. uid
  63. };
  64. }
  65. /**
  66. * Removes the raise hand notifications.
  67. *
  68. * @returns {{
  69. * type: HIDE_RAISE_HAND_NOTIFICATIONS
  70. * }}
  71. */
  72. export function hideRaiseHandNotifications() {
  73. return {
  74. type: HIDE_RAISE_HAND_NOTIFICATIONS
  75. };
  76. }
  77. /**
  78. * Stops notifications from being displayed.
  79. *
  80. * @param {boolean} enabled - Whether or not notifications should display.
  81. * @returns {{
  82. * type: SET_NOTIFICATIONS_ENABLED,
  83. * enabled: boolean
  84. * }}
  85. */
  86. export function setNotificationsEnabled(enabled: boolean) {
  87. return {
  88. type: SET_NOTIFICATIONS_ENABLED,
  89. enabled
  90. };
  91. }
  92. /**
  93. * Queues an error notification for display.
  94. *
  95. * @param {Object} props - The props needed to show the notification component.
  96. * @param {string} type - Notification type.
  97. * @returns {Object}
  98. */
  99. export function showErrorNotification(props: Object, type: ?string) {
  100. return showNotification({
  101. ...props,
  102. appearance: NOTIFICATION_TYPE.ERROR
  103. }, type);
  104. }
  105. /**
  106. * Queues a notification for display.
  107. *
  108. * @param {Object} props - The props needed to show the notification component.
  109. * @param {string} type - Notification type.
  110. * @returns {Function}
  111. */
  112. export function showNotification(props: Object = {}, type: ?string) {
  113. return function(dispatch: Function, getState: Function) {
  114. const { notifications, notificationTimeouts } = getState()['features/base/config'];
  115. const enabledFlag = getFeatureFlag(getState(), NOTIFICATIONS_ENABLED, true);
  116. const shouldDisplay = enabledFlag
  117. && (!notifications
  118. || notifications.includes(props.descriptionKey)
  119. || notifications.includes(props.titleKey));
  120. if (shouldDisplay) {
  121. return dispatch({
  122. type: SHOW_NOTIFICATION,
  123. props,
  124. timeout: getNotificationTimeout(type, notificationTimeouts),
  125. uid: props.uid || window.Date.now().toString()
  126. });
  127. }
  128. };
  129. }
  130. /**
  131. * Queues a warning notification for display.
  132. *
  133. * @param {Object} props - The props needed to show the notification component.
  134. * @param {string} type - Notification type.
  135. * @returns {Object}
  136. */
  137. export function showWarningNotification(props: Object, type: ?string) {
  138. return showNotification({
  139. ...props,
  140. appearance: NOTIFICATION_TYPE.WARNING
  141. }, type);
  142. }
  143. /**
  144. * An array of names of participants that have joined the conference. The array
  145. * is replaced with an empty array as notifications are displayed.
  146. *
  147. * @private
  148. * @type {string[]}
  149. */
  150. let joinedParticipantsNames = [];
  151. /**
  152. * A throttled internal function that takes the internal list of participant
  153. * names, {@code joinedParticipantsNames}, and triggers the display of a
  154. * notification informing of their joining.
  155. *
  156. * @private
  157. * @type {Function}
  158. */
  159. const _throttledNotifyParticipantConnected = throttle((dispatch: Dispatch<any>, getState: Function) => {
  160. const participantCount = getParticipantCount(getState());
  161. // Skip join notifications altogether for large meetings.
  162. if (participantCount > SILENT_JOIN_THRESHOLD) {
  163. joinedParticipantsNames = [];
  164. return;
  165. }
  166. const joinedParticipantsCount = joinedParticipantsNames.length;
  167. let notificationProps;
  168. if (joinedParticipantsCount >= 3) {
  169. notificationProps = {
  170. titleArguments: {
  171. name: joinedParticipantsNames[0]
  172. },
  173. titleKey: 'notify.connectedThreePlusMembers'
  174. };
  175. } else if (joinedParticipantsCount === 2) {
  176. notificationProps = {
  177. titleArguments: {
  178. first: joinedParticipantsNames[0],
  179. second: joinedParticipantsNames[1]
  180. },
  181. titleKey: 'notify.connectedTwoMembers'
  182. };
  183. } else if (joinedParticipantsCount) {
  184. notificationProps = {
  185. titleArguments: {
  186. name: joinedParticipantsNames[0]
  187. },
  188. titleKey: 'notify.connectedOneMember'
  189. };
  190. }
  191. if (notificationProps) {
  192. dispatch(
  193. showNotification(notificationProps, NOTIFICATION_TIMEOUT_TYPE.SHORT));
  194. }
  195. joinedParticipantsNames = [];
  196. }, 2000, { leading: false });
  197. /**
  198. * An array of names of participants that have left the conference. The array
  199. * is replaced with an empty array as notifications are displayed.
  200. *
  201. * @private
  202. * @type {string[]}
  203. */
  204. let leftParticipantsNames = [];
  205. /**
  206. * A throttled internal function that takes the internal list of participant
  207. * names, {@code leftParticipantsNames}, and triggers the display of a
  208. * notification informing of their leaving.
  209. *
  210. * @private
  211. * @type {Function}
  212. */
  213. const _throttledNotifyParticipantLeft = throttle((dispatch: Dispatch<any>, getState: Function) => {
  214. const participantCount = getParticipantCount(getState());
  215. // Skip left notifications altogether for large meetings.
  216. if (participantCount > SILENT_LEFT_THRESHOLD) {
  217. leftParticipantsNames = [];
  218. return;
  219. }
  220. const leftParticipantsCount = leftParticipantsNames.length;
  221. let notificationProps;
  222. if (leftParticipantsCount >= 3) {
  223. notificationProps = {
  224. titleArguments: {
  225. name: leftParticipantsNames[0]
  226. },
  227. titleKey: 'notify.leftThreePlusMembers'
  228. };
  229. } else if (leftParticipantsCount === 2) {
  230. notificationProps = {
  231. titleArguments: {
  232. first: leftParticipantsNames[0],
  233. second: leftParticipantsNames[1]
  234. },
  235. titleKey: 'notify.leftTwoMembers'
  236. };
  237. } else if (leftParticipantsCount) {
  238. notificationProps = {
  239. titleArguments: {
  240. name: leftParticipantsNames[0]
  241. },
  242. titleKey: 'notify.leftOneMember'
  243. };
  244. }
  245. if (notificationProps) {
  246. dispatch(
  247. showNotification(notificationProps, NOTIFICATION_TIMEOUT_TYPE.SHORT));
  248. }
  249. leftParticipantsNames = [];
  250. }, 2000, { leading: false });
  251. /**
  252. * Queues the display of a notification of a participant having connected to
  253. * the meeting. The notifications are batched so that quick consecutive
  254. * connection events are shown in one notification.
  255. *
  256. * @param {string} displayName - The name of the participant that connected.
  257. * @returns {Function}
  258. */
  259. export function showParticipantJoinedNotification(displayName: string) {
  260. leftParticipantsNames.push(displayName);
  261. return (dispatch: Dispatch<any>, getState: Function) => _throttledNotifyParticipantConnected(dispatch, getState);
  262. }
  263. /**
  264. * Queues the display of a notification of a participant having left to
  265. * the meeting. The notifications are batched so that quick consecutive
  266. * connection events are shown in one notification.
  267. *
  268. * @param {string} displayName - The name of the participant that left.
  269. * @returns {Function}
  270. */
  271. export function showParticipantLeftNotification(displayName: string) {
  272. joinedParticipantsNames.push(displayName);
  273. return (dispatch: Dispatch<any>, getState: Function) => _throttledNotifyParticipantLeft(dispatch, getState);
  274. }