diff --git a/packages/desktop/src/providers/ConversationProvider.tsx b/packages/desktop/src/providers/ConversationProvider.tsx index 0660066..21f6e10 100644 --- a/packages/desktop/src/providers/ConversationProvider.tsx +++ b/packages/desktop/src/providers/ConversationProvider.tsx @@ -16,16 +16,16 @@ import { useAsyncFn } from 'react-use'; import { useImmer } from 'use-immer'; interface IConversationContext { - conversations: ConversationMap; + conversationMap: ConversationMap; selectedConversation?: MasterConversation; - // handleSetConversation?: (conversationId: string) => void; + selectConversation?: (conversationId: string, temporaryOverrideSort?: boolean) => Promise; - handleStartConversation?: (otherUsers: User[]) => void; + handleStartConversation?: (otherUsers: User[], conversationName?: string) => Promise; } const ConversationContext = React.createContext({ - conversations: {}, + conversationMap: {}, }); export function ConversationProvider({ children }: { children: React.ReactNode }) { @@ -100,7 +100,7 @@ export function ConversationProvider({ children }: { children: React.ReactNode } ); const handleStartConversation = useCallback( - async (otherUsers: User[]) => { + async (otherUsers: User[], conversationName?: string) => { try { /** group conversation * 1. create it @@ -133,7 +133,7 @@ export function ConversationProvider({ children }: { children: React.ReactNode } } const createdConversationResult = await createConversation( - new CreateConversationRequest(otherUsers), + new CreateConversationRequest(otherUsers, conversationName), ); selectConversation(createdConversationResult.data.conversationId.toString()); @@ -144,7 +144,7 @@ export function ConversationProvider({ children }: { children: React.ReactNode } toast.error(error.message); } }, - [conversationMap, selectConversation], + [selectConversation], ); // todo: open up a handler for children @@ -162,7 +162,12 @@ export function ConversationProvider({ children }: { children: React.ReactNode } return ( {children} diff --git a/packages/desktop/src/tree/ConversationList.tsx b/packages/desktop/src/tree/ConversationList.tsx new file mode 100644 index 0000000..ab3754c --- /dev/null +++ b/packages/desktop/src/tree/ConversationList.tsx @@ -0,0 +1,187 @@ +import { + Avatar, + AvatarGroup, + Box, + Button, + CircularProgress, + Divider, + IconButton, + List, + ListItem, + ListItemAvatar, + ListItemButton, + ListSubheader, + Stack, + Typography, +} from '@mui/material'; +import { FiActivity, FiCircle, FiSun } from 'react-icons/fi'; +import React, { useCallback, useMemo } from 'react'; +import { useKeyPressEvent, useRendersCount } from 'react-use'; + +import Conversation from '@nirvana/core/models/conversation.model'; +import ConversationLabel from '../subcomponents/ConversationLabel'; +import KeyboardShortcutLabel from '../subcomponents/KeyboardShortcutLabel'; +import { MasterConversation } from '../util/types'; +import { NirvanaRules } from '../util/rules'; +import { SUPPORT_DISPLAY_NAME } from '../util/support'; +import useAuth from '../providers/AuthProvider'; +import useConversations from '../providers/ConversationProvider'; +import useTerminal from './Terminal'; + +// sort conversations based on the different data sources: type, conversations, audio clips, etc. + +/** + * + * @param lookingForSomeone: if a conversation id has been selected and we are looking for it + * @returns + */ +export function ConversationList() { + // const { handleOmniSearch } = useTerminal(); + + const { conversationMap } = useConversations(); + + const rendersCount = useRendersCount(); + console.warn('RENDER COUNT | CONVERSATION LIST | ', rendersCount); + + // don't actually dial, just show nirvana support there + // const handleQuickDialSupport = useCallback(() => { + // handleOmniSearch(SUPPORT_DISPLAY_NAME); + // }, [handleOmniSearch]); + + if (Object.keys(conversationMap).length === 0) { + return ( + + + Look for someone by name or email to start a conversation! + + + + + + + ); + } + + return ( + <> + + + Priority + + } + > + {Object.values(conversationMap).map((currentConversation, index) => ( + + ))} + + + {/* */} + + {/* + + Inbox + + } + > */} + + ); +} + +/** + * + * @param index is used for keyboard shortcut if this convo row is in a list + * @returns + */ +export function ConversationRow({ + conversation, + index, +}: { + conversation: MasterConversation; + index?: number; +}) { + const { user } = useAuth(); + + const { selectedConversation, selectConversation } = useConversations(); + + const rendersCount = useRendersCount(); + console.warn('RENDER COUNT | CONVERSATION LIST ROW | ', rendersCount); + + const keyboardShortcut = useMemo(() => { + if (index < NirvanaRules.topXConversationsWithShortcuts) { + return index + 1; + } + + return undefined; + }, [index]); + + const handleSelectConversation = useCallback(() => { + selectConversation(conversation._id.toString(), false); + }, [conversation, selectConversation]); + + useKeyPressEvent(`${keyboardShortcut?.toString()}`, handleSelectConversation); + + return ( + + + {conversation.tunedInUsers?.length > 0 ? ( + + + + ) : ( + + + + )} + + + {keyboardShortcut && } + + + + + + + {conversation.members?.map((conversationUser, index) => ( + + ))} + + + + {/* 20 sec */} + + + ); +} diff --git a/packages/desktop/src/tree/NewConversationDialog.tsx b/packages/desktop/src/tree/NewConversationDialog.tsx index 736433e..e01fc36 100644 --- a/packages/desktop/src/tree/NewConversationDialog.tsx +++ b/packages/desktop/src/tree/NewConversationDialog.tsx @@ -97,14 +97,21 @@ export default function NewConversationDialog() { setIsSubmitting(true); - handleStartConversation(selectedUsers); + await handleStartConversation(selectedUsers, conversationName); // clear form for next time setSelectedUsers([]); setConversationName(''); setIsSubmitting(false); - }, [selectedUsers, setConversationName, conversationName, setSelectedUsers, setIsSubmitting]); + }, [ + selectedUsers, + setConversationName, + conversationName, + setSelectedUsers, + setIsSubmitting, + handleStartConversation, + ]); return (