Redesign: left panel fixes #2364

bwindels · 2018-12-18T13:44:51Z

fixes on left panel:

resizer sometimes failing (resizer sometimes stuck immediately after launch (perhaps if you try to resize during the catchup sync?). easy to repro for matthew & amandine element-hq/element-web#7903)
scroll indicator gradient being there/not being there when needed (Grey gradient shouldn't be present at the bottom of room sublist if you're at the bottom of that list. However if you filter the list, that check fails and so you get an unwanted gradient. element-hq/element-web#7867)
make scroll indicator smaller as room tiles are now smaller, went with 30px instead of 20px because the effect was often not visible anymore with 20px (make overflow scroll indicators smaller (20px?) element-hq/element-web#7893)

check overflow on mount restore size on query change (in case a sublist appeared) check overflow when updating rooms avoid duplicating for restoring size and checking overflow

Last friday a child <div> was added inside the ResizeHandle component, which made the parentElement/classList checks fail on the event.target here. This would only fail (and select all the text) when dragging exactly on the grey line (the div), not the transparent margin around it. use closest to make sure we have the root element of the handle.

the overflow/underflow events are not always reliable in nooverlay browsers (FF), so forward the checkOverflow call we need anyway for the scroll indicator gradients to see if we need to do the margin trick for the on-hover scrollbar we use in nooverlay browsers. this fixes on hover jumping in a subroomlist

jryans

Thanks, looks good to me! 😁

src/components/views/rooms/RoomList.js

src/components/structures/AutoHideScrollbar.js

bwindels added 8 commits December 18, 2018 10:56

call header clicked callback after rerendering, so resizer has DOM nodes

b359a2e

check overflow and restore sizes in more places inside RoomList:

cdcb3c1

check overflow on mount restore size on query change (in case a sublist appeared) check overflow when updating rooms avoid duplicating for restoring size and checking overflow

add id to props for completeness

279521c

make scroll indicator gradient smaller (40px->30px)

affe75f

change subroomlist min height, as roomtiles are smaller now

12a339f

fix docs

f0a412e

bwindels requested a review from a team December 18, 2018 13:45

jryans self-assigned this Dec 18, 2018

jryans approved these changes Dec 18, 2018

View reviewed changes

src/components/views/rooms/RoomList.js Outdated Show resolved Hide resolved

src/components/structures/AutoHideScrollbar.js Outdated Show resolved Hide resolved

bwindels added 2 commits December 18, 2018 15:06

fix empty comment line

2cda6d8

cleanup: do initialization in componentDidMount instead of render

31c13ad

bwindels merged commit acba36c into experimental Dec 18, 2018

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Redesign: left panel fixes #2364

Redesign: left panel fixes #2364

bwindels commented Dec 18, 2018

jryans left a comment

Redesign: left panel fixes #2364

Redesign: left panel fixes #2364

Conversation

bwindels commented Dec 18, 2018

jryans left a comment

Choose a reason for hiding this comment