feat(multi-stream) Add fake participant tile for screen share.

prioritize participants with screen shares
support local screen share track
auto pin screen share
support screen share for large video
ensure fake screen share participants are sorted
fix local screen share in vertical filmstrip
fix local screen share in tile mode
use FakeScreenShareParticipant component for screen share thumbnails
ensure changes are behind feature flag and update jsdocs
fix bug where local screen share was not rendering
update receiver constraints to include SS source names
remove fake ss participant creation on track update
fix: handle screenshare muted change and track removal
refactor: update key values for sortedFakeScreenShareParticipants
address PR comments
refactor getter for screenshare tracks
rename state to sortedRemoteFakeScreenShareParticipants

react/features/connection-stats/components/ConnectionStatsTable.js

@@ -91,6 +91,11 @@ type Props = {
      */
     isLocalVideo: boolean,
 
+    /**
+     * Whether or not the statistics are for screen share.
+     */
+    isFakeScreenShareParticipant: boolean,
+
     /**
      * The send-side max enabled resolution (aka the highest layer that is not
      * suspended on the send-side).
@@ -231,9 +236,19 @@ class ConnectionStatsTable extends Component<Props> {
      * @returns {ReactElement}
      */
     render() {
-        const { isLocalVideo, enableSaveLogs, disableShowMoreStats, classes } = this.props;
+        const {
+            classes,
+            disableShowMoreStats,
+            enableSaveLogs,
+            isFakeScreenShareParticipant,
+            isLocalVideo
+        } = this.props;
         const className = clsx(classes.connectionStatsTable, { [classes.mobile]: isMobileBrowser() });
 
+        if (isFakeScreenShareParticipant) {
+            return this._renderScreenShareStatus();
+        }
+
         return (
             <ContextMenu
                 className = { classes.contextMenu }
@@ -253,6 +268,34 @@ class ConnectionStatsTable extends Component<Props> {
         );
     }
 
+    /**
+     * Creates a ReactElement that will display connection statistics for a screen share thumbnail.
+     *
+     * @private
+     * @returns {ReactElement}
+     */
+    _renderScreenShareStatus() {
+        const { classes } = this.props;
+        const className = isMobileBrowser() ? 'connection-info connection-info__mobile' : 'connection-info';
+
+        return (<ContextMenu
+            className = { classes.contextMenu }
+            hidden = { false }
+            inDrawer = { true }>
+            <div
+                className = { className }
+                onClick = { onClick }>
+                { <table className = 'connection-info__container'>
+                    <tbody>
+                        { this._renderResolution() }
+                        { this._renderFrameRate() }
+                    </tbody>
+                </table> }
+
+            </div>
+        </ContextMenu>);
+    }
+
     /**
      * Creates a table as ReactElement that will display additional statistics
      * related to bandwidth and transport for the local user.