OpenCloud
/
riot-web
mirror of https://github.com/vector-im/riot-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #5051 from matrix-org/t3chguy/room-list/desync 

RoomList listen to notificationState updates for bolding
pull/21833/head
Michael Telatynski 2020-07-27 14:51:20 +01:00 committed by GitHub
parent 548b8adb66 a74470aff0
commit 9d6bf366a9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 16 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/views/rooms/RoomTile.tsx
View File

@ -53,7 +53,7 @@ import RoomListActions from "../../../actions/RoomListActions";
import defaultDispatcher from "../../../dispatcher/dispatcher"; import defaultDispatcher from "../../../dispatcher/dispatcher";
import {ActionPayload} from "../../../dispatcher/payloads"; import {ActionPayload} from "../../../dispatcher/payloads";
import { RoomNotificationStateStore } from "../../../stores/notifications/RoomNotificationStateStore"; 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"; import AccessibleTooltipButton from "../elements/AccessibleTooltipButton";
interface IProps { interface IProps {
@ -66,7 +66,6 @@ interface IProps {
type PartialDOMRect = Pick<DOMRect, "left" | "bottom">; type PartialDOMRect = Pick<DOMRect, "left" | "bottom">;
interface IState { interface IState {
notificationState: NotificationState;
selected: boolean; selected: boolean;
notificationsMenuPosition: PartialDOMRect; notificationsMenuPosition: PartialDOMRect;
generalMenuPosition: PartialDOMRect; generalMenuPosition: PartialDOMRect;
@ -112,12 +111,12 @@ const NotifOption: React.FC<INotifOptionProps> = ({active, onClick, iconClassNam
export default class RoomTile extends React.PureComponent<IProps, IState> { export default class RoomTile extends React.PureComponent<IProps, IState> {
private dispatcherRef: string; private dispatcherRef: string;
private roomTileRef = createRef<HTMLDivElement>(); private roomTileRef = createRef<HTMLDivElement>();
private notificationState: NotificationState;
constructor(props: IProps) { constructor(props: IProps) {
super(props); super(props);
this.state = { this.state = {
notificationState: RoomNotificationStateStore.instance.getRoomState(this.props.room),
selected: ActiveRoomObserver.activeRoomId === this.props.room.roomId, selected: ActiveRoomObserver.activeRoomId === this.props.room.roomId,
notificationsMenuPosition: null, notificationsMenuPosition: null,
generalMenuPosition: null, generalMenuPosition: null,
@ -129,8 +128,14 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
ActiveRoomObserver.addListener(this.props.room.roomId, this.onActiveRoomUpdate); ActiveRoomObserver.addListener(this.props.room.roomId, this.onActiveRoomUpdate);
this.dispatcherRef = defaultDispatcher.register(this.onAction); this.dispatcherRef = defaultDispatcher.register(this.onAction);
MessagePreviewStore.instance.on(ROOM_PREVIEW_CHANGED, this.onRoomPreviewChanged); 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 { private get showContextMenu(): boolean {
return !this.props.isMinimized && this.props.tag !== DefaultTagID.Invite; return !this.props.isMinimized && this.props.tag !== DefaultTagID.Invite;
} }
@ -152,6 +157,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
} }
defaultDispatcher.unregister(this.dispatcherRef); defaultDispatcher.unregister(this.dispatcherRef);
MessagePreviewStore.instance.off(ROOM_PREVIEW_CHANGED, this.onRoomPreviewChanged); MessagePreviewStore.instance.off(ROOM_PREVIEW_CHANGED, this.onRoomPreviewChanged);
this.notificationState.off(NOTIFICATION_STATE_UPDATE, this.onNotificationUpdate);
} }
private onAction = (payload: ActionPayload) => { private onAction = (payload: ActionPayload) => {
@ -491,7 +497,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
badge = ( badge = (
<div className="mx_RoomTile_badgeContainer" aria-hidden="true"> <div className="mx_RoomTile_badgeContainer" aria-hidden="true">
<NotificationBadge <NotificationBadge
notification={this.state.notificationState} notification={this.notificationState}
forceCount={false} forceCount={false}
roomId={this.props.room.roomId} roomId={this.props.room.roomId}
/> />
@ -515,7 +521,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
const nameClasses = classNames({ const nameClasses = classNames({
"mx_RoomTile_name": true, "mx_RoomTile_name": true,
"mx_RoomTile_nameWithPreview": !!messagePreview, "mx_RoomTile_nameWithPreview": !!messagePreview,
"mx_RoomTile_nameHasUnreadEvents": this.state.notificationState.isUnread, "mx_RoomTile_nameHasUnreadEvents": this.notificationState.isUnread,
}); });
let nameContainer = ( let nameContainer = (
@ -532,15 +538,15 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
// The following labels are written in such a fashion to increase screen reader efficiency (speed). // The following labels are written in such a fashion to increase screen reader efficiency (speed).
if (this.props.tag === DefaultTagID.Invite) { if (this.props.tag === DefaultTagID.Invite) {
// append nothing // append nothing
} else if (this.state.notificationState.hasMentions) { } else if (this.notificationState.hasMentions) {
ariaLabel += " " + _t("%(count)s unread messages including mentions.", { ariaLabel += " " + _t("%(count)s unread messages including mentions.", {
count: this.state.notificationState.count, count: this.notificationState.count,
}); });
} else if (this.state.notificationState.hasUnreadCount) { } else if (this.notificationState.hasUnreadCount) {
ariaLabel += " " + _t("%(count)s unread messages.", { ariaLabel += " " + _t("%(count)s unread messages.", {
count: this.state.notificationState.count, count: this.notificationState.count,
}); });
} else if (this.state.notificationState.isUnread) { } else if (this.notificationState.isUnread) {
ariaLabel += " " + _t("Unread messages."); ariaLabel += " " + _t("Unread messages.");
} }