[Glitch] Change window resize handler to switch to/from mobile layout as soon as needed

Port bd4099d976 to glitch-soc

Signed-off-by: Thibaut Girka <thib@sitedethib.com>
This commit is contained in:
ThibG 2019-08-25 15:48:50 +02:00 committed by Thibaut Girka
parent b90bd31cfd
commit 6ee2501991
1 changed files with 14 additions and 4 deletions

View File

@ -138,14 +138,24 @@ class SwitchingColumnsArea extends React.PureComponent {
window.removeEventListener('resize', this.handleResize); window.removeEventListener('resize', this.handleResize);
} }
handleResize = debounce(() => { handleLayoutChange = debounce(() => {
// The cached heights are no longer accurate, invalidate // The cached heights are no longer accurate, invalidate
this.props.onLayoutChange(); this.props.onLayoutChange();
this.setState({ mobile: isMobile(window.innerWidth, this.props.layout) });
}, 500, { }, 500, {
trailing: true, trailing: true,
}); })
handleResize = () => {
const mobile = isMobile(window.innerWidth, this.props.layout);
if (mobile !== this.state.mobile) {
this.handleLayoutChange.cancel();
this.props.onLayoutChange();
this.setState({ mobile });
} else {
this.handleLayoutChange();
}
}
setRef = c => { setRef = c => {
this.node = c.getWrappedInstance(); this.node = c.getWrappedInstance();