diff --git a/packages/desktop/src/providers/ConversationProvider.tsx b/packages/desktop/src/providers/ConversationProvider.tsx index b9b8278..8f29903 100644 --- a/packages/desktop/src/providers/ConversationProvider.tsx +++ b/packages/desktop/src/providers/ConversationProvider.tsx @@ -64,6 +64,10 @@ function useSocketFire() { interface IConversationContext { conversationMap: ConversationMap; + // sorted conversation lists + priorityConversations: MasterConversation[]; + inboxConversations: MasterConversation[]; + selectedConversation?: MasterConversation; selectConversation?: (conversationId: string, temporaryOverrideSort?: boolean) => Promise; @@ -72,6 +76,8 @@ interface IConversationContext { const ConversationContext = React.createContext({ conversationMap: {}, + priorityConversations: [], + inboxConversations: [], }); export function ConversationProvider({ children }: { children: React.ReactNode }) { @@ -339,6 +345,43 @@ export function ConversationProvider({ children }: { children: React.ReactNode } return tunedConversations; }, [conversationMap, user]); + const masterConversations = useMemo(() => { + const priorityConversations: MasterConversation[] = []; + const inboxConversations: MasterConversation[] = []; + + Object.values(conversationMap).forEach((currentMasterConversation) => { + const personalConvoMember = currentMasterConversation.members.find( + (mem) => mem._id.toString() === user._id.toString(), + ); + if (personalConvoMember && personalConvoMember.memberState === 'priority') { + priorityConversations.push(currentMasterConversation); + + return; + } + inboxConversations.push(currentMasterConversation); + }); + + // sort each list + inboxConversations.sort((a, b) => { + if (a.temporaryOverrideSort) { + return 1; + } + + if (b.temporaryOverrideSort) { + return -1; + } + + // sort by which ones have new activity for me + // then sort by last activity date + }); + + priorityConversations.sort((a, b) => { + return b.createdDate.getTime() - a.createdDate.getTime(); + }); + + return [priorityConversations, inboxConversations]; + }, [conversationMap, user]); + if (fetchState.error) { return ( @@ -354,6 +397,8 @@ export function ConversationProvider({ children }: { children: React.ReactNode } handleStartConversation, selectedConversation, selectConversation, + priorityConversations: masterConversations[0], + inboxConversations: masterConversations[1], }} > {children} diff --git a/packages/desktop/src/tree/ConversationList.tsx b/packages/desktop/src/tree/ConversationList.tsx index 964f31e..411347e 100644 --- a/packages/desktop/src/tree/ConversationList.tsx +++ b/packages/desktop/src/tree/ConversationList.tsx @@ -41,7 +41,7 @@ export function ConversationList() { const { omniSearch } = useSearch(); - const { conversationMap } = useConversations(); + const { conversationMap, inboxConversations } = useConversations(); const rendersCount = useRendersCount(); // console.warn('RENDER COUNT | CONVERSATION LIST | ', rendersCount); @@ -51,43 +51,6 @@ export function ConversationList() { omniSearch(SUPPORT_DISPLAY_NAME); }, [omniSearch]); - const masterConversations = useMemo(() => { - const priorityConversations: MasterConversation[] = []; - const inboxConversations: MasterConversation[] = []; - - Object.values(conversationMap).forEach((currentMasterConversation) => { - const personalConvoMember = currentMasterConversation.members.find( - (mem) => mem._id.toString() === user._id.toString(), - ); - if (personalConvoMember && personalConvoMember.memberState === 'priority') { - priorityConversations.push(currentMasterConversation); - - return; - } - inboxConversations.push(currentMasterConversation); - }); - - // sort each list - inboxConversations.sort((a, b) => { - if (a.temporaryOverrideSort) { - return 1; - } - - if (b.temporaryOverrideSort) { - return -1; - } - - // sort by which ones have new activity for me - // then sort by last activity date - }); - - priorityConversations.sort((a, b) => { - return b.createdDate.getTime() - a.createdDate.getTime(); - }); - - return [priorityConversations, inboxConversations]; - }, [conversationMap, user]); - if (Object.keys(conversationMap).length === 0) { return ( @@ -123,37 +86,6 @@ export function ConversationList() { - - - Priority - - } - > - {masterConversations[0].length === 0 && ( - - - Mark conversations as priority to hear them across the hall. - - - )} - - {masterConversations[0].map((currentConversation, index) => ( - - ))} - - - - } > - {masterConversations[1].map((currentConversation, index) => ( + {inboxConversations.map((currentConversation, index) => ( (false); @@ -69,6 +70,18 @@ export default function FooterControls() { setOpenUserSettings(false); }, [setOpenUserSettings]); + // is there a selected conversation and if so, is it a priority one? + const isSelectedConversationPriority = useMemo(() => { + const priorityIds = + priorityConversations.map((priorityConvo) => priorityConvo._id.toString()) ?? []; + + if (selectedConversation && priorityIds.includes(selectedConversation._id.toString())) { + return true; + } + + return false; + }, [selectedConversation, priorityConversations]); + return ( - {selectedConversation && ( - - {/* status */} - theme.palette.secondary.main, - height: 5, - width: 5, - borderRadius: 100, - }} - /> - - :first-child': { - marginTop: 0, - }, - '& > *': { - marginLeft: '0 !important' as any, - marginTop: -2, - }, - }} - > - {selectedConversation.members?.map((conversationUser, index) => ( - - ))} - + {priorityConversations.map((masterPriorityConversation) => ( + + ))} + {selectedConversation && !isSelectedConversationPriority && ( + <> - - - - - - - - {/* todo: not speaking mode, speaking mode, locked in mode */} - - - - - - - - - - + + )} @@ -222,6 +165,104 @@ export default function FooterControls() { ); } +function OverlayConversation({ + masterConversation, + isSelected = false, +}: { + masterConversation: MasterConversation; + isSelected?: boolean; +}) { + return ( + + {/* status */} + theme.palette.secondary.main, + height: 5, + width: 5, + borderRadius: 100, + }} + /> + + :first-child': { + marginTop: 0, + }, + '& > *': { + marginLeft: '0 !important' as any, + marginTop: -2, + }, + }} + > + {masterConversation.members?.map((conversationUser, index) => ( + + ))} + + + {isSelected && ( + <> + + + + + + + + + {/* todo: not speaking mode, speaking mode, locked in mode */} + + + + + + + + + + + )} + + ); +} + const NO_DEVICE_SELECTION = 'NA'; function UserSettingsDialog({ open, handleClose }: { handleClose: () => void; open: boolean }) {