diff --git a/src/components/structures/LeftPanel.tsx b/src/components/structures/LeftPanel.tsx index 8699c27fdc..7df4bcadf3 100644 --- a/src/components/structures/LeftPanel.tsx +++ b/src/components/structures/LeftPanel.tsx @@ -110,6 +110,12 @@ export default class LeftPanel extends React.Component { UIStore.instance.removeListener("ListContainer", this.refreshStickyHeaders); } + public componentDidUpdate(prevProps: IProps, prevState: IState): void { + if (prevState.activeSpace !== this.state.activeSpace) { + this.refreshStickyHeaders(); + } + } + private updateActiveSpace = (activeSpace: Room) => { this.setState({ activeSpace }); }; @@ -429,6 +435,7 @@ export default class LeftPanel extends React.Component { onBlur={this.onBlur} isMinimized={this.props.isMinimized} activeSpace={this.state.activeSpace} + onListCollapse={this.refreshStickyHeaders} />; const containerClasses = classNames({ diff --git a/src/components/views/rooms/RoomList.tsx b/src/components/views/rooms/RoomList.tsx index 896021f918..8b36341ed0 100644 --- a/src/components/views/rooms/RoomList.tsx +++ b/src/components/views/rooms/RoomList.tsx @@ -55,6 +55,7 @@ interface IProps { onKeyDown: (ev: React.KeyboardEvent) => void; onFocus: (ev: React.FocusEvent) => void; onBlur: (ev: React.FocusEvent) => void; + onListCollapse?: (isExpanded: boolean) => void; resizeNotifier: ResizeNotifier; isMinimized: boolean; activeSpace: Room; @@ -538,6 +539,7 @@ export default class RoomList extends React.PureComponent { extraTiles={extraTiles} resizeNotifier={this.props.resizeNotifier} alwaysVisible={ALWAYS_VISIBLE_TAGS.includes(orderedTagId)} + onListCollapse={this.props.onListCollapse} /> }); } diff --git a/src/components/views/rooms/RoomSublist.tsx b/src/components/views/rooms/RoomSublist.tsx index eee93f6b01..df00524b3b 100644 --- a/src/components/views/rooms/RoomSublist.tsx +++ b/src/components/views/rooms/RoomSublist.tsx @@ -78,6 +78,7 @@ interface IProps { alwaysVisible?: boolean; resizeNotifier: ResizeNotifier; extraTiles?: ReactComponentElement[]; + onListCollapse?: (isExpanded: boolean) => void; // TODO: Account for https://github.com/vector-im/element-web/issues/14179 } @@ -472,6 +473,9 @@ export default class RoomSublist extends React.Component { private toggleCollapsed = () => { this.layout.isCollapsed = this.state.isExpanded; this.setState({isExpanded: !this.layout.isCollapsed}); + if (this.props.onListCollapse) { + this.props.onListCollapse(!this.layout.isCollapsed) + } }; private onHeaderKeyDown = (ev: React.KeyboardEvent) => {