Revert "feat: rebuild muting/unmuting room functionality using matrix…

… push ru…" (#2730)

This reverts commit 264992b.

src/apps/feed/components/sidekick/index.tsx

@@ -9,23 +9,14 @@ import { CurrentUserDetails } from '../../../../components/sidekick/components/c
 import { ScrollbarContainer } from '../../../../components/scrollbar-container';
 import { Input } from '@zero-tech/zui/components/Input/Input';
 import { LoadingIndicator } from '@zero-tech/zui/components/LoadingIndicator';
-import { IconBellOff1, IconSearchMd } from '@zero-tech/zui/icons';
+import { IconSearchMd } from '@zero-tech/zui/icons';
 import { Panel, PanelBody } from '../../../../components/layout/panel';
 
 import styles from './styles.module.scss';
 
 export const Sidekick = () => {
-  const {
-    isErrorZids,
-    isLoadingZids,
-    isProfileOpen,
-    selectedZId,
-    zids,
-    search,
-    setSearch,
-    unreadCounts,
-    isMutedChannels,
-  } = useSidekick();
+  const { isErrorZids, isLoadingZids, isProfileOpen, selectedZId, zids, search, setSearch, unreadCounts } =
+    useSidekick();
 
   return (
     <SidekickContainer className={styles.Container}>
@@ -55,16 +46,13 @@ export const Sidekick = () => {
                     {zids?.map((zid) => {
                       const hasUnreadHighlights = unreadCounts[zid]?.highlight > 0;
                       const hasUnreadTotal = unreadCounts[zid]?.total > 0;
-                      const isMuted = isMutedChannels[zid];
 
                       return (
                         <FeedItem key={zid} route={`/feed/${zid}`} isSelected={selectedZId === zid}>
                           <div className={styles.FeedName}>
                             <span>0://</span>
                             <div>{zid}</div>
                           </div>
-
-                          {isMuted && <IconBellOff1 className={styles.MutedIcon} size={16} />}
                           {!hasUnreadHighlights && hasUnreadTotal && (
                             <div className={styles.UnreadCount}>{unreadCounts[zid]?.total}</div>
                           )}

src/apps/feed/components/sidekick/lib/selectors.ts

@@ -14,15 +14,3 @@ export const selectSocialChannelsUnreadCounts = createSelector(
       }, {} as { [zid: string]: UnreadCount });
   }
 );
-
-export const selectIsMutedChannels = createSelector(
-  [(state: RootState) => denormalizeConversations(state)],
-  (conversations) => {
-    return conversations
-      .filter((c) => c.isSocialChannel && c.zid)
-      .reduce((acc, channel) => {
-        acc[channel.zid!] = channel.isMuted;
-        return acc;
-      }, {} as { [zid: string]: boolean });
-  }
-);

src/apps/feed/components/sidekick/lib/useSidekick.ts

@@ -5,7 +5,7 @@ import { useSelector } from 'react-redux';
 import { RootState } from '../../../../../store/reducer';
 import { Stage as ProfileStage } from '../../../../../store/user-profile';
 import { useState } from 'react';
-import { selectIsMutedChannels, selectSocialChannelsUnreadCounts } from './selectors';
+import { selectSocialChannelsUnreadCounts } from './selectors';
 
 export interface UnreadCount {
   total: number;
@@ -20,7 +20,6 @@ interface UseSidekickReturn {
   zids?: string[];
   search: string;
   unreadCounts: { [zid: string]: UnreadCount };
-  isMutedChannels: { [zid: string]: boolean };
   setSearch: (search: string) => void;
 }
 
@@ -40,7 +39,6 @@ export const useSidekick = (): UseSidekickReturn => {
   const filteredZids = uniqueWorldZids?.filter((zid) => zid.toLowerCase().includes(search.toLowerCase()));
 
   const unreadCounts = useSelector(selectSocialChannelsUnreadCounts);
-  const isMutedChannels = useSelector(selectIsMutedChannels);
 
   return {
     isErrorZids: isError,
@@ -51,6 +49,5 @@ export const useSidekick = (): UseSidekickReturn => {
     search,
     setSearch,
     unreadCounts,
-    isMutedChannels,
   };
 };

src/apps/feed/components/sidekick/styles.module.scss

@@ -1,5 +1,3 @@
-@import '../../../../glass';
-
 .Container {
   width: 100%;
   max-width: 288px;
@@ -144,9 +142,3 @@
   line-height: 11px;
   letter-spacing: 0.32px;
 }
-
-.MutedIcon {
-  @include glass-text-tertiary-color;
-
-  align-self: center;
-}

src/components/app-bar/container.tsx

@@ -24,15 +24,19 @@ const useAppBar = () => {
     const conversations = denormalizeConversations(state);
     return conversations.some(
       (channel) =>
-        channel.unreadCount?.total > 0 && !channel.labels?.includes(DefaultRoomLabels.ARCHIVED) && !channel.isMuted
+        channel.unreadCount?.total > 0 &&
+        !channel.labels?.includes(DefaultRoomLabels.ARCHIVED) &&
+        !channel.labels?.includes(DefaultRoomLabels.MUTE)
     );
   });
 
   const hasUnreadHighlights = useSelector((state: RootState) => {
     const conversations = denormalizeConversations(state);
     return conversations.some(
       (channel) =>
-        channel.unreadCount?.highlight > 0 && !channel.labels?.includes(DefaultRoomLabels.ARCHIVED) && !channel.isMuted
+        channel.unreadCount?.highlight > 0 &&
+        !channel.labels?.includes(DefaultRoomLabels.ARCHIVED) &&
+        !channel.labels?.includes(DefaultRoomLabels.MUTE)
     );
   });
 

src/components/messenger/conversation-actions/container.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { RootState } from '../../../store/reducer';
 import { connectContainer } from '../../../store/redux-container';
-import { Channel, denormalize, onMuteRoom, onUnmuteRoom } from '../../../store/channels';
+import { Channel, DefaultRoomLabels, denormalize, onAddLabel, onRemoveLabel } from '../../../store/channels';
 import { currentUserSelector } from '../../../store/authentication/selectors';
 import {
   startAddGroupMember,
@@ -36,8 +36,8 @@ export interface Properties extends PublicProperties {
   setLeaveGroupStatus: (status: LeaveGroupDialogStatus) => void;
   viewGroupInformation: () => void;
   toggleSecondarySidekick: () => void;
-  onMuteRoom: (payload: { roomId: string }) => void;
-  onUnmuteRoom: (payload: { roomId: string }) => void;
+  onAddLabel: (payload: { roomId: string; label: string }) => void;
+  onRemoveLabel: (payload: { roomId: string; label: string }) => void;
   openReportUserModal: (payload: { reportedUserId: string }) => void;
 }
 
@@ -83,8 +83,8 @@ export class Container extends React.Component<Properties> {
       setLeaveGroupStatus,
       viewGroupInformation,
       toggleSecondarySidekick,
-      onMuteRoom,
-      onUnmuteRoom,
+      onAddLabel,
+      onRemoveLabel,
       openReportUserModal,
     };
   }
@@ -98,15 +98,15 @@ export class Container extends React.Component<Properties> {
   };
 
   muteRoom = () => {
-    this.props.onMuteRoom({ roomId: this.props.activeConversationId });
+    this.props.onAddLabel({ roomId: this.props.activeConversationId, label: DefaultRoomLabels.MUTE });
   };
 
   unmuteRoom = () => {
-    this.props.onUnmuteRoom({ roomId: this.props.activeConversationId });
+    this.props.onRemoveLabel({ roomId: this.props.activeConversationId, label: DefaultRoomLabels.MUTE });
   };
 
   get isMuted() {
-    return this.props.directMessage.isMuted;
+    return this.props.directMessage.labels?.includes(DefaultRoomLabels.MUTE);
   }
 
   render() {

src/components/messenger/list/conversation-item/index.test.tsx

@@ -6,6 +6,7 @@ import { ContentHighlighter } from '../../../content-highlighter';
 import { Avatar } from '@zero-tech/zui/components';
 import { bem } from '../../../../lib/bem';
 import { IconBellOff1 } from '@zero-tech/zui/icons';
+import { DefaultRoomLabels } from '../../../../store/channels';
 
 const c = bem('.conversation-item');
 
@@ -66,15 +67,15 @@ describe(ConversationItem, () => {
 
   it('renders muted icon if conversation is muted', function () {
     const wrapper = subject({
-      conversation: { ...convoWith(), id: 'test-conversation-id', isMuted: true },
+      conversation: { ...convoWith(), id: 'test-conversation-id', labels: [DefaultRoomLabels.MUTE] },
     });
 
     expect(wrapper).toHaveElement(IconBellOff1);
   });
 
   it('does not render muted icon if conversation is not muted', function () {
     const wrapper = subject({
-      conversation: { ...convoWith(), id: 'test-conversation-id', isMuted: false },
+      conversation: { ...convoWith(), id: 'test-conversation-id', labels: [] },
     });
 
     expect(wrapper).not.toHaveElement(IconBellOff1);

src/components/messenger/list/conversation-item/index.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 
 import { otherMembersToString } from '../../../../platform-apps/channels/util';
 import { getOtherMembersTypingDisplayText, highlightFilter } from '../../lib/utils';
-import { Channel } from '../../../../store/channels';
+import { Channel, DefaultRoomLabels } from '../../../../store/channels';
 
 import { MoreMenu } from './more-menu';
 import { Avatar } from '@zero-tech/zui/components';
@@ -152,7 +152,9 @@ export class ConversationItem extends React.Component<Properties, State> {
               <div {...cn('name')} is-unread={isUnread}>
                 {this.highlightedName()}
               </div>
-              {conversation.isMuted && <IconBellOff1 {...cn('muted-icon')} size={16} />}
+              {conversation.labels?.includes(DefaultRoomLabels.MUTE) && (
+                <IconBellOff1 {...cn('muted-icon')} size={16} />
+              )}
 
               <div {...cn('timestamp')}>{previewDisplayDate}</div>
             </div>

src/components/notifications-feed/index.test.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { shallow } from 'enzyme';
 import { Container } from './index';
 import { NotificationItem } from './notification-item';
-import { Channel } from '../../store/channels';
+import { Channel, DefaultRoomLabels } from '../../store/channels';
 
 describe('NotificationsFeed', () => {
   const mockConversations: Channel[] = [
@@ -49,13 +49,13 @@ describe('NotificationsFeed', () => {
         id: 'channel-1',
         unreadCount: { total: 3, highlight: 0 },
         name: 'Regular Chat',
-        isMuted: false,
+        labels: [],
       },
       {
         id: 'channel-2',
         unreadCount: { total: 1, highlight: 1 },
         name: 'Muted Chat',
-        isMuted: true,
+        labels: [DefaultRoomLabels.MUTE],
       },
     ] as Channel[];
 
@@ -95,13 +95,13 @@ describe('NotificationsFeed', () => {
         id: 'channel-1',
         unreadCount: { total: 3, highlight: 0 },
         name: 'Regular Chat',
-        isMuted: false,
+        labels: [],
       },
       {
         id: 'channel-2',
         unreadCount: { total: 1, highlight: 1 },
         name: 'Muted Chat',
-        isMuted: true,
+        labels: [DefaultRoomLabels.MUTE],
       },
     ] as Channel[];
 

src/components/notifications-feed/index.tsx

@@ -80,19 +80,21 @@ export class Container extends React.Component<Properties, State> {
           (conversation) =>
             conversation.unreadCount?.highlight > 0 &&
             !conversation.labels?.includes(DefaultRoomLabels.ARCHIVED) &&
-            !conversation.isMuted
+            !conversation.labels?.includes(DefaultRoomLabels.MUTE)
         );
       case Tab.Muted:
         return conversations.filter(
           (conversation) =>
-            conversation.isMuted &&
+            conversation.labels?.includes(DefaultRoomLabels.MUTE) &&
             !conversation.labels?.includes(DefaultRoomLabels.ARCHIVED) &&
             (conversation.unreadCount?.total > 0 || conversation.unreadCount?.highlight > 0)
         );
       case Tab.All:
       default:
         return conversations.filter(
-          (conversation) => !conversation.labels?.includes(DefaultRoomLabels.ARCHIVED) && !conversation.isMuted
+          (conversation) =>
+            !conversation.labels?.includes(DefaultRoomLabels.ARCHIVED) &&
+            !conversation.labels?.includes(DefaultRoomLabels.MUTE)
         );
     }
   }

src/lib/chat/index.ts

@@ -24,7 +24,6 @@ export interface RealtimeChatEvents {
   roomLabelChange: (roomId: string, labels: string[]) => void;
   postMessageReactionChange: (roomId: string, reaction: any) => void;
   messageEmojiReactionChange: (roomId: string, reaction: any) => void;
-  roomMuteStatusChanged: (roomId: string, isMuted: boolean) => void;
 }
 
 export interface MatrixKeyBackupInfo {
@@ -439,11 +438,3 @@ export function getProfileInfo(userId: string): Promise<{
 export async function getAliasForRoomId(roomId: string) {
   return chat.get().matrix.getAliasForRoomId(roomId);
 }
-
-export async function muteRoom(roomId: string) {
-  return await chat.get().matrix.muteRoom(roomId);
-}
-
-export async function unmuteRoom(roomId: string) {
-  return await chat.get().matrix.unmuteRoom(roomId);
-}