a3a1e2e01f added the padding
to maxTilesPx which was confusing the calculation of whether we
should be showing the 'show more' button or the 'show less' button.
Hopefully this fixes the issue without undoing fixes from
https://github.com/matrix-org/matrix-react-sdk/pull/4964 or the
above commit by adding the padding in all cased in `get padding()`.
Fixes https://github.com/vector-im/riot-web/issues/14426
The issue only applies to lists which won't have a 'show less' button, as the lists with the button would have the button's height considered when determining visible tiles. For lists that were under that (1-4 rooms), the show more button wasn't being considered and thus leading to the padding being added rather than subtracted, causing an extra tile to render.
By ensuring we include the padding for both show more and show less, we ensure that no extra tiles get rendered and that the cutoff semantics are still present.
this way we have a flexbox layout in the resizer with:
- the resize handle (fixed)
- the show more/less button, if any (fixed)
- the list of tiles (grabbing whatever is left)
Known issues:
* Causes scroll jumps when the button gets added to DOM
* Resize handle is invisible when there's a show more button
TODO:
* Clean up comments
* Clean up useless code (all the padding stuff isn't needed)
Previously we were creating a notification state whenever we needed one, which was leading to hundreds of listeners even on a small account. To ease the burden, and reduce the load of having to wake so many listeners, we now record a single listener for each tag ID and room combination.
This commit also introduces a number of utilities to make future notification work a bit of an easier transition, such as the `isX` and `hasX` getters on the new NotificationState abstract class. Similarly, "snapshots" have been added to reduce code duplication between different kinds of states checking for updates.
The ListNotificationState is now heavily tied into the store which offers it to help reuse the cache of room notification states.
Fixes https://github.com/vector-im/riot-web/issues/14370
This is more general maintenance than performance as the RoomList doesn't need to be generating layouts for the sublists, and it certainly doesn't need to be creating a bunch of extra ones.
The sublists are perfectly capable of getting their own layout instance and using it, and we are perfectly able to limit the number of these things we create through the session's lifespan.
In this demonstration, we remove the cutting line (as it collides with the tile in a weird spot) and instead replace the tile with a placeholder when the text is about to collide with the avatar in the tile. We use a `round()` for this because through some amazing coincidence the collision happens at 0.47, which is close enough to 0.5 for people not to notice.
react-resizer appears to be okay at tracking state, but it often desyncs from reality. re-resizer is more maintained and more broadly used (160k downloads vs 110k), and appears to generally do a better job of tracking the cursor.
The new library has some oddities though, such as deltas, touch support (hence the polyfill), and calling handles "Enable".
For https://github.com/vector-im/riot-web/issues/14022
