|
@@ -152,6 +152,7 @@ StateListenerRegistry.register(
|
152
|
152
|
* Symbol mapping used for the tile view responsiveness computation.
|
153
|
153
|
*/
|
154
|
154
|
const responsiveColumnMapping = {
|
|
155
|
+ multipleColumns: Symbol('multipleColumns'),
|
155
|
156
|
singleColumn: Symbol('singleColumn'),
|
156
|
157
|
twoColumns: Symbol('twoColumns'),
|
157
|
158
|
twoParticipantsSingleColumn: Symbol('twoParticipantsSingleColumn')
|
|
@@ -173,14 +174,13 @@ StateListenerRegistry.register(
|
173
|
174
|
// Forcing the recomputation of tiles when screen switches in or out of
|
174
|
175
|
// the (ASPECT_RATIO_BREAKPOINT, SINGLE_COLUMN_BREAKPOINT] interval.
|
175
|
176
|
return responsiveColumnMapping.twoParticipantsSingleColumn;
|
|
177
|
+ } else if (clientWidth < SINGLE_COLUMN_BREAKPOINT) {
|
|
178
|
+ // Forcing the recomputation of tiles when screen switches below SINGLE_COLUMN_BREAKPOINT.
|
|
179
|
+ return responsiveColumnMapping.singleColumn;
|
176
|
180
|
}
|
177
|
181
|
|
178
|
|
- /**
|
179
|
|
- * This gets called either when the width of the screen is above {@code TWO_COLUMN_BREAKPOINT}
|
180
|
|
- * or below {@CODE SINGLE_COLUMN_BREAKPOINT}, however, the internal logic from {@code getMaxColumnCount}
|
181
|
|
- * only takes the second case into consideration.
|
182
|
|
- */
|
183
|
|
- return responsiveColumnMapping.singleColumn;
|
|
182
|
+ // Forcing the recomputation of tiles when screen switches above TWO_COLUMN_BREAKPOINT.
|
|
183
|
+ return responsiveColumnMapping.multipleColumns;
|
184
|
184
|
},
|
185
|
185
|
/* listener */ (_, store) => {
|
186
|
186
|
const state = store.getState();
|