feat(tile-view): allow disabling thumbnail enlargement

config.js

@@ -995,6 +995,9 @@ var config = {
     // If true, tile view will not be enabled automatically when the participants count threshold is reached.
     // disableTileView: true,
 
+    // If true, the tiles will be displayed contained within the available space rather than enlarged to cover it.
+    // disableTileEnlargement: true,
+
     // Controls the visibility and behavior of the top header conference info labels.
     // If a label's id is not in any of the 2 arrays, it will not be visible at all on the header.
     // conferenceInfo: {

react/features/base/config/configWhitelist.js

@@ -122,6 +122,7 @@ export default [
     'disableSimulcast',
     'disableThirdPartyRequests',
     'disableTileView',
+    'disableTileEnlargement',
     'displayJids',
     'doNotStoreRoom',
     'doNotFlipLocalVideo',

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

@@ -114,6 +114,11 @@ export type Props = {|
      */
     _disableLocalVideoFlip: boolean,
 
+    /**
+     * Indicates whether enlargement of tiles to fill the available space is disabled.
+     */
+    _disableTileEnlargement: boolean,
+
     /**
      * The display mode of the thumbnail.
      */
@@ -548,6 +553,7 @@ class Thumbnail extends Component<Props, State> {
         const { canPlayEventReceived } = this.state;
         const {
             _currentLayout,
+            _disableTileEnlargement,
             _height,
             _isHidden,
             _isScreenSharing,
@@ -581,7 +587,7 @@ class Thumbnail extends Component<Props, State> {
         if (!_isScreenSharing) {
             if (canPlayEventReceived || _participant.local) {
                 videoStyles = {
-                    objectFit: _height < 320 && tileViewActive ? 'contain' : 'cover'
+                    objectFit: (_height < 320 && tileViewActive) || _disableTileEnlargement ? 'contain' : 'cover'
                 };
             } else {
                 videoStyles = {
@@ -1124,6 +1130,7 @@ function _mapStateToProps(state, ownProps): Object {
         startSilent,
         defaultLocalDisplayName,
         disableLocalVideoFlip,
+        disableTileEnlargement,
         iAmRecorder,
         iAmSipGateway
     } = state['features/base/config'];
@@ -1181,6 +1188,7 @@ function _mapStateToProps(state, ownProps): Object {
         _currentLayout,
         _defaultLocalDisplayName: defaultLocalDisplayName,
         _disableLocalVideoFlip: Boolean(disableLocalVideoFlip),
+        _disableTileEnlargement: Boolean(disableTileEnlargement),
         _isHidden: isLocal && iAmRecorder && !iAmSipGateway,
         _isAudioOnly: Boolean(state['features/base/audio-only'].enabled),
         _isCurrentlyOnLargeVideo: state['features/large-video']?.participantId === id,