This commit is contained in:
talksik
2022-05-30 11:40:01 -05:00
parent 089491a436
commit bc4b26dd1f
2 changed files with 120 additions and 100 deletions
@@ -0,0 +1,118 @@
import {
Avatar,
List,
ListItem,
ListItemAvatar,
ListItemButton,
ListItemSecondaryAction,
ListItemText,
ListSubheader,
Tooltip,
Typography,
} from '@mui/material';
import Conversation from '@nirvana/core/src/models/conversation.model';
import { ConversationRow } from './ConversationList';
import { FiZap } from 'react-icons/fi';
import React from 'react';
import { User } from '@nirvana/core/src/models/user.model';
import useTerminal from './Terminal';
export default function OmniSearchResults({
people,
conversations,
}: {
people: User[];
conversations: Conversation[];
}) {
const { handleQuickDial, selectConversation } = useTerminal();
return (
<>
<List
sx={{
pt: 2,
}}
subheader={
<ListSubheader
sx={{
display: 'flex',
justifyContent: 'center',
}}
>
<Typography align={'center'} variant="subtitle2">
People
</Typography>
</ListSubheader>
}
>
<ListItem
sx={{
display: 'flex',
justifyContent: 'center',
}}
>
{people.length === 0 && (
<Typography align="center" variant="caption">
{`Can't find someone? Invite them!`}
</Typography>
)}
</ListItem>
{people.map((person) => (
<Tooltip key={`${person.uid}-searchUsers`} title={'quick dial'}>
<ListItem>
<ListItemButton onClick={() => handleQuickDial(person)}>
<ListItemAvatar>
<Avatar alt={person.displayName} src={person.photoUrl} />
</ListItemAvatar>
<ListItemText primary={person.displayName} secondary={person.email} />
<ListItemSecondaryAction sx={{ color: 'GrayText' }}>
<FiZap />
</ListItemSecondaryAction>
</ListItemButton>
</ListItem>
</Tooltip>
))}
</List>
<List
sx={{
pt: 2,
}}
subheader={
<ListSubheader
sx={{
display: 'flex',
justifyContent: 'center',
}}
>
<Typography align={'center'} variant="subtitle2">
Conversations
</Typography>
</ListSubheader>
}
>
<ListItem
sx={{
display: 'flex',
justifyContent: 'center',
}}
>
{conversations.length === 0 && (
<Typography align="center" variant="caption">
{`Can't find a conversation? Just create one!`}
</Typography>
)}
</ListItem>
{conversations.map((conversation) => (
<Tooltip key={`${conversation.id}-searchConversations`} title={'continue conversation'}>
<ConversationRow conversation={conversation} />
</Tooltip>
))}
</List>
</>
);
}
+2 -100
View File
@@ -45,6 +45,7 @@ import FooterControls from './FooterControls';
import MainPanel from './MainPanel';
import Navbar from './Navbar';
import NewConversationDialog from './NewConversationDialog';
import OmniSearchResults from './OmniSearchResults';
import { User } from '@nirvana/core/src/models/user.model';
import { blueGrey } from '@mui/material/colors';
import { createGroupConversation } from '../firebase/firestore';
@@ -543,7 +544,7 @@ export function TerminalProvider({ children }: { children?: React.ReactNode }) {
<Box sx={{ p: 2 }}>
{searchVal ? (
<SearchResults
<OmniSearchResults
people={searchUsersResults}
conversations={searchConversationsResults}
/>
@@ -576,102 +577,3 @@ export function TerminalProvider({ children }: { children?: React.ReactNode }) {
export default function useTerminal() {
return useContext(TerminalContext);
}
function SearchResults({
people,
conversations,
}: {
people: User[];
conversations: Conversation[];
}) {
const { handleQuickDial, selectConversation } = useTerminal();
return (
<>
<List
sx={{
pt: 2,
}}
subheader={
<ListSubheader
sx={{
display: 'flex',
justifyContent: 'center',
}}
>
<Typography align={'center'} variant="subtitle2">
People
</Typography>
</ListSubheader>
}
>
<ListItem
sx={{
display: 'flex',
justifyContent: 'center',
}}
>
{people.length === 0 && (
<Typography align="center" variant="caption">
{`Can't find someone? Invite them!`}
</Typography>
)}
</ListItem>
{people.map((person) => (
<Tooltip key={`${person.uid}-searchUsers`} title={'quick dial'}>
<ListItem>
<ListItemButton onClick={() => handleQuickDial(person)}>
<ListItemAvatar>
<Avatar alt={person.displayName} src={person.photoUrl} />
</ListItemAvatar>
<ListItemText primary={person.displayName} secondary={person.email} />
<ListItemSecondaryAction sx={{ color: 'GrayText' }}>
<FiZap />
</ListItemSecondaryAction>
</ListItemButton>
</ListItem>
</Tooltip>
))}
</List>
<List
sx={{
pt: 2,
}}
subheader={
<ListSubheader
sx={{
display: 'flex',
justifyContent: 'center',
}}
>
<Typography align={'center'} variant="subtitle2">
Conversations
</Typography>
</ListSubheader>
}
>
<ListItem
sx={{
display: 'flex',
justifyContent: 'center',
}}
>
{conversations.length === 0 && (
<Typography align="center" variant="caption">
{`Can't find a conversation? Just create one!`}
</Typography>
)}
</ListItem>
{conversations.map((conversation) => (
<Tooltip key={`${conversation.id}-searchConversations`} title={'continue conversation'}>
<ConversationRow conversation={conversation} />
</Tooltip>
))}
</List>
</>
);
}