consider membership change with reason change (#1441)

diff --git a/src/app/hooks/useMemberEventParser.tsx b/src/app/hooks/useMemberEventParser.tsx
index ecb6f66b2f41a7d533a45a35c447521e737a86ac..367e76d95cd7264d06917c5381d7fbebf9ab48d1 100644 (file)
--- a/src/app/hooks/useMemberEventParser.tsx
+++ b/src/app/hooks/useMemberEventParser.tsx
@@ -3,6 +3,7 @@ import { IconSrc, Icons } from 'folds';
 import { MatrixEvent } from 'matrix-js-sdk';
 import { IMemberContent, Membership } from '../../types/matrix/room';
 import { getMxIdLocalPart } from '../utils/matrix';
+import { isMembershipChanged } from '../utils/room';
 
 export type ParsedResult = {
   icon: IconSrc;
@@ -27,7 +28,7 @@ export const useMemberEventParser = (): MemberEventParser => {
     const senderName = getMxIdLocalPart(senderId);
     const userName = content.displayname || getMxIdLocalPart(userId);
 
-    if (content.membership !== prevContent.membership) {
+    if (isMembershipChanged(mEvent)) {
       if (content.membership === Membership.Invite) {
         if (prevContent.membership === Membership.Knock) {
           return {

diff --git a/src/app/hooks/useRoomLatestRenderedEvent.ts b/src/app/hooks/useRoomLatestRenderedEvent.ts
index 295d103070b4e4bbf97ab34d7237fb250535424a..428e7b52a3a5e0b2be6bdd08160f741b85c91722 100644 (file)
--- a/src/app/hooks/useRoomLatestRenderedEvent.ts
+++ b/src/app/hooks/useRoomLatestRenderedEvent.ts
@@ -4,6 +4,7 @@ import { useEffect, useState } from 'react';
 import { settingsAtom } from '../state/settings';
 import { useSetting } from '../state/hooks/settings';
 import { MessageEvent, StateEvent } from '../../types/matrix/room';
+import { isMembershipChanged } from '../utils/room';
 
 export const useRoomLatestRenderedEvent = (room: Room) => {
   const [hideMembershipEvents] = useSetting(settingsAtom, 'hideMembershipEvents');
@@ -20,7 +21,7 @@ export const useRoomLatestRenderedEvent = (room: Room) => {
         if (!evt) continue;
         if (evt.isRelation()) continue;
         if (evt.getType() === StateEvent.RoomMember) {
-          const membershipChanged = evt.getContent().membership !== evt.getPrevContent().membership;
+          const membershipChanged = isMembershipChanged(evt);
           if (membershipChanged && hideMembershipEvents) continue;
           if (!membershipChanged && hideNickAvatarEvents) continue;
           return evt;

diff --git a/src/app/organisms/room/RoomTimeline.tsx b/src/app/organisms/room/RoomTimeline.tsx
index 96555f3d7fa4cb5587bdf61b8592e704e7a2de98..03744c33df111a54482cdd5794ad3ef3dfaa45fc 100644 (file)
--- a/src/app/organisms/room/RoomTimeline.tsx
+++ b/src/app/organisms/room/RoomTimeline.tsx
@@ -83,6 +83,7 @@ import {
   decryptAllTimelineEvent,
   getMemberDisplayName,
   getReactionContent,
+  isMembershipChanged,
 } from '../../utils/room';
 import { useSetting } from '../../state/hooks/settings';
 import { settingsAtom } from '../../state/settings';
@@ -1311,8 +1312,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
       );
     },
     renderRoomMember: (mEventId, mEvent, item) => {
-      const membershipChanged =
-        mEvent.getContent().membership !== mEvent.getPrevContent().membership;
+      const membershipChanged = isMembershipChanged(mEvent);
       if (membershipChanged && hideMembershipEvents) return null;
       if (!membershipChanged && hideNickAvatarEvents) return null;
 

diff --git a/src/app/utils/room.ts b/src/app/utils/room.ts
index f86378337d3874a4b875d1fb3bbd57efb58c1293..af9505d4029c15cfdc2503ed07c80b801f854c0d 100644 (file)
--- a/src/app/utils/room.ts
+++ b/src/app/utils/room.ts
@@ -278,6 +278,10 @@ export const getMemberAvatarMxc = (room: Room, userId: string): string | undefin
   return member?.getMxcAvatarUrl();
 };
 
+export const isMembershipChanged = (mEvent: MatrixEvent): boolean =>
+  mEvent.getContent().membership !== mEvent.getPrevContent().membership ||
+  mEvent.getContent().reason !== mEvent.getPrevContent().reason;
+
 export const decryptAllTimelineEvent = async (mx: MatrixClient, timeline: EventTimeline) => {
   const crypto = mx.getCrypto();
   if (!crypto) return;