diff --git a/src/components/views/rooms/RoomTile.tsx b/src/components/views/rooms/RoomTile.tsx index 259d2aa5b8..fc7d3a528b 100644 --- a/src/components/views/rooms/RoomTile.tsx +++ b/src/components/views/rooms/RoomTile.tsx @@ -53,7 +53,7 @@ import RoomListActions from "../../../actions/RoomListActions"; import defaultDispatcher from "../../../dispatcher/dispatcher"; import {ActionPayload} from "../../../dispatcher/payloads"; import { RoomNotificationStateStore } from "../../../stores/notifications/RoomNotificationStateStore"; -import { NotificationState } from "../../../stores/notifications/NotificationState"; +import { NOTIFICATION_STATE_UPDATE, NotificationState } from "../../../stores/notifications/NotificationState"; import AccessibleTooltipButton from "../elements/AccessibleTooltipButton"; interface IProps { @@ -66,7 +66,6 @@ interface IProps { type PartialDOMRect = Pick; interface IState { - notificationState: NotificationState; selected: boolean; notificationsMenuPosition: PartialDOMRect; generalMenuPosition: PartialDOMRect; @@ -112,12 +111,12 @@ const NotifOption: React.FC = ({active, onClick, iconClassNam export default class RoomTile extends React.PureComponent { private dispatcherRef: string; private roomTileRef = createRef(); + private notificationState: NotificationState; constructor(props: IProps) { super(props); this.state = { - notificationState: RoomNotificationStateStore.instance.getRoomState(this.props.room), selected: ActiveRoomObserver.activeRoomId === this.props.room.roomId, notificationsMenuPosition: null, generalMenuPosition: null, @@ -129,8 +128,14 @@ export default class RoomTile extends React.PureComponent { ActiveRoomObserver.addListener(this.props.room.roomId, this.onActiveRoomUpdate); this.dispatcherRef = defaultDispatcher.register(this.onAction); MessagePreviewStore.instance.on(ROOM_PREVIEW_CHANGED, this.onRoomPreviewChanged); + this.notificationState = RoomNotificationStateStore.instance.getRoomState(this.props.room); + this.notificationState.on(NOTIFICATION_STATE_UPDATE, this.onNotificationUpdate); } + private onNotificationUpdate = () => { + this.forceUpdate(); // notification state changed - update + }; + private get showContextMenu(): boolean { return !this.props.isMinimized && this.props.tag !== DefaultTagID.Invite; } @@ -152,6 +157,7 @@ export default class RoomTile extends React.PureComponent { } defaultDispatcher.unregister(this.dispatcherRef); MessagePreviewStore.instance.off(ROOM_PREVIEW_CHANGED, this.onRoomPreviewChanged); + this.notificationState.off(NOTIFICATION_STATE_UPDATE, this.onNotificationUpdate); } private onAction = (payload: ActionPayload) => { @@ -491,7 +497,7 @@ export default class RoomTile extends React.PureComponent { badge = (