Fix muted room show unread indicator (#386)

* Move getNotifType function

Signed-off-by: Ajay Bura <ajbura@gmail.com>

* Fix bug in getNotiType

Signed-off-by: Ajay Bura <ajbura@gmail.com>

* Add isMuted prop in room selector

Signed-off-by: Ajay Bura <ajbura@gmail.com>

* Fix muted room show unread indicator

Signed-off-by: Ajay Bura <ajbura@gmail.com>

* Fix muted room notification visible in space

Signed-off-by: Ajay Bura <ajbura@gmail.com>

* Fix space shows muted room notification on load

Signed-off-by: Ajay Bura <ajbura@gmail.com>

* Toggle room mute when changed from other client

Signed-off-by: Ajay Bura <ajbura@gmail.com>
This commit is contained in:
Ajay Bura 2022-03-15 17:21:36 +05:30 committed by GitHub
parent 92a3a8d6fa
commit 70ffd7ded8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 106 additions and 30 deletions

View file

@ -32,28 +32,9 @@ const items = [{
type: cons.notifs.MUTE,
}];
function getNotifType(roomId) {
const mx = initMatrix.matrixClient;
const pushRule = mx.getRoomPushRule('global', roomId);
if (typeof pushRule === 'undefined') {
const overridePushRules = mx.getAccountData('m.push_rules')?.getContent()?.global?.override;
if (typeof overridePushRules === 'undefined') return 0;
const isMuteOverride = overridePushRules.find((rule) => (
rule.rule_id === roomId
&& rule.actions[0] === 'dont_notify'
&& rule.conditions[0].kind === 'event_match'
));
return isMuteOverride ? cons.notifs.MUTE : cons.notifs.DEFAULT;
}
if (pushRule.actions[0] === 'notify') return cons.notifs.ALL_MESSAGES;
return cons.notifs.MENTIONS_AND_KEYWORDS;
}
function setRoomNotifType(roomId, newType) {
const mx = initMatrix.matrixClient;
const { notifications } = initMatrix;
const roomPushRule = mx.getRoomPushRule('global', roomId);
const promises = [];
@ -76,7 +57,7 @@ function setRoomNotifType(roomId, newType) {
return promises;
}
const oldState = getNotifType(roomId);
const oldState = notifications.getNotiType(roomId);
if (oldState === cons.notifs.MUTE) {
promises.push(mx.deletePushRule('global', 'override', roomId));
}
@ -115,8 +96,9 @@ function setRoomNotifType(roomId, newType) {
}
function useNotifications(roomId) {
const [activeType, setActiveType] = useState(getNotifType(roomId));
useEffect(() => setActiveType(getNotifType(roomId)), [roomId]);
const { notifications } = initMatrix;
const [activeType, setActiveType] = useState(notifications.getNotiType(roomId));
useEffect(() => setActiveType(notifications.getNotiType(roomId)), [roomId]);
const setNotification = useCallback((item) => {
if (item.type === activeType.type) return;

View file

@ -11,13 +11,16 @@ import NotificationBadge from '../../atoms/badge/NotificationBadge';
import { blurOnBubbling } from '../../atoms/button/script';
function RoomSelectorWrapper({
isSelected, isUnread, onClick,
isSelected, isMuted, isUnread, onClick,
content, options, onContextMenu,
}) {
let myClass = isUnread ? ' room-selector--unread' : '';
myClass += isSelected ? ' room-selector--selected' : '';
const classes = ['room-selector'];
if (isMuted) classes.push('room-selector--muted');
if (isUnread) classes.push('room-selector--unread');
if (isSelected) classes.push('room-selector--selected');
return (
<div className={`room-selector${myClass}`}>
<div className={classes.join(' ')}>
<button
className="room-selector__content"
type="button"
@ -32,11 +35,13 @@ function RoomSelectorWrapper({
);
}
RoomSelectorWrapper.defaultProps = {
isMuted: false,
options: null,
onContextMenu: null,
};
RoomSelectorWrapper.propTypes = {
isSelected: PropTypes.bool.isRequired,
isMuted: PropTypes.bool,
isUnread: PropTypes.bool.isRequired,
onClick: PropTypes.func.isRequired,
content: PropTypes.node.isRequired,
@ -46,12 +51,13 @@ RoomSelectorWrapper.propTypes = {
function RoomSelector({
name, parentName, roomId, imageSrc, iconSrc,
isSelected, isUnread, notificationCount, isAlert,
isSelected, isMuted, isUnread, notificationCount, isAlert,
options, onClick, onContextMenu,
}) {
return (
<RoomSelectorWrapper
isSelected={isSelected}
isMuted={isMuted}
isUnread={isUnread}
content={(
<>
@ -91,6 +97,7 @@ RoomSelector.defaultProps = {
isSelected: false,
imageSrc: null,
iconSrc: null,
isMuted: false,
options: null,
onContextMenu: null,
};
@ -101,6 +108,7 @@ RoomSelector.propTypes = {
imageSrc: PropTypes.string,
iconSrc: PropTypes.string,
isSelected: PropTypes.bool,
isMuted: PropTypes.bool,
isUnread: PropTypes.bool.isRequired,
notificationCount: PropTypes.oneOfType([
PropTypes.string,

View file

@ -9,6 +9,10 @@
border-radius: var(--bo-radius);
cursor: pointer;
&--muted {
opacity: 0.6;
}
&--unread {
.room-selector__content > .text {
color: var(--tc-surface-high);

View file

@ -33,9 +33,11 @@ function Directs() {
navigation.on(cons.events.navigation.ROOM_SELECTED, selectorChanged);
notifications.on(cons.events.notifications.NOTI_CHANGED, notiChanged);
notifications.on(cons.events.notifications.MUTE_TOGGLED, notiChanged);
return () => {
navigation.removeListener(cons.events.navigation.ROOM_SELECTED, selectorChanged);
notifications.removeListener(cons.events.notifications.NOTI_CHANGED, notiChanged);
notifications.removeListener(cons.events.notifications.MUTE_TOGGLED, notiChanged);
};
}, []);

View file

@ -62,9 +62,11 @@ function Home({ spaceId }) {
navigation.on(cons.events.navigation.ROOM_SELECTED, selectorChanged);
notifications.on(cons.events.notifications.NOTI_CHANGED, notiChanged);
notifications.on(cons.events.notifications.MUTE_TOGGLED, notiChanged);
return () => {
navigation.removeListener(cons.events.navigation.ROOM_SELECTED, selectorChanged);
notifications.removeListener(cons.events.notifications.NOTI_CHANGED, notiChanged);
notifications.removeListener(cons.events.notifications.MUTE_TOGGLED, notiChanged);
};
}, []);

View file

@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
import './RoomsCategory.scss';
import initMatrix from '../../../client/initMatrix';
import { selectSpace, selectRoom,openReusableContextMenu } from '../../../client/action/navigation';
import { selectSpace, selectRoom, openReusableContextMenu } from '../../../client/action/navigation';
import { getEventCords } from '../../../util/common';
import Text from '../../atoms/text/Text';

View file

@ -3,6 +3,7 @@ import React, { useEffect } from 'react';
import PropTypes from 'prop-types';
import initMatrix from '../../../client/initMatrix';
import cons from '../../../client/state/cons';
import navigation from '../../../client/state/navigation';
import { openReusableContextMenu } from '../../../client/action/navigation';
import { getEventCords, abbreviateNumber } from '../../../util/common';
@ -23,9 +24,12 @@ function Selector({
const mx = initMatrix.matrixClient;
const noti = initMatrix.notifications;
const room = mx.getRoom(roomId);
let imageSrc = room.getAvatarFallbackMember()?.getAvatarUrl(mx.baseUrl, 24, 24, 'crop') || null;
if (imageSrc === null) imageSrc = room.getAvatarUrl(mx.baseUrl, 24, 24, 'crop') || null;
const isMuted = noti.getNotiType(roomId) === cons.notifs.MUTE;
const [, forceUpdate] = useForceUpdate();
useEffect(() => {
@ -56,7 +60,8 @@ function Selector({
imageSrc={isDM ? imageSrc : null}
iconSrc={isDM ? null : joinRuleToIconSrc(room.getJoinRule(), room.isSpaceRoom())}
isSelected={navigation.selectedRoomId === roomId}
isUnread={noti.hasNoti(roomId)}
isMuted={isMuted}
isUnread={!isMuted && noti.hasNoti(roomId)}
notificationCount={abbreviateNumber(noti.getTotalNoti(roomId))}
isAlert={noti.getHighlightNoti(roomId) !== 0}
onClick={onClick}