Update lib-jitsi-meet.

Update lib-jitsi-meet which adds the setNetworkInfo method.

css/modals/security/_security.scss

@@ -47,13 +47,10 @@
     }
 }
 
-.new-toolbox .toolbox-content .toolbox-icon.security-toolbar-button,
 .new-toolbox .toolbox-content .toolbox-icon.toggled.security-toolbar-button {
-    background: rgba(241, 173, 51, 0.7);
-    border: 1px solid rgba(255, 255, 255, 0.4);
+    border-width: 0;
 
-    &:hover {
-        background: rgba(241, 173, 51, 0.7);
-        border: 1px solid rgba(255, 255, 255, 0.4);
+    &:not(:hover) {
+        background: unset;
     }
 }

package-lock.json

@@ -10965,8 +10965,8 @@
       }
     },
     "lib-jitsi-meet": {
-      "version": "github:jitsi/lib-jitsi-meet#b5f85a4758570dfd3ffccf6b4ddfcbf88edc33ac",
-      "from": "github:jitsi/lib-jitsi-meet#b5f85a4758570dfd3ffccf6b4ddfcbf88edc33ac",
+      "version": "github:jitsi/lib-jitsi-meet#50ed056943fe7066f98a917b207b48471e112462",
+      "from": "github:jitsi/lib-jitsi-meet#50ed056943fe7066f98a917b207b48471e112462",
       "requires": {
         "@jitsi/sdp-interop": "1.0.3",
         "@jitsi/sdp-simulcast": "0.3.0",

package.json

@@ -56,7 +56,7 @@
     "js-md5": "0.6.1",
     "js-utils": "github:jitsi/js-utils#cf11996bd866fdb47326c59a5d3bc24be17282d4",
     "jwt-decode": "2.2.0",
-    "lib-jitsi-meet": "github:jitsi/lib-jitsi-meet#b5f85a4758570dfd3ffccf6b4ddfcbf88edc33ac",
+    "lib-jitsi-meet": "github:jitsi/lib-jitsi-meet#cdada996725ab62279f9af95cd09a6775409f0c3",
     "libflacjs": "github:mmig/libflac.js#93d37e7f811f01cf7d8b6a603e38bd3c3810907d",
     "lodash": "4.17.13",
     "moment": "2.19.4",

react/features/base/devices/middleware.js

@@ -15,14 +15,19 @@ import {
     NOTIFY_CAMERA_ERROR,
     NOTIFY_MIC_ERROR,
     SET_AUDIO_INPUT_DEVICE,
-    SET_VIDEO_INPUT_DEVICE
+    SET_VIDEO_INPUT_DEVICE,
+    UPDATE_DEVICE_LIST
 } from './actionTypes';
 import {
     removePendingDeviceRequests,
     setAudioInputDevice,
     setVideoInputDevice
 } from './actions';
-import { formatDeviceLabel, setAudioOutputDeviceId } from './functions';
+import {
+    formatDeviceLabel,
+    groupDevicesByKind,
+    setAudioOutputDeviceId
+} from './functions';
 import logger from './logger';
 
 const JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP = {
@@ -41,6 +46,24 @@ const JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP = {
     }
 };
 
+/**
+ * Logs the current device list.
+ *
+ * @param {Object} deviceList - Whatever is returned by {@link groupDevicesByKind}.
+ * @returns {string}
+ */
+function logDeviceList(deviceList) {
+    const devicesToStr = list => list.map(device => `\t\t${device.label}[${device.deviceId}]`).join('\n');
+    const audioInputs = devicesToStr(deviceList.audioInput);
+    const audioOutputs = devicesToStr(deviceList.audioOutput);
+    const videoInputs = devicesToStr(deviceList.videoInput);
+
+    logger.debug('Device list updated:\n'
+        + `audioInput:\n${audioInputs}\n`
+        + `audioOutput:\n${audioOutputs}\n`
+        + `videoInput:\n${videoInputs}`);
+}
+
 /**
  * Implements the middleware of the feature base/devices.
  *
@@ -123,6 +146,9 @@ MiddlewareRegistry.register(store => next => action => {
             APP.UI.emitEvent(UIEvents.VIDEO_DEVICE_CHANGED, action.deviceId);
         }
         break;
+    case UPDATE_DEVICE_LIST:
+        logDeviceList(groupDevicesByKind(action.devices));
+        break;
     case CHECK_AND_NOTIFY_FOR_NEW_DEVICE:
         _checkAndNotifyForNewDevice(store, action.newDevices, action.oldDevices);
         break;

react/features/base/devices/reducer.js

@@ -19,24 +19,6 @@ const DEFAULT_STATE = {
     pendingRequests: []
 };
 
-/**
- * Logs the current device list.
- *
- * @param {Object} deviceList - Whatever is returned by {@link groupDevicesByKind}.
- * @returns {string}
- */
-function logDeviceList(deviceList) {
-    const devicesToStr = list => list.map(device => `\t\t${device.label}[${device.deviceId}]`).join('\n');
-    const audioInputs = devicesToStr(deviceList.audioInput);
-    const audioOutputs = devicesToStr(deviceList.audioOutput);
-    const videoInputs = devicesToStr(deviceList.videoInput);
-
-    logger.debug('Device list updated:\n'
-        + `audioInput:\n${audioInputs}\n`
-        + `audioOutput:\n${audioOutputs}\n`
-        + `videoInput:\n${videoInputs}`);
-}
-
 /**
  * Listen for actions which changes the state of known and used devices.
  *
@@ -54,8 +36,6 @@ ReducerRegistry.register(
         case UPDATE_DEVICE_LIST: {
             const deviceList = groupDevicesByKind(action.devices);
 
-            logDeviceList(deviceList);
-
             return {
                 ...state,
                 availableDevices: deviceList

react/features/base/icons/svg/index.js

@@ -46,7 +46,6 @@ export { default as IconInfo } from './info.svg';
 export { default as IconInviteMore } from './user-plus.svg';
 export { default as IconKick } from './kick.svg';
 export { default as IconLiveStreaming } from './public.svg';
-export { default as IconLockPassword } from './lock.svg';
 export { default as IconMeetingLocked } from './meeting-locked.svg';
 export { default as IconMeetingUnlocked } from './meeting-unlocked.svg';
 export { default as IconMenu } from './menu.svg';
@@ -75,6 +74,8 @@ export { default as IconReply } from './reply.svg';
 export { default as IconRestore } from './restore.svg';
 export { default as IconRoomLock } from './security.svg';
 export { default as IconRoomUnlock } from './security-locked.svg';
+export { default as IconSecurityOff } from './security-off.svg';
+export { default as IconSecurityOn } from './security-on.svg';
 export { default as IconSearch } from './search.svg';
 export { default as IconSettings } from './settings.svg';
 export { default as IconSignalLevel0 } from './signal_cellular_0.svg';
@@ -87,7 +88,6 @@ export { default as IconShareVideo } from './shared-video.svg';
 export { default as IconSwitchCamera } from './switch-camera.svg';
 export { default as IconTileView } from './tiles-many.svg';
 export { default as IconToggleRecording } from './camera-take-picture.svg';
-export { default as IconUnlockPassword } from './unlock.svg';
 export { default as IconVideoQualityAudioOnly } from './AUD.svg';
 export { default as IconVideoQualityHD } from './HD.svg';
 export { default as IconVideoQualityLD } from './LD.svg';

react/features/base/icons/svg/lock.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M5 10H7H17H19V20H5V10ZM19 8H17V7C17 4.23858 14.7614 2 12 2C9.23858 2 7 4.23858 7 7V8H5C3.89543 8 3 8.89543 3 10V20C3 21.1046 3.89543 22 5 22H19C20.1046 22 21 21.1046 21 20V10C21 8.89543 20.1046 8 19 8ZM12.9686 15.7502C13.5837 15.4091 14 14.7532 14 14C14 12.8954 13.1046 12 12 12C10.8954 12 10 12.8954 10 14C10 14.7532 10.4163 15.4091 11.0314 15.7502C11.0109 15.8301 11 15.9138 11 16V17C11 17.5523 11.4477 18 12 18C12.5523 18 13 17.5523 13 17V16C13 15.9138 12.9891 15.8301 12.9686 15.7502ZM12 4C13.6569 4 15 5.34315 15 7V8H9V7C9 5.34315 10.3431 4 12 4Z" fill="white"/>
-</svg>

react/features/base/icons/svg/security-off.svg

@@ -0,0 +1,14 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.87597 3.00772L3 3.11722V4V13.6745C3 16.088 4.24334 18.3313 6.29001 19.6105L11.47 22.848L12 23.1792L12.53 22.848L17.71 19.6105C19.7567 18.3313 21 16.088 21 13.6745V4V3.11722L20.124 3.00772L12.124 2.00772L12 1.99222L11.876 2.00772L3.87597 3.00772Z" fill="url(#paint0_linear)" stroke="white" stroke-width="2"/>
+<path d="M20 4V13.6745C20 15.7433 18.9343 17.6661 17.18 18.7625L12 22V3L20 4Z" fill="url(#paint1_linear)"/>
+<defs>
+<linearGradient id="paint0_linear" x1="11.8143" y1="4.14215" x2="11.8143" y2="23" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFB800"/>
+<stop offset="1" stop-color="#CF4B00"/>
+</linearGradient>
+<linearGradient id="paint1_linear" x1="11.8143" y1="4.14215" x2="11.8143" y2="23" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FF8A00"/>
+<stop offset="1" stop-color="#A03B03"/>
+</linearGradient>
+</defs>
+</svg>

react/features/base/icons/svg/security-on.svg

@@ -0,0 +1,15 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.87597 3.00772L3 3.11722V4V13.6745C3 16.088 4.24334 18.3313 6.29001 19.6105L11.47 22.848L12 23.1792L12.53 22.848L17.71 19.6105C19.7567 18.3313 21 16.088 21 13.6745V4V3.11722L20.124 3.00772L12.124 2.00772L12 1.99222L11.876 2.00772L3.87597 3.00772Z" fill="url(#paint0_linear)" stroke="white" stroke-width="2"/>
+<path d="M20 4V13.6745C20 15.7433 18.9343 17.6661 17.18 18.7625L12 22V3L20 4Z" fill="url(#paint1_linear)"/>
+<path d="M9 11.4382L10.6848 13L15 9" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<defs>
+<linearGradient id="paint0_linear" x1="11.8143" y1="4.14215" x2="11.8143" y2="23" gradientUnits="userSpaceOnUse">
+<stop stop-color="#76CF9C"/>
+<stop offset="1" stop-color="#279255"/>
+</linearGradient>
+<linearGradient id="paint1_linear" x1="11.8143" y1="4.14215" x2="11.8143" y2="23" gradientUnits="userSpaceOnUse">
+<stop stop-color="#31B76A"/>
+<stop offset="1" stop-color="#18663A"/>
+</linearGradient>
+</defs>
+</svg>

react/features/base/icons/svg/unlock.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M7 8V7C7 4.23858 9.23858 2 12 2C14.0608 2 15.8304 3.24676 16.5957 5.02716L14.7583 5.81698C14.2882 4.72339 13.2108 4 12 4C10.3431 4 9 5.34315 9 7V8H12H16.8374H16.8818H19C20.1046 8 21 8.89543 21 10V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V10C3 8.89543 3.89543 8 5 8H7ZM5 20V10H19V20H5ZM12.9686 15.7502C13.5837 15.4091 14 14.7532 14 14C14 12.8954 13.1046 12 12 12C10.8954 12 10 12.8954 10 14C10 14.7532 10.4163 15.4091 11.0314 15.7502C11.0109 15.8301 11 15.9138 11 16V17C11 17.5523 11.4477 18 12 18C12.5523 18 13 17.5523 13 17V16C13 15.9138 12.9891 15.8301 12.9686 15.7502Z" fill="white"/>
-</svg>

react/features/base/lib-jitsi-meet/actions.js

@@ -2,6 +2,8 @@
 
 import type { Dispatch } from 'redux';
 
+import { isOnline } from '../net-info/selectors';
+
 import JitsiMeetJS from './_';
 import {
     LIB_DID_DISPOSE,
@@ -37,7 +39,8 @@ export function disposeLib() {
  */
 export function initLib() {
     return (dispatch: Dispatch<any>, getState: Function): void => {
-        const config = getState()['features/base/config'];
+        const state = getState();
+        const config = state['features/base/config'];
 
         if (!config) {
             throw new Error('Cannot init lib-jitsi-meet without config');
@@ -50,6 +53,9 @@ export function initLib() {
                 enableAnalyticsLogging: isAnalyticsEnabled(getState),
                 ...config
             });
+            JitsiMeetJS.setNetworkInfo({
+                isOnline: isOnline(state)
+            });
             dispatch({ type: LIB_DID_INIT });
         } catch (error) {
             dispatch(libInitError(error));

react/features/base/lib-jitsi-meet/middleware.js

@@ -2,6 +2,7 @@
 
 import { SET_CONFIG } from '../config';
 import { setLoggingConfig } from '../logging';
+import { SET_NETWORK_INFO } from '../net-info';
 import { PARTICIPANT_LEFT } from '../participants';
 import { MiddlewareRegistry } from '../redux';
 
@@ -31,6 +32,12 @@ MiddlewareRegistry.register(store => next => action => {
         }
         break;
 
+    case SET_NETWORK_INFO:
+        JitsiMeetJS.setNetworkInfo({
+            isOnline: action.isOnline
+        });
+        break;
+
     case PARTICIPANT_LEFT:
         action.participant.local && store.dispatch(disposeLib());
         break;

react/features/base/net-info/selectors.js

@@ -0,0 +1,11 @@
+import { STORE_NAME } from './constants';
+
+/**
+ * A selector for the internet online status.
+ *
+ * @param {Object} state - The redux state.
+ * @returns {boolean}
+ */
+export function isOnline(state) {
+    return state[STORE_NAME].isOnline;
+}

react/features/security/components/security-dialog/SecurityDialogButton.js

@@ -2,7 +2,7 @@
 
 import { createToolbarEvent, sendAnalytics } from '../../../analytics';
 import { translate } from '../../../base/i18n';
-import { IconLockPassword, IconUnlockPassword } from '../../../base/icons';
+import { IconSecurityOff, IconSecurityOn } from '../../../base/icons';
 import { connect } from '../../../base/redux';
 import { AbstractButton, type AbstractButtonProps } from '../../../base/toolbox';
 import { openSecurityDialog } from '../../actions';
@@ -28,9 +28,9 @@ type Props = AbstractButtonProps & {
  */
 class SecurityDialogButton extends AbstractButton<Props, *> {
     accessibilityLabel = 'toolbar.accessibilityLabel.security';
-    icon = IconUnlockPassword;
+    icon = IconSecurityOff;
     label = 'toolbar.security';
-    toggledIcon = IconLockPassword;
+    toggledIcon = IconSecurityOn;
     tooltip = 'toolbar.security';
 
     /**