Don't reference the notification levels by colour (#12138)
* Don't reference the notification levels by colour We're about to change what colours they are so either we'd have to rename a bunch of constants. We may as well make things not reference what colour anything is in the actual UI. Hopefully these constants are clear enough. * Rename NotificationColor -> NotificationLevel * Red -> Highlight * Grey -> Notification * Bold -> Activity * Anywhere else that calls it 'color' -> 'level' Also fixes some weird mixes of US & UK English. It turns out this is referenced in... quite a lot of places, so this is quite a large PR. It can't really be much smaller, sorry. * One test rename & some hiding due to ts-ignore * More hiding behind ts-ignore * Damn you, @ts-ignore... * Fix test CSS values * Missed some colour -> level Co-authored-by: Florian Duros <florianduros@element.io> * Change other instances of variables renamed in suggestion * Update new test for renames --------- Co-authored-by: Florian Duros <florianduros@element.io>
This commit is contained in:
parent
97339ee2f6
commit
9254e9562e
42 changed files with 268 additions and 265 deletions
|
@ -17,7 +17,7 @@ limitations under the License.
|
|||
import { NotificationCountType, Room, RoomEvent, ThreadEvent } from "matrix-js-sdk/src/matrix";
|
||||
import { useCallback, useEffect, useState } from "react";
|
||||
|
||||
import { NotificationColor } from "../../stores/notifications/NotificationColor";
|
||||
import { NotificationLevel } from "../../stores/notifications/NotificationLevel";
|
||||
import { doesRoomOrThreadHaveUnreadMessages } from "../../Unread";
|
||||
import { useEventEmitter } from "../useEventEmitter";
|
||||
|
||||
|
@ -26,16 +26,16 @@ import { useEventEmitter } from "../useEventEmitter";
|
|||
* @param room the room to track
|
||||
* @returns the type of notification for this room
|
||||
*/
|
||||
export const useRoomThreadNotifications = (room: Room): NotificationColor => {
|
||||
const [notificationColor, setNotificationColor] = useState(NotificationColor.None);
|
||||
export const useRoomThreadNotifications = (room: Room): NotificationLevel => {
|
||||
const [notificationLevel, setNotificationLevel] = useState(NotificationLevel.None);
|
||||
|
||||
const updateNotification = useCallback(() => {
|
||||
switch (room?.threadsAggregateNotificationType) {
|
||||
case NotificationCountType.Highlight:
|
||||
setNotificationColor(NotificationColor.Red);
|
||||
setNotificationLevel(NotificationLevel.Highlight);
|
||||
break;
|
||||
case NotificationCountType.Total:
|
||||
setNotificationColor(NotificationColor.Grey);
|
||||
setNotificationLevel(NotificationLevel.Notification);
|
||||
break;
|
||||
}
|
||||
// We don't have any notified messages, but we might have unread messages. Let's
|
||||
|
@ -43,7 +43,7 @@ export const useRoomThreadNotifications = (room: Room): NotificationColor => {
|
|||
for (const thread of room!.getThreads()) {
|
||||
// If the current thread has unread messages, we're done.
|
||||
if (doesRoomOrThreadHaveUnreadMessages(thread)) {
|
||||
setNotificationColor(NotificationColor.Bold);
|
||||
setNotificationLevel(NotificationLevel.Activity);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
@ -63,5 +63,5 @@ export const useRoomThreadNotifications = (room: Room): NotificationColor => {
|
|||
updateNotification();
|
||||
}, [updateNotification]);
|
||||
|
||||
return notificationColor;
|
||||
return notificationLevel;
|
||||
};
|
||||
|
|
|
@ -19,7 +19,7 @@ import { useCallback, useEffect, useState } from "react";
|
|||
|
||||
import type { NotificationCount, Room } from "matrix-js-sdk/src/matrix";
|
||||
import { determineUnreadState } from "../RoomNotifs";
|
||||
import { NotificationColor } from "../stores/notifications/NotificationColor";
|
||||
import { NotificationLevel } from "../stores/notifications/NotificationLevel";
|
||||
import { useEventEmitter } from "./useEventEmitter";
|
||||
|
||||
export const useUnreadNotifications = (
|
||||
|
@ -28,11 +28,11 @@ export const useUnreadNotifications = (
|
|||
): {
|
||||
symbol: string | null;
|
||||
count: number;
|
||||
color: NotificationColor;
|
||||
level: NotificationLevel;
|
||||
} => {
|
||||
const [symbol, setSymbol] = useState<string | null>(null);
|
||||
const [count, setCount] = useState<number>(0);
|
||||
const [color, setColor] = useState<NotificationColor>(NotificationColor.None);
|
||||
const [level, setLevel] = useState<NotificationLevel>(NotificationLevel.None);
|
||||
|
||||
useEventEmitter(
|
||||
room,
|
||||
|
@ -50,10 +50,10 @@ export const useUnreadNotifications = (
|
|||
useEventEmitter(room, RoomEvent.MyMembership, () => updateNotificationState());
|
||||
|
||||
const updateNotificationState = useCallback(() => {
|
||||
const { symbol, count, color } = determineUnreadState(room, threadId);
|
||||
const { symbol, count, level } = determineUnreadState(room, threadId);
|
||||
setSymbol(symbol);
|
||||
setCount(count);
|
||||
setColor(color);
|
||||
setLevel(level);
|
||||
}, [room, threadId]);
|
||||
|
||||
useEffect(() => {
|
||||
|
@ -63,6 +63,6 @@ export const useUnreadNotifications = (
|
|||
return {
|
||||
symbol,
|
||||
count,
|
||||
color,
|
||||
level,
|
||||
};
|
||||
};
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue