handling overlay and making it WORK!!!!

This commit is contained in:
talksik
2022-06-20 12:40:44 -05:00
parent 8743b26d49
commit 6e68b246c8
4 changed files with 53 additions and 38 deletions
@@ -384,7 +384,7 @@ export function ConversationProvider({ children }: { children: React.ReactNode }
}); });
priorityConversations.sort((a, b) => { priorityConversations.sort((a, b) => {
return b.createdDate.getTime() - a.createdDate.getTime(); return b.createdDate.valueOf() - a.createdDate.valueOf();
}); });
return [priorityConversations, inboxConversations]; return [priorityConversations, inboxConversations];
@@ -36,8 +36,8 @@ export function ElectronProvider({ children }: { children: React.ReactNode }) {
} else if (desktopMode === 'overlayOnly') { } else if (desktopMode === 'overlayOnly') {
stayOnTop = true; stayOnTop = true;
finalDimensions = { finalDimensions = {
height: 273, height: DEFAULT_APP_PRESET.height,
width: 350, width: 100,
}; };
finalPosition = 'topRight'; finalPosition = 'topRight';
} }
+11 -2
View File
@@ -26,6 +26,7 @@ import { blueGrey } from '@mui/material/colors';
import useAuth from '../providers/AuthProvider'; import useAuth from '../providers/AuthProvider';
import useConversations from '../providers/ConversationProvider'; import useConversations from '../providers/ConversationProvider';
import useDevices from '../hooks/useDevices'; import useDevices from '../hooks/useDevices';
import useElectron from '../providers/ElectronProvider';
import useSearch from '../providers/SearchProvider'; import useSearch from '../providers/SearchProvider';
import useZen from '../providers/ZenProvider'; import useZen from '../providers/ZenProvider';
@@ -35,6 +36,8 @@ export default function FooterControls() {
const { selectedConversation, priorityConversations } = useConversations(); const { selectedConversation, priorityConversations } = useConversations();
const { user, handleLogout } = useAuth(); const { user, handleLogout } = useAuth();
const { handleToggleDesktopMode, desktopMode } = useElectron();
const [openUserSettings, setOpenUserSettings] = useState<boolean>(false); const [openUserSettings, setOpenUserSettings] = useState<boolean>(false);
const handleClickProfile = useCallback( const handleClickProfile = useCallback(
@@ -64,6 +67,7 @@ export default function FooterControls() {
<Box <Box
sx={{ sx={{
maxWidth: 100, maxWidth: 100,
width: '100%',
zIndex: 10, zIndex: 10,
boxShadow: 10, boxShadow: 10,
@@ -104,7 +108,12 @@ export default function FooterControls() {
<Divider orientation="horizontal" flexItem /> <Divider orientation="horizontal" flexItem />
<Tooltip title={'overlay mode'}> <Tooltip title={'overlay mode'}>
<Switch color="secondary" size="small" /> <Switch
checked={desktopMode === 'overlayOnly'}
onChange={handleToggleDesktopMode}
color="secondary"
size="small"
/>
</Tooltip> </Tooltip>
<Divider orientation="horizontal" flexItem /> <Divider orientation="horizontal" flexItem />
@@ -156,7 +165,7 @@ function OverlayConversation({
if (!isSelected) { if (!isSelected) {
selectConversation(masterConversation._id.toString(), false); selectConversation(masterConversation._id.toString(), false);
} }
}, [masterConversation, selectConversation]); }, [masterConversation, selectConversation, isSelected]);
return ( return (
<Stack <Stack
+39 -33
View File
@@ -8,6 +8,7 @@ import NewConversationDialog from './NewConversationDialog';
import OmniSearchResults from './OmniSearchResults'; import OmniSearchResults from './OmniSearchResults';
import React from 'react'; import React from 'react';
import { blueGrey } from '@mui/material/colors'; import { blueGrey } from '@mui/material/colors';
import useElectron from '../providers/ElectronProvider';
import useRouter from '../providers/RouterProvider'; import useRouter from '../providers/RouterProvider';
import useSearch from '../providers/SearchProvider'; import useSearch from '../providers/SearchProvider';
@@ -16,6 +17,8 @@ export default function Terminal() {
const { searchQuery } = useSearch(); const { searchQuery } = useSearch();
const { desktopMode } = useElectron();
return ( return (
<Container <Container
maxWidth={false} maxWidth={false}
@@ -25,44 +28,47 @@ export default function Terminal() {
flexDirection: 'row', flexDirection: 'row',
}} }}
> >
<Grid container spacing={0} sx={{ flex: 1 }}> {desktopMode === 'mainApp' && (
<Grid <>
item {/* create chat dialog */}
xs={4} <NewConversationDialog />
sx={{
zIndex: 2,
backgroundColor: blueGrey[50],
boxShadow: 3,
borderRight: `1px solid ${blueGrey}`,
display: 'flex', <Grid container spacing={0} sx={{ flex: 1 }}>
flexDirection: 'column', <Grid
}} item
> xs={4}
<Navbar /> sx={{
zIndex: 2,
backgroundColor: blueGrey[50],
boxShadow: 3,
borderRight: `1px solid ${blueGrey}`,
<Box sx={{ p: 2 }}>{searchQuery ? <OmniSearchResults /> : <ConversationList />}</Box> display: 'flex',
</Grid> flexDirection: 'column',
}}
>
<Navbar />
<Grid <Box sx={{ p: 2 }}>{searchQuery ? <OmniSearchResults /> : <ConversationList />}</Box>
item </Grid>
xs={8}
sx={{ <Grid
backgroundColor: 'white', item
display: 'flex', xs={8}
flexDirection: 'column', sx={{
maxHeight: '100vh', backgroundColor: 'white',
overflowY: 'auto', display: 'flex',
}} flexDirection: 'column',
> maxHeight: '100vh',
<MainPanel /> }}
</Grid> >
</Grid> <MainPanel />
</Grid>
</Grid>
</>
)}
<FooterControls /> <FooterControls />
{/* create chat dialog */}
<NewConversationDialog />
</Container> </Container>
); );
} }