rn: drop {AddPeople,Invite}Controller

We are going to implement the invite dialog *inside* the SDK, so there is no
need to have all this machinery anymore.

android/build.gradle

@@ -113,6 +113,15 @@ allprojects {
                 }
             }
 
+            task androidJavadocs(type: Javadoc) {
+                source = android.sourceSets.main.java.source
+                classpath += project.files(android.getBootClasspath().join(File.pathSeparator))
+                failOnError false
+            }
+            task androidJavadocsJar(type: Jar, dependsOn: androidJavadocs) {
+                classifier = 'javadoc'
+                from androidJavadocs.destinationDir
+            }
             task androidSourcesJar(type: Jar) {
                 classifier = 'sources'
                 from android.sourceSets.main.java.source
@@ -128,6 +137,7 @@ allprojects {
                         extension "aar"
                     }
                     artifact(androidSourcesJar)
+                    artifact(androidJavadocsJar)
                     pom.withXml {
                         def pomXml = asNode()
                         pomXml.appendNode('name', project.name)

android/sdk/src/main/java/org/jitsi/meet/sdk/JitsiMeetActivity.java

@@ -52,11 +52,6 @@ public class JitsiMeetActivity
     private static final int OVERLAY_PERMISSION_REQUEST_CODE
         = (int) (Math.random() * Short.MAX_VALUE);
 
-    /**
-     * A color scheme object to override the default color is the SDK.
-     */
-    private Bundle colorScheme;
-
     /**
      * The default base {@code URL} used to join a conference when a partial URL
      * (e.g. a room name only) is specified. The value is used only while
@@ -125,7 +120,6 @@ public class JitsiMeetActivity
 
         // XXX Before calling JitsiMeetView#loadURL, make sure to call whatever
         // is documented to need such an order in order to take effect:
-        view.setColorScheme(colorScheme);
         view.setDefaultURL(defaultURL);
         if (pictureInPictureEnabled != null) {
             view.setPictureInPictureEnabled(
@@ -292,17 +286,6 @@ public class JitsiMeetActivity
         ReactActivityLifecycleCallbacks.requestPermissions(this, permissions, requestCode, listener);
     }
 
-    /**
-     * @see JitsiMeetView#setColorScheme(Bundle)
-     */
-    public void setColorScheme(Bundle colorScheme) {
-        if (view == null) {
-            this.colorScheme = colorScheme;
-        } else {
-            view.setColorScheme(colorScheme);
-        }
-    }
-
     /**
      *
      * @see JitsiMeetView#setDefaultURL(URL)

android/sdk/src/main/java/org/jitsi/meet/sdk/JitsiMeetView.java

@@ -69,11 +69,6 @@ public class JitsiMeetView
         return loaded;
     }
 
-    /**
-     * A color scheme object to override the default color is the SDK.
-     */
-    private Bundle colorScheme;
-
     /**
      * The default base {@code URL} used to join a conference when a partial URL
      * (e.g. a room name only) is specified to {@link #loadURLString(String)} or
@@ -135,15 +130,6 @@ public class JitsiMeetView
         }
     }
 
-    /**
-     * Gets the color scheme used in the SDK.
-     *
-     * @return The color scheme map.
-     */
-    public Bundle getColorScheme() {
-        return colorScheme;
-    }
-
     /**
      * Gets the default base {@code URL} used to join a conference when a
      * partial URL (e.g. a room name only) is specified to
@@ -222,11 +208,6 @@ public class JitsiMeetView
     public void loadURLObject(@Nullable Bundle urlObject) {
         Bundle props = new Bundle();
 
-        // color scheme
-        if (colorScheme != null) {
-            props.putBundle("colorScheme", colorScheme);
-        }
-
         // defaultURL
         if (defaultURL != null) {
             props.putString("defaultURL", defaultURL.toString());
@@ -324,15 +305,6 @@ public class JitsiMeetView
         onExternalAPIEvent(LISTENER_METHODS, name, data);
     }
 
-    /**
-     * Sets the color scheme to override the default colors of the SDK.
-     *
-     * @param colorScheme The color scheme map.
-     */
-    public void setColorScheme(Bundle colorScheme) {
-        this.colorScheme = colorScheme;
-    }
-
     /**
      * Sets the default base {@code URL} used to join a conference when a
      * partial URL (e.g. a room name only) is specified to

conference.js

@@ -45,8 +45,7 @@ import {
     onStartMutedPolicyChanged,
     p2pStatusChanged,
     sendLocalParticipant,
-    setDesktopSharingEnabled,
-    setSubject
+    setDesktopSharingEnabled
 } from './react/features/base/conference';
 import {
     getAvailableDevices,
@@ -1826,8 +1825,6 @@ export default {
         room.on(JitsiConferenceEvents.TALK_WHILE_MUTED, () => {
             APP.UI.showToolbar(6000);
         });
-        room.on(JitsiConferenceEvents.SUBJECT_CHANGED,
-            subject => APP.API.notifySubjectChanged(subject));
 
         room.on(
             JitsiConferenceEvents.LAST_N_ENDPOINTS_CHANGED,
@@ -2315,8 +2312,7 @@ export default {
                         }));
                     }
 
-                    if (this.localVideo
-                        && this.localVideo.videoType === 'camera') {
+                    if (this.localVideo) {
                         dispatch(updateSettings({
                             cameraDeviceId: this.localVideo.getDeviceId()
                         }));
@@ -2760,16 +2756,6 @@ export default {
         APP.API.notifyAudioMutedStatusChanged(muted);
     },
 
-    /**
-     * Changes the subject of the conference.
-     * Note: available only for moderator.
-     *
-     * @param subject {string} the new subject for the conference.
-     */
-    setSubject(subject) {
-        APP.store.dispatch(setSubject(subject));
-    },
-
     /**
      * Dispatches the passed in feedback for submission. The submitted score
      * should be a number inclusively between 1 through 5, or -1 for no score.

config.js

@@ -146,7 +146,7 @@ var config = {
     desktopSharingChromeExtId: null,
 
     // Whether desktop sharing should be disabled on Chrome.
-    // desktopSharingChromeDisabled: false,
+    desktopSharingChromeDisabled: true,
 
     // The media sources to use when using screen sharing with the Chrome
     // extension.
@@ -156,7 +156,7 @@ var config = {
     desktopSharingChromeMinExtVersion: '0.1',
 
     // Whether desktop sharing should be disabled on Firefox.
-    // desktopSharingFirefoxDisabled: false,
+    desktopSharingFirefoxDisabled: false,
 
     // Optional desktop sharing frame rate options. Default value: min:5, max:5.
     // desktopSharingFrameRate: {

css/_font.scss

@@ -1,10 +1,10 @@
 @font-face {
     font-family: 'jitsi';
-    src:  url('../fonts/jitsi.eot?3vw865');
-    src:  url('../fonts/jitsi.eot?3vw865#iefix') format('embedded-opentype'),
-        url('../fonts/jitsi.ttf?3vw865') format('truetype'),
-        url('../fonts/jitsi.woff?3vw865') format('woff'),
-        url('../fonts/jitsi.svg?3vw865#jitsi') format('svg');
+    src:url('../fonts/jitsi.eot?94d075');
+    src:url('../fonts/jitsi.eot?#iefix94d075') format('embedded-opentype'),
+        url('../fonts/jitsi.woff?94d075') format('woff'),
+        url('../fonts/jitsi.ttf?94d075') format('truetype'),
+        url('../fonts/jitsi.svg?94d075#jitsi') format('svg');
     font-weight: normal;
     font-style: normal;
 }
@@ -28,74 +28,167 @@
 .icon-chat-unread:before {
   content: "\e0b7";
 }
-.icon-closed_caption:before {
-  content: "\e930";
-}
-.icon-tiles-many:before {
-  content: "\e92e";
+.icon-arrow_back:before {
+  content: "\e5c4";
 }
 .icon-close:before {
   content: "\e5cd";
 }
-.icon-open_in_new:before {
-  content: "\e89e";
-}
-.icon-restore:before {
-  content: "\e8b3";
-}
-.icon-navigate_next:before {
-  content: "\e409";
+.icon-event_note:before {
+    content: "\e616";
 }
 .icon-menu:before {
   content: "\e5d2";
 }
-.icon-arrow_back:before {
-  content: "\e5c4";
+.icon-navigate_before:before {
+  content: "\e408";
+}
+.icon-navigate_next:before {
+  content: "\e409";
 }
 .icon-public:before {
-  content: "\e80b";
+    content: "\e80b";
 }
-.icon-event_note:before {
-  content: "\e616";
+.icon-restore:before {
+  content: "\e8b3";
 }
-.icon-bluetooth:before {
-  content: "\e1aa";
-}
-.icon-headset:before {
-  content: "\e310";
-}
-.icon-phone-talk:before {
-  content: "\e61d";
+.icon-timer:before {
+    content: "\e425";
 }
 .icon-thumb-menu:before {
-  content: "\e5d4";
+    content: "\e5d4";
+}
+.icon-mic-camera-combined:before {
+    content: "\e903";
+}
+.icon-feedback:before {
+    content: "\e91d";
+}
+.icon-toggle-filmstrip:before {
+    content: "\e91c";
+}
+.icon-avatar:before {
+    content: "\e901";
+}
+.icon-hangup:before {
+    content: "\e905";
+}
+.icon-chat:before {
+    content: "\e906";
+}
+.icon-download:before {
+    content: "\e902";
+}
+.icon-edit:before {
+    content: "\e907";
+}
+.icon-share-doc:before {
+    content: "\e908";
+}
+.icon-kick:before {
+    content: "\e904";
+}
+.icon-menu-up:before {
+    content: "\e91f";
+}
+.icon-menu-down:before {
+    content: "\e920";
+}
+.icon-full-screen:before {
+    content: "\e90b";
+}
+.icon-exit-full-screen:before {
+    content: "\e90c";
+}
+.icon-star-full:before {
+    content: "\e90a";
+}
+.icon-security:before {
+    content: "\e90d";
+}
+.icon-security-locked:before {
+    content: "\e90e";
+}
+.icon-reload:before {
+    content: "\e90f";
+}
+.icon-microphone:before {
+    content: "\e910";
+}
+.icon-mic-empty:before {
+    content: "\e911";
+}
+.icon-mic-disabled:before {
+    content: "\e912";
 }
 .icon-ninja:before {
-  content: "\e909";
+    content: "\e909";
 }
-.icon-invite:before {
-  content: "\e145";
+.icon-raised-hand:before {
+    content: "\e91e";
+}
+.icon-contactList:before {
+    content: "\e91b";
+}
+.icon-link:before {
+    content: "\e913";
+}
+.icon-shared-video:before {
+    content: "\e914";
+}
+.icon-settings:before {
+    content: "\e915";
+}
+.icon-star:before {
+    content: "\e916";
+}
+.icon-switch-camera:before {
+    content: "\e921";
+}
+.icon-share-desktop:before {
+    content: "\e917";
+}
+.icon-camera:before {
+    content: "\e918";
+}
+.icon-camera-disabled:before {
+    content: "\e919";
+}
+.icon-volume:before {
+    content: "\e91a";
+}
+.icon-recDisable:before {
+    content: "\e613";
+}
+.icon-recEnable:before {
+    content: "\e614";
+}
+.icon-presentation:before {
+    content: "\e603";
+}
+.icon-dialpad:before {
+    content: "\e925";
+}
+.icon-visibility:before {
+    content: "\e923";
+}
+.icon-visibility-off:before {
+    content: "\e924";
+}
+.icon-telephone:before {
+    content: "\e0cd";
 }
 .icon-add:before {
-  content: "\e146";
+    content: "\e145";
 }
-.icon-play:before {
-  content: "\f04b";
+.icon-info:before {
+    content: "\e922";
 }
-.icon-stop:before {
-  content: "\f04d";
+.icon-gsm-bars:before {
+    content: "\e926";
 }
-.icon-dominant-speaker:before {
-  content: "\f0a1";
-}
-.icon-speaker:before {
-  content: "\e92d";
-}
-.icon-rec:before {
-  content: "\e92b";
-}
-.icon-camera-take-picture:before {
-  content: "\e92a";
+.icon-open_in_new:before {
+  content: "\e89e";
 }
 .icon-AUD:before {
   content: "\e900";
@@ -109,90 +202,33 @@
 .icon-SD:before {
   content: "\e929";
 }
-.icon-gsm-bars:before {
-  content: "\e926";
+.icon-camera-take-picture:before {
+  content: "\e92a";
 }
-.icon-info:before {
-  content: "\e922";
+.icon-rec:before {
+  content: "\e92b";
 }
-.icon-mic-camera-combined:before {
-  content: "\e903";
+.icon-live:before {
+  content: "\e92c";
 }
-.icon-feedback:before {
-  content: "\e91d";
+.icon-speaker:before {
+    content: "\e92d";
 }
-.icon-hangup:before {
-  content: "\e905";
+.icon-tiles-many:before {
+  content: "\e92e";
 }
-.icon-chat:before {
-  content: "\e906";
+.icon-tiles-one:before {
+  content: "\e92f";
 }
-.icon-share-doc:before {
-  content: "\e908";
+.icon-closed_caption:before {
+    content: "\e930";
 }
-.icon-kick:before {
-  content: "\e904";
+.icon-play:before {
+    content: "\f04b";
 }
-.icon-menu-up:before {
-  content: "\e91f";
-}
-.icon-menu-down:before {
-  content: "\e920";
-}
-.icon-full-screen:before {
-  content: "\e90b";
-}
-.icon-exit-full-screen:before {
-  content: "\e90c";
-}
-.icon-security:before {
-  content: "\e90d";
-}
-.icon-security-locked:before {
-  content: "\e90e";
-}
-.icon-microphone:before {
-  content: "\e910";
-}
-.icon-mic-disabled:before {
-  content: "\e912";
-}
-.icon-raised-hand:before {
-  content: "\e91e";
-}
-.icon-link:before {
-  content: "\e913";
-}
-.icon-shared-video:before {
-  content: "\e914";
-}
-.icon-settings:before {
-  content: "\e915";
-}
-.icon-star:before {
-  content: "\e916";
-}
-.icon-switch-camera:before {
-  content: "\e921";
-}
-.icon-share-desktop:before {
-  content: "\e917";
-}
-.icon-camera:before {
-  content: "\e918";
-}
-.icon-camera-disabled:before {
-  content: "\e919";
-}
-.icon-volume:before {
-  content: "\e91a";
-}
-.icon-presentation:before {
-  content: "\e603";
-}
-.icon-visibility:before {
-  content: "\e923";
-}
-.icon-visibility-off:before {
-  content: "\e924";
+.icon-stop:before {
+    content: "\f04d";
 }
+.icon-dominant-speaker:before {
+    content: "\f0a1";
+}

css/_toolbars.scss

@@ -23,244 +23,193 @@
  * TODO: when the old filmstrip has been removed, remove the "new-" prefix.
  */
 .new-toolbox {
+    background-color: $newToolbarBackgroundColor;
     bottom: calc((#{$newToolbarSize} * 2) * -1);
+    box-sizing: border-box;
+    display: flex;
+    justify-content: space-between;
     left: 0;
+    margin-left: auto;
+    margin-right: auto;
+    padding: 12px 8px;
     position: absolute;
     right: 0;
     transition: bottom .3s ease-in;
     width: 100%;
-
+    z-index: $toolbarZ;
 
     &.visible {
         bottom: 0;
-        .toolbox-background {
-            bottom: 0px;
-        }
     }
 
     &.no-buttons {
         display: none;
     }
 
-    .toolbox-background {
-        background-image: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
-        transition: bottom .3s ease-in;
-        height: 160px;
-        width: 100%;
-        bottom: -160px;
-        position: absolute;
-        z-index: $toolbarBackgroundZ;
+    .button-group-center,
+    .button-group-left,
+    .button-group-right {
+        display: flex;
+        width: 33%;
     }
 
-    .toolbox-content {
-        box-sizing: border-box;
-        display: flex;
-        justify-content: space-between;
-        margin-left: auto;
-        margin-right: auto;
-        padding: 20px 16px;
-        position: relative;
+    .button-group-center {
+        justify-content: center;
+    }
+
+    .button-group-right {
+        justify-content: flex-end;
+    }
+
+    i {
+        border-radius: 5px;
+        cursor: pointer;
+        display: block;
+        font-size: inherit;
+        height: 100%;
+        line-height: inherit;
         width: 100%;
-        z-index: $toolbarZ;
+    }
 
-        .button-group-center,
-        .button-group-left,
-        .button-group-right {
+    i:hover {
+        background-color: $newToolbarButtonHoverColor;
+    }
+
+    i.toggled {
+        background: $newToolbarButtonToggleColor;
+    }
+
+    i.toggled:hover {
+        background-color: $newToolbarButtonHoverColor;
+    }
+
+    i.disabled {
+        cursor: initial;
+        color: #3b475c;
+    }
+
+    .disabled i {
+        cursor: initial;
+        color: #3b475c;
+    }
+
+    i.disabled:hover {
+        background-color: initial;
+    }
+
+    .icon-hangup {
+        color: $hangupColor;
+        font-size: $newToolbarHangupFontSize;
+    }
+
+    .overflow-menu {
+        font-size: 1.2em;
+        list-style-type: none;
+        /**
+         * Undo atlaskit padding by reducing margins.
+         */
+        margin: -15px -24px;
+        padding: 4px 0;
+
+        .overflow-menu-item {
+            align-items: center;
+            color: #B8C7E0;
+            cursor: pointer;
             display: flex;
-            width: 33%;
-        }
+            font-size: 14px;
+            height: 22px;
+            padding: 5px 12px;
 
-        .button-group-center {
-            justify-content: center;
-            .toolbox-icon {
-                margin: 0px 4px;
-            }
-        }
-
-        .button-group-right {
-            justify-content: flex-end;
-        }
-
-        i {
-            border-radius: 5px;
-            cursor: pointer;
-            display: block;
-            font-size: inherit;
-            height: 100%;
-            line-height: inherit;
-            width: 100%;
-        }
-
-        i:hover {
-            background: $newToolbarButtonHoverColor;
-        }
-
-        i.toggled {
-            background: $newToolbarButtonToggleColor;
-        }
-
-        i.toggled:hover {
-            background: $newToolbarButtonHoverColor;
-        }
-
-        .icon-hangup {
-            background-color: #e12d2d;
-            color: #fff;
-            border-radius: 50%;
-            width: 40px;
-            height: 40px;
-
-            &:hover {
-                background-color: #e54b4b;
-            }
-        }
-        i.disabled, .disabled i {
-            cursor: initial;
-            color: #fff;
-            background-color: #a4b8d1;
-        }
-
-        .icon-mic-disabled, .icon-microphone, .icon-camera-disabled, .icon-camera {
-            background-color: #fff;
-            color: #5e6d7a;
-            border-radius: 50%;
-            border: 1px solid #d1dbe8;
-            width: 38px;
-            height: 38px;
-
-            &:hover {
-                background-color: #daebfa;
-                border: 1px solid #daebfa;
-            }
-
-            &.toggled {
-                background: #2a3a4b;
-                color: #fff;
-                border: 1px solid #5e6d7a;
-
-                &:hover {
-                    background-color: #5e6d7a;
-                }
-            }
-
-            &.disabled, .disabled & {
-                cursor: initial;
-                color: #fff;
-                background-color: #a4b8d1;
-            }
-        }
-
-        .overflow-menu {
-            font-size: 1.2em;
-            list-style-type: none;
-            background-color: $overflowMenuBG;
-            /**
-             * Undo atlaskit padding by reducing margins.
-             */
-            margin: -16px -24px;
-            padding: 4px 0;
-
-            .overflow-menu-item {
-                align-items: center;
-                color: $overflowMenuItemColor;
-                cursor: pointer;
+            div {
                 display: flex;
-                font-size: 14px;
-                height: 22px;
-                padding: 5px 12px;
-
-                div {
-                    display: flex;
-                    flex-direction: row;
-                    align-items: center;
-                }
-
-                &:hover {
-                    background-color: $overflowMenuItemHoverBG;
-                    color: $overflowMenuItemHoverColor;
-                }
-
-                &.unclickable {
-                    cursor: default;
-                }
-                &.unclickable:hover {
-                    background: inherit;
-                }
-                &.disabled {
-                    cursor: initial;
-                    color: #3b475c;
-                }
+                flex-direction: row;
+                align-items: center;
             }
 
-            .beta-tag {
-                background: $overflowMenuItemColor;
-                border-radius: 2px;
-                color: $overflowMenuBG;
-                font-size: 11px;
-                font-weight: bold;
-                margin-left: 8px;
-                padding: 0 6px;
+            &:hover {
+                background: #313D52;
             }
 
-            .overflow-menu-item-icon {
-                margin-right: 10px;
-
-                i {
-                    display: inline;
-                    font-size: 24px;
-                }
-
-                i:hover {
-                    background-color: initial;
-                }
-
-                img {
-                    max-width: 24px;
-                    max-height: 24px;
-                }
+            &.unclickable {
+                cursor: default;
             }
-
-            .profile-text {
-                max-width: 150px;
-                text-overflow: ellipsis;
-                overflow: hidden;
-                white-space: nowrap;
+            &.unclickable:hover {
+                background: inherit;
+            }
+            &.disabled {
+                cursor: initial;
+                color: #3b475c;
             }
         }
 
-        .toolbox-button {
-            color: $toolbarButtonColor;
-            cursor: pointer;
-            display: inline-block;
-            line-height: $newToolbarSize;
-            margin: 0 8px;
-            text-align: center;
+        .beta-tag {
+            background: #B8C7E0;
+            border-radius: 2px;
+            color: $newToolbarBackgroundColor;
+            font-size: 11px;
+            font-weight: bold;
+            margin-left: 8px;
+            padding: 0 6px;
         }
 
-        .toolbar-button-with-badge {
-            position: relative;
+        .overflow-menu-item-icon {
+            margin-right: 10px;
 
-            .badge-round {
-                bottom: -5px;
-                font-size: 12px;
-                line-height: 20px;
-                min-width: 20px;
-                pointer-events: none;
-                position: absolute;
-                right: -5px;
+            i {
+                display: inline;
+                font-size: 24px;
+            }
+
+            i:hover {
+                background-color: initial;
+            }
+
+            img {
+                max-width: 24px;
+                max-height: 24px;
             }
         }
 
-        .toolbox-button-wth-dialog {
-            display: inline-block;
+        .profile-text {
+            max-width: 150px;
+            text-overflow: ellipsis;
+            overflow: hidden;
+            white-space: nowrap;
         }
+    }
 
-        .toolbox-icon {
-            height: $newToolbarSize;
-            font-size: 24px;
-            width: $newToolbarSize;
+    .toolbox-button {
+        color: $toolbarButtonColor;
+        cursor: pointer;
+        display: inline-block;
+        line-height: $newToolbarSize;
+        margin: 0 4px;
+        text-align: center;
+    }
+
+    .toolbar-button-with-badge {
+        position: relative;
+
+        .badge-round {
+            bottom: -5px;
+            font-size: 12px;
+            line-height: 20px;
+            min-width: 20px;
+            pointer-events: none;
+            position: absolute;
+            right: -5px;
         }
     }
+
+    .toolbox-button-wth-dialog {
+        display: inline-block;
+    }
+
+    .toolbox-icon {
+        height: $newToolbarSize;
+        font-size: 24px;
+        width: $newToolbarSize;
+    }
 }
 
 .always-on-top-toolbox,
@@ -277,15 +226,15 @@
     }
 
     i:hover {
-        background-color: $AOTToolbarButtonHoverColor;
+        background-color: $newToolbarButtonHoverColor;
     }
 
     i.toggled {
-        background: $AOTToolbarButtonToggleColor;
+        background: $newToolbarButtonToggleColor;
     }
 
     i.toggled:hover:not(.disabled) {
-        background-color: $AOTToolbarButtonHoverColor;
+        background-color: $newToolbarButtonHoverColor;
     }
 
     .icon-hangup {

css/_variables.scss

@@ -34,19 +34,13 @@ $defaultDarkColor: #2b3d5c;
  */
 $defaultToolbarSize: 50px;
 $newToolbarBackgroundColor: rgba(22, 38, 55, 0.8);
-$newToolbarButtonHoverColor: rgba(255, 255, 255, 0.15);
-$newToolbarButtonToggleColor: rgba(255, 255, 255, 0.2);
-$AOTToolbarButtonHoverColor: rgba(14, 20, 35, 0.6);
-$AOTToolbarButtonToggleColor: rgba(14, 20, 35, 1);
+$newToolbarButtonHoverColor: rgba(14, 20, 35, 0.6);
+$newToolbarButtonToggleColor: rgba(14, 20, 35, 1);
 $newToolbarFontSize: 24px;
 $newToolbarHangupFontSize: 32px;
 $newToolbarSize: 40px;
 $newToolbarSizeWithPadding: calc(#{$newToolbarSize} + 24px);
 $toolbarTitleFontSize: 19px;
-$overflowMenuBG: initial;
-$overflowMenuItemHoverBG: #313D52;
-$overflowMenuItemHoverColor: #B8C7E0;
-$overflowMenuItemColor: #B8C7E0;
 
 /**
  * Video layout
@@ -63,7 +57,6 @@ $audioLevelShadow: rgba(9, 36, 77, 0.9);
 $videoStateIndicatorColor: $defaultColor;
 $videoStateIndicatorBackground: $toolbarBackground;
 $videoStateIndicatorSize: 40px;
-$remoteVideoMenuIconLeft: initial;
 
 /**
  * Feedback Modal
@@ -98,7 +91,6 @@ $zindex0: 0;
 $zindex1: 1;
 $zindex2: 2;
 $zindex3: 3;
-$toolbarBackgroundZ: 4;
 $filmstripVideosZ: 5;
 $zindex10: 10;
 $reloadZ: 20;

css/_videolayout_default.scss

@@ -412,7 +412,6 @@
 
     >i{
         cursor: hand;
-        margin-left: $remoteVideoMenuIconLeft;
     }
 }
 .remote-video-menu-trigger {

debian/control

@@ -21,7 +21,7 @@ Description: WebRTC JavaScript video conferences
 
 Package: jitsi-meet-web-config
 Architecture: all
-Depends: openssl, openjdk-8-jre-headless | nginx | nginx-extras | apache2
+Depends: openssl, openjdk-8-jre-headless | nginx | apache2
 Description: Configuration for web serving of Jitsi Meet
  Jitsi Meet is a WebRTC JavaScript application that uses Jitsi
  Videobridge to provide high quality, scalable video conferences.

debian/jitsi-meet-web-config.postinst

@@ -52,11 +52,7 @@ case "$1" in
         db_set jitsi-meet/jvb-hostname $JVB_HOSTNAME
 
         NGINX_INSTALL_CHECK="$(dpkg-query -f '${Status}' -W 'nginx' 2>/dev/null | awk '{print $3}' || true)"
-        NGINX_EXTRAS_INSTALL_CHECK="$(dpkg-query -f '${Status}' -W 'nginx-extras' 2>/dev/null | awk '{print $3}' || true)"
-        if [ "$NGINX_INSTALL_CHECK" = "installed" ] \
-           || [ "$NGINX_INSTALL_CHECK" = "unpacked" ] \
-           || [ "$NGINX_EXTRAS_INSTALL_CHECK" = "installed" ] \
-           || [ "$NGINX_EXTRAS_INSTALL_CHECK" = "unpacked" ] ; then
+        if [ "$NGINX_INSTALL_CHECK" = "installed" ] || [ "$NGINX_INSTALL_CHECK" = "unpacked" ] ; then
             FORCE_NGINX="true"
         fi
         APACHE_INSTALL_CHECK="$(dpkg-query -f '${Status}' -W 'apache2' 2>/dev/null | awk '{print $3}' || true)"

doc/api.md

@@ -1,6 +1,6 @@
 # Jitsi Meet API
 
-You can use the Jitsi Meet API to embed Jitsi Meet in to your application. You are also welcome to use it for embedding the globally distributed and highly available deployment on meet.jit.si itself. The only thing we ask for in that case is that you please DO NOT remove the jitsi.org logo from the top left corner.
+You can use the Jitsi Meet API to embed Jitsi Meet in to your application.
 
 ## Installation
 
@@ -78,11 +78,6 @@ The `command` parameter is String object with the name of the command. The follo
 api.executeCommand('displayName', 'New Nickname');
 ```
 
-* **subject** - Sets the subject of the conference. This command requires one argument - the new subject to be set.
-```javascript
-api.executeCommand('subject', 'New Conference Subject');
-```
-
 * **toggleAudio** - Mutes / unmutes the audio for the local participant. No arguments are required.
 ```javascript
 api.executeCommand('toggleAudio')
@@ -256,14 +251,6 @@ changes. The listener will receive an object with the following structure:
 
 * **readyToClose** - event notification fired when Jitsi Meet is ready to be closed (hangup operations are completed).
 
-* **subjectChange** - event notifications about subject of conference changes. 
-The listener will receive an object with the following structure:
-```javascript
-{
-"subject": subject // the new subject
-}
-```
-
 You can also add multiple event listeners by using `addEventListeners`.
 This method requires one argument of type Object. The object argument must
 have the names of the events as keys and the listeners of the events as values.

fonts/jitsi.svg

@@ -8,33 +8,43 @@
 <missing-glyph horiz-adv-x="1024" />
 <glyph unicode="&#x20;" d="" />
 <glyph unicode="&#xe0b7;" glyph-name="chat-unread" d="M768 682v86h-512v-86h512zM598 426v86h-342v-86h342zM256 640v-86h512v86h-512zM854 938c46 0 84-38 84-84v-512c0-46-38-86-84-86h-598l-170-170v768c0 46 38 84 84 84h684z" />
-<glyph unicode="&#xe145;" glyph-name="invite" d="M810 470h-256v-256h-84v256h-256v84h256v256h84v-256h256v-84z" />
-<glyph unicode="&#xe146;" glyph-name="add" d="M810 470h-256v-256h-84v256h-256v84h256v256h84v-256h256v-84z" />
+<glyph unicode="&#xe0cd;" glyph-name="phone" d="M282 564c62-120 162-220 282-282l94 94c12 12 30 16 44 10 48-16 100-24 152-24 24 0 42-18 42-42v-150c0-24-18-42-42-42-400 0-726 326-726 726 0 24 18 42 42 42h150c24 0 42-18 42-42 0-54 8-104 24-152 4-14 2-32-10-44z" />
+<glyph unicode="&#xe145;" glyph-name="add" d="M810 470h-256v-256h-84v256h-256v84h256v256h84v-256h256v-84z" />
 <glyph unicode="&#xe1aa;" glyph-name="bluetooth" d="M550 328l-80 82v-162zM470 776v-162l80 82zM670 696l-184-184 184-184-244-242h-42v324l-196-196-60 60 238 238-238 238 60 60 196-196v324h42zM834 738c40-64 62-142 62-222 0-84-24-160-66-226l-50 50c26 52 42 110 42 172s-16 120-42 172zM608 512l98 98c12-30 20-64 20-98s-8-70-20-100z" />
 <glyph unicode="&#xe310;" glyph-name="headset" d="M512 982c212 0 384-172 384-384v-300c0-70-58-128-128-128h-128v342h170v86c0 166-132 298-298 298s-298-132-298-298v-86h170v-342h-128c-70 0-128 58-128 128v300c0 212 172 384 384 384z" />
+<glyph unicode="&#xe408;" glyph-name="navigate_before" d="M658 708l-196-196 196-196-60-60-256 256 256 256z" />
 <glyph unicode="&#xe409;" glyph-name="navigate_next" d="M426 768l256-256-256-256-60 60 196 196-196 196z" />
+<glyph unicode="&#xe425;" glyph-name="timer" d="M512 170c166 0 298 134 298 300s-132 298-298 298-298-132-298-298 132-300 298-300zM812 708c52-66 84-148 84-238 0-212-172-384-384-384s-384 172-384 384 172 384 384 384c90 0 174-34 240-86l60 62c22-18 42-38 60-60zM470 426v256h84v-256h-84zM640 982v-86h-256v86h256z" />
 <glyph unicode="&#xe5c4;" glyph-name="arrow_back" d="M854 554v-84h-520l238-240-60-60-342 342 342 342 60-60-238-240h520z" />
 <glyph unicode="&#xe5cd;" glyph-name="close" d="M810 750l-238-238 238-238-60-60-238 238-238-238-60 60 238 238-238 238 60 60 238-238 238 238z" />
 <glyph unicode="&#xe5d2;" glyph-name="menu" d="M128 768h768v-86h-768v86zM128 470v84h768v-84h-768zM128 256v86h768v-86h-768z" />
 <glyph unicode="&#xe5d4;" glyph-name="thumb-menu" d="M512 342c46 0 86-40 86-86s-40-86-86-86-86 40-86 86 40 86 86 86zM512 598c46 0 86-40 86-86s-40-86-86-86-86 40-86 86 40 86 86 86zM512 682c-46 0-86 40-86 86s40 86 86 86 86-40 86-86-40-86-86-86z" />
 <glyph unicode="&#xe603;" glyph-name="presentation" horiz-adv-x="1088" d="M952.495 1019.065h-818.689c-72.81 0-132.183-60.63-132.183-135.162v-750.719c0-74.473 59.372-135.101 132.183-135.101h818.686c72.936 0 132.314 60.625 132.314 135.101v750.722c0.003 74.532-59.378 135.159-132.311 135.159zM946.346 139.651h-806.14v737.822h806.015l0.126-737.822zM685.753 738.544h216.911v-566.758h-216.911v566.758zM428.672 610.002h216.911v-438.216h-216.911v438.216zM172.339 481.46h216.161v-309.677h-216.161v309.677z" />
+<glyph unicode="&#xe613;" glyph-name="recDisable" horiz-adv-x="1140" d="M1123.444 1003.015c-23.593 26.481-64.131 28.989-90.74 5.395l-1008.269-893.436c-26.609-23.468-28.991-64.131-5.46-90.676 12.674-14.306 30.308-21.649 48.126-21.649 15.123 0 30.372 5.401 42.544 16.195l130.045 115.22c90.743-81.844 210.569-132.165 342.473-132.101 282.816 0.061 510.913 227.969 511.287 510.972 0.126 109.934-34.682 211.367-93.499 294.72l118.088 104.625c26.483 23.526 28.997 64.129 5.404 90.735zM944.422 513.818c0.128-200.922-161.896-363.201-362.509-362.952-87.56 0.123-167.573 31.151-230.061 82.569l331.277 293.509v-73.176c1.071-60.993 32.696-92.18 94.944-93.692 61.997 1.512 93.686 32.763 95.131 93.756v41.096h-72.227v-47.499c0.251-4.642-0.564-10.607-2.511-17.949-1.25-3.261-3.448-6.020-6.525-8.093-3.197-2.572-7.845-3.828-13.868-3.828-10.543 0.31-17.132 4.268-19.827 11.921-1.068 3.512-1.947 6.905-2.508 10.163-0.254 2.887-0.377 5.532-0.377 7.786v143.511l42.477 37.634c0.215-0.432 0.452-0.851 0.63-1.303 1.947-6.467 2.762-12.799 2.511-19.076v-36.772h72.227v30.121c-0.246 31.245-9.086 54.699-26.363 70.447l40.711 36.069c35.787-56.055 56.803-122.585 56.867-194.244zM239.795 395.47c-12.613 37.023-19.827 76.557-19.827 117.913-0.19 200.236 161.584 362.009 361.945 362.135 56.853 0 110.313-13.302 158.133-36.398l117.846 104.421c-79.444 50.952-173.758 80.817-275.292 80.948-283.377 0.181-511.354-227.729-511.789-511.675-0.126-79.567 18.636-154.679 51.137-221.882l117.848 104.538zM388.576 690.020h-97.514v-249.057l72.23 64.070v0.689h0.815l117.72 104.418c0 0.564 0.123 0.94 0.123 1.509 0.753 53.898-30.369 80.069-93.374 78.37zM405.959 625.517c1.942-2.767 3.074-6.469 3.323-11.112 0.312-4.452 0.438-9.6 0.438-15.246 0.251-10.916-0.689-19.83-2.949-26.985-2.952-7.594-10.983-11.357-24.159-11.357h-19.325v74.043h15.31c7.842 0 13.865-0.683 18.072-2.19 4.397-1.573 7.468-3.953 9.29-7.153z" />
+<glyph unicode="&#xe614;" glyph-name="recEnable" horiz-adv-x="1142" d="M581.278 1025.708c284.857-0.19 514.807-230.517 514.427-514.997-0.378-285.047-230.073-514.553-514.869-514.615-284.541-0.062-515.311 230.517-514.933 514.422 0.439 285.936 230.009 515.439 515.375 515.19zM580.579 875.756c-201.764-0.123-364.666-163.032-364.478-364.663 0-202.018 162.524-364.735 364.478-364.984 202.018-0.316 365.174 163.030 365.048 365.423-0.252 201.767-163.156 364.35-365.048 364.224zM287.698 688.907h98.196c63.442 1.767 94.785-24.518 94.027-78.863 0.254-19.081-2.211-34.882-7.456-47.521-6.005-12.508-18.706-21.988-38.167-28.181v-0.819c28.373-6.259 43.031-23.573 43.981-51.946v-57.689c0-11.247 0.254-22.813 0.758-34.756 0.819-12.005 3.033-20.979 6.696-27.043h-71.846c-3.727 6.064-6.128 15.038-7.14 27.043-1.012 11.943-1.454 23.509-1.138 34.756v52.321c0 9.603-2.214 16.553-6.573 20.979-4.675 4.107-12.701 6.19-24.012 6.19h-14.599v-141.291h-72.73v326.82zM360.428 558.861h19.463c13.271 0 21.359 3.794 24.331 11.375 2.276 7.204 3.221 16.304 2.969 27.171 0 5.815-0.126 10.867-0.442 15.418-0.252 4.675-1.392 8.404-3.352 11.247-1.831 3.157-4.926 5.561-9.352 7.14-4.233 1.454-10.299 2.211-18.2 2.211h-15.418v-74.564zM498.372 688.907h162.082v-62.687h-89.35v-65.587h78.103v-62.685h-78.103v-73.11h92.822v-62.749h-165.557v326.818zM682.507 599.999c0.316 31.782 9.416 55.542 27.425 71.407 17.44 15.29 40.185 22.936 68.181 22.936 28.247 0 51.119-7.646 68.623-23 17.82-15.798 26.92-39.623 27.171-71.407v-30.333h-72.73v37.031c0.254 6.192-0.57 12.639-2.527 19.209-1.264 3.157-3.475 5.938-6.573 8.214-3.221 1.515-7.898 2.404-13.964 2.404-10.615-0.316-17.249-3.855-19.967-10.618-2.211-6.573-3.223-13.017-2.907-19.209v-161.956c0-2.273 0.126-4.865 0.38-7.772 0.568-3.411 1.454-6.824 2.527-10.233 2.717-7.775 9.352-11.756 19.967-12.007 6.067 0 10.744 1.261 13.964 3.791 3.098 2.15 5.309 4.867 6.573 8.216 1.96 7.33 2.782 13.33 2.527 18.007v47.837h72.73v-41.328c-1.451-61.547-33.364-93.015-95.794-94.469-62.685 1.454-94.53 32.922-95.607 94.343v148.937z" />
 <glyph unicode="&#xe616;" glyph-name="event_note" d="M598 426v-84h-300v84h300zM810 214v468h-596v-468h596zM810 896c46 0 86-40 86-86v-596c0-46-40-86-86-86h-596c-48 0-86 40-86 86v596c0 46 38 86 86 86h42v86h86v-86h340v86h86v-86h42zM726 598v-86h-428v86h428z" />
 <glyph unicode="&#xe61d;" glyph-name="phone-talk" d="M640 512c0 70-58 128-128 128v86c118 0 214-96 214-214h-86zM810 512c0 166-132 298-298 298v86c212 0 384-172 384-384h-86zM854 362c24 0 42-18 42-42v-150c0-24-18-42-42-42-400 0-726 326-726 726 0 24 18 42 42 42h150c24 0 42-18 42-42 0-54 8-104 24-152 4-14 2-32-10-44l-94-94c62-122 162-220 282-282l94 94c12 12 30 14 44 10 48-16 98-24 152-24z" />
 <glyph unicode="&#xe80b;" glyph-name="public" d="M764 282c56 60 90 142 90 230 0 142-88 266-214 316v-18c0-46-40-84-86-84h-84v-86c0-24-20-42-44-42h-84v-86h256c24 0 42-18 42-42v-128h42c38 0 70-26 82-60zM470 174v82c-46 0-86 40-86 86v42l-204 204c-6-24-10-50-10-76 0-174 132-318 300-338zM512 938c236 0 426-190 426-426s-190-426-426-426-426 190-426 426 190 426 426 426z" />
 <glyph unicode="&#xe89e;" glyph-name="open_in_new" d="M598 896h298v-298h-86v152l-418-418-60 60 418 418h-152v86zM810 214v298h86v-298c0-46-40-86-86-86h-596c-48 0-86 40-86 86v596c0 46 38 86 86 86h298v-86h-298v-596h596z" />
 <glyph unicode="&#xe8b3;" glyph-name="restore" d="M512 682h64v-180l150-90-32-52-182 110v212zM554 896c212 0 384-172 384-384s-172-384-384-384c-106 0-200 42-270 112l60 62c54-54 128-88 210-88 166 0 300 132 300 298s-134 298-300 298-298-132-298-298h128l-172-172-4 6-166 166h128c0 212 172 384 384 384z" />
 <glyph unicode="&#xe900;" glyph-name="AUD" d="M512 0c-282.77 0-512 229.23-512 512s229.23 512 512 512c282.77 0 512-229.23 512-512s-229.23-512-512-512zM308.25 387.3h57.225l-87.675 252.525h-62.125l-87.675-252.525h53.025l19.425 60.2h88.725l19.075-60.2zM461.9 639.825h-52.85v-165.375c0-56 41.125-93.625 105.7-93.625 64.75 0 105.875 37.625 105.875 93.625v165.375h-52.85v-159.95c0-31.85-19.075-52.15-53.025-52.15-33.775 0-52.85 20.3-52.85 52.15v159.95zM682.225 640v-252.7h99.4c75.6 0 118.475 46.025 118.475 128.1 0 79.1-43.4 124.6-118.475 124.6h-99.4zM735.075 594.85v-162.4h38.15c46.725 0 72.975 28.7 72.975 82.075 0 51.1-27.125 80.325-72.975 80.325h-38.15zM243.5 587.325l-31.675-99.050h66.15l-31.325 99.050h-3.15z" />
+<glyph unicode="&#xe901;" glyph-name="avatar" d="M512 204c106 0 200 56 256 138-2 84-172 132-256 132-86 0-254-48-256-132 56-82 150-138 256-138zM512 810c-70 0-128-58-128-128s58-128 128-128 128 58 128 128-58 128-128 128zM512 938c236 0 426-190 426-426s-190-426-426-426-426 190-426 426 190 426 426 426z" />
+<glyph unicode="&#xe902;" glyph-name="download" d="M726 470h-128v170h-172v-170h-128l214-214zM826 596c110-8 198-100 198-212 0-118-96-214-214-214h-554c-142 0-256 114-256 256 0 132 100 240 228 254 54 102 160 174 284 174 156 0 284-110 314-258z" />
 <glyph unicode="&#xe903;" glyph-name="mic-camera-combined" d="M756.704 628.138l267.296 202.213v-635.075l-267.296 202.213v-191.923c0-12.085-11.296-21.863-25.216-21.863h-706.272c-13.92 0-25.216 9.777-25.216 21.863v612.25c0 12.085 11.296 21.863 25.216 21.863h706.272c13.92 0 25.216-9.777 25.216-21.863v-189.679zM371.338 376.228c47.817 0 86.529 40.232 86.529 89.811v184.835c0 49.651-38.713 89.883-86.529 89.883-47.788 0-86.515-40.232-86.515-89.883v-184.835c0-49.579 38.756-89.811 86.515-89.811v0zM356.754 314.070v-32.78h33.718v33.412c73.858 9.606 131.235 73.73 131.235 151.351v88.232h-30.636v-88.232c0-67.57-53.696-122.534-119.734-122.534-66.024 0-119.691 54.964-119.691 122.534v88.232h-30.636v-88.232c0-79.215 59.674-144.502 135.744-151.969v-0.014z" />
 <glyph unicode="&#xe904;" glyph-name="kick" d="M512 810l284-426h-568zM214 298h596v-84h-596v84z" />
 <glyph unicode="&#xe905;" glyph-name="hangup" d="M512 640c-68 0-134-10-196-30v-132c0-16-10-34-24-40-42-20-80-46-114-78-8-8-18-12-30-12s-22 4-30 12l-106 106c-8 8-12 18-12 30s4 22 12 30c130 124 306 200 500 200s370-76 500-200c8-8 12-18 12-30s-4-22-12-30l-106-106c-8-8-18-12-30-12s-22 4-30 12c-34 32-72 58-114 78-14 6-24 20-24 38v132c-62 20-128 32-196 32z" />
 <glyph unicode="&#xe906;" glyph-name="chat" d="M854 342v512h-684v-598l86 86h598zM854 938c46 0 84-38 84-84v-512c0-46-38-86-84-86h-598l-170-170v768c0 46 38 84 84 84h684z" />
+<glyph unicode="&#xe907;" glyph-name="edit" d="M884 724l-78-78-160 160 78 78c16 16 44 16 60 0l100-100c16-16 16-44 0-60zM128 288l472 472 160-160-472-472h-160v160z" />
 <glyph unicode="&#xe908;" glyph-name="share-doc" d="M554 640h236l-236 234v-234zM682 426v86h-340v-86h340zM682 256v86h-340v-86h340zM598 938l256-256v-512c0-46-40-84-86-84h-512c-46 0-86 38-86 84l2 684c0 46 38 84 84 84h342z" />
 <glyph unicode="&#xe909;" glyph-name="ninja" d="M330.667 469.333c-0.427 14.933 6.4 29.44 17.92 39.253 32-6.827 61.867-20.053 88.747-39.253 0-29.013-23.893-52.907-53.333-52.907s-52.907 23.467-53.333 52.907zM586.667 469.333c26.88 18.773 56.747 32 88.747 38.827 11.52-9.813 18.347-24.32 17.92-38.827 0-29.867-23.893-53.76-53.333-53.76s-53.333 23.893-53.333 53.76v0zM512 640c-118.187 1.707-234.667-27.733-338.347-85.333l-2.987-42.667c0-52.48 12.373-104.107 35.84-151.040 101.12 15.36 203.093 23.040 305.493 23.040s204.373-7.68 305.493-23.040c23.467 46.933 35.84 98.56 35.84 151.040l-2.987 42.667c-103.68 57.6-220.16 87.040-338.347 85.333zM512 938.667c235.641 0 426.667-191.025 426.667-426.667s-191.025-426.667-426.667-426.667c-235.641 0-426.667 191.025-426.667 426.667s191.025 426.667 426.667 426.667z" />
+<glyph unicode="&#xe90a;" glyph-name="star-full" d="M512 288l-264-160 70 300-232 202 306 26 120 282 120-282 306-26-232-202 70-300z" />
 <glyph unicode="&#xe90b;" glyph-name="full-screen" d="M598 810h212v-212h-84v128h-128v84zM726 298v128h84v-212h-212v84h128zM214 598v212h212v-84h-128v-128h-84zM298 426v-128h128v-84h-212v212h84z" />
 <glyph unicode="&#xe90c;" glyph-name="exit-full-screen" d="M682 682h128v-84h-212v212h84v-128zM598 214v212h212v-84h-128v-128h-84zM342 682v128h84v-212h-212v84h128zM214 342v84h212v-212h-84v128h-128z" />
 <glyph unicode="&#xe90d;" glyph-name="security" d="M768 170v428h-512v-428h512zM768 682c46 0 86-38 86-84v-428c0-46-40-84-86-84h-512c-46 0-86 38-86 84v428c0 46 40 84 86 84h388v86c0 72-60 132-132 132s-132-60-132-132h-82c0 118 96 214 214 214s214-96 214-214v-86h42zM512 298c-46 0-86 40-86 86s40 86 86 86 86-40 86-86-40-86-86-86z" />
 <glyph unicode="&#xe90e;" glyph-name="security-locked" d="M768 170v428h-512v-428h512zM380 768v-86h264v86c0 72-60 132-132 132s-132-60-132-132zM768 682c46 0 86-38 86-84v-428c0-46-40-84-86-84h-512c-46 0-86 38-86 84v428c0 46 40 84 86 84h42v86c0 118 96 214 214 214s214-96 214-214v-86h42zM512 298c-46 0-86 40-86 86s40 86 86 86 86-40 86-86-40-86-86-86z" />
+<glyph unicode="&#xe90f;" glyph-name="reload" d="M512 256v128l170-170-170-172v128c-188 0-342 154-342 342 0 66 20 130 54 182l62-62c-20-36-30-76-30-120 0-142 114-256 256-256zM512 854c188 0 342-154 342-342 0-66-20-130-54-182l-62 62c20 36 30 76 30 120 0 142-114 256-256 256v-128l-170 170 170 172v-128z" />
 <glyph unicode="&#xe910;" glyph-name="microphone" d="M738 554h72c0-146-116-266-256-286v-140h-84v140c-140 20-256 140-256 286h72c0-128 108-216 226-216s226 88 226 216zM512 426c-70 0-128 58-128 128v256c0 70 58 128 128 128s128-58 128-128v-256c0-70-58-128-128-128z" />
+<glyph unicode="&#xe911;" glyph-name="mic-empty" d="M738 554h72c0-146-116-266-256-286v-140h-84v140c-140 20-256 140-256 286h72c0-128 108-216 226-216s226 88 226 216zM460 814v-264c0-28 24-50 52-50s50 22 50 50l2 264c0 28-24 52-52 52s-52-24-52-52zM512 426c-70 0-128 58-128 128v256c0 70 58 128 128 128s128-58 128-128v-256c0-70-58-128-128-128z" />
 <glyph unicode="&#xe912;" glyph-name="mic-disabled" d="M182 896l714-714-54-54-178 178c-32-20-72-32-110-38v-140h-84v140c-140 20-256 140-256 286h72c0-128 108-216 226-216 34 0 68 8 98 22l-70 70c-8-2-18-4-28-4-70 0-128 58-128 128v32l-256 256zM640 548l-256 254v8c0 70 58 128 128 128s128-58 128-128v-262zM810 554c0-50-14-98-38-140l-52 54c12 26 18 54 18 86h72z" />
 <glyph unicode="&#xe913;" glyph-name="link" d="M640 426c114 0 342-56 342-170v-86h-684v86c0 114 228 170 342 170zM256 598h128v-86h-128v-128h-86v128h-128v86h128v128h86v-128zM640 512c-94 0-170 76-170 170s76 172 170 172 170-78 170-172-76-170-170-170z" />
 <glyph unicode="&#xe914;" glyph-name="shared-video" d="M512 170c188 0 342 154 342 342s-154 342-342 342-342-154-342-342 154-342 342-342zM512 938c236 0 426-190 426-426s-190-426-426-426-426 190-426 426 190 426 426 426zM426 320v384l256-192z" />
@@ -44,6 +54,8 @@
 <glyph unicode="&#xe918;" glyph-name="camera" d="M726 576l170 170v-468l-170 170v-150c0-24-20-42-44-42h-512c-24 0-42 18-42 42v428c0 24 18 42 42 42h512c24 0 44-18 44-42v-150z" />
 <glyph unicode="&#xe919;" glyph-name="camera-disabled" d="M140 938l756-756-54-54-136 136c-6-4-16-8-24-8h-512c-24 0-42 18-42 42v428c0 24 18 42 42 42h32l-116 116zM896 746v-456l-478 478h264c24 0 44-18 44-42v-150z" />
 <glyph unicode="&#xe91a;" glyph-name="volume" d="M598 886c172-38 298-192 298-374s-126-336-298-374v88c124 36 212 150 212 286s-88 250-212 286v88zM704 512c0-76-42-140-106-172v344c64-32 106-96 106-172zM128 640h170l214 214v-684l-214 214h-170v256z" />
+<glyph unicode="&#xe91b;" glyph-name="contactList" d="M704 746c-46 0-86-38-86-84s40-86 86-86 86 40 86 86-40 84-86 84zM704 512c-82 0-150 68-150 150s68 148 150 148 150-66 150-148-68-150-150-150zM320 746c-46 0-86-38-86-84s40-86 86-86 86 40 86 86-40 84-86 84zM320 512c-82 0-150 68-150 150s68 148 150 148 150-66 150-148-68-150-150-150zM918 278v52c0 24-110 76-214 76-46 0-90-12-128-24 14-16 22-32 22-52v-52h320zM534 278v52c0 24-110 76-214 76s-214-52-214-76v-52h428zM704 470c92 0 278-48 278-140v-116h-940v116c0 92 186 140 278 140 52 0 130-16 192-44 62 28 140 44 192 44z" />
+<glyph unicode="&#xe91c;" glyph-name="toggle-filmstrip" d="M896 896h-768c-46.933 0-85.333-38.4-85.333-85.333v-597.333c0-46.933 38.4-85.333 85.333-85.333h768c46.933 0 85.333 38.4 85.333 85.333v597.333c0 46.933-38.4 85.333-85.333 85.333zM896 213.333h-768v128h768v-128z" />
 <glyph unicode="&#xe91d;" glyph-name="feedback" d="M42.667 128h170.667v512h-170.667v-512zM981.333 597.333c0 46.933-38.4 85.333-85.333 85.333h-269.227l40.533 194.987 1.28 13.653c0 17.493-7.253 33.707-18.773 45.227l-45.227 44.8-280.747-281.173c-15.787-15.36-25.173-36.693-25.173-60.16v-426.667c0-46.933 38.4-85.333 85.333-85.333h384c35.413 0 65.707 21.333 78.507 52.053l128.853 300.8c3.84 9.813 5.973 20.053 5.973 31.147v81.493l-0.427 0.427 0.427 3.413z" />
 <glyph unicode="&#xe91e;" glyph-name="raised-hand" d="M982 790v-620c0-94-78-170-172-170h-310c-46 0-90 18-122 50l-336 342s54 52 56 52c10 8 22 12 34 12 10 0 18-2 26-6 2 0 184-104 184-104v508c0 36 28 64 64 64s64-28 64-64v-300h42v406c0 36 28 64 64 64s64-28 64-64v-406h42v364c0 36 28 64 64 64s64-28 64-64v-364h44v236c0 36 28 64 64 64s64-28 64-64z" />
 <glyph unicode="&#xe91f;" glyph-name="menu-up" d="M512 682l256-256-60-60-196 196-196-196-60 60z" />
@@ -52,14 +64,17 @@
 <glyph unicode="&#xe922;" glyph-name="info" d="M512 938.667c-235.52 0-426.667-191.147-426.667-426.667s191.147-426.667 426.667-426.667 426.667 191.147 426.667 426.667-191.147 426.667-426.667 426.667zM554.667 298.667h-85.333v256h85.333v-256zM554.667 640h-85.333v85.333h85.333v-85.333z" />
 <glyph unicode="&#xe923;" glyph-name="visibility" d="M512 640c70 0 128-58 128-128s-58-128-128-128-128 58-128 128 58 128 128 128zM512 298c118 0 214 96 214 214s-96 214-214 214-214-96-214-214 96-214 214-214zM512 832c214 0 396-132 470-320-74-188-256-320-470-320s-396 132-470 320c74 188 256 320 470 320z" />
 <glyph unicode="&#xe924;" glyph-name="visibility-off" d="M506 640h6c70 0 128-58 128-128v-8zM322 606c-14-28-24-60-24-94 0-118 96-214 214-214 34 0 66 10 94 24l-66 66c-8-2-18-4-28-4-70 0-128 58-128 128 0 10 2 20 4 28zM86 842l54 54 756-756-54-54c-47.968 47.365-96.266 94.401-144 142-58-24-120-36-186-36-214 0-396 132-470 320 34 84 90 156 160 212-39.017 38.983-77.307 78.693-116 118zM512 726c-28 0-54-6-78-16l-92 92c52 20 110 30 170 30 214 0 394-132 468-320-32-80-82-148-146-202l-124 124c10 24 16 50 16 78 0 118-96 214-214 214z" />
-<glyph unicode="&#xe926;" glyph-name="gsm-bars" d="M896 1024c70.692 0 128-57.308 128-128v-768c0-70.692-57.308-128-128-128s-128 57.308-128 128v768c0 70.692 57.308 128 128 128zM512 768c70.692 0 128-57.308 128-128v-512c0-70.692-57.308-128-128-128s-128 57.308-128 128v512c0 70.692 57.308 128 128 128zM128 384v0c70.692 0 128-57.308 128-128v-128c0-70.692-57.308-128-128-128s-128 57.308-128 128v128c0 70.692 57.308 128 128 128v0z" />
+<glyph unicode="&#xe925;" glyph-name="dialpad" d="M512 982c46 0 86-40 86-86s-40-86-86-86-86 40-86 86 40 86 86 86zM512 726c46 0 86-40 86-86s-40-86-86-86-86 40-86 86 40 86 86 86zM768 726c46 0 86-40 86-86s-40-86-86-86-86 40-86 86 40 86 86 86zM768 470c46 0 86-40 86-86s-40-86-86-86-86 40-86 86 40 86 86 86zM512 470c46 0 86-40 86-86s-40-86-86-86-86 40-86 86 40 86 86 86zM768 810c-46 0-86 40-86 86s40 86 86 86 86-40 86-86-40-86-86-86zM256 470c46 0 86-40 86-86s-40-86-86-86-86 40-86 86 40 86 86 86zM256 726c46 0 86-40 86-86s-40-86-86-86-86 40-86 86 40 86 86 86zM256 982c46 0 86-40 86-86s-40-86-86-86-86 40-86 86 40 86 86 86zM512 214c46 0 86-40 86-86s-40-86-86-86-86 40-86 86 40 86 86 86z" />
+<glyph unicode="&#xe926;" glyph-name="gsm-bars-black" d="M896 1024c70.692 0 128-57.308 128-128v-768c0-70.692-57.308-128-128-128s-128 57.308-128 128v768c0 70.692 57.308 128 128 128zM512 768c70.692 0 128-57.308 128-128v-512c0-70.692-57.308-128-128-128s-128 57.308-128 128v512c0 70.692 57.308 128 128 128zM128 384v0c70.692 0 128-57.308 128-128v-128c0-70.692-57.308-128-128-128s-128 57.308-128 128v128c0 70.692 57.308 128 128 128v0z" />
 <glyph unicode="&#xe927;" glyph-name="HD" d="M512 0c-282.77 0-512 229.23-512 512s229.23 512 512 512c282.77 0 512-229.23 512-512s-229.23-512-512-512zM481.359 384v255.823h-54.273v-103.18h-116.813v103.18h-54.273v-255.823h54.273v106.903h116.813v-106.903h54.273zM544.258 640v-256h102.077c77.636 0 121.665 46.626 121.665 129.773 0 80.133-44.569 126.227-121.665 126.227h-102.077zM598.531 594.26v-164.521h39.177c47.983 0 74.94 29.075 74.94 83.147 0 51.767-27.855 81.374-74.94 81.374h-39.177z" />
 <glyph unicode="&#xe928;" glyph-name="LD" d="M512 0c-282.77 0-512 229.23-512 512s229.23 512 512 512c282.77 0 512-229.23 512-512s-229.23-512-512-512zM472.4 433.325h-112.35v206.5h-52.85v-252.525h165.2v46.025zM520.35 640v-252.7h99.4c75.6 0 118.475 46.025 118.475 128.1 0 79.1-43.4 124.6-118.475 124.6h-99.4zM573.2 594.85v-162.4h38.15c46.725 0 72.975 28.7 72.975 82.075 0 51.1-27.125 80.325-72.975 80.325h-38.15z" />
 <glyph unicode="&#xe929;" glyph-name="SD" d="M512 0c-282.77 0-512 229.23-512 512s229.23 512 512 512c282.77 0 512-229.23 512-512s-229.23-512-512-512zM281.6 451.175c1.925-47.075 40.95-76.65 101.15-76.65 63.35 0 102.375 31.15 102.375 82.075 0 39.2-21.875 61.075-72.625 71.75l-30.45 6.475c-29.575 6.3-41.65 15.225-41.65 30.8 0 19.25 17.5 31.5 43.925 31.5 25.55 0 44.1-13.3 46.55-33.25h49.7c-1.575 44.975-40.95 76.125-96.6 76.125-58.275 0-96.6-31.325-96.6-78.925 0-38.5 22.575-62.475 68.6-72.1l32.9-7c30.975-6.65 43.575-15.925 43.575-32.025 0-19.075-19.425-32.375-46.9-32.375-29.75 0-50.4 13.125-52.85 33.6h-51.1zM535 633.7v-252.7h99.4c75.6 0 118.475 46.025 118.475 128.1 0 79.1-43.4 124.6-118.475 124.6h-99.4zM587.85 588.55v-162.4h38.15c46.725 0 72.975 28.7 72.975 82.075 0 51.1-27.125 80.325-72.975 80.325h-38.15z" />
 <glyph unicode="&#xe92a;" glyph-name="camera-take-picture" d="M725.333 512c0-117.821-95.513-213.333-213.333-213.333s-213.333 95.513-213.333 213.333c0 117.821 95.513 213.333 213.333 213.333s213.333-95.513 213.333-213.333zM512 256c141.385 0 256 114.615 256 256s-114.615 256-256 256v0c-141.385 0-256-114.615-256-256s114.615-256 256-256v0zM512 213.333c-164.949 0-298.667 133.718-298.667 298.667s133.718 298.667 298.667 298.667v0c164.949 0 298.667-133.718 298.667-298.667s-133.718-298.667-298.667-298.667v0z" />
 <glyph unicode="&#xe92b;" glyph-name="rec" d="M512 0c-282.77 0-512 229.23-512 512s229.23 512 512 512c282.77 0 512-229.23 512-512s-229.23-512-512-512zM581.333 433.782h-110.595v59.233h104.338v40.332h-104.338v56.87h110.595v43.539h-161.665v-243.512h161.665v43.539zM738.771 384c58.849 0 101.802 36.282 106.029 88.933h-49.717c-4.904-26.832-26.888-44.045-56.143-44.045-38.556 0-62.4 31.895-62.4 83.196s23.844 83.027 62.231 83.027c29.086 0 51.239-18.394 56.143-46.407h49.717c-3.72 52.989-48.026 91.296-105.86 91.296-70.855 0-114.485-48.77-114.485-127.916 0-79.314 43.798-128.084 114.485-128.084zM230.27 478.502h41.769l45.489-88.258h57.834l-51.408 96.19c28.072 11.138 44.306 38.138 44.306 69.189 0 48.432-32.976 78.133-86.582 78.133h-102.478v-243.512h51.070v88.258zM230.27 592.58v-74.927h44.813c25.704 0 40.754 13.838 40.754 37.295 0 23.119-15.896 37.632-41.262 37.632h-44.306z" />
+<glyph unicode="&#xe92c;" glyph-name="live" d="M512 0c-282.77 0-512 229.23-512 512s229.23 512 512 512c282.77 0 512-229.23 512-512s-229.23-512-512-512zM298.225 430.025h-112.35v206.5h-52.85v-252.525h165.2v46.025zM399.025 384v252.525h-52.85v-252.525h52.85zM591.525 384l84.175 252.525h-56.875l-56.35-193.025h-3.15l-57.4 193.025h-59.675l85.4-252.525h63.875zM886.050 429.15h-114.45v61.425h107.975v41.825h-107.975v58.975h114.45v45.15h-167.3v-252.525h167.3v45.15z" />
 <glyph unicode="&#xe92d;" glyph-name="speaker" d="M0 512c0-282.795 229.205-512 512-512s512 229.205 512 512c0 282.795-229.205 512-512 512s-512-229.205-512-512zM525.005 759.362c-20.475 24.944-16.326 61.342 9.268 81.297s62.94 15.911 83.416-9.033c16.036-19.536 38.593-52.97 60.894-97.797 81.621-164.065 89.461-340.992-26.857-506.352-8.384-11.919-17.386-23.69-27.012-35.307-20.593-24.851-57.959-28.727-83.458-8.657s-29.476 56.487-8.882 81.338c7.686 9.275 14.833 18.621 21.455 28.035 88.66 126.041 82.71 260.306 17.953 390.475-10.599 21.305-21.94 40.51-33.198 57.196-6.515 9.657-11.322 16.057-13.578 18.805zM353.479 647.46c-19.353 24.679-15.129 60.448 9.434 79.893s60.164 15.2 79.517-9.479c9.635-12.287 22.577-32.644 35.209-60.034 50.35-109.176 50.35-231.689-33.639-349.612-18.198-25.551-53.566-31.441-78.997-13.157s-31.294 53.819-13.096 79.37c57.564 80.822 57.564 160.581 22.983 235.565-8.601 18.65-16.892 31.691-21.412 37.455z" />
 <glyph unicode="&#xe92e;" glyph-name="tiles-many" d="M113.778 1024h227.556c62.838 0 113.778-50.94 113.778-113.778v-227.556c0-62.838-50.94-113.778-113.778-113.778h-227.556c-62.838 0-113.778 50.94-113.778 113.778v227.556c0 62.838 50.94 113.778 113.778 113.778zM170.667 910.222c-31.419 0-56.889-25.47-56.889-56.889v-113.778c0-31.419 25.47-56.889 56.889-56.889h113.778c31.419 0 56.889 25.47 56.889 56.889v113.778c0 31.419-25.47 56.889-56.889 56.889h-113.778zM113.778 455.111h227.556c62.838 0 113.778-50.94 113.778-113.778v-227.556c0-62.838-50.94-113.778-113.778-113.778h-227.556c-62.838 0-113.778 50.94-113.778 113.778v227.556c0 62.838 50.94 113.778 113.778 113.778zM170.667 341.333c-31.419 0-56.889-25.47-56.889-56.889v-113.778c0-31.419 25.47-56.889 56.889-56.889h113.778c31.419 0 56.889 25.47 56.889 56.889v113.778c0 31.419-25.47 56.889-56.889 56.889h-113.778zM682.667 1024h227.556c62.838 0 113.778-50.94 113.778-113.778v-227.556c0-62.838-50.94-113.778-113.778-113.778h-227.556c-62.838 0-113.778 50.94-113.778 113.778v227.556c0 62.838 50.94 113.778 113.778 113.778zM739.556 910.222c-31.419 0-56.889-25.47-56.889-56.889v-113.778c0-31.419 25.47-56.889 56.889-56.889h113.778c31.419 0 56.889 25.47 56.889 56.889v113.778c0 31.419-25.47 56.889-56.889 56.889h-113.778zM682.667 455.111h227.556c62.838 0 113.778-50.94 113.778-113.778v-227.556c0-62.838-50.94-113.778-113.778-113.778h-227.556c-62.838 0-113.778 50.94-113.778 113.778v227.556c0 62.838 50.94 113.778 113.778 113.778zM739.556 341.333c-31.419 0-56.889-25.47-56.889-56.889v-113.778c0-31.419 25.47-56.889 56.889-56.889h113.778c31.419 0 56.889 25.47 56.889 56.889v113.778c0 31.419-25.47 56.889-56.889 56.889h-113.778z" />
+<glyph unicode="&#xe92f;" glyph-name="tiles-one" d="M170.667 810.667h682.667c47.128 0 85.333-38.205 85.333-85.333v-426.667c0-47.128-38.205-85.333-85.333-85.333h-682.667c-47.128 0-85.333 38.205-85.333 85.333v426.667c0 47.128 38.205 85.333 85.333 85.333zM213.333 725.333c-23.564 0-42.667-19.103-42.667-42.667v-341.333c0-23.564 19.103-42.667 42.667-42.667h597.333c23.564 0 42.667 19.103 42.667 42.667v341.333c0 23.564-19.103 42.667-42.667 42.667h-597.333z" />
 <glyph unicode="&#xe930;" glyph-name="closed_caption" d="M768 554v44c0 24-18 42-42 42h-128c-24 0-44-18-44-42v-172c0-24 20-42 44-42h128c24 0 42 18 42 42v44h-64v-22h-86v128h86v-22h64zM470 554v44c0 24-20 42-44 42h-128c-24 0-42-18-42-42v-172c0-24 18-42 42-42h128c24 0 44 18 44 42v44h-64v-22h-86v128h86v-22h64zM810 854c46 0 86-40 86-86v-512c0-46-40-86-86-86h-596c-48 0-86 40-86 86v512c0 46 38 86 86 86h596z" />
 <glyph unicode="&#xf04b;" glyph-name="play" horiz-adv-x="809" d="M790.857 494.286l-758.857-421.714c-17.714-9.714-32-1.143-32 18.857v841.143c0 20 14.286 28.571 32 18.857l758.857-421.714c17.714-9.714 17.714-25.714 0-35.429z" />
 <glyph unicode="&#xf04d;" glyph-name="stop" horiz-adv-x="878" d="M877.714 914.286v-804.571c0-20-16.571-36.571-36.571-36.571h-804.571c-20 0-36.571 16.571-36.571 36.571v804.571c0 20 16.571 36.571 36.571 36.571h804.571c20 0 36.571-16.571 36.571-36.571z" />

ios/Podfile.lock

@@ -236,7 +236,7 @@ EXTERNAL SOURCES:
 
 SPEC CHECKSUMS:
   boost-for-react-native: 39c7adb57c4e60d6c5479dd8623128eb5b3f0f2c
-  BVLinearGradient: 0d985ec461359c82bc254f26d11008bdae50d17a
+  BVLinearGradient: b0b70acf63ee888829b7c2ebbf6b50e227396e55
   Crashlytics: 07fb167b1694128c1c9a5a5cc319b0e9c3ca0933
   DoubleConversion: bb338842f62ab1d708ceb63ec3d999f0f3d98ecd
   Fabric: f988e33c97f08930a413e08123064d2e5f68d655
@@ -256,18 +256,18 @@ SPEC CHECKSUMS:
   GTMSessionFetcher: 32aeca0aa144acea523e1c8e053089dec2cb98ca
   nanopb: 2901f78ea1b7b4015c860c2fdd1ea2fee1a18d48
   ObjectiveDropboxOfficial: a5afefc83f6467c42c45f2253f583f2ad1ffc701
-  React: adbac0757ce35e92fbd447ab98c810209d27d9b0
-  react-native-background-timer: 0d34748e53a972507c66963490c775321a88f6f2
-  react-native-calendar-events: ee9573e355711ac679e071be70789542431f4ce3
-  react-native-fast-image: 47487b71169aea34868e7b38bf870b6b3f2157c5
-  react-native-keep-awake: eba3137546b10003361b37c761f6c429b59814ae
-  react-native-webrtc: 7152e789c1efefb695fe1166bd9432eff2afd8ac
-  RNGoogleSignin: 361174d9a3090d295b06257162b560d8efc8a6ed
-  RNSound: 53d2fc9c6589bd68daba530262b7560393def3ac
-  RNVectorIcons: d819334932bcda3332deb3d2c8ea4d069e0b98f9
+  React: 1fe0eb13d90b625d94c3b117c274dcfd2e760e11
+  react-native-background-timer: bb7a98c8e97fc7c290de2d423dd09ddb73dcbcbb
+  react-native-calendar-events: fe6fbc8ed337a7423c98f2c9012b25f20444de09
+  react-native-fast-image: cba3d9bf9c2cf8ddb643d887a686c53a5dd90a2c
+  react-native-keep-awake: 0de4bd66de0c23178107dce0c2fcc3354b2a8e94
+  react-native-webrtc: 31b6d3f1e3e2ce373aa43fd682b04367250f807d
+  RNGoogleSignin: 8b08beabff7f3b1373b2821b0944b38de36ba95e
+  RNSound: b360b3862d3118ed1c74bb9825696b5957686ac4
+  RNVectorIcons: 8c52e1e8da1153613fdef44748e865c25556cb9c
   SDWebImage: c5594f1a19c48d526d321e548902b56b479cd508
-  yoga: 74cdf036c30820443b25ade59916236b1e95ee93
+  yoga: b1ce48b6cf950b98deae82838f5173ea7cf89e85
 
 PODFILE CHECKSUM: 7d1909450626f31f9ea2de80122a66a50af2e1ea
 
-COCOAPODS: 1.6.0
+COCOAPODS: 1.5.3

ios/app/app.xcodeproj/project.pbxproj

@@ -243,7 +243,7 @@
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 			shellPath = /bin/sh;
-			shellScript = "../scripts/run-packager.sh\n";
+			shellScript = "../scripts/run-packager.sh";
 		};
 		B35383AD1DDA0083008F406A /* Adjust embedded framework architectures */ = {
 			isa = PBXShellScriptBuildPhase;

ios/sdk/sdk.xcodeproj/project.pbxproj

@@ -63,7 +63,7 @@
 		0BB9AD781F5EC6D7001C08DB /* Intents.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = Intents.framework; path = System/Library/Frameworks/Intents.framework; sourceTree = SDKROOT; };
 		0BB9AD7A1F5EC8F4001C08DB /* CallKit.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = CallKit.m; sourceTree = "<group>"; };
 		0BB9AD7C1F60356D001C08DB /* AppInfo.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = AppInfo.m; sourceTree = "<group>"; };
-		0BC4B8681F8C01E100CE8B21 /* CallKitIcon.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; name = CallKitIcon.png; path = "../../react/features/mobile/call-integration/CallKitIcon.png"; sourceTree = "<group>"; };
+		0BC4B8681F8C01E100CE8B21 /* CallKitIcon.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; name = CallKitIcon.png; path = ../../react/features/mobile/call-integration/CallKitIcon.png; sourceTree = "<group>"; };
 		0BCA495C1EC4B6C600B793EE /* AudioMode.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = AudioMode.m; sourceTree = "<group>"; };
 		0BCA495D1EC4B6C600B793EE /* POSIX.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = POSIX.m; sourceTree = "<group>"; };
 		0BCA495E1EC4B6C600B793EE /* Proximity.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = Proximity.m; sourceTree = "<group>"; };
@@ -347,7 +347,7 @@
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 			shellPath = /bin/sh;
-			shellScript = "if [[ \"$CONFIGURATION\" == *Debug* && ! \"$PLATFORM_NAME\" == *simulator ]]; then\n    IP=$(ipconfig getifaddr en0)\n    if [ -z \"$IP\" ]; then\n        IP=$(ifconfig | grep 'inet ' | grep -v ' 127.' | cut -d\\   -f2  | awk 'NR==1{print $1}')\n    fi\n    DEST=$CONFIGURATION_BUILD_DIR/$UNLOCALIZED_RESOURCES_FOLDER_PATH\n    echo \"$IP\" > \"$DEST/ip.txt\"\n    exit 0\nfi\nexport NODE_BINARY=node\n../../node_modules/react-native/scripts/react-native-xcode.sh\n";
+			shellScript = "if [[ \"$CONFIGURATION\" == *Debug* && ! \"$PLATFORM_NAME\" == *simulator ]]; then\n    IP=$(ipconfig getifaddr en0)\n    if [ -z \"$IP\" ]; then\n        IP=$(ifconfig | grep 'inet ' | grep -v ' 127.' | cut -d\\   -f2  | awk 'NR==1{print $1}')\n    fi\n    DEST=$CONFIGURATION_BUILD_DIR/$UNLOCALIZED_RESOURCES_FOLDER_PATH\n    echo \"$IP\" > \"$DEST/ip.txt\"\n    exit 0\nfi\nexport NODE_BINARY=node\n../../node_modules/react-native/scripts/react-native-xcode.sh";
 		};
 		26796D8589142D80C8AFDA51 /* [CP] Check Pods Manifest.lock */ = {
 			isa = PBXShellScriptBuildPhase;
@@ -373,7 +373,7 @@
 			files = (
 			);
 			inputPaths = (
-				"${PODS_ROOT}/Target Support Files/Pods-JitsiMeet/Pods-JitsiMeet-resources.sh",
+				"${SRCROOT}/../Pods/Target Support Files/Pods-JitsiMeet/Pods-JitsiMeet-resources.sh",
 				"${PODS_ROOT}/GoogleSignIn/Resources/GoogleSignIn.bundle",
 				"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/AntDesign.ttf",
 				"${PODS_ROOT}/../../node_modules/react-native-vector-icons/Fonts/Entypo.ttf",
@@ -412,7 +412,7 @@
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 			shellPath = /bin/sh;
-			shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-JitsiMeet/Pods-JitsiMeet-resources.sh\"\n";
+			shellScript = "\"${SRCROOT}/../Pods/Target Support Files/Pods-JitsiMeet/Pods-JitsiMeet-resources.sh\"\n";
 			showEnvVarsInLog = 0;
 		};
 /* End PBXShellScriptBuildPhase section */

ios/sdk/src/AudioMode.m

@@ -19,7 +19,6 @@
 
 #import <React/RCTBridgeModule.h>
 #import <React/RCTLog.h>
-#import <WebRTC/WebRTC.h>
 
 typedef enum {
     kAudioModeDefault,
@@ -27,17 +26,16 @@ typedef enum {
     kAudioModeVideoCall
 } JitsiMeetAudioMode;
 
-@interface AudioMode : NSObject<RCTBridgeModule, RTCAudioSessionDelegate>
+@interface AudioMode : NSObject<RCTBridgeModule>
 
 @property(nonatomic, strong) dispatch_queue_t workerQueue;
 
 @end
 
 @implementation AudioMode {
-    JitsiMeetAudioMode activeMode;
-    RTCAudioSessionConfiguration *defaultConfig;
-    RTCAudioSessionConfiguration *audioCallConfig;
-    RTCAudioSessionConfiguration *videoCallConfig;
+    NSString *_avCategory;
+    NSString *_avMode;
+    JitsiMeetAudioMode _mode;
 }
 
 RCT_EXPORT_MODULE();
@@ -57,32 +55,24 @@ RCT_EXPORT_MODULE();
 - (instancetype)init {
     self = [super init];
     if (self) {
+        _avCategory = nil;
+        _avMode = nil;
+        _mode = kAudioModeDefault;
+
         dispatch_queue_attr_t attributes =
         dispatch_queue_attr_make_with_qos_class(DISPATCH_QUEUE_SERIAL,
                                                 QOS_CLASS_USER_INITIATED, -1);
         _workerQueue = dispatch_queue_create("AudioMode.queue", attributes);
 
-        activeMode = kAudioModeDefault;
-
-        defaultConfig = [[RTCAudioSessionConfiguration alloc] init];
-        defaultConfig.category = AVAudioSessionCategoryAmbient;
-        defaultConfig.categoryOptions = 0;
-        defaultConfig.mode = AVAudioSessionModeDefault;
-
-        audioCallConfig = [[RTCAudioSessionConfiguration alloc] init];
-        audioCallConfig.category = AVAudioSessionCategoryPlayAndRecord;
-        audioCallConfig.categoryOptions = AVAudioSessionCategoryOptionAllowBluetooth;
-        audioCallConfig.mode = AVAudioSessionModeVoiceChat;
-
-        videoCallConfig = [[RTCAudioSessionConfiguration alloc] init];
-        videoCallConfig.category = AVAudioSessionCategoryPlayAndRecord;
-        videoCallConfig.categoryOptions = AVAudioSessionCategoryOptionAllowBluetooth;
-        videoCallConfig.mode = AVAudioSessionModeVideoChat;
-
-        RTCAudioSession *session = [RTCAudioSession sharedInstance];
-        [session addDelegate:self];
+        // AVAudioSession is a singleton and other parts of the application such as
+        // WebRTC may undo the settings. Make sure that the settings are reapplied
+        // upon undoes.
+        [[NSNotificationCenter defaultCenter]
+             addObserver:self
+                selector:@selector(routeChanged:)
+                    name:AVAudioSessionRouteChangeNotification
+                  object:nil];
     }
-
     return self;
 }
 
@@ -91,74 +81,93 @@ RCT_EXPORT_MODULE();
     return _workerQueue;
 }
 
-- (BOOL)setConfig:(RTCAudioSessionConfiguration *)config
-            error:(NSError * _Nullable *)outError {
+- (void)routeChanged:(NSNotification*)notification {
+    NSInteger reason
+        = [[notification.userInfo
+                valueForKey:AVAudioSessionRouteChangeReasonKey]
+            integerValue];
 
-    RTCAudioSession *session = [RTCAudioSession sharedInstance];
-    [session lockForConfiguration];
-    BOOL success = [session setConfiguration:config error:outError];
-    [session unlockForConfiguration];
-
-    return success;
+    switch (reason) {
+    case AVAudioSessionRouteChangeReasonCategoryChange: {
+        // The category has changed. Check if it's the one we want and adjust as
+        // needed. This notification is posted on a secondary thread, so make
+        // sure we switch to our worker thread.
+        dispatch_async(_workerQueue, ^{
+            [self setCategory:self->_avCategory mode:self->_avMode error:nil];
+        });
+        break;
+    }
+    default:
+        // Do nothing.
+        break;
+    }
 }
 
-#pragma mark - Exported methods
+- (BOOL)setCategory:(NSString *)category
+               mode:(NSString *)mode
+              error:(NSError * _Nullable *)outError {
+    AVAudioSession *session = [AVAudioSession sharedInstance];
+
+    // We don't want to touch the category when setting the default mode.
+    // This is to play well with other components which could be integrated
+    // into the final application.
+    if (_mode == kAudioModeDefault) {
+        return YES;
+    }
+
+    // Nothing to do.
+    if (category == nil && mode == nil) {
+        return YES;
+    }
+
+    if (session.category != category
+            && ![session setCategory:category error:outError]) {
+        RCTLogError(@"Failed to (re)apply specified AVAudioSession category!");
+        return NO;
+    }
+
+    if (session.mode != mode && ![session setMode:mode error:outError]) {
+        RCTLogError(@"Failed to (re)apply specified AVAudioSession mode!");
+        return NO;
+    }
+
+    return YES;
+}
 
 RCT_EXPORT_METHOD(setMode:(int)mode
                   resolve:(RCTPromiseResolveBlock)resolve
                    reject:(RCTPromiseRejectBlock)reject) {
-    RTCAudioSessionConfiguration *config;
+    NSString *avCategory = nil;
+    NSString *avMode = nil;
     NSError *error;
 
     switch (mode) {
     case kAudioModeAudioCall:
-        config = audioCallConfig;
+        avCategory = AVAudioSessionCategoryPlayAndRecord;
+        avMode = AVAudioSessionModeVoiceChat;
         break;
     case kAudioModeDefault:
-        config = defaultConfig;
         break;
     case kAudioModeVideoCall:
-        config = videoCallConfig;
+        avCategory = AVAudioSessionCategoryPlayAndRecord;
+        avMode = AVAudioSessionModeVideoChat;
         break;
     default:
         reject(@"setMode", @"Invalid mode", nil);
         return;
     }
 
-    activeMode = mode;
+    // Save the desired/specified category and mode so that they may be
+    // reapplied.
+    _avCategory = avCategory;
+    _avMode = avMode;
+    _mode = mode;
 
-    if ([self setConfig:config error:&error]) {
-        resolve(nil);
-    } else {
+    if (![self setCategory:avCategory mode:avMode error:&error] || error) {
         reject(@"setMode", error.localizedDescription, error);
+    } else {
+        resolve(nil);
     }
 }
 
-#pragma mark - RTCAudioSessionDelegate
-
-- (void)audioSessionDidChangeRoute:(RTCAudioSession *)session
-                            reason:(AVAudioSessionRouteChangeReason)reason
-                     previousRoute:(AVAudioSessionRouteDescription *)previousRoute {
-    if (reason == AVAudioSessionRouteChangeReasonCategoryChange) {
-        // The category has changed. Check if it's the one we want and adjust as
-        // needed. This notification is posted on a secondary thread, so make
-        // sure we switch to our worker thread.
-        dispatch_async(_workerQueue, ^{
-            // We don't want to touch the category when in default mode.
-            // This is to play well with other components which could be integrated
-            // into the final application.
-            if (self->activeMode != kAudioModeDefault) {
-                NSLog(@"Audio route changed, reapplying RTCAudioSession config");
-                RTCAudioSessionConfiguration *config
-                    = self->activeMode == kAudioModeAudioCall ? self->audioCallConfig : self->videoCallConfig;
-                [self setConfig:config error:nil];
-            }
-        });
-    }
-}
-
-- (void)audioSession:(RTCAudioSession *)audioSession didSetActive:(BOOL)active {
-    NSLog(@"[AudioMode] Audio session didSetActive:%d", active);
-}
-
 @end

ios/sdk/src/JitsiMeetView.h

@@ -23,8 +23,6 @@
 
 @property (class, copy, nonatomic, nullable) NSString *conferenceActivityType;
 
-@property (nonatomic) NSDictionary *colorScheme;
-
 @property (copy, nonatomic, nullable) NSURL *defaultURL;
 
 @property (nonatomic, nullable, weak) id<JitsiMeetViewDelegate> delegate;

ios/sdk/src/JitsiMeetView.m

@@ -231,7 +231,6 @@ static NSMapTable<NSString *, JitsiMeetView *> *views;
         props[@"defaultURL"] = [self.defaultURL absoluteString];
     }
 
-    props[@"colorScheme"] = self.colorScheme;
     props[@"externalAPIScope"] = externalAPIScope;
     props[@"pictureInPictureEnabled"] = @(self.pictureInPictureEnabled);
     props[@"welcomePageEnabled"] = @(self.welcomePageEnabled);

ios/sdk/src/Proximity.m

@@ -25,10 +25,6 @@
 
 RCT_EXPORT_MODULE();
 
-- (dispatch_queue_t)methodQueue {
-    return dispatch_get_main_queue();
-}
-
 /**
  * Enables / disables the proximity sensor monitoring. On iOS enabling the
  * proximity sensor automatically dims the screen and disables touch controls,

ios/sdk/src/callkit/JMCallKitProxy.swift

@@ -1,6 +1,5 @@
 /*
- * Copyright @ 2019-present 8x8, Inc.
- * Copyright @ 2018-2019 Atlassian Pty Ltd
+ * Copyright @ 2018-present Atlassian Pty Ltd
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -54,7 +53,6 @@ import Foundation
         didSet {
             if enabled == false {
                 provider.setDelegate(nil, queue: nil)
-                provider.invalidate()
             }
         }
     }
@@ -62,8 +60,6 @@ import Foundation
     @objc public static func configureProvider(localizedName: String,
                                                ringtoneSound: String?,
                                                iconTemplateImageData: Data?) {
-        guard enabled else { return }
-
         let configuration = CXProviderConfiguration(localizedName: localizedName)
         configuration.iconTemplateImageData = iconTemplateImageData
         configuration.maximumCallGroups = 1
@@ -191,4 +187,3 @@ import Foundation
         return update
     }
 }
-

lang/languages.json

@@ -1,6 +1,5 @@
 {
     "en": "English",
-    "af": "Afrikaans",
     "az": "Azerbaijani",
     "bg": "Bulgarian",
     "cs": "Czech",

modules/API/API.js

@@ -63,10 +63,6 @@ function initCommands() {
         'proxy-connection-event': event => {
             APP.conference.onProxyConnectionEvent(event);
         },
-        'subject': subject => {
-            sendAnalytics(createApiEvent('subject.changed'));
-            APP.conference.setSubject(subject);
-        },
         'submit-feedback': feedback => {
             sendAnalytics(createApiEvent('submit.feedback'));
             APP.conference.submitFeedback(feedback.score, feedback.message);
@@ -541,16 +537,6 @@ class API {
         this._sendEvent({ name: 'feedback-submitted' });
     }
 
-    /**
-     * Notify external application (if API is enabled) that the feedback prompt
-     * has been displayed.
-     *
-     * @returns {void}
-     */
-    notifyFeedbackPromptDisplayed() {
-        this._sendEvent({ name: 'feedback-prompt-displayed' });
-    }
-
     /**
      * Notify external application (if API is enabled) that the screen sharing
      * has been turned on/off.
@@ -565,20 +551,6 @@ class API {
         });
     }
 
-    /**
-     * Notify external application (if API is enabled) that the conference
-     * changed their subject.
-     *
-     * @param {string} subject - Conference subject.
-     * @returns {void}
-     */
-    notifySubjectChanged(subject: string) {
-        this._sendEvent({
-            name: 'subject-change',
-            subject
-        });
-    }
-
     /**
      * Disposes the allocated resources.
      *

modules/API/external/external_api.js

@@ -23,7 +23,6 @@ const commands = {
     displayName: 'display-name',
     email: 'email',
     hangup: 'video-hangup',
-    subject: 'subject',
     submitFeedback: 'submit-feedback',
     toggleAudio: 'toggle-audio',
     toggleChat: 'toggle-chat',
@@ -43,7 +42,6 @@ const events = {
     'display-name-change': 'displayNameChange',
     'email-change': 'emailChange',
     'feedback-submitted': 'feedbackSubmitted',
-    'feedback-prompt-displayed': 'feedbackPromptDisplayed',
     'incoming-message': 'incomingMessage',
     'outgoing-message': 'outgoingMessage',
     'participant-joined': 'participantJoined',
@@ -54,8 +52,7 @@ const events = {
     'video-conference-left': 'videoConferenceLeft',
     'video-availability-changed': 'videoAvailabilityChanged',
     'video-mute-status-changed': 'videoMuteStatusChanged',
-    'screen-sharing-status-changed': 'screenSharingStatusChanged',
-    'subject-change': 'subjectChange'
+    'screen-sharing-status-changed': 'screenSharingStatusChanged'
 };
 
 /**
@@ -545,9 +542,6 @@ export default class JitsiMeetExternalAPI extends EventEmitter {
      * Executes command. The available commands are:
      * {@code displayName} - Sets the display name of the local participant to
      * the value passed in the arguments array.
-     * {@code subject} - Sets the subject of the conference, the value passed
-     * in the arguments array. Note: available only for moderator.
-     *
      * {@code toggleAudio} - Mutes / unmutes audio with no arguments.
      * {@code toggleVideo} - Mutes / unmutes video with no arguments.
      * {@code toggleFilmStrip} - Hides / shows the filmstrip with no arguments.

modules/UI/util/UIUtil.js

@@ -18,6 +18,16 @@ const ThumbnailSizes = {
     MEDIUM: 80
 };
 
+/**
+ * Contains font sizes for thumbnail indicators
+ * @type {{SMALL: number, MEDIUM: number}}
+ */
+const IndicatorFontSizes = {
+    SMALL: 5,
+    MEDIUM: 6,
+    NORMAL: 8
+};
+
 /**
  * Created by hristo on 12/22/14.
  */
@@ -300,11 +310,6 @@ const UIUtil = {
             ? $('#localVideoContainer').height() : thumbnailHeight;
 
         const { SMALL, MEDIUM } = ThumbnailSizes;
-        const IndicatorFontSizes = interfaceConfig.INDICATOR_FONT_SIZES || {
-            SMALL: 5,
-            MEDIUM: 6,
-            NORMAL: 8
-        };
         let fontSize = IndicatorFontSizes.NORMAL;
 
         if (height <= SMALL) {

package-lock.json

@@ -2487,7 +2487,7 @@
         "blueimp-md5": "^2.10.0",
         "json3": "^3.3.2",
         "lodash": "^4.17.4",
-        "ua-parser-js": "github:amplitude/ua-parser-js#ed538f1"
+        "ua-parser-js": "github:amplitude/ua-parser-js#ed538f16f5c6ecd8357da989b617d4f156dcf35d"
       },
       "dependencies": {
         "ua-parser-js": {
@@ -4244,9 +4244,9 @@
       }
     },
     "connect-history-api-fallback": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz",
-      "integrity": "sha512-e54B99q/OUoH64zYYRf3HBP5z24G38h5D3qXu23JGRoigpX5Ss4r9ZnDk3g0Z8uQC2x2lPaJ+UlWBc1ZWBWdLg==",
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.5.0.tgz",
+      "integrity": "sha1-sGhzk0vF40T+9hGhlqb6rgruAVo=",
       "dev": true
     },
     "console-browserify": {
@@ -4653,6 +4653,36 @@
       "requires": {
         "execa": "^0.10.0",
         "ip-regex": "^2.1.0"
+      },
+      "dependencies": {
+        "cross-spawn": {
+          "version": "6.0.5",
+          "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
+          "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
+          "dev": true,
+          "requires": {
+            "nice-try": "^1.0.4",
+            "path-key": "^2.0.1",
+            "semver": "^5.5.0",
+            "shebang-command": "^1.2.0",
+            "which": "^1.2.9"
+          }
+        },
+        "execa": {
+          "version": "0.10.0",
+          "resolved": "https://registry.npmjs.org/execa/-/execa-0.10.0.tgz",
+          "integrity": "sha512-7XOMnz8Ynx1gGo/3hyV9loYNPWM94jG3+3T3Y8tsfSstFmETmENCMU/A/zj8Lyaj1lkgEepKepvd6240tBRvlw==",
+          "dev": true,
+          "requires": {
+            "cross-spawn": "^6.0.0",
+            "get-stream": "^3.0.0",
+            "is-stream": "^1.1.0",
+            "npm-run-path": "^2.0.0",
+            "p-finally": "^1.0.0",
+            "signal-exit": "^3.0.0",
+            "strip-eof": "^1.0.0"
+          }
+        }
       }
     },
     "define-properties": {
@@ -5627,36 +5657,6 @@
         "merge": "^1.2.0"
       }
     },
-    "execa": {
-      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/execa/-/execa-0.10.0.tgz",
-      "integrity": "sha512-7XOMnz8Ynx1gGo/3hyV9loYNPWM94jG3+3T3Y8tsfSstFmETmENCMU/A/zj8Lyaj1lkgEepKepvd6240tBRvlw==",
-      "dev": true,
-      "requires": {
-        "cross-spawn": "^6.0.0",
-        "get-stream": "^3.0.0",
-        "is-stream": "^1.1.0",
-        "npm-run-path": "^2.0.0",
-        "p-finally": "^1.0.0",
-        "signal-exit": "^3.0.0",
-        "strip-eof": "^1.0.0"
-      },
-      "dependencies": {
-        "cross-spawn": {
-          "version": "6.0.5",
-          "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
-          "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
-          "dev": true,
-          "requires": {
-            "nice-try": "^1.0.4",
-            "path-key": "^2.0.1",
-            "semver": "^5.5.0",
-            "shebang-command": "^1.2.0",
-            "which": "^1.2.9"
-          }
-        }
-      }
-    },
     "exenv": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
@@ -6069,28 +6069,22 @@
       "integrity": "sha512-jqjj49iZEVT/X8yidEMmP8oWmDKJlJy/um7OyYP42CZ0y4icCp6Fm2lTkZVcFVpt4mZ/hPtbs9ikqId7YhUelw=="
     },
     "follow-redirects": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.7.0.tgz",
-      "integrity": "sha512-m/pZQy4Gj287eNy94nivy5wchN3Kp+Q5WgUPNy5lJSZ3sgkVKSYV/ZChMAQVIgx1SqfZ2zBZtPA2YlXIWxxJOQ==",
+      "version": "1.5.10",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
+      "integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
       "dev": true,
       "requires": {
-        "debug": "^3.2.6"
+        "debug": "=3.1.0"
       },
       "dependencies": {
         "debug": {
-          "version": "3.2.6",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
-          "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
           "dev": true,
           "requires": {
-            "ms": "^2.1.1"
+            "ms": "2.0.0"
           }
-        },
-        "ms": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz",
-          "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==",
-          "dev": true
         }
       }
     },
@@ -6235,8 +6229,7 @@
         },
         "ansi-regex": {
           "version": "2.1.1",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "aproba": {
           "version": "1.2.0",
@@ -6254,13 +6247,11 @@
         },
         "balanced-match": {
           "version": "1.0.0",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
-          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -6273,18 +6264,15 @@
         },
         "code-point-at": {
           "version": "1.1.0",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "concat-map": {
           "version": "0.0.1",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "console-control-strings": {
           "version": "1.1.0",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -6387,8 +6375,7 @@
         },
         "inherits": {
           "version": "2.0.3",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "ini": {
           "version": "1.3.5",
@@ -6398,7 +6385,6 @@
         "is-fullwidth-code-point": {
           "version": "1.0.0",
           "bundled": true,
-          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -6411,20 +6397,17 @@
         "minimatch": {
           "version": "3.0.4",
           "bundled": true,
-          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
         },
         "minimist": {
           "version": "0.0.8",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "minipass": {
           "version": "2.2.4",
           "bundled": true,
-          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.1",
             "yallist": "^3.0.0"
@@ -6441,7 +6424,6 @@
         "mkdirp": {
           "version": "0.5.1",
           "bundled": true,
-          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -6514,8 +6496,7 @@
         },
         "number-is-nan": {
           "version": "1.0.1",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -6525,7 +6506,6 @@
         "once": {
           "version": "1.4.0",
           "bundled": true,
-          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -6601,8 +6581,7 @@
         },
         "safe-buffer": {
           "version": "5.1.1",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "safer-buffer": {
           "version": "2.1.2",
@@ -6632,7 +6611,6 @@
         "string-width": {
           "version": "1.0.2",
           "bundled": true,
-          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -6650,7 +6628,6 @@
         "strip-ansi": {
           "version": "3.0.1",
           "bundled": true,
-          "optional": true,
           "requires": {
             "ansi-regex": "^2.0.0"
           }
@@ -6689,13 +6666,11 @@
         },
         "wrappy": {
           "version": "1.0.2",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "yallist": {
           "version": "3.0.2",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         }
       }
     },
@@ -6880,9 +6855,9 @@
       "integrity": "sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw=="
     },
     "handle-thing": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-2.0.0.tgz",
-      "integrity": "sha512-d4sze1JNC454Wdo2fkuyzCr6aHcbL6PGGuFAz0Li/NcOm1tCHGnWDRmJP85dh9IhQErTc2svWFEX5xHIOo//kQ==",
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz",
+      "integrity": "sha1-/Xqtcmvxpf0W38KbL3pmAdJxOcQ=",
       "dev": true
     },
     "har-schema": {
@@ -13496,79 +13471,59 @@
       "integrity": "sha1-yd96NCRZSt5r0RkA1ZZpbcBrrFc="
     },
     "spdy": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/spdy/-/spdy-4.0.0.tgz",
-      "integrity": "sha512-ot0oEGT/PGUpzf/6uk4AWLqkq+irlqHXkrdbk51oWONh3bxQmBuljxPNl66zlRRcIJStWq0QkLUCPOPjgjvU0Q==",
+      "version": "3.4.7",
+      "resolved": "https://registry.npmjs.org/spdy/-/spdy-3.4.7.tgz",
+      "integrity": "sha1-Qv9B7OXMD5mjpsKKq7c/XDsDrLw=",
       "dev": true,
       "requires": {
-        "debug": "^4.1.0",
-        "handle-thing": "^2.0.0",
+        "debug": "^2.6.8",
+        "handle-thing": "^1.2.5",
         "http-deceiver": "^1.2.7",
+        "safe-buffer": "^5.0.1",
         "select-hose": "^2.0.0",
-        "spdy-transport": "^3.0.0"
-      },
-      "dependencies": {
-        "debug": {
-          "version": "4.1.1",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-          "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-          "dev": true,
-          "requires": {
-            "ms": "^2.1.1"
-          }
-        },
-        "ms": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz",
-          "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==",
-          "dev": true
-        }
+        "spdy-transport": "^2.0.18"
       }
     },
     "spdy-transport": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-3.0.0.tgz",
-      "integrity": "sha512-hsLVFE5SjA6TCisWeJXFKniGGOpBgMLmerfO2aCyCU5s7nJ/rpAepqmFifv/GCbSbueEeAJJnmSQ2rKC/g8Fcw==",
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-2.1.1.tgz",
+      "integrity": "sha512-q7D8c148escoB3Z7ySCASadkegMmUZW8Wb/Q1u0/XBgDKMO880rLQDj8Twiew/tYi7ghemKUi/whSYOwE17f5Q==",
       "dev": true,
       "requires": {
-        "debug": "^4.1.0",
-        "detect-node": "^2.0.4",
+        "debug": "^2.6.8",
+        "detect-node": "^2.0.3",
         "hpack.js": "^2.1.6",
-        "obuf": "^1.1.2",
-        "readable-stream": "^3.0.6",
-        "wbuf": "^1.7.3"
+        "obuf": "^1.1.1",
+        "readable-stream": "^2.2.9",
+        "safe-buffer": "^5.0.1",
+        "wbuf": "^1.7.2"
       },
       "dependencies": {
-        "debug": {
-          "version": "4.1.1",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-          "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
-          "dev": true,
-          "requires": {
-            "ms": "^2.1.1"
-          }
-        },
-        "ms": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz",
-          "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==",
+        "isarray": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
           "dev": true
         },
         "readable-stream": {
-          "version": "3.1.1",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.1.1.tgz",
-          "integrity": "sha512-DkN66hPyqDhnIQ6Jcsvx9bFjhw214O4poMBcIMgPVpQvNy9a0e0Uhg5SqySyDKAmUlwt8LonTBz1ezOnM8pUdA==",
+          "version": "2.3.6",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
+          "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
           "dev": true,
           "requires": {
-            "inherits": "^2.0.3",
-            "string_decoder": "^1.1.1",
-            "util-deprecate": "^1.0.1"
+            "core-util-is": "~1.0.0",
+            "inherits": "~2.0.3",
+            "isarray": "~1.0.0",
+            "process-nextick-args": "~2.0.0",
+            "safe-buffer": "~5.1.1",
+            "string_decoder": "~1.1.1",
+            "util-deprecate": "~1.0.1"
           }
         },
         "string_decoder": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.2.0.tgz",
-          "integrity": "sha512-6YqyX6ZWEYguAxgZzHGL7SsCeGx3V2TtOTqZz1xSTSWnqsbWwbptafNyvf/ACquZUXV3DANr5BDIwNYe1mN42w==",
+          "version": "1.1.1",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+          "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
           "dev": true,
           "requires": {
             "safe-buffer": "~5.1.0"
@@ -15611,9 +15566,9 @@
       }
     },
     "webpack-dev-server": {
-      "version": "3.1.14",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.1.14.tgz",
-      "integrity": "sha512-mGXDgz5SlTxcF3hUpfC8hrQ11yhAttuUQWf1Wmb+6zo3x6rb7b9mIfuQvAPLdfDRCGRGvakBWHdHOa0I9p/EVQ==",
+      "version": "3.1.10",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.1.10.tgz",
+      "integrity": "sha512-RqOAVjfqZJtQcB0LmrzJ5y4Jp78lv9CK0MZ1YJDTaTmedMZ9PU9FLMQNrMCfVu8hHzaVLVOJKBlGEHMN10z+ww==",
       "dev": true,
       "requires": {
         "ansi-html": "0.0.7",
@@ -15635,23 +15590,21 @@
         "portfinder": "^1.0.9",
         "schema-utils": "^1.0.0",
         "selfsigned": "^1.9.1",
-        "semver": "^5.6.0",
         "serve-index": "^1.7.2",
         "sockjs": "0.3.19",
         "sockjs-client": "1.3.0",
-        "spdy": "^4.0.0",
+        "spdy": "^3.4.1",
         "strip-ansi": "^3.0.0",
         "supports-color": "^5.1.0",
-        "url": "^0.11.0",
         "webpack-dev-middleware": "3.4.0",
         "webpack-log": "^2.0.0",
         "yargs": "12.0.2"
       },
       "dependencies": {
         "ajv": {
-          "version": "6.9.1",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.9.1.tgz",
-          "integrity": "sha512-XDN92U311aINL77ieWHmqCcNlwjoP5cHXDxIxbf2MaPYuCXOHS7gHH8jktxeK5omgd52XbSTX6a4Piwd1pQmzA==",
+          "version": "6.6.1",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.6.1.tgz",
+          "integrity": "sha512-ZoJjft5B+EJBjUyu9C9Hc0OZyPZSSlOF+plzouTrg6UlA8f+e/n8NIgBFG/9tppJtpPWfthHakK7juJdNDODww==",
           "dev": true,
           "requires": {
             "fast-deep-equal": "^2.0.1",
@@ -15734,13 +15687,13 @@
           }
         },
         "execa": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/execa/-/execa-1.0.0.tgz",
-          "integrity": "sha512-adbxcyWV46qiHyvSp50TKt05tB4tK3HcmF7/nxfAdhnox83seTDbwnaqKO4sXRy7roHAIFqJP/Rw/AuEbX61LA==",
+          "version": "0.10.0",
+          "resolved": "https://registry.npmjs.org/execa/-/execa-0.10.0.tgz",
+          "integrity": "sha512-7XOMnz8Ynx1gGo/3hyV9loYNPWM94jG3+3T3Y8tsfSstFmETmENCMU/A/zj8Lyaj1lkgEepKepvd6240tBRvlw==",
           "dev": true,
           "requires": {
             "cross-spawn": "^6.0.0",
-            "get-stream": "^4.0.0",
+            "get-stream": "^3.0.0",
             "is-stream": "^1.1.0",
             "npm-run-path": "^2.0.0",
             "p-finally": "^1.0.0",
@@ -15763,15 +15716,6 @@
             "locate-path": "^3.0.0"
           }
         },
-        "get-stream": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-4.1.0.tgz",
-          "integrity": "sha512-GMat4EJ5161kIy2HevLlr4luNjBgvmj413KaQA7jt4V8B4RDsfpHk7WQ9GVqfYyyx8OS/L66Kox+rJRNklLK7w==",
-          "dev": true,
-          "requires": {
-            "pump": "^3.0.0"
-          }
-        },
         "globby": {
           "version": "6.1.0",
           "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
@@ -15831,14 +15775,14 @@
           }
         },
         "mem": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/mem/-/mem-4.1.0.tgz",
-          "integrity": "sha512-I5u6Q1x7wxO0kdOpYBB28xueHADYps5uty/zg936CiG8NTe5sJL8EjrCuLneuDW3PlMdZBGDIn8BirEVdovZvg==",
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/mem/-/mem-4.0.0.tgz",
+          "integrity": "sha512-WQxG/5xYc3tMbYLXoXPm81ET2WDULiU5FxbuIoNbJqLOOI8zehXFdZuiUEgfdrU2mVB1pxBZUGlYORSrpuJreA==",
           "dev": true,
           "requires": {
             "map-age-cleaner": "^0.1.1",
             "mimic-fn": "^1.0.0",
-            "p-is-promise": "^2.0.0"
+            "p-is-promise": "^1.1.0"
           }
         },
         "ms": {
@@ -15857,26 +15801,20 @@
           }
         },
         "os-locale": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-3.1.0.tgz",
-          "integrity": "sha512-Z8l3R4wYWM40/52Z+S265okfFj8Kt2cC2MKY+xNi3kFs+XGI7WXu/I309QQQYbRW4ijiZ+yxs9pqEhJh0DqW3Q==",
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-3.0.1.tgz",
+          "integrity": "sha512-7g5e7dmXPtzcP4bgsZ8ixDVqA7oWYuEz4lOSujeWyliPai4gfVDiFIcwBg3aGCPnmSGfzOKTK3ccPn0CKv3DBw==",
           "dev": true,
           "requires": {
-            "execa": "^1.0.0",
+            "execa": "^0.10.0",
             "lcid": "^2.0.0",
             "mem": "^4.0.0"
           }
         },
-        "p-is-promise": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/p-is-promise/-/p-is-promise-2.0.0.tgz",
-          "integrity": "sha512-pzQPhYMCAgLAKPWD2jC3Se9fEfrD9npNos0y150EeqZll7akhEgGhTW/slB6lHku8AvYGiJ+YJ5hfHKePPgFWg==",
-          "dev": true
-        },
         "p-limit": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.1.0.tgz",
-          "integrity": "sha512-NhURkNcrVB+8hNfLuysU8enY5xn2KXphsHBaC2YmRNTZRc7RWusw6apSpdEj3jo4CMb6W9nrF6tTnsJsJeyu6g==",
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.0.0.tgz",
+          "integrity": "sha512-fl5s52lI5ahKCernzzIyAP0QAZbGIovtVHGwpcu1Jr/EpzLVDI2myISHwGqK7m8uQFugVWSrbxH7XnhGtvEc+A==",
           "dev": true,
           "requires": {
             "p-try": "^2.0.0"
@@ -15903,16 +15841,6 @@
           "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=",
           "dev": true
         },
-        "pump": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
-          "integrity": "sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==",
-          "dev": true,
-          "requires": {
-            "end-of-stream": "^1.1.0",
-            "once": "^1.3.1"
-          }
-        },
         "schema-utils": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz",
@@ -15924,12 +15852,6 @@
             "ajv-keywords": "^3.1.0"
           }
         },
-        "semver": {
-          "version": "5.6.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.6.0.tgz",
-          "integrity": "sha512-RS9R6R35NYgQn++fkDWaOmqGoj4Ek9gGs+DPxNUZKuwE183xjJroKvyo1IzVFeXvUrvmALy6FWD5xrdJT25gMg==",
-          "dev": true
-        },
         "supports-color": {
           "version": "5.5.0",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
@@ -15981,9 +15903,9 @@
       },
       "dependencies": {
         "ansi-colors": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-3.2.3.tgz",
-          "integrity": "sha512-LEHHyuhlPY3TmuUYMh2oz89lTShfvgbmzaBcxve9t/9Wuy7Dwf4yoAKcND7KFT1HAQfqZ12qtc+DUrBMeKF9nw==",
+          "version": "3.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-3.2.1.tgz",
+          "integrity": "sha512-Xt+zb6nqgvV9SWAVp0EG3lRsHcbq5DDgqjPPz6pwgtj6RKz65zGXMNa82oJfOSBA/to6GmRP7Dr+6o+kbApTzQ==",
           "dev": true
         },
         "uuid": {

package.json

@@ -114,7 +114,7 @@
     "style-loader": "0.19.0",
     "webpack": "4.26.1",
     "webpack-cli": "3.1.2",
-    "webpack-dev-server": "3.1.14"
+    "webpack-dev-server": "3.1.10"
   },
   "engines": {
     "node": ">=8.0.0",

react/features/app/components/App.native.js

@@ -5,7 +5,6 @@ import { Linking } from 'react-native';
 
 import '../../analytics';
 import '../../authentication';
-import { setColorScheme } from '../../base/color-scheme';
 import { DialogContainer } from '../../base/dialog';
 import '../../base/jwt';
 import { Platform } from '../../base/react';
@@ -36,11 +35,6 @@ const logger = require('jitsi-meet-logger').getLogger(__filename);
  */
 type Props = AbstractAppProps & {
 
-    /**
-     * An object of colors that override the default colors of the app/sdk.
-     */
-    colorScheme: Object,
-
     /**
      * Whether Picture-in-Picture is enabled. If {@code true}, a toolbar button
      * is rendered in the {@link Conference} view to afford entering
@@ -62,8 +56,6 @@ type Props = AbstractAppProps & {
  * @extends AbstractApp
  */
 export class App extends AbstractApp {
-    _init: Promise<*>;
-
     /**
      * Initializes a new {@code App} instance.
      *
@@ -94,12 +86,6 @@ export class App extends AbstractApp {
     componentDidMount() {
         super.componentDidMount();
 
-        this._init.then(() => {
-            // We set the color scheme early enough so then we avoid any
-            // unnecessary re-renders.
-            this.state.store.dispatch(setColorScheme(this.props.colorScheme));
-        });
-
         Linking.addEventListener('url', this._onLinkingURL);
     }
 

react/features/authentication/components/LoginDialog.native.js

@@ -9,12 +9,10 @@ import {
     CustomSubmitDialog,
     FIELD_UNDERLINE,
     PLACEHOLDER_COLOR,
-    _abstractMapStateToProps,
     inputDialog as inputDialogStyle
 } from '../../base/dialog';
 import { translate } from '../../base/i18n';
 import { JitsiConnectionErrors } from '../../base/lib-jitsi-meet';
-import { StyleType } from '../../base/styles';
 
 import { authenticateAndUpgradeRole, cancelLogin } from '../actions';
 import styles from './styles';
@@ -40,11 +38,6 @@ type Props = {
      */
     _connecting: boolean,
 
-    /**
-     * The color-schemed stylesheet of the base/dialog feature.
-     */
-    _dialogStyles: StyleType,
-
     /**
      * The error which occurred during login/authentication.
      */
@@ -141,7 +134,6 @@ class LoginDialog extends Component<Props, State> {
     render() {
         const {
             _connecting: connecting,
-            _dialogStyles,
             _error: error,
             _progress: progress,
             t
@@ -194,7 +186,7 @@ class LoginDialog extends Component<Props, State> {
                         onChangeText = { this._onUsernameChange }
                         placeholder = { 'user@domain.com' }
                         placeholderTextColor = { PLACEHOLDER_COLOR }
-                        style = { _dialogStyles.field }
+                        style = { inputDialogStyle.field }
                         underlineColorAndroid = { FIELD_UNDERLINE }
                         value = { this.state.username } />
                     <TextInput
@@ -203,7 +195,7 @@ class LoginDialog extends Component<Props, State> {
                         placeholderTextColor = { PLACEHOLDER_COLOR }
                         secureTextEntry = { true }
                         style = { [
-                            _dialogStyles.field,
+                            inputDialogStyle.field,
                             inputDialogStyle.bottomField
                         ] }
                         underlineColorAndroid = { FIELD_UNDERLINE }
@@ -297,7 +289,6 @@ class LoginDialog extends Component<Props, State> {
  *     _conference: JitsiConference,
  *     _configHosts: Object,
  *     _connecting: boolean,
- *     _dialogStyles: StyleType,
  *     _error: Object,
  *     _progress: number
  * }}
@@ -316,7 +307,6 @@ function _mapStateToProps(state) {
     } = state['features/base/connection'];
 
     return {
-        ..._abstractMapStateToProps(state),
         _conference: authRequired,
         _configHosts: configHosts,
         _connecting: Boolean(connecting) || Boolean(thenableWithCancel),

react/features/base/color-scheme/ColorSchemeRegistry.js

@@ -1,160 +0,0 @@
-// @flow
-
-import { toState } from '../redux';
-import { StyleType } from '../styles';
-
-import defaultScheme from './defaultScheme';
-
-/**
- * A registry class to register styles that need to be color-schemed.
- *
- * This class uses lazy initialization for scheme-ified style definitions on
- * request.
- */
-class ColorSchemeRegistry {
-    /**
-     * A map of already scheme-ified style definitions.
-     */
-    _schemedStyles = new Map();
-
-    /**
-     * A map of registered style templates.
-     */
-    _styleTemplates = new Map();
-
-    /**
-     * Clears the already scheme-ified style definitions. This is useful when
-     * the {@code SET_COLOR_SCHEME} action is dispatched (again).
-     *
-     * @returns {void}
-     */
-    clear() {
-        this._schemedStyles.clear();
-    }
-
-    /**
-     * Retreives the color-scheme applied style definition of a component.
-     *
-     * @param {Object | Function} stateful - An object or function that can be
-     * resolved to Redux state using the {@code toState} function.
-     * @param {string} componentName - The name of the component whose style we
-     * want to retreive.
-     * @returns {StyleType}
-     */
-    get(stateful: Object | Function, componentName: string): StyleType {
-        let schemedStyle = this._schemedStyles.get(componentName);
-
-        if (!schemedStyle) {
-            schemedStyle
-                = this._applyColorScheme(
-                    stateful,
-                    componentName,
-                    this._styleTemplates.get(componentName));
-            this._schemedStyles.set(componentName, schemedStyle);
-        }
-
-        return schemedStyle;
-    }
-
-    /**
-     * Registers a style definition to the registry for color-scheming.
-     *
-     * NOTE: It's suggested to only use this registry on styles where color
-     * scheming is needed, otherwise just use a static style object as before.
-     *
-     * @param {string} componentName - The name of the component to register the
-     * style to (e.g. {@code 'Toolbox'}).
-     * @param {StyleType} style - The style definition to register.
-     * @returns {void}
-     */
-    register(componentName: string, style: StyleType): void {
-        this._styleTemplates.set(componentName, style);
-
-        // If this is a style overwrite, we need to delete the processed version
-        // of the style from the other map
-        this._schemedStyles.delete(componentName);
-    }
-
-    /**
-     * Creates a color schemed style object applying the color scheme to every
-     * colors in the style object prepared in a special way.
-     *
-     * @param {Object | Function} stateful - An object or function that can be
-     * resolved to Redux state using the {@code toState} function.
-     * @param {string} componentName - The name of the component to apply the
-     * color scheme to.
-     * @param {StyleType} style - The style definition to apply the color scheme
-     * to.
-     * @returns {StyleType}
-     */
-    _applyColorScheme(
-            stateful: Object | Function,
-            componentName: string,
-            style: StyleType): StyleType {
-        let schemedStyle;
-
-        if (Array.isArray(style)) {
-            // The style is an array of styles, we apply the same transformation
-            // to each, recursively.
-            schemedStyle = [];
-
-            for (const entry of style) {
-                schemedStyle.push(this._applyColorScheme(
-                    stateful, componentName, entry));
-            }
-        } else {
-            // The style is an object, we create a copy of it to avoid in-place
-            // modification.
-            schemedStyle = {
-                ...style
-            };
-
-            for (const [
-                styleName,
-                styleValue
-            ] of Object.entries(schemedStyle)) {
-                if (typeof styleValue === 'object') {
-                    // The value is another style object, we apply the same
-                    // transformation recusively.
-                    schemedStyle[styleName]
-                        = this._applyColorScheme(
-                            stateful, componentName, styleValue);
-                } else if (typeof styleValue === 'function') {
-                    // The value is a function, which indicates that it's a
-                    // dynamic, schemed color we need to resolve.
-                    schemedStyle[styleName]
-                        = this._getColor(stateful, componentName, styleValue());
-                }
-
-            }
-        }
-
-        return schemedStyle;
-    }
-
-    /**
-     * Function to get the color value for the provided identifier.
-     *
-     * @param {Object | Function} stateful - An object or function that can be
-     * resolved to Redux state using the {@code toState} function.
-     * @param {string} componentName - The name of the component to get the
-     * color value for.
-     * @param {string} colorDefinition - The string identifier of the color,
-     * e.g. {@code appBackground}.
-     * @returns {string}
-     */
-    _getColor(
-            stateful: Object | Function,
-            componentName: string,
-            colorDefinition: string): string {
-        const colorScheme = toState(stateful)['features/base/color-scheme'];
-
-        return {
-            ...defaultScheme[componentName],
-            ...colorScheme[componentName]
-        }[colorDefinition];
-    }
-
-}
-
-export default new ColorSchemeRegistry();

react/features/base/color-scheme/actionTypes.js

@@ -1,11 +0,0 @@
-// @flow
-
-/**
- * Redux action to signal a color scheme change in the app/sdk.
- *
- * {
- *     type: SET_COLOR_SCHEME
- *     colorScheme: Object
- * }
- */
-export const SET_COLOR_SCHEME = Symbol('SET_COLOR_SCHEME');

react/features/base/color-scheme/actions.js

@@ -1,19 +0,0 @@
-// @flow
-
-import { SET_COLOR_SCHEME } from './actionTypes';
-
-/**
- * Dispatches a Redux action to set the color scheme of the app/sdk.
- *
- * @param {Object} colorScheme - The color scheme to set.
- * @returns {{
- *     type: SET_COLOR_SCHEME,
- *     colorScheme: Object
- * }}
- */
-export function setColorScheme(colorScheme: Object): Object {
-    return {
-        type: SET_COLOR_SCHEME,
-        colorScheme
-    };
-}

react/features/base/color-scheme/defaultScheme.js

@@ -1,35 +0,0 @@
-// @flow
-
-import { ColorPalette, getRGBAFormat } from '../styles';
-
-/**
- * The default color scheme of the application.
- */
-export default {
-    'BottomSheet': {
-        background: ColorPalette.blackBlue,
-        icon: ColorPalette.white,
-        label: ColorPalette.white
-    },
-    'Dialog': {
-        background: ColorPalette.blackBlue,
-        border: getRGBAFormat(ColorPalette.white, 0.2),
-        icon: ColorPalette.white,
-        text: ColorPalette.white
-    },
-    'LargeVideo': {
-        background: ColorPalette.black
-    },
-    'Thumbnail': {
-        activeParticipantHighlight: ColorPalette.blue,
-        activeParticipantTint: ColorPalette.black,
-        background: ColorPalette.black
-    },
-    'Toolbox': {
-        button: getRGBAFormat(ColorPalette.white, 0.7),
-        buttonToggled: getRGBAFormat(ColorPalette.buttonUnderlay, 0.7),
-        buttonToggledBorder:
-            getRGBAFormat(ColorPalette.buttonUnderlay, 0.7),
-        hangup: ColorPalette.red
-    }
-};

react/features/base/color-scheme/functions.js

@@ -1,13 +0,0 @@
-// @flow
-
-/**
- * A special function to be used in the {@code createColorSchemedStyle} call,
- * that denotes that the color is a dynamic color.
- *
- * @param {string} colorDefinition - The definition of the color to mark to be
- * resolved.
- * @returns {Function}
- */
-export function schemeColor(colorDefinition: string): Function {
-    return () => colorDefinition;
-}

react/features/base/color-scheme/index.js

@@ -1,8 +0,0 @@
-// @flow
-
-export * from './actions';
-export * from './actionTypes';
-export * from './functions';
-export { default as ColorSchemeRegistry } from './ColorSchemeRegistry';
-
-import './reducer';

react/features/base/color-scheme/middleware.js

@@ -1,20 +0,0 @@
-// @flow
-
-import { MiddlewareRegistry } from '../redux';
-
-import { SET_COLOR_SCHEME } from './actionTypes';
-import ColorSchemeRegistry from './ColorSchemeRegistry';
-
-/**
- * The middleware of the feature {@code base/color-scheme}.
- *
- * @returns {Function}
- */
-MiddlewareRegistry.register((/* store */) => next => action => {
-    switch (action.type) {
-    case SET_COLOR_SCHEME:
-        return ColorSchemeRegistry.clear();
-    }
-
-    return next(action);
-});

react/features/base/color-scheme/reducer.js

@@ -1,21 +0,0 @@
-// @flow
-
-import _ from 'lodash';
-
-import { ReducerRegistry } from '../redux';
-
-import { SET_COLOR_SCHEME } from './actionTypes';
-
-/**
- * The reducer of the feature {@code base/color-scheme}.
- *
- * @returns {Function}
- */
-ReducerRegistry.register('features/base/color-scheme', (state = {}, action) => {
-    switch (action.type) {
-    case SET_COLOR_SCHEME:
-        return _.cloneDeep(action.colorScheme) || state;
-    }
-
-    return state;
-});

react/features/base/conference/actionTypes.js

@@ -119,16 +119,6 @@ export const P2P_STATUS_CHANGED = Symbol('P2P_STATUS_CHANGED');
  */
 export const SET_AUDIO_ONLY = Symbol('SET_AUDIO_ONLY');
 
-/**
- * The type of (redux) action, which indicates to set conference subject.
- *
- * {
- *     type: SET_CONFERENCE_SUBJECT
- *     subject: string
- * }
- */
-export const SET_CONFERENCE_SUBJECT = Symbol('SET_CONFERENCE_SUBJECT');
-
 /**
  * The type of (redux) action which sets the desktop sharing enabled flag for
  * the current conference.

react/features/base/conference/actions.js

@@ -33,7 +33,6 @@ import {
     LOCK_STATE_CHANGED,
     P2P_STATUS_CHANGED,
     SET_AUDIO_ONLY,
-    SET_CONFERENCE_SUBJECT,
     SET_DESKTOP_SHARING_ENABLED,
     SET_FOLLOW_ME,
     SET_LASTN,
@@ -729,16 +728,3 @@ export function toggleAudioOnly() {
         return dispatch(setAudioOnly(!audioOnly, true));
     };
 }
-
-/**
- * Changing conference subject.
- *
- * @param {string} subject - The new subject.
- * @returns {void}
- */
-export function setSubject(subject: String) {
-    return {
-        type: SET_CONFERENCE_SUBJECT,
-        subject
-    };
-}

react/features/base/conference/middleware.js

@@ -35,7 +35,6 @@ import {
     CONFERENCE_WILL_LEAVE,
     DATA_CHANNEL_OPENED,
     SET_AUDIO_ONLY,
-    SET_CONFERENCE_SUBJECT,
     SET_LASTN,
     SET_ROOM
 } from './actionTypes';
@@ -91,9 +90,6 @@ MiddlewareRegistry.register(store => next => action => {
     case SET_AUDIO_ONLY:
         return _setAudioOnly(store, next, action);
 
-    case SET_CONFERENCE_SUBJECT:
-        return _setSubject(store, next, action);
-
     case SET_LASTN:
         return _setLastN(store, next, action);
 
@@ -683,26 +679,3 @@ function _updateLocalParticipantInConference({ getState }, next, action) {
 
     return result;
 }
-
-/**
- * Changing conference subject.
- *
- * @param {Store} store - The redux store in which the specified {@code action}
- * is being dispatched.
- * @param {Dispatch} next - The redux {@code dispatch} function to dispatch the
- * specified {@code action} to the specified {@code store}.
- * @param {Action} action - The redux action which is being dispatched in the
- * specified {@code store}.
- * @private
- * @returns {Object} The value returned by {@code next(action)}.
- */
-function _setSubject({ getState }, next, action) {
-    const { conference } = getState()['features/base/conference'];
-    const { subject } = action;
-
-    if (subject) {
-        conference.setSubject(subject);
-    }
-
-    return next(action);
-}

react/features/base/config/parseURLParams.js

@@ -19,18 +19,9 @@ export default function parseURLParams(
         source: string = 'hash'): Object {
     const paramStr = source === 'search' ? url.search : url.hash;
     const params = {};
-    const paramParts = (paramStr && paramStr.substr(1).split('&')) || [];
 
-    // Detect and ignore hash params for hash routers.
-    if (source === 'hash' && paramParts.length === 1) {
-        const firstParam = paramParts[0];
-
-        if (firstParam.startsWith('/') && firstParam.split('&').length === 1) {
-            return params;
-        }
-    }
-
-    paramParts.forEach(part => {
+    // eslint-disable-next-line newline-per-chained-call
+    paramStr && paramStr.substr(1).split('&').forEach(part => {
         const param = part.split('=');
         const key = param[0];
 

react/features/base/dialog/components/native/BaseDialog.js

@@ -8,7 +8,6 @@ import {
 } from 'react-native';
 
 import { Icon } from '../../../font-icons';
-import { StyleType } from '../../../styles';
 
 import AbstractDialog, {
     type Props as AbstractProps,
@@ -19,11 +18,6 @@ import { brandedDialog as styles } from './styles';
 export type Props = {
     ...AbstractProps,
 
-    /**
-     * The color-schemed stylesheet of the feature.
-     */
-    _dialogStyles: StyleType,
-
     t: Function
 }
 
@@ -49,7 +43,7 @@ class BaseDialog<P: Props, S: State> extends AbstractDialog<P, S> {
      * @returns {ReactElement}
      */
     render() {
-        const { _dialogStyles, style } = this.props;
+        const { style } = this.props;
 
         return (
             <View
@@ -61,7 +55,7 @@ class BaseDialog<P: Props, S: State> extends AbstractDialog<P, S> {
                 <View
                     pointerEvents = 'box-none'
                     style = { [
-                        _dialogStyles.dialog,
+                        styles.dialog,
                         this.props.style
                     ] }>
                     <TouchableOpacity
@@ -69,7 +63,7 @@ class BaseDialog<P: Props, S: State> extends AbstractDialog<P, S> {
                         style = { styles.closeWrapper }>
                         <Icon
                             name = 'close'
-                            style = { _dialogStyles.closeStyle } />
+                            style = { styles.closeStyle } />
                     </TouchableOpacity>
                     { this._renderContent() }
                 </View>

react/features/base/dialog/components/native/BaseSubmitDialog.js

@@ -3,8 +3,6 @@
 import React from 'react';
 import { View, Text, TouchableOpacity } from 'react-native';
 
-import { StyleType } from '../../../styles';
-
 import BaseDialog, { type Props as BaseProps } from './BaseDialog';
 import {
     brandedDialog
@@ -13,11 +11,6 @@ import {
 type Props = {
     ...BaseProps,
 
-    /**
-     * The color-schemed stylesheet of the feature.
-     */
-    _dialogStyles: StyleType,
-
     t: Function
 }
 
@@ -53,7 +46,7 @@ class BaseSubmitDialog<P: Props, S: *> extends BaseDialog<P, S> {
      * @inheritdoc
      */
     _renderContent() {
-        const { _dialogStyles, t } = this.props;
+        const { t } = this.props;
         const additionalButtons = this._renderAdditionalButtons();
 
         return (
@@ -72,7 +65,7 @@ class BaseSubmitDialog<P: Props, S: *> extends BaseDialog<P, S> {
                                 ? null : brandedDialog.buttonFarLeft,
                             brandedDialog.buttonFarRight
                         ] }>
-                        <Text style = { _dialogStyles.text }>
+                        <Text style = { brandedDialog.text }>
                             { t(this._getSubmitButtonKey()) }
                         </Text>
                     </TouchableOpacity>

react/features/base/dialog/components/native/BottomSheet.js

@@ -2,11 +2,8 @@
 
 import React, { Component, type Node } from 'react';
 import { TouchableWithoutFeedback, View } from 'react-native';
-import { connect } from 'react-redux';
 
-import { ColorSchemeRegistry } from '../../../color-scheme';
 import { Modal } from '../../../react';
-import { StyleType } from '../../../styles';
 
 import { bottomSheetStyles as styles } from './styles';
 
@@ -15,11 +12,6 @@ import { bottomSheetStyles as styles } from './styles';
  */
 type Props = {
 
-    /**
-     * The color-schemed stylesheet of the feature.
-     */
-    _styles: StyleType,
-
     /**
      * The children to be displayed within this component.
      */
@@ -36,7 +28,7 @@ type Props = {
  * A component emulating Android's BottomSheet. For all intents and purposes,
  * this component has been designed to work and behave as a {@code Dialog}.
  */
-class BottomSheet extends Component<Props> {
+export default class BottomSheet extends Component<Props> {
     /**
      * Initializes a new {@code BottomSheet} instance.
      *
@@ -55,8 +47,6 @@ class BottomSheet extends Component<Props> {
      * @returns {ReactElement}
      */
     render() {
-        const { _styles } = this.props;
-
         return [
             <View
                 key = 'overlay'
@@ -70,7 +60,7 @@ class BottomSheet extends Component<Props> {
                         onPress = { this._onCancel } >
                         <View style = { styles.backdrop } />
                     </TouchableWithoutFeedback>
-                    <View style = { _styles.sheet }>
+                    <View style = { styles.sheet }>
                         { this.props.children }
                     </View>
                 </View>
@@ -92,19 +82,3 @@ class BottomSheet extends Component<Props> {
         onCancel && onCancel();
     }
 }
-
-/**
- * Maps part of the Redux state to the props of this component.
- *
- * @param {Object} state - The Redux state.
- * @returns {{
- *     _styles: StyleType
- * }}
- */
-function _mapStateToProps(state) {
-    return {
-        _styles: ColorSchemeRegistry.get(state, 'BottomSheet')
-    };
-}
-
-export default connect(_mapStateToProps)(BottomSheet);

react/features/base/dialog/components/native/ConfirmDialog.js

@@ -5,9 +5,6 @@ import { Text, TouchableOpacity } from 'react-native';
 import { connect } from 'react-redux';
 
 import { translate } from '../../../i18n';
-import { StyleType } from '../../../styles';
-
-import { _abstractMapStateToProps } from '../../functions';
 
 import { type Props as BaseProps } from './BaseDialog';
 import BaseSubmitDialog from './BaseSubmitDialog';
@@ -16,11 +13,6 @@ import { brandedDialog } from './styles';
 type Props = {
     ...BaseProps,
 
-    /**
-     * The color-schemed stylesheet of the feature.
-     */
-    _dialogStyles: StyleType,
-
     /**
      * Untranslated i18n key of the content to be displayed.
      *
@@ -57,7 +49,7 @@ class ConfirmDialog extends BaseSubmitDialog<Props, *> {
      * @inheritdoc
      */
     _renderAdditionalButtons() {
-        const { _dialogStyles, t } = this.props;
+        const { t } = this.props;
 
         return (
             <TouchableOpacity
@@ -65,9 +57,9 @@ class ConfirmDialog extends BaseSubmitDialog<Props, *> {
                 style = { [
                     brandedDialog.button,
                     brandedDialog.buttonFarLeft,
-                    _dialogStyles.buttonSeparator
+                    brandedDialog.buttonSeparator
                 ] }>
-                <Text style = { _dialogStyles.text }>
+                <Text style = { brandedDialog.text }>
                     { t('dialog.confirmNo') }
                 </Text>
             </TouchableOpacity>
@@ -80,14 +72,14 @@ class ConfirmDialog extends BaseSubmitDialog<Props, *> {
      * @inheritdoc
      */
     _renderSubmittable() {
-        const { _dialogStyles, contentKey, t } = this.props;
+        const { contentKey, t } = this.props;
         const content
             = typeof contentKey === 'string'
                 ? t(contentKey)
                 : this._renderHTML(t(contentKey.key, contentKey.params));
 
         return (
-            <Text style = { _dialogStyles.text }>
+            <Text style = { brandedDialog.text }>
                 { content }
             </Text>
         );
@@ -96,4 +88,4 @@ class ConfirmDialog extends BaseSubmitDialog<Props, *> {
     _renderHTML: string => Object | string
 }
 
-export default translate(connect(_abstractMapStateToProps)(ConfirmDialog));
+export default translate(connect()(ConfirmDialog));

react/features/base/dialog/components/native/CustomDialog.js

@@ -2,8 +2,6 @@
 
 import { connect } from 'react-redux';
 
-import { _abstractMapStateToProps } from '../../functions';
-
 import BaseDialog, { type Props } from './BaseDialog';
 
 /**
@@ -21,4 +19,4 @@ class CustomDialog extends BaseDialog<Props, *> {
     }
 }
 
-export default connect(_abstractMapStateToProps)(CustomDialog);
+export default connect()(CustomDialog);

react/features/base/dialog/components/native/CustomSubmitDialog.js

@@ -4,8 +4,6 @@ import { connect } from 'react-redux';
 
 import { translate } from '../../../i18n';
 
-import { _abstractMapStateToProps } from '../../functions';
-
 import { type Props as BaseProps } from './BaseDialog';
 import BaseSubmitDialog from './BaseSubmitDialog';
 
@@ -29,5 +27,4 @@ class CustomSubmitDialog extends BaseSubmitDialog<Props, *> {
     }
 }
 
-export default translate(
-    connect(_abstractMapStateToProps)(CustomSubmitDialog));
+export default translate(connect()(CustomSubmitDialog));

react/features/base/dialog/components/native/InputDialog.js

@@ -5,9 +5,6 @@ import { View, Text, TextInput, TouchableOpacity } from 'react-native';
 import { connect } from 'react-redux';
 
 import { translate } from '../../../i18n';
-import { StyleType } from '../../../styles';
-
-import { _abstractMapStateToProps } from '../../functions';
 
 import { type State as AbstractState } from '../AbstractDialog';
 
@@ -21,11 +18,6 @@ import {
 type Props = {
     ...BaseProps,
 
-    /**
-     * The color-schemed stylesheet of the feature.
-     */
-    _dialogStyles: StyleType,
-
     /**
      * The untranslated i18n key for the field label on the dialog.
      */
@@ -71,7 +63,7 @@ class InputDialog extends BaseDialog<Props, State> {
      * @inheritdoc
      */
     _renderContent() {
-        const { _dialogStyles, okDisabled, t } = this.props;
+        const { okDisabled, t } = this.props;
 
         return (
             <View>
@@ -80,12 +72,12 @@ class InputDialog extends BaseDialog<Props, State> {
                         brandedDialog.mainWrapper,
                         styles.fieldWrapper
                     ] }>
-                    <Text style = { _dialogStyles.fieldLabel }>
+                    <Text style = { styles.fieldLabel }>
                         { t(this.props.contentKey) }
                     </Text>
                     <TextInput
                         onChangeText = { this._onChangeText }
-                        style = { _dialogStyles.field }
+                        style = { styles.field }
                         underlineColorAndroid = { FIELD_UNDERLINE }
                         value = { this.state.fieldValue }
                         { ...this.props.textInputProps } />
@@ -99,7 +91,7 @@ class InputDialog extends BaseDialog<Props, State> {
                             brandedDialog.buttonFarLeft,
                             brandedDialog.buttonFarRight
                         ] }>
-                        <Text style = { _dialogStyles.text }>
+                        <Text style = { brandedDialog.text }>
                             { t('dialog.Ok') }
                         </Text>
                     </TouchableOpacity>
@@ -138,4 +130,4 @@ class InputDialog extends BaseDialog<Props, State> {
     }
 }
 
-export default translate(connect(_abstractMapStateToProps)(InputDialog));
+export default translate(connect()(InputDialog));

react/features/base/dialog/components/native/styles.js

@@ -2,12 +2,12 @@
 
 import { StyleSheet } from 'react-native';
 
-import { ColorSchemeRegistry, schemeColor } from '../../../color-scheme';
 import { BoxModel, ColorPalette, createStyleSheet } from '../../../styles';
 
 import { PREFERRED_DIALOG_SIZE } from '../../constants';
 
 const BORDER_RADIUS = 5;
+const DIALOG_BORDER_COLOR = 'rgba(255, 255, 255, 0.2)';
 
 export const FIELD_UNDERLINE = ColorPalette.transparent;
 
@@ -22,6 +22,47 @@ export const MD_ITEM_MARGIN_PADDING = 16;
 
 export const PLACEHOLDER_COLOR = ColorPalette.lightGrey;
 
+/**
+ * Default styles for the items of a {@code BottomSheet}-based menu.
+ *
+ * These have been implemented as per the Material Design guidelines:
+ * {@link https://material.io/guidelines/components/bottom-sheets.html}.
+ */
+const bottomSheetItemStyles = createStyleSheet({
+    /**
+     * Container style for a generic item rendered in the menu.
+     */
+    style: {
+        alignItems: 'center',
+        flexDirection: 'row',
+        height: MD_ITEM_HEIGHT
+    },
+
+    /**
+     * Style for the {@code Icon} element in a generic item of the menu.
+     */
+    iconStyle: {
+        color: ColorPalette.white,
+        fontSize: 24
+    },
+
+    /**
+     * Style for the label in a generic item rendered in the menu.
+     */
+    labelStyle: {
+        color: ColorPalette.white,
+        flexShrink: 1,
+        fontSize: MD_FONT_SIZE,
+        marginLeft: 32,
+        opacity: 0.90
+    }
+});
+
+export const bottomSheetItemStylesCombined = {
+    ...bottomSheetItemStyles,
+    underlayColor: ColorPalette.overflowMenuItemUnderlay
+};
+
 /**
  * The React {@code Component} styles of {@code BottomSheet}. These have
  * been implemented as per the Material Design guidelines:
@@ -53,6 +94,16 @@ export const bottomSheetStyles = createStyleSheet({
     overlay: {
         ...StyleSheet.absoluteFillObject,
         backgroundColor: 'rgba(127, 127, 127, 0.6)'
+    },
+
+    /**
+     * Bottom sheet's base style.
+     */
+    sheet: {
+        backgroundColor: 'rgb(0, 3, 6)',
+        flex: 1,
+        paddingHorizontal: MD_ITEM_MARGIN_PADDING,
+        paddingVertical: 8
     }
 });
 
@@ -80,17 +131,38 @@ export const brandedDialog = createStyleSheet({
         borderBottomRightRadius: BORDER_RADIUS
     },
 
+    buttonSeparator: {
+        borderRightColor: DIALOG_BORDER_COLOR,
+        borderRightWidth: 1
+    },
+
     buttonWrapper: {
         alignItems: 'stretch',
         borderRadius: BORDER_RADIUS,
         flexDirection: 'row'
     },
 
+    closeStyle: {
+        color: ColorPalette.white,
+        fontSize: MD_FONT_SIZE
+    },
+
     closeWrapper: {
         alignSelf: 'flex-end',
         padding: BoxModel.padding
     },
 
+    dialog: {
+        alignItems: 'stretch',
+        backgroundColor: 'rgb(0, 3, 6)',
+        borderColor: DIALOG_BORDER_COLOR,
+        borderRadius: BORDER_RADIUS,
+        borderWidth: 1,
+        flex: 1,
+        flexDirection: 'column',
+        maxWidth: PREFERRED_DIALOG_SIZE
+    },
+
     mainWrapper: {
         alignSelf: 'stretch',
         padding: BoxModel.padding * 2,
@@ -107,135 +179,56 @@ export const brandedDialog = createStyleSheet({
         flexDirection: 'row',
         justifyContent: 'center',
         padding: 30
+    },
+
+    text: {
+        color: ColorPalette.white,
+        fontSize: MD_FONT_SIZE,
+        textAlign: 'center'
     }
 });
 
 /**
- * Reusable (colored) style for text in any branded dialogs.
+ * The React {@code Component} styles of {@code Dialog}.
  */
-const brandedDialogText = {
-    color: schemeColor('text'),
-    fontSize: MD_FONT_SIZE,
-    textAlign: 'center'
-};
+export const dialog = createStyleSheet({
+    /**
+     * The style of the {@code Text} in a {@code Dialog} button.
+     */
+    buttonText: {
+        color: ColorPalette.blue
+    },
+
+    /**
+     * The style of the {@code Text} in a {@code Dialog} button which is
+     * disabled.
+     */
+    disabledButtonText: {
+        color: ColorPalette.darkGrey
+    }
+});
 
 export const inputDialog = createStyleSheet({
     bottomField: {
         marginBottom: 0
     },
 
+    field: {
+        ...brandedDialog.text,
+        borderBottomWidth: 1,
+        borderColor: DIALOG_BORDER_COLOR,
+        margin: BoxModel.margin,
+        textAlign: 'left'
+    },
+
+    fieldLabel: {
+        ...brandedDialog.text,
+        margin: BoxModel.margin,
+        textAlign: 'left'
+    },
+
     fieldWrapper: {
         ...brandedDialog.mainWrapper,
         paddingBottom: BoxModel.padding * 2
     }
 });
-
-/**
- * Default styles for the items of a {@code BottomSheet}-based menu.
- *
- * These have been implemented as per the Material Design guidelines:
- * {@link https://material.io/guidelines/components/bottom-sheets.html}.
- */
-ColorSchemeRegistry.register('BottomSheet', {
-    /**
-     * Style for the {@code Icon} element in a generic item of the menu.
-     */
-    iconStyle: {
-        color: schemeColor('icon'),
-        fontSize: 24
-    },
-
-    /**
-     * Style for the label in a generic item rendered in the menu.
-     */
-    labelStyle: {
-        color: schemeColor('label'),
-        flexShrink: 1,
-        fontSize: MD_FONT_SIZE,
-        marginLeft: 32,
-        opacity: 0.90
-    },
-
-    /**
-     * Bottom sheet's base style.
-     */
-    sheet: {
-        backgroundColor: schemeColor('background'),
-        flex: 1,
-        paddingHorizontal: MD_ITEM_MARGIN_PADDING,
-        paddingVertical: 8
-    },
-
-    /**
-     * Container style for a generic item rendered in the menu.
-     */
-    style: {
-        alignItems: 'center',
-        flexDirection: 'row',
-        height: MD_ITEM_HEIGHT
-    },
-
-    /**
-     * Additional style that is not directly used as a style object.
-     */
-    underlayColor: ColorPalette.overflowMenuItemUnderlay
-});
-
-/**
- * Color schemed styles for all the component based on the abstract dialog.
- */
-ColorSchemeRegistry.register('Dialog', {
-    /**
-     * Separator line for the buttons in a dialog.
-     */
-    buttonSeparator: {
-        borderRightColor: schemeColor('border'),
-        borderRightWidth: 1
-    },
-
-    /**
-     * Style of the close icon on a dialog.
-     */
-    closeStyle: {
-        color: schemeColor('icon'),
-        fontSize: MD_FONT_SIZE
-    },
-
-    /**
-     * Base style of the dialogs.
-     */
-    dialog: {
-        alignItems: 'stretch',
-        backgroundColor: schemeColor('background'),
-        borderColor: schemeColor('border'),
-        borderRadius: BORDER_RADIUS,
-        borderWidth: 1,
-        flex: 1,
-        flexDirection: 'column',
-        maxWidth: PREFERRED_DIALOG_SIZE
-    },
-
-    /**
-     * Field on an input dialog.
-     */
-    field: {
-        ...brandedDialogText,
-        borderBottomWidth: 1,
-        borderColor: schemeColor('border'),
-        margin: BoxModel.margin,
-        textAlign: 'left'
-    },
-
-    /**
-     * Style for the field label on an input dialog.
-     */
-    fieldLabel: {
-        ...brandedDialogText,
-        margin: BoxModel.margin,
-        textAlign: 'left'
-    },
-
-    text: {
-        ...brandedDialogText
-    }
-});

react/features/base/dialog/functions.js

@@ -1,6 +1,5 @@
 /* @flow */
 
-import { ColorSchemeRegistry } from '../color-scheme';
 import { toState } from '../redux';
 
 /**
@@ -16,17 +15,3 @@ import { toState } from '../redux';
 export function isDialogOpen(stateful: Function | Object, component: Object) {
     return toState(stateful)['features/base/dialog'].component === component;
 }
-
-/**
- * Maps part of the Redux state to the props of any Dialog based component.
- *
- * @param {Object} state - The Redux state.
- * @returns {{
- *     _dialogStyles: StyleType
- * }}
- */
-export function _abstractMapStateToProps(state: Object): Object {
-    return {
-        _dialogStyles: ColorSchemeRegistry.get(state, 'Dialog')
-    };
-}

react/features/base/participants/components/ParticipantView.native.js

@@ -12,7 +12,6 @@ import {
     VideoTrack
 } from '../../media';
 import { Container, TintedView } from '../../react';
-import { StyleType } from '../../styles';
 import { TestHint } from '../../testing/components';
 import { getTrackByMediaTypeAndParticipant } from '../../tracks';
 
@@ -98,11 +97,6 @@ type Props = {
      */
     tintEnabled: boolean,
 
-    /**
-     * The style of the tinting when applied.
-     */
-    tintStyle: StyleType,
-
     /**
      * The test hint id which can be used to locate the {@code ParticipantView}
      * on the jitsi-meet-torture side. If not provided, the
@@ -192,12 +186,11 @@ class ParticipantView extends Component<Props> {
      */
     render() {
         const {
+            onPress,
             _avatar: avatar,
             _connectionStatus: connectionStatus,
             _renderVideo: renderVideo,
-            _videoTrack: videoTrack,
-            onPress,
-            tintStyle
+            _videoTrack: videoTrack
         } = this.props;
 
         const waitForVideoStarted = false;
@@ -206,10 +199,9 @@ class ParticipantView extends Component<Props> {
         const renderAvatar = Boolean(!renderVideo && avatar);
 
         // If the connection has problems, we will "tint" the video / avatar.
-        const connectionProblem
-            = connectionStatus !== JitsiParticipantConnectionStatus.ACTIVE;
         const useTint
-            = connectionProblem || this.props.tintEnabled;
+            = connectionStatus !== JitsiParticipantConnectionStatus.ACTIVE
+                || this.props.tintEnabled;
 
         const testHintId
             = this.props.testHintId
@@ -246,9 +238,7 @@ class ParticipantView extends Component<Props> {
                 { useTint
 
                     // If the connection has problems, tint the video / avatar.
-                    && <TintedView
-                        style = {
-                            connectionProblem ? undefined : tintStyle } /> }
+                    && <TintedView /> }
 
                 { this.props.useConnectivityInfoLabel
                     && this._renderConnectionInfo(connectionStatus) }

react/features/base/react/components/native/TintedView.js

@@ -3,7 +3,7 @@
 import React, { Component } from 'react';
 import { StyleSheet, View } from 'react-native';
 
-import { TINTED_VIEW_DEFAULT } from './styles';
+import { ColorPalette } from '../../../styles';
 
 /**
  * Base style for the {@code TintedView} component.
@@ -24,6 +24,16 @@ type Props = {
      */
     children?: React$Node,
 
+    /**
+     * Color used as the background of the view. Defaults to
+     */
+    color: string,
+
+    /**
+     * Opacity for the
+     */
+    opacity: number,
+
     /**
      * Style to override the base style.
      */
@@ -35,6 +45,15 @@ type Props = {
  * the given color and opacity.
  */
 export default class TintedView extends Component<Props> {
+    /**
+     * Default values for the component's props.
+     */
+    static defaultProps = {
+        color: ColorPalette.appBackground,
+        opacity: 0.8,
+        style: {}
+    };
+
     /**
      * Implements React's {@link Component#render()}.
      *
@@ -42,7 +61,7 @@ export default class TintedView extends Component<Props> {
      * @returns {ReactElement}
      */
     render() {
-        const { children, style } = this.props;
+        const { children, color, opacity, style } = this.props;
 
         // XXX Don't tint the children, tint the background only.
         return (
@@ -53,8 +72,11 @@ export default class TintedView extends Component<Props> {
                     pointerEvents = 'none'
                     style = { [
                         BASE_STYLE,
-                        TINTED_VIEW_DEFAULT,
-                        style
+                        style,
+                        {
+                            backgroundColor: color,
+                            opacity
+                        }
                     ] } />
                 <View
                     pointerEvents = 'box-none'

react/features/base/react/components/native/styles.js

@@ -324,11 +324,6 @@ const SIDEBAR_STYLES = {
     }
 };
 
-export const TINTED_VIEW_DEFAULT = {
-    backgroundColor: ColorPalette.appBackground,
-    opacity: 0.8
-};
-
 /**
  * The styles of the generic React {@code Component}s implemented by the feature
  * base/react.

react/features/base/styles/components/styles/ColorPalette.js

@@ -18,7 +18,6 @@ export const ColorPalette = {
      * the sake of consistency.
      */
     black: BLACK,
-    blackBlue: 'rgb(0, 3, 6)',
     blue: '#17A0DB',
     blueHighlight: '#1081b2',
     buttonUnderlay: '#495258',
@@ -28,7 +27,7 @@ export const ColorPalette = {
     overflowMenuItemUnderlay: '#EEEEEE',
     red: '#D00000',
     transparent: 'rgba(0, 0, 0, 0)',
-    white: '#FFFFFF',
+    white: 'white',
 
     /**
      * These are colors from the atlaskit to be used on mobile, when needed.

react/features/base/styles/functions.js

@@ -6,23 +6,6 @@ import { ColorPalette } from './components';
 declare type StyleSheet = Object;
 export type StyleType = StyleSheet | Array<StyleSheet>;
 
-/**
- * RegExp pattern for long HEX color format.
- */
-const HEX_LONG_COLOR_FORMAT
-    = /^#([0-9A-F]{2,2})([0-9A-F]{2,2})([0-9A-F]{2,2})$/i;
-
-/**
- * RegExp pattern for short HEX color format.
- */
-const HEX_SHORT_COLOR_FORMAT
-    = /^#([0-9A-F]{1,1})([0-9A-F]{1,1})([0-9A-F]{1,1})$/i;
-
-/**
- * RegExp pattern for RGB color format.
- */
-const RGB_COLOR_FORMAT = /^rgb\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\)$/i;
-
 /**
  * The list of the well-known style properties which may not be numbers on Web
  * but must be numbers on React Native.
@@ -104,49 +87,6 @@ export function fixAndroidViewClipping<T: StyleSheet>(styles: T): T {
     return styles;
 }
 
-/**
- * Returns an rgba format of the provided color if it's in hex or rgb format.
- *
- * NOTE: The function will return the same color if it's not in one of those
- * two formats (e.g. 'white').
- *
- * @param {string} color - The string representation of the color in rgb or hex
- * format.
- * @param {number} alpha - The alpha value to apply.
- * @returns {string}
- */
-export function getRGBAFormat(color: string, alpha: number): string {
-    let match = color.match(HEX_LONG_COLOR_FORMAT);
-
-    if (match) {
-        return `#${match[1]}${match[2]}${match[3]}${_getAlphaInHex(alpha)}`;
-    }
-
-    match = color.match(HEX_SHORT_COLOR_FORMAT);
-    if (match) {
-        return `#${match[1]}${match[1]}${match[2]}${match[2]}${match[3]}${
-            match[3]}${_getAlphaInHex(alpha)}`;
-    }
-
-    match = color.match(RGB_COLOR_FORMAT);
-    if (match) {
-        return `rgba(${match[1]}, ${match[2]}, ${match[3]}, ${alpha})`;
-    }
-
-    return color;
-}
-
-/**
- * Converts an [0..1] alpha value into HEX.
- *
- * @param {number} alpha - The alpha value to convert.
- * @returns {string}
- */
-function _getAlphaInHex(alpha: number): string {
-    return Number(Math.round(255 * alpha)).toString(16)
-        .padStart(2, '0');
-}
-
 /**
  * Shims style properties to work correctly on native. Allows us to minimize the
  * number of style declarations that need to be set or overridden for specific

react/features/feedback/components/FeedbackDialog.web.js

@@ -15,7 +15,6 @@ import { translate } from '../../base/i18n';
 
 import { cancelFeedback, submitFeedback } from '../actions';
 
-declare var APP: Object;
 declare var interfaceConfig: Object;
 
 const scoreAnimationClass
@@ -173,9 +172,6 @@ class FeedbackDialog extends Component<Props, State> {
      */
     componentDidMount() {
         sendAnalytics(createFeedbackOpenEvent());
-        if (typeof APP !== 'undefined') {
-            APP.API.notifyFeedbackPromptDisplayed();
-        }
     }
 
     /**

react/features/filmstrip/components/native/Thumbnail.js

@@ -3,7 +3,6 @@
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 
-import { ColorSchemeRegistry } from '../../../base/color-scheme';
 import { openDialog } from '../../../base/dialog';
 import { Audio, MEDIA_TYPE } from '../../../base/media';
 import {
@@ -13,7 +12,6 @@ import {
     pinParticipant
 } from '../../../base/participants';
 import { Container } from '../../../base/react';
-import { StyleType } from '../../../base/styles';
 import { getTrackByMediaTypeAndParticipant } from '../../../base/tracks';
 
 import { RemoteVideoMenu } from '../../../remote-video-menu';
@@ -55,11 +53,6 @@ type Props = {
      */
     _onShowRemoteVideoMenu: ?Function,
 
-    /**
-     * The color-schemed stylesheet of the feature.
-     */
-    _styles: StyleType,
-
     /**
      * The Redux representation of the participant's video track.
      */
@@ -113,7 +106,6 @@ class Thumbnail extends Component<Props> {
             _largeVideo: largeVideo,
             _onClick,
             _onShowRemoteVideoMenu,
-            _styles,
             _videoTrack: videoTrack,
             disablePin,
             disableTint,
@@ -143,7 +135,7 @@ class Thumbnail extends Component<Props> {
                 style = { [
                     styles.thumbnail,
                     participant.pinned && !disablePin
-                        ? _styles.thumbnailPinned : null,
+                        ? styles.thumbnailPinned : null,
                     this.props.styleOverrides || null
                 ] }
                 touchFeedback = { false }>
@@ -156,9 +148,7 @@ class Thumbnail extends Component<Props> {
                 <ParticipantView
                     avatarSize = { AVATAR_SIZE }
                     participantId = { participantId }
-                    style = { _styles.participantViewStyle }
                     tintEnabled = { participantInLargeVideo && !disableTint }
-                    tintStyle = { _styles.activeThumbnailTint }
                     zOrder = { 1 } />
 
                 { participant.role === PARTICIPANT_ROLE.MODERATOR
@@ -229,7 +219,6 @@ function _mapDispatchToProps(dispatch: Function, ownProps): Object {
  *      _audioTrack: Track,
  *      _isModerator: boolean,
  *      _largeVideo: Object,
- *      _styles: StyleType,
  *      _videoTrack: Track
  *  }}
  */
@@ -249,7 +238,6 @@ function _mapStateToProps(state, ownProps) {
         _audioTrack: audioTrack,
         _isModerator: isLocalParticipantModerator(state),
         _largeVideo: largeVideo,
-        _styles: ColorSchemeRegistry.get(state, 'Thumbnail'),
         _videoTrack: videoTrack
     };
 }

react/features/filmstrip/components/styles.js

@@ -1,6 +1,3 @@
-// @flow
-
-import { ColorSchemeRegistry, schemeColor } from '../../base/color-scheme';
 import { ColorPalette } from '../../base/styles';
 import { FILMSTRIP_SIZE } from '../constants';
 
@@ -137,6 +134,19 @@ export default {
         position: 'absolute'
     },
 
+    /**
+     * Pinned video thumbnail style.
+     */
+    thumbnailPinned: {
+        borderColor: ColorPalette.blue,
+        shadowColor: ColorPalette.black,
+        shadowOffset: {
+            height: 5,
+            width: 5
+        },
+        shadowRadius: 5
+    },
+
     tileView: {
         alignSelf: 'center'
     },
@@ -150,36 +160,3 @@ export default {
         justifyContent: 'center'
     }
 };
-
-/**
- * Color schemed styles for the @{code Thumbnail} component.
- */
-ColorSchemeRegistry.register('Thumbnail', {
-
-    /**
-     * Tinting style of the on-stage participant thumbnail.
-     */
-    activeThumbnailTint: {
-        backgroundColor: schemeColor('activeParticipantTint')
-    },
-
-    /**
-     * Coloring if the thumbnail background.
-     */
-    participantViewStyle: {
-        backgroundColor: schemeColor('background')
-    },
-
-    /**
-     * Pinned video thumbnail style.
-     */
-    thumbnailPinned: {
-        borderColor: schemeColor('activeParticipantHighlight'),
-        shadowColor: schemeColor('activeParticipantHighlight'),
-        shadowOffset: {
-            height: 5,
-            width: 5
-        },
-        shadowRadius: 5
-    }
-});

react/features/invite/functions.js

@@ -274,19 +274,17 @@ export function invitePeopleAndChatRooms( // eslint-disable-line max-params
         return Promise.resolve();
     }
 
-    return fetch(
-           `${inviteServiceUrl}?token=${jwt}`,
-           {
-               body: JSON.stringify({
-                   'invited': inviteItems,
-                   'url': inviteUrl
-               }),
-               method: 'POST',
-               headers: {
-                   'Content-Type': 'application/json'
-               }
-           }
-    );
+    return new Promise((resolve, reject) => {
+        $.post(
+                `${inviteServiceUrl}?token=${jwt}`,
+                JSON.stringify({
+                    'invited': inviteItems,
+                    'url': inviteUrl
+                }),
+                resolve,
+                'json')
+            .fail((jqxhr, textStatus, error) => reject(error));
+    });
 }
 
 /**

react/features/large-video/components/LargeVideo.native.js

@@ -3,34 +3,27 @@
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 
-import { ColorSchemeRegistry } from '../../base/color-scheme';
 import { ParticipantView } from '../../base/participants';
 import { DimensionsDetector } from '../../base/responsive-ui';
-import { StyleType } from '../../base/styles';
 
-import { AVATAR_SIZE } from './styles';
+import styles, { AVATAR_SIZE } from './styles';
 
 /**
  * The type of the React {@link Component} props of {@link LargeVideo}.
  */
 type Props = {
 
+    /**
+     * Callback to invoke when the {@code LargeVideo} is clicked/pressed.
+     */
+    onClick: Function,
+
     /**
      * The ID of the participant (to be) depicted by LargeVideo.
      *
      * @private
      */
-    _participantId: string,
-
-    /**
-     * The color-schemed stylesheet of the feature.
-     */
-    _styles: StyleType,
-
-    /**
-     * Callback to invoke when the {@code LargeVideo} is clicked/pressed.
-     */
-    onClick: Function,
+    _participantId: string
 };
 
 /**
@@ -121,7 +114,6 @@ class LargeVideo extends Component<Props, State> {
         } = this.state;
         const {
             _participantId,
-            _styles,
             onClick
         } = this.props;
 
@@ -132,7 +124,7 @@ class LargeVideo extends Component<Props, State> {
                     avatarSize = { avatarSize }
                     onPress = { onClick }
                     participantId = { _participantId }
-                    style = { _styles.largeVideo }
+                    style = { styles.largeVideo }
                     testHintId = 'org.jitsi.meet.LargeVideo'
                     useConnectivityInfoLabel = { useConnectivityInfoLabel }
                     zOrder = { 0 }
@@ -148,14 +140,12 @@ class LargeVideo extends Component<Props, State> {
  * @param {Object} state - Redux state.
  * @private
  * @returns {{
- *     _participantId: string,
- *     _styles: StyleType
+ *     _participantId: string
  * }}
  */
 function _mapStateToProps(state) {
     return {
-        _participantId: state['features/large-video'].participantId,
-        _styles: ColorSchemeRegistry.get(state, 'LargeVideo')
+        _participantId: state['features/large-video'].participantId
     };
 }
 

react/features/large-video/components/styles.js

@@ -1,16 +1,13 @@
 import { StyleSheet } from 'react-native';
 
-import { ColorSchemeRegistry, schemeColor } from '../../base/color-scheme';
+import { ColorPalette, createStyleSheet } from '../../base/styles';
 
 /**
  * Size for the Avatar.
  */
 export const AVATAR_SIZE = 200;
 
-/**
- * Color schemed styles for the @{LargeVideo} component.
- */
-ColorSchemeRegistry.register('LargeVideo', {
+export default createStyleSheet({
 
     /**
      * Large video container style.
@@ -18,7 +15,7 @@ ColorSchemeRegistry.register('LargeVideo', {
     largeVideo: {
         ...StyleSheet.absoluteFillObject,
         alignItems: 'stretch',
-        backgroundColor: schemeColor('background'),
+        backgroundColor: ColorPalette.appBackground,
         flex: 1,
         justifyContent: 'center'
     }

react/features/mobile/audio-mode/middleware.js

@@ -7,8 +7,7 @@ import {
     CONFERENCE_FAILED,
     CONFERENCE_LEFT,
     CONFERENCE_JOINED,
-    SET_AUDIO_ONLY,
-    getCurrentConference
+    SET_AUDIO_ONLY
 } from '../../base/conference';
 import { MiddlewareRegistry } from '../../base/redux';
 
@@ -32,15 +31,9 @@ MiddlewareRegistry.register(({ getState }) => next => action => {
         switch (action.type) {
         case APP_WILL_MOUNT:
         case CONFERENCE_FAILED:
-        case CONFERENCE_LEFT: {
-            const conference = getCurrentConference(getState());
-
-            if (typeof conference === 'undefined') {
-                mode = AudioMode.DEFAULT;
-            }
-
+        case CONFERENCE_LEFT:
+            mode = AudioMode.DEFAULT;
             break;
-        }
 
         /*
          * NOTE: We moved the audio mode setting from CONFERENCE_WILL_JOIN to

react/features/mobile/call-integration/middleware.js

@@ -8,10 +8,9 @@ import { appNavigate } from '../../app';
 import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from '../../base/app';
 import {
     CONFERENCE_FAILED,
-    CONFERENCE_JOINED,
     CONFERENCE_LEFT,
     CONFERENCE_WILL_JOIN,
-    CONFERENCE_WILL_LEAVE,
+    CONFERENCE_JOINED,
     SET_AUDIO_ONLY,
     getConferenceName,
     getCurrentConference
@@ -64,14 +63,7 @@ CallIntegration && MiddlewareRegistry.register(store => next => action => {
     case CONFERENCE_JOINED:
         return _conferenceJoined(store, next, action);
 
-    // If a conference is being left in a graceful manner then
-    // the CONFERENCE_WILL_LEAVE fires as soon as the conference starts
-    // disconnecting. We need to destroy the call on the native side as soon
-    // as possible, because the disconnection process is asynchronous and
-    // Android not always supports two simultaneous calls at the same time
-    // (even though it should according to the spec).
     case CONFERENCE_LEFT:
-    case CONFERENCE_WILL_LEAVE:
         return _conferenceLeft(store, next, action);
 
     case CONFERENCE_WILL_JOIN:
@@ -149,7 +141,6 @@ function _conferenceFailed(store, next, action) {
         const { callUUID } = action.conference;
 
         if (callUUID) {
-            delete action.conference.callUUID;
             CallIntegration.reportCallFailed(callUUID);
         }
     }
@@ -201,7 +192,6 @@ function _conferenceLeft(store, next, action) {
     const { callUUID } = action.conference;
 
     if (callUUID) {
-        delete action.conference.callUUID;
         CallIntegration.endCall(callUUID);
     }
 

react/features/recording/components/LiveStream/AbstractStreamKeyForm.js

@@ -52,8 +52,7 @@ type State = {
  *
  * @extends Component
  */
-export default class AbstractStreamKeyForm<P: Props>
-    extends Component<P, State> {
+export default class AbstractStreamKeyForm extends Component<Props, State> {
     helpURL: string;
     _debouncedUpdateValidationErrorVisibility: Function;
 
@@ -62,7 +61,7 @@ export default class AbstractStreamKeyForm<P: Props>
      *
      * @inheritdoc
      */
-    constructor(props: P) {
+    constructor(props: Props) {
         super(props);
 
         this.state = {
@@ -89,7 +88,7 @@ export default class AbstractStreamKeyForm<P: Props>
      *
      * @inheritdoc
      */
-    componentDidUpdate(prevProps: P) {
+    componentDidUpdate(prevProps: Props) {
         if (this.props.value !== prevProps.value) {
             this._debouncedUpdateValidationErrorVisibility();
         }

react/features/recording/components/LiveStream/native/GoogleSigninForm.js

@@ -4,9 +4,7 @@ import React, { Component } from 'react';
 import { Text, View } from 'react-native';
 import { connect } from 'react-redux';
 
-import { _abstractMapStateToProps } from '../../../../base/dialog';
 import { translate } from '../../../../base/i18n';
-import { StyleType } from '../../../../base/styles';
 
 import {
     GOOGLE_API_STATES,
@@ -25,11 +23,6 @@ const logger = require('jitsi-meet-logger').getLogger(__filename);
  */
 type Props = {
 
-    /**
-     * Style of the dialogs feature.
-     */
-    _dialogStyles: StyleType,
-
     /**
      * The Redux dispatch Function.
      */
@@ -109,7 +102,7 @@ class GoogleSigninForm extends Component<Props> {
      * @inheritdoc
      */
     render() {
-        const { _dialogStyles, t } = this.props;
+        const { t } = this.props;
         const { googleAPIState, googleResponse } = this.props;
         const signedInUser = googleResponse
             && googleResponse.user
@@ -128,11 +121,7 @@ class GoogleSigninForm extends Component<Props> {
         return (
             <View style = { styles.formWrapper }>
                 <View style = { styles.helpText }>
-                    <Text
-                        style = { [
-                            _dialogStyles.text,
-                            styles.text
-                        ] }>
+                    <Text style = { styles.text }>
                         { userInfo }
                     </Text>
                 </View>
@@ -236,7 +225,6 @@ function _mapStateToProps(state: Object) {
     const { googleAPIState, googleResponse } = state['features/google-api'];
 
     return {
-        ..._abstractMapStateToProps(state),
         googleAPIState,
         googleResponse
     };

react/features/recording/components/LiveStream/native/StreamKeyForm.js

@@ -2,24 +2,13 @@
 
 import React from 'react';
 import { Linking, Text, TextInput, TouchableOpacity, View } from 'react-native';
-import { connect } from 'react-redux';
 
-import { _abstractMapStateToProps } from '../../../../base/dialog';
 import { translate } from '../../../../base/i18n';
-import { StyleType } from '../../../../base/styles';
 
 import AbstractStreamKeyForm, {
-    type Props as AbstractProps
+    type Props
 } from '../AbstractStreamKeyForm';
 
-type Props = AbstractProps & {
-
-    /**
-     * Style of the dialogs feature.
-     */
-    _dialogStyles: StyleType
-};
-
 import styles, { PLACEHOLDER_COLOR } from './styles';
 
 /**
@@ -27,7 +16,7 @@ import styles, { PLACEHOLDER_COLOR } from './styles';
  *
  * @extends Component
  */
-class StreamKeyForm extends AbstractStreamKeyForm<Props> {
+class StreamKeyForm extends AbstractStreamKeyForm {
     /**
      * Initializes a new {@code StreamKeyForm} instance.
      *
@@ -48,16 +37,11 @@ class StreamKeyForm extends AbstractStreamKeyForm<Props> {
      * @returns {ReactElement}
      */
     render() {
-        const { _dialogStyles, t } = this.props;
+        const { t } = this.props;
 
         return (
             <View style = { styles.formWrapper }>
-                <Text
-                    style = { [
-                        _dialogStyles.text,
-                        styles.text,
-                        styles.streamKeyInputLabel
-                    ] }>
+                <Text style = { styles.streamKeyInputLabel }>
                     {
                         t('dialog.streamKey')
                     }
@@ -72,11 +56,7 @@ class StreamKeyForm extends AbstractStreamKeyForm<Props> {
                     {
                         this.state.showValidationError
                             ? <View style = { styles.formFooterItem }>
-                                <Text
-                                    style = { [
-                                        _dialogStyles.text,
-                                        styles.warningText
-                                    ] }>
+                                <Text style = { styles.warningText }>
                                     { t('liveStreaming.invalidStreamKey') }
                                 </Text>
                             </View>
@@ -86,11 +66,7 @@ class StreamKeyForm extends AbstractStreamKeyForm<Props> {
                         <TouchableOpacity
                             onPress = { this._onOpenHelp }
                             style = { styles.streamKeyHelp } >
-                            <Text
-                                style = { [
-                                    _dialogStyles.text,
-                                    styles.text
-                                ] }>
+                            <Text style = { styles.text }>
                                 {
                                     t('liveStreaming.streamIdHelp')
                                 }
@@ -122,4 +98,4 @@ class StreamKeyForm extends AbstractStreamKeyForm<Props> {
     }
 }
 
-export default translate(connect(_abstractMapStateToProps)(StreamKeyForm));
+export default translate(StreamKeyForm);

react/features/recording/components/LiveStream/native/StreamKeyPicker.js

@@ -8,11 +8,8 @@ import {
     TouchableOpacity,
     View
 } from 'react-native';
-import { connect } from 'react-redux';
 
-import { _abstractMapStateToProps } from '../../../../base/dialog';
 import { translate } from '../../../../base/i18n';
-import { StyleType } from '../../../../base/styles';
 
 import { YOUTUBE_LIVE_DASHBOARD_URL } from '../constants';
 
@@ -20,11 +17,6 @@ import styles, { ACTIVE_OPACITY, TOUCHABLE_UNDERLAY } from './styles';
 
 type Props = {
 
-    /**
-     * Style of the dialogs feature.
-     */
-    _dialogStyles: StyleType,
-
     /**
      * The list of broadcasts the user can pick from.
      */
@@ -82,7 +74,7 @@ class StreamKeyPicker extends Component<Props, State> {
      * @inheritdoc
      */
     render() {
-        const { _dialogStyles, broadcasts } = this.props;
+        const { broadcasts } = this.props;
 
         if (!broadcasts) {
             return null;
@@ -93,11 +85,7 @@ class StreamKeyPicker extends Component<Props, State> {
                 <View style = { styles.formWrapper }>
                     <TouchableOpacity
                         onPress = { this._onOpenYoutubeDashboard }>
-                        <Text
-                            style = { [
-                                _dialogStyles.text,
-                                styles.warningText
-                            ] }>
+                        <Text style = { styles.warningText }>
                             { this.props.t(
                                 'liveStreaming.getStreamKeyManually') }
                         </Text>
@@ -109,11 +97,7 @@ class StreamKeyPicker extends Component<Props, State> {
         return (
             <View style = { styles.formWrapper }>
                 <View style = { styles.streamKeyPickerCta }>
-                    <Text
-                        style = { [
-                            _dialogStyles.text,
-                            styles.text
-                        ] }>
+                    <Text style = { styles.text }>
                         { this.props.t('liveStreaming.choose') }
                     </Text>
                 </View>
@@ -129,11 +113,7 @@ class StreamKeyPicker extends Component<Props, State> {
                                     ? styles.streamKeyPickerItemHighlight : null
                             ] }
                             underlayColor = { TOUCHABLE_UNDERLAY }>
-                            <Text
-                                style = { [
-                                    _dialogStyles.text,
-                                    styles.text
-                                ] }>
+                            <Text style = { styles.text }>
                                 { broadcast.title }
                             </Text>
                         </TouchableHighlight>))
@@ -175,5 +155,4 @@ class StreamKeyPicker extends Component<Props, State> {
     }
 }
 
-export default translate(
-    connect(_abstractMapStateToProps)(StreamKeyPicker));
+export default translate(StreamKeyPicker);

react/features/recording/components/LiveStream/native/styles.js

@@ -99,7 +99,8 @@ export default createStyleSheet({
      * Label for the previous field.
      */
     streamKeyInputLabel: {
-        alignSelf: 'flex-start'
+        alignSelf: 'flex-start',
+        color: ColorPalette.white
     },
 
     /**
@@ -145,8 +146,7 @@ export default createStyleSheet({
     },
 
     text: {
-        fontSize: 14,
-        textAlign: 'left'
+        color: ColorPalette.white
     },
 
     /**

react/features/recording/components/LiveStream/web/StreamKeyForm.js

@@ -14,7 +14,7 @@ import AbstractStreamKeyForm, {
  *
  * @extends Component
  */
-class StreamKeyForm extends AbstractStreamKeyForm<Props> {
+class StreamKeyForm extends AbstractStreamKeyForm {
 
     /**
      * Initializes a new {@code StreamKeyForm} instance.

react/features/recording/components/Recording/StartRecordingDialogContent.js

@@ -7,10 +7,7 @@ import {
     createRecordingDialogEvent,
     sendAnalytics
 } from '../../../analytics';
-import {
-    DialogContent,
-    _abstractMapStateToProps
-} from '../../../base/dialog';
+import { DialogContent } from '../../../base/dialog';
 import { translate } from '../../../base/i18n';
 import {
     Container,
@@ -18,7 +15,6 @@ import {
     Switch,
     Text
 } from '../../../base/react';
-import { StyleType } from '../../../base/styles';
 import { authorizeDropbox, updateDropboxToken } from '../../../dropbox';
 
 import styles from './styles';
@@ -26,11 +22,6 @@ import { getRecordingDurationEstimation } from '../../functions';
 
 type Props = {
 
-    /**
-     * Style of the dialogs feature.
-     */
-    _dialogStyles: StyleType,
-
     /**
      * The redux dispatch function.
      */
@@ -108,7 +99,7 @@ class StartRecordingDialogContent extends Component<Props> {
      */
     _renderNoIntegrationsContent() {
         return (
-            <DialogContent style = { this.props._dialogStyles.text }>
+            <DialogContent style = { styles.noIntegrationContent }>
                 { this.props.t('recording.startRecordingBody') }
             </DialogContent>
         );
@@ -121,7 +112,7 @@ class StartRecordingDialogContent extends Component<Props> {
      * @returns {React$Component}
      */
     _renderIntegrationsContent() {
-        const { _dialogStyles, isTokenValid, isValidating, t } = this.props;
+        const { isTokenValid, isValidating, t } = this.props;
 
         let content = null;
 
@@ -144,10 +135,7 @@ class StartRecordingDialogContent extends Component<Props> {
                     style = { styles.header }>
                     <Text
                         className = 'recording-title'
-                        style = {{
-                            ..._dialogStyles.text,
-                            ...styles.title
-                        }}>
+                        style = { styles.title }>
                         { t('recording.authDropboxText') }
                     </Text>
                     <Switch
@@ -260,5 +248,4 @@ class StartRecordingDialogContent extends Component<Props> {
     }
 }
 
-export default translate(
-    connect(_abstractMapStateToProps)(StartRecordingDialogContent));
+export default translate(connect()(StartRecordingDialogContent));

react/features/recording/components/Recording/styles.native.js

@@ -28,6 +28,10 @@ export default createStyleSheet({
         paddingBottom: _PADDING
     },
 
+    noIntegrationContent: {
+        color: ColorPalette.white
+    },
+
     startRecordingText: {
         paddingBottom: _PADDING
     },
@@ -38,6 +42,7 @@ export default createStyleSheet({
     },
 
     title: {
+        color: ColorPalette.white,
         fontSize: 16,
         fontWeight: 'bold'
     },

react/features/remote-video-menu/components/native/RemoteVideoMenu.js

@@ -4,16 +4,15 @@ import React, { Component } from 'react';
 import { Text, View } from 'react-native';
 import { connect } from 'react-redux';
 
-import { ColorSchemeRegistry } from '../../../base/color-scheme';
 import {
-    BottomSheet
+    BottomSheet,
+    bottomSheetItemStylesCombined
 } from '../../../base/dialog';
 import {
     Avatar,
     getAvatarURL,
     getParticipantDisplayName
 } from '../../../base/participants';
-import { StyleType } from '../../../base/styles';
 
 import { hideRemoteVideoMenu } from '../../actions';
 
@@ -43,11 +42,6 @@ type Props = {
      */
     _avatarURL: string,
 
-    /**
-     * The color-schemed stylesheet of the BottomSheet.
-     */
-    _bottomSheetStyles: StyleType,
-
     /**
      * Display name of the participant retreived from Redux.
      */
@@ -79,7 +73,7 @@ class RemoteVideoMenu extends Component<Props> {
             afterClick: this._onCancel,
             showLabel: true,
             participantID: this.props.participant.id,
-            styles: this.props._bottomSheetStyles
+            styles: bottomSheetItemStylesCombined
         };
 
         return (
@@ -119,7 +113,6 @@ class RemoteVideoMenu extends Component<Props> {
  * @private
  * @returns {{
  *      _avatarURL: string,
- *      _bottomSheetStyles: StyleType,
  *      _participantDisplayName: string
  *  }}
  */
@@ -128,8 +121,6 @@ function _mapStateToProps(state, ownProps) {
 
     return {
         _avatarURL: getAvatarURL(participant),
-        _bottomSheetStyles:
-            ColorSchemeRegistry.get(state, 'BottomSheet'),
         _participantDisplayName: getParticipantDisplayName(
             state, participant.id)
     };

react/features/toolbox/components/native/OverflowMenu.js

@@ -4,12 +4,11 @@ import React, { Component } from 'react';
 import { Platform } from 'react-native';
 import { connect } from 'react-redux';
 
-import { ColorSchemeRegistry } from '../../../base/color-scheme';
 import {
     BottomSheet,
+    bottomSheetItemStylesCombined,
     hideDialog
 } from '../../../base/dialog';
-import { StyleType } from '../../../base/styles';
 import { InviteButton } from '../../../invite';
 import { AudioRouteButton } from '../../../mobile/audio-mode';
 import { LiveStreamButton, RecordButton } from '../../../recording';
@@ -27,15 +26,10 @@ declare var __DEV__;
  */
 type Props = {
 
-    /**
-     * The color-schemed stylesheet of the dialog feature.
-     */
-    _bottomSheetStyles: StyleType,
-
     /**
      * Used for hiding the dialog when the selection was completed.
      */
-    dispatch: Function
+    dispatch: Function,
 };
 
 /**
@@ -74,7 +68,7 @@ class OverflowMenu extends Component<Props> {
         const buttonProps = {
             afterClick: this._onCancel,
             showLabel: true,
-            styles: this.props._bottomSheetStyles
+            styles: bottomSheetItemStylesCombined
         };
 
         return (
@@ -112,22 +106,6 @@ class OverflowMenu extends Component<Props> {
     }
 }
 
-/**
- * Function that maps parts of Redux state tree into component props.
- *
- * @param {Object} state - Redux state.
- * @private
- * @returns {{
- *      _bottomSheetStyles: StyleType
- *  }}
- */
-function _mapStateToProps(state) {
-    return {
-        _bottomSheetStyles:
-            ColorSchemeRegistry.get(state, 'BottomSheet')
-    };
-}
-
-OverflowMenu_ = connect(_mapStateToProps)(OverflowMenu);
+OverflowMenu_ = connect()(OverflowMenu);
 
 export default OverflowMenu_;

react/features/toolbox/components/native/Toolbox.js

@@ -5,19 +5,21 @@ import { View } from 'react-native';
 import { connect } from 'react-redux';
 
 import { Container } from '../../../base/react';
-import { ColorSchemeRegistry } from '../../../base/color-scheme';
-import { StyleType } from '../../../base/styles';
 import { ChatButton } from '../../../chat';
 
 import { isToolboxVisible } from '../../functions';
-import { HANGUP_BUTTON_SIZE } from '../../constants';
 
 import AudioMuteButton from '../AudioMuteButton';
 import HangupButton from '../HangupButton';
+import VideoMuteButton from '../VideoMuteButton';
 
 import OverflowMenuButton from './OverflowMenuButton';
-import styles from './styles';
-import VideoMuteButton from '../VideoMuteButton';
+import styles, {
+    chatButtonOverride,
+    hangupButtonStyles,
+    toolbarButtonStyles,
+    toolbarToggledButtonStyles
+} from './styles';
 
 /**
  * The number of buttons other than {@link HangupButton} to render in
@@ -41,11 +43,6 @@ const _BUTTON_SIZE_FACTOR = 0.85;
  */
 type Props = {
 
-    /**
-     * The color-schemed stylesheet of the feature.
-     */
-    _styles: StyleType,
-
     /**
      * The indicator which determines whether the toolbox is visible.
      */
@@ -114,7 +111,6 @@ class Toolbox extends Component<Props, State> {
      * @returns {number}
      */
     _calculateButtonSize() {
-        const { _styles } = this.props;
         const { width } = this.state;
 
         if (width <= 0) {
@@ -122,8 +118,8 @@ class Toolbox extends Component<Props, State> {
             return width;
         }
 
-        const hangupButtonSize = HANGUP_BUTTON_SIZE;
-        const { style } = _styles.buttonStyles;
+        const hangupButtonSize = styles.hangupButton.width;
+        const { style } = toolbarButtonStyles;
         let buttonSize
             = (width
 
@@ -159,14 +155,12 @@ class Toolbox extends Component<Props, State> {
      * @returns {Object | Array}
      */
     _getChatButtonToggledStyle(baseStyle) {
-        const { _styles } = this.props;
-
         if (Array.isArray(baseStyle.style)) {
             return {
                 ...baseStyle,
                 style: [
                     ...baseStyle.style,
-                    _styles.chatButtonOverride.toggled
+                    chatButtonOverride.toggled
                 ]
             };
         }
@@ -175,7 +169,7 @@ class Toolbox extends Component<Props, State> {
             ...baseStyle,
             style: [
                 baseStyle.style,
-                _styles.chatButtonOverride.toggled
+                chatButtonOverride.toggled
             ]
         };
     }
@@ -202,9 +196,9 @@ class Toolbox extends Component<Props, State> {
      * @returns {React$Node}
      */
     _renderToolbar() {
-        const { _styles } = this.props;
         const buttonSize = this._calculateButtonSize();
-        let { buttonStyles, toggledButtonStyles } = _styles;
+        let buttonStyles = toolbarButtonStyles;
+        let toggledButtonStyles = toolbarToggledButtonStyles;
 
         if (buttonSize > 0) {
             const extraButtonStyle = {
@@ -247,8 +241,7 @@ class Toolbox extends Component<Props, State> {
                 <AudioMuteButton
                     styles = { buttonStyles }
                     toggledStyles = { toggledButtonStyles } />
-                <HangupButton
-                    styles = { _styles.hangupButtonStyles } />
+                <HangupButton styles = { hangupButtonStyles } />
                 <VideoMuteButton
                     styles = { buttonStyles }
                     toggledStyles = { toggledButtonStyles } />
@@ -268,13 +261,11 @@ class Toolbox extends Component<Props, State> {
  * {@code Toolbox} props.
  * @private
  * @returns {{
- *     _styles: StyleType,
  *     _visible: boolean
  * }}
  */
 function _mapStateToProps(state: Object): Object {
     return {
-        _styles: ColorSchemeRegistry.get(state, 'Toolbox'),
         _visible: isToolboxVisible(state)
     };
 }

react/features/toolbox/components/native/styles.js

@@ -1,6 +1,4 @@
 // @flow
-
-import { ColorSchemeRegistry, schemeColor } from '../../../base/color-scheme';
 import { BoxModel, ColorPalette, createStyleSheet } from '../../../base/styles';
 
 import { HANGUP_BUTTON_SIZE } from '../../constants';
@@ -11,7 +9,7 @@ import { HANGUP_BUTTON_SIZE } from '../../constants';
  * The style of toolbar buttons.
  */
 const toolbarButton = {
-    backgroundColor: schemeColor('button'),
+    backgroundColor: ColorPalette.white,
     borderRadius: 20,
     borderWidth: 0,
     flex: 0,
@@ -22,6 +20,7 @@ const toolbarButton = {
     // XXX We probably tested BoxModel.margin and discovered it to be too small
     // for our taste.
     marginHorizontal: 7,
+    opacity: 0.7,
     width: 40
 };
 
@@ -34,26 +33,29 @@ const toolbarButtonIcon = {
     fontSize: 22
 };
 
-/**
- * The style of toolbar buttons which display white icons.
- */
-const whiteToolbarButton = {
-    ...toolbarButton,
-    backgroundColor: schemeColor('buttonToggled')
-};
-
-/**
- * The icon style of toolbar buttons which display white icons.
- */
-const whiteToolbarButtonIcon = {
-    ...toolbarButtonIcon,
-    color: ColorPalette.white
-};
-
 /**
  * The Toolbox and toolbar related styles.
  */
 const styles = createStyleSheet({
+    /**
+     * The style of the toolbar button which hangs the current conference up.
+     */
+    hangupButton: {
+        ...toolbarButton,
+        backgroundColor: ColorPalette.red,
+        borderRadius: 30,
+        height: HANGUP_BUTTON_SIZE,
+        width: HANGUP_BUTTON_SIZE
+    },
+
+    /**
+     * The icon style of toolbar buttons which hangs the current conference up.
+     */
+    hangupButtonIcon: {
+        ...toolbarButtonIcon,
+        color: ColorPalette.white,
+        fontSize: 24
+    },
 
     /**
      * The style of the toolbar.
@@ -67,60 +69,74 @@ const styles = createStyleSheet({
         paddingHorizontal: BoxModel.margin
     },
 
+    /**
+     * The style of toolbar buttons.
+     */
+    toolbarButton,
+
+    /**
+     * The icon style of the toolbar buttons.
+     */
+    toolbarButtonIcon,
+
     /**
      * The style of the root/top-level {@link Container} of {@link Toolbox}.
      */
     toolbox: {
         flexDirection: 'column',
         flexGrow: 0
+    },
+
+    /**
+     * The style of toolbar buttons which display white icons.
+     */
+    whiteToolbarButton: {
+        ...toolbarButton,
+        backgroundColor: ColorPalette.buttonUnderlay
+    },
+
+    /**
+     * The icon style of toolbar buttons which display white icons.
+     */
+    whiteToolbarButtonIcon: {
+        ...toolbarButtonIcon,
+        color: ColorPalette.white
     }
 });
 
 export default styles;
 
 /**
- * Color schemed styles for the @{Toolbox} component.
+ * Styles for the hangup button.
  */
-ColorSchemeRegistry.register('Toolbox', {
-    /**
-     * Styles for buttons in the toolbar.
-     */
-    buttonStyles: {
-        iconStyle: toolbarButtonIcon,
-        style: toolbarButton
-    },
+export const hangupButtonStyles = {
+    iconStyle: styles.whiteToolbarButtonIcon,
+    style: styles.hangupButton,
+    underlayColor: ColorPalette.buttonUnderlay
+};
 
-    /**
-     * Overrides to the standard styles that we apply to the chat button, as
-     * that behaves slightly differently to other buttons.
-     */
-    chatButtonOverride: {
-        toggled: {
-            backgroundColor: ColorPalette.blue
-        }
-    },
+/**
+ * Styles for buttons in the toolbar.
+ */
+export const toolbarButtonStyles = {
+    iconStyle: styles.toolbarButtonIcon,
+    style: styles.toolbarButton
+};
 
-    hangupButtonStyles: {
-        iconStyle: whiteToolbarButtonIcon,
-        style: {
-            ...toolbarButton,
-            backgroundColor: schemeColor('hangup'),
-            borderRadius: HANGUP_BUTTON_SIZE / 2,
-            height: HANGUP_BUTTON_SIZE,
-            width: HANGUP_BUTTON_SIZE
-        },
-        underlayColor: ColorPalette.buttonUnderlay
-    },
+/**
+ * Styles for toggled buttons in the toolbar.
+ */
+export const toolbarToggledButtonStyles = {
+    iconStyle: styles.whiteToolbarButtonIcon,
+    style: styles.whiteToolbarButton
+};
 
-    /**
-     * Styles for toggled buttons in the toolbar.
-     */
-    toggledButtonStyles: {
-        iconStyle: whiteToolbarButtonIcon,
-        style: {
-            ...whiteToolbarButton,
-            borderColor: schemeColor('buttonToggledBorder'),
-            borderWidth: 1
-        }
+/**
+ * Overrides to the standard styles that we apply to the chat button, as that
+ * behaves slightly differently to other buttons.
+ */
+export const chatButtonOverride = createStyleSheet({
+    toggled: {
+        backgroundColor: ColorPalette.blue
     }
 });

react/features/toolbox/components/web/Toolbox.js

@@ -312,9 +312,21 @@ class Toolbox extends Component<Props> {
      * @returns {ReactElement}
      */
     render() {
-        const { _visible, _visibleButtons } = this.props;
+        const {
+            _chatOpen,
+            _hideInviteButton,
+            _overflowMenuVisible,
+            _raisedHand,
+            _visible,
+            _visibleButtons,
+            t
+        } = this.props;
         const rootClassNames = `new-toolbox ${_visible ? 'visible' : ''} ${
             _visibleButtons.size ? '' : 'no-buttons'}`;
+        const overflowMenuContent = this._renderOverflowMenuContent();
+        const overflowHasItems = Boolean(overflowMenuContent.filter(
+            child => child).length);
+        const toolbarAccLabel = 'toolbar.accessibilityLabel.moreActionsMenu';
 
         return (
             <div
@@ -322,8 +334,72 @@ class Toolbox extends Component<Props> {
                 id = 'new-toolbox'
                 onMouseOut = { this._onMouseOut }
                 onMouseOver = { this._onMouseOver }>
-                <div className = 'toolbox-background' />
-                { this._renderToolboxContent() }
+                <div className = 'button-group-left'>
+                    { this._shouldShowButton('desktop')
+                        && this._renderDesktopSharingButton() }
+                    { this._shouldShowButton('raisehand')
+                        && <ToolbarButton
+                            accessibilityLabel =
+                                { t('toolbar.accessibilityLabel.raiseHand') }
+                            iconName = { _raisedHand
+                                ? 'icon-raised-hand toggled'
+                                : 'icon-raised-hand' }
+                            onClick = { this._onToolbarToggleRaiseHand }
+                            tooltip = { t('toolbar.raiseHand') } /> }
+                    { this._shouldShowButton('chat')
+                        && <div className = 'toolbar-button-with-badge'>
+                            <ToolbarButton
+                                accessibilityLabel =
+                                    { t('toolbar.accessibilityLabel.chat') }
+                                iconName = { _chatOpen
+                                    ? 'icon-chat toggled'
+                                    : 'icon-chat' }
+                                onClick = { this._onToolbarToggleChat }
+                                tooltip = { t('toolbar.chat') } />
+                            <ChatCounter />
+                        </div> }
+                    {
+                        this._shouldShowButton('closedcaptions')
+                            && <ClosedCaptionButton />
+                    }
+                </div>
+                <div className = 'button-group-center'>
+                    <AudioMuteButton
+                        visible = { this._shouldShowButton('microphone') } />
+                    <HangupButton
+                        visible = { this._shouldShowButton('hangup') } />
+                    <VideoMuteButton
+                        visible = { this._shouldShowButton('camera') } />
+                </div>
+                <div className = 'button-group-right'>
+                    { this._shouldShowButton('localrecording')
+                        && <LocalRecordingButton
+                            onClick = {
+                                this._onToolbarOpenLocalRecordingInfoDialog
+                            } />
+                    }
+                    { this._shouldShowButton('tileview')
+                        && <TileViewButton /> }
+                    { this._shouldShowButton('invite')
+                        && !_hideInviteButton
+                        && <ToolbarButton
+                            accessibilityLabel =
+                                { t('toolbar.accessibilityLabel.invite') }
+                            iconName = 'icon-add'
+                            onClick = { this._onToolbarOpenInvite }
+                            tooltip = { t('toolbar.invite') } /> }
+                    { this._shouldShowButton('info') && <InfoDialogButton /> }
+                    { overflowHasItems
+                        && <OverflowMenuButton
+                            isOpen = { _overflowMenuVisible }
+                            onVisibilityChange = { this._onSetOverflowVisible }>
+                            <ul
+                                aria-label = { t(toolbarAccLabel) }
+                                className = 'overflow-menu'>
+                                { overflowMenuContent }
+                            </ul>
+                        </OverflowMenuButton> }
+                </div>
             </div>
         );
     }
@@ -924,97 +1000,6 @@ class Toolbox extends Component<Props> {
         ];
     }
 
-    /**
-     * Renders the toolbox content.
-     *
-     * @returns {Array<ReactElement>}
-     */
-    _renderToolboxContent() {
-        const {
-            _chatOpen,
-            _hideInviteButton,
-            _overflowMenuVisible,
-            _raisedHand,
-            t
-        } = this.props;
-        const overflowMenuContent = this._renderOverflowMenuContent();
-        const overflowHasItems = Boolean(overflowMenuContent.filter(
-            child => child).length);
-        const toolbarAccLabel = 'toolbar.accessibilityLabel.moreActionsMenu';
-
-        return (
-            <div className = 'toolbox-content'>
-                <div className = 'button-group-left'>
-                    { this._shouldShowButton('desktop')
-                        && this._renderDesktopSharingButton() }
-                    { this._shouldShowButton('raisehand')
-                        && <ToolbarButton
-                            accessibilityLabel =
-                                {
-                                    t('toolbar.accessibilityLabel.raiseHand')
-                                }
-                            iconName = { _raisedHand
-                                ? 'icon-raised-hand toggled'
-                                : 'icon-raised-hand' }
-                            onClick = { this._onToolbarToggleRaiseHand }
-                            tooltip = { t('toolbar.raiseHand') } /> }
-                    { this._shouldShowButton('chat')
-                        && <div className = 'toolbar-button-with-badge'>
-                            <ToolbarButton
-                                accessibilityLabel =
-                                    { t('toolbar.accessibilityLabel.chat') }
-                                iconName = { _chatOpen
-                                    ? 'icon-chat toggled'
-                                    : 'icon-chat' }
-                                onClick = { this._onToolbarToggleChat }
-                                tooltip = { t('toolbar.chat') } />
-                            <ChatCounter />
-                        </div> }
-                    {
-                        this._shouldShowButton('closedcaptions')
-                            && <ClosedCaptionButton />
-                    }
-                </div>
-                <div className = 'button-group-center'>
-                    <AudioMuteButton
-                        visible = { this._shouldShowButton('microphone') } />
-                    <HangupButton
-                        visible = { this._shouldShowButton('hangup') } />
-                    <VideoMuteButton
-                        visible = { this._shouldShowButton('camera') } />
-                </div>
-                <div className = 'button-group-right'>
-                    { this._shouldShowButton('localrecording')
-                        && <LocalRecordingButton
-                            onClick = {
-                                this._onToolbarOpenLocalRecordingInfoDialog
-                            } />
-                    }
-                    { this._shouldShowButton('tileview')
-                        && <TileViewButton /> }
-                    { this._shouldShowButton('invite')
-                        && !_hideInviteButton
-                        && <ToolbarButton
-                            accessibilityLabel =
-                                { t('toolbar.accessibilityLabel.invite') }
-                            iconName = 'icon-invite'
-                            onClick = { this._onToolbarOpenInvite }
-                            tooltip = { t('toolbar.invite') } /> }
-                    { this._shouldShowButton('info') && <InfoDialogButton /> }
-                    { overflowHasItems
-                        && <OverflowMenuButton
-                            isOpen = { _overflowMenuVisible }
-                            onVisibilityChange = { this._onSetOverflowVisible }>
-                            <ul
-                                aria-label = { t(toolbarAccLabel) }
-                                className = 'overflow-menu'>
-                                { overflowMenuContent }
-                            </ul>
-                        </OverflowMenuButton> }
-                </div>
-            </div>);
-    }
-
     _shouldShowButton: (string) => boolean;
 
     /**