talksik/nirvana-v4
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

adding stuff for mic

Browse Source
This commit is contained in:
talksik
2022-05-29 08:46:58 -05:00
parent c3eba13154
commit 4f7d8c92c1
6 changed files with 142 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/desktop/src/components/Terminal.tsx
+129 -102
View File
@@ -65,6 +65,7 @@ import NirvanaAvatar from './NirvanaAvatar';
import { useDebounce, useKeyPressEvent } from 'react-use';
import KeyboardShortcutLabel from './KeyboardShortcutLabel';
import Channels from '../electron/constants';
type ConversationMap = {
[conversationId: string]: Conversation;
};
@@ -86,10 +87,14 @@ interface ITerminalContext {
handleQuickDial?: (otherUserId: string) => void;
getUser?: (userId: string) => Promise<User | undefined>;
isUserSpeaking: boolean;
}
const TerminalContext = React.createContext<ITerminalContext>({
conversationMap: {},
isUserSpeaking: false,
});
// TODOS
@@ -151,7 +156,7 @@ export function TerminalProvider({ children }: { children?: React.ReactNode }) {
});
return () => unsub();
}, [user, enqueueSnackbar, updateConversationMap]);
}, [user, updateConversationMap]);
// cache of selected conversation
const selectedConversation: Conversation | undefined = useMemo(() => {
@@ -240,15 +245,32 @@ export function TerminalProvider({ children }: { children?: React.ReactNode }) {
useKeyPressEvent('Shift', onSearchFocus);
const [isUserSpeaking, setIsUserSpeaking] = useState<boolean>(false);
const [userAudioStream, setUserAudioStream] = useState<MediaStream>(null);
const handleAskForMicrophonePermissions = useCallback(() => {
window.electronAPI.send(Channels.ASK_MICROPHONE_PERMISSIONS);
}, []);
// when user wants to talk,
// unmute them and send clip for everyone to hear in the distance
const handleBroadcast = useCallback(() => {
if (!userAudioStream) {
enqueueSnackbar('Check your audio mic permissions!', { variant: 'error' });
handleAskForMicrophonePermissions();
return;
}
setIsUserSpeaking(true);
enqueueSnackbar('started recording');
}, []);
}, [setIsUserSpeaking, userAudioStream, handleAskForMicrophonePermissions]);
const handleStopBroadcast = useCallback(() => {
setIsUserSpeaking(false);
enqueueSnackbar('stopped...', { variant: 'info' });
}, []);
}, [setIsUserSpeaking]);
useKeyPressEvent('`', handleBroadcast, handleStopBroadcast);
@@ -295,6 +317,7 @@ export function TerminalProvider({ children }: { children?: React.ReactNode }) {
return (
<TerminalContext.Provider
value={{
isUserSpeaking,
selectedConversation,
conversationMap,
getUser,
@@ -633,8 +656,6 @@ function ConversationRow({ conversation }: { conversation: Conversation }) {
return;
}, [conversation.memberIdsList, getUser, user, setConversationUsers]);
console.log(conversationUsers);
return (
<ListItem key={`${conversation.id}-priorityConvoList`}>
<ListItemButton
@@ -782,103 +803,7 @@ function ConversationDetails() {
</Stack>
<Container maxWidth={false} sx={{ position: 'relative', flex: 1 }}>
<Container maxWidth="xs">
<Stack
justifyContent={'flex-start'}
alignItems={'center'}
sx={{
pt: 2,
}}
>
<Typography variant="caption">yesterday</Typography>
<Paper elevation={1} sx={{ p: 1, width: '100%' }}>
<Stack direction={'row'} alignItems="center">
<Stack spacing={2} direction={'row'} alignItems={'center'}>
<Avatar alt={'Arjun Patel'} src="https://mui.com/static/images/avatar/2.jpg" />
<Typography color={'GrayText'} variant="overline">
{'Viet Phan'}
</Typography>
</Stack>
<Box
sx={{
ml: 'auto',
color: 'GrayText',
}}
>
<FiPlay />
</Box>
</Stack>
</Paper>
</Stack>
<Stack
justifyContent={'flex-start'}
alignItems={'center'}
sx={{
pt: 2,
}}
>
<Typography variant="caption">today</Typography>
<Paper elevation={8} sx={{ p: 1, width: '100%' }}>
<Stack direction={'row'} alignItems="center">
<Stack spacing={2} direction={'row'} alignItems={'center'}>
<Avatar alt={'Arjun Patel'} src="https://mui.com/static/images/avatar/2.jpg" />
<Typography color={'GrayText'} variant="overline">
{'Viet Phan'}
</Typography>
</Stack>
<Box
sx={{
ml: 'auto',
color: 'GrayText',
}}
>
<FiPlay />
</Box>
</Stack>
</Paper>
</Stack>
<Stack
justifyContent={'flex-start'}
alignItems={'center'}
sx={{
pt: 2,
}}
>
<Typography variant="caption">right now</Typography>
<Paper elevation={24} sx={{ p: 1, width: '100%' }}>
<Stack direction={'row'} alignItems="center">
<Stack spacing={2} direction={'row'} alignItems={'center'}>
<Avatar
alt={'Arjun Patel'}
src="https://lh3.googleusercontent.com/ogw/ADea4I6TRqnIptWNP25-iXdusoAHafj-cUPYkO53xKT2_H0=s64-c-mo"
/>
<Typography color={'GrayText'} variant="overline">
{'Arjun Patel'}
</Typography>
</Stack>
<Box
sx={{
ml: 'auto',
color: 'GrayText',
}}
>
<FiPlay />
</Box>
</Stack>
</Paper>
</Stack>
</Container>
{/* <ConversationHistory /> */}
<Box
sx={{
@@ -897,3 +822,105 @@ function ConversationDetails() {
</>
);
}
function ConversationHistory() {
return (
<Container maxWidth="xs">
<Stack
justifyContent={'flex-start'}
alignItems={'center'}
sx={{
pt: 2,
}}
>
<Typography variant="caption">yesterday</Typography>
<Paper elevation={1} sx={{ p: 1, width: '100%' }}>
<Stack direction={'row'} alignItems="center">
<Stack spacing={2} direction={'row'} alignItems={'center'}>
<Avatar alt={'Arjun Patel'} src="https://mui.com/static/images/avatar/2.jpg" />
<Typography color={'GrayText'} variant="overline">
{'Viet Phan'}
</Typography>
</Stack>
<Box
sx={{
ml: 'auto',
color: 'GrayText',
}}
>
<FiPlay />
</Box>
</Stack>
</Paper>
</Stack>
<Stack
justifyContent={'flex-start'}
alignItems={'center'}
sx={{
pt: 2,
}}
>
<Typography variant="caption">today</Typography>
<Paper elevation={8} sx={{ p: 1, width: '100%' }}>
<Stack direction={'row'} alignItems="center">
<Stack spacing={2} direction={'row'} alignItems={'center'}>
<Avatar alt={'Arjun Patel'} src="https://mui.com/static/images/avatar/2.jpg" />
<Typography color={'GrayText'} variant="overline">
{'Viet Phan'}
</Typography>
</Stack>
<Box
sx={{
ml: 'auto',
color: 'GrayText',
}}
>
<FiPlay />
</Box>
</Stack>
</Paper>
</Stack>
<Stack
justifyContent={'flex-start'}
alignItems={'center'}
sx={{
pt: 2,
}}
>
<Typography variant="caption">right now</Typography>
<Paper elevation={24} sx={{ p: 1, width: '100%' }}>
<Stack direction={'row'} alignItems="center">
<Stack spacing={2} direction={'row'} alignItems={'center'}>
<Avatar
alt={'Arjun Patel'}
src="https://lh3.googleusercontent.com/ogw/ADea4I6TRqnIptWNP25-iXdusoAHafj-cUPYkO53xKT2_H0=s64-c-mo"
/>
<Typography color={'GrayText'} variant="overline">
{'Arjun Patel'}
</Typography>
</Stack>
<Box
sx={{
ml: 'auto',
color: 'GrayText',
}}
>
<FiPlay />
</Box>
</Stack>
</Paper>
</Stack>
</Container>
);
}
packages/desktop/src/electron/constants.ts
+2
View File
@@ -8,6 +8,8 @@ enum Channels {
RESIZE_WINDOW = 'RESIZE_WINDOW',
ON_WINDOW_BLUR = 'ON_WINDOW_BLUR',
ON_WINDOW_FOCUS = 'ON_WINDOW_FOCUS',
ASK_MICROPHONE_PERMISSIONS = 'ASK_MICROPHONE_PERMISSIONS',
}
export enum STORE_ITEMS {
packages/desktop/src/electron/global.d.ts
Vendored
+1
View File
@@ -15,6 +15,7 @@ declare global {
window: {
resizeWindow(dimensionChangeRequest: DimensionChangeRequest): void;
};
send(channel: Channels, data?: any);
on(channel: Channels, func: any): () => void;
once(channel: Channels, func: any): () => void;
};
packages/desktop/src/electron/preload.ts
+4
View File
@@ -23,6 +23,10 @@ const electronAPI = {
},
},
send(channel: Channels, data?: any) {
ipcRenderer.send(channel, data);
},
on(channel: Channels, func: any) {
// const validChannels = ['ipc-example'];
// if (validChannels.includes(channel)) {
packages/desktop/src/firebase/firestore.ts
+1 -1
View File
@@ -134,7 +134,7 @@ export const getUserById = async (userId: string): Promise<User | undefined> =>
// get the conversations for particular user
export const getConversationsQueryLIVE = (userId: string) =>
query(db.conversations, where('memberIdsList', 'array-contains', userId));
query(db.conversations, where(`members.${userId}.isActive`, '==', true));
/**
*
packages/desktop/src/index.ts
+5 -1
View File
@@ -1,4 +1,4 @@
import { app, BrowserWindow, ipcMain, Display, screen } from 'electron';
import { app, BrowserWindow, ipcMain, Display, screen, systemPreferences } from 'electron';
import Channels, { DEFAULT_APP_PRESET, DimensionChangeRequest } from './electron/constants';
import { handleGoogleLogin } from './electron/handleLogin';
@@ -64,6 +64,10 @@ app
console.log('initiating log in');
await handleGoogleLogin();
});
ipcMain.on(Channels.ASK_MICROPHONE_PERMISSIONS, async () => {
systemPreferences.askForMediaAccess('microphone');
});
})
.then(() => {
// dynamically changing the window bounds