From 6d15fe4e64fd094bedb63d6fe1f9b531871ee9f0 Mon Sep 17 00:00:00 2001 From: David Lee Date: Tue, 6 Feb 2024 17:26:03 -0600 Subject: [PATCH 1/2] wire up chatMessageReceived in draft state --- .../src/components/ChatList/ChatList.tsx | 19 +++----- .../StatefulGraphChatListClient.ts | 47 ++++--------------- 2 files changed, 14 insertions(+), 52 deletions(-) diff --git a/packages/mgt-chat/src/components/ChatList/ChatList.tsx b/packages/mgt-chat/src/components/ChatList/ChatList.tsx index 6f27bd9f60..1375de99c0 100644 --- a/packages/mgt-chat/src/components/ChatList/ChatList.tsx +++ b/packages/mgt-chat/src/components/ChatList/ChatList.tsx @@ -137,18 +137,15 @@ export const ChatList = ({ return; } - // handle events emitted from the chat list client - const handleChatListEvent = (event: ChatListEvent) => { - if (event.type === 'chatMessageReceived') { - if (onMessageReceived) { - onMessageReceived(event.message); - } - } - }; - // handle state changes chatListClient.onStateChange(setChatListState); chatListClient.onStateChange(state => { + if (state.status === 'chat message received') { + if (onMessageReceived && state.chatMessage) { + onMessageReceived(state.chatMessage); + } + } + if (state.status === 'chats loaded' && onLoaded) { onLoaded(state?.chatThreads ?? []); } @@ -171,15 +168,11 @@ export const ChatList = ({ } }); - // handle chat list events - chatListClient.onChatListEvent(handleChatListEvent); - // tear down return () => { // log state of chatlistclient for debugging purposes log(chatListClient.getState()); chatListClient.offStateChange(setChatListState); - chatListClient.offChatListEvent(handleChatListEvent); chatListClient.tearDown(); setHeaderBannerMessage('We ran into a problem. Please close or refresh.'); }; diff --git a/packages/mgt-chat/src/statefulClient/StatefulGraphChatListClient.ts b/packages/mgt-chat/src/statefulClient/StatefulGraphChatListClient.ts index 111a43b6ce..4a7680a815 100644 --- a/packages/mgt-chat/src/statefulClient/StatefulGraphChatListClient.ts +++ b/packages/mgt-chat/src/statefulClient/StatefulGraphChatListClient.ts @@ -80,8 +80,10 @@ export type GraphChatListClient = Pick & { | 'no chats' | 'chats loaded' | 'error' + | 'chat message received' | 'chats read'; chatThreads: GraphChatThread[]; + chatMessage: ChatMessage | undefined; moreChatThreadsToLoad: boolean | undefined; } & Pick; @@ -102,18 +104,6 @@ interface StatefulClient { * @param handler Callback to be unregistered */ offStateChange(handler: (state: T) => void): void; - /** - * Register a callback to receive ChatList events - * - * @param handler Callback to receive ChatList events - */ - onChatListEvent(handler: (event: ChatListEvent) => void): void; - /** - * Remove a callback to receive ChatList events - * - * @param handler Callback to be unregistered - */ - offChatListEvent(handler: (event: ChatListEvent) => void): void; chatThreadsPerPage: number; /** @@ -166,7 +156,6 @@ class StatefulGraphChatListClient implements StatefulClient private readonly _eventEmitter: ThreadEventEmitter; private readonly _cache: LastReadCache; private _stateSubscribers: ((state: GraphChatListClient) => void)[] = []; - private _chatListEventSubscribers: ((state: ChatListEvent) => void)[] = []; private readonly _graph: IGraph; constructor(chatThreadsPerPage: number) { this.userId = currentUserId(); @@ -322,37 +311,13 @@ class StatefulGraphChatListClient implements StatefulClient } } - /** - * Register a callback to receive ChatList events - * - * @param {(event: ChatListEvent) => void} handler - * @memberof StatefulGraphChatListClient - */ - public onChatListEvent(handler: (event: ChatListEvent) => void): void { - if (!this._chatListEventSubscribers.includes(handler)) { - this._chatListEventSubscribers.push(handler); - } - } - - /** - * Unregister a callback from receiving ChatList events - * - * @param {(event: ChatListEvent) => void} handler - * @memberof StatefulGraphChatListClient - */ - public offChatListEvent(handler: (event: ChatListEvent) => void): void { - const index = this._chatListEventSubscribers.indexOf(handler); - if (index !== -1) { - this._chatListEventSubscribers = this._chatListEventSubscribers.splice(index, 1); - } - } - private readonly _initialState: GraphChatListClient = { status: 'initial', activeErrorMessages: [], userId: '', chatThreads: [], - moreChatThreadsToLoad: undefined + moreChatThreadsToLoad: undefined, + chatMessage: undefined }; /** @@ -445,12 +410,16 @@ class StatefulGraphChatListClient implements StatefulClient isDeleted: true } as ChatMessageInfo; } else if (event.type === 'chatMessageReceived' && event.message && chatThread) { + draft.status = 'chat message received'; + draft.chatMessage = event.message; // update the last message preview and bring to the top chatThread.lastMessagePreview = event.message as ChatMessageInfo; chatThread.lastUpdatedDateTime = event.message.lastModifiedDateTime; chatThread.isRead = false; bringToTop(); } else if (event.type === 'chatMessageReceived' && event.message?.chatId) { + draft.status = 'chat message received'; + draft.chatMessage = event.message; // create a new chat thread at the top const newChatThread: GraphChatThread = { id: event.message.chatId, From 5856bd222715e40ecbe647da725bc055ccd8b77d Mon Sep 17 00:00:00 2001 From: David Lee Date: Wed, 7 Feb 2024 07:54:48 -0600 Subject: [PATCH 2/2] remove unused --- packages/mgt-chat/src/components/ChatList/ChatList.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/mgt-chat/src/components/ChatList/ChatList.tsx b/packages/mgt-chat/src/components/ChatList/ChatList.tsx index 1375de99c0..47694f9ae6 100644 --- a/packages/mgt-chat/src/components/ChatList/ChatList.tsx +++ b/packages/mgt-chat/src/components/ChatList/ChatList.tsx @@ -8,7 +8,6 @@ import { Chat as GraphChat, ChatMessage } from '@microsoft/microsoft-graph-types import { StatefulGraphChatListClient, GraphChatListClient, - ChatListEvent, GraphChatThread } from '../../statefulClient/StatefulGraphChatListClient'; import { ChatListHeader } from '../ChatListHeader/ChatListHeader';