From 6b02dda33f15dabdf20933cc6ab04bcb5cc6bacf Mon Sep 17 00:00:00 2001
From: talksik <patel.arjun50@gmail.com>
Date: Sun, 29 May 2022 14:13:38 -0500
Subject: [PATCH] Update Terminal.tsx

---
 packages/desktop/src/components/Terminal.tsx | 201 +++++++++----------
 1 file changed, 94 insertions(+), 107 deletions(-)

diff --git a/packages/desktop/src/components/Terminal.tsx b/packages/desktop/src/components/Terminal.tsx
index d14c4af..0a2693b 100644
--- a/packages/desktop/src/components/Terminal.tsx
+++ b/packages/desktop/src/components/Terminal.tsx
@@ -512,7 +512,6 @@ export function TerminalProvider({ children }: { children?: React.ReactNode }) {
             backgroundColor: blueGrey[50],
             boxShadow: 3,
             borderRight: `1px solid ${blueGrey}`,
-            position: 'relative',
           }}
         >
           <Stack
@@ -520,7 +519,6 @@ export function TerminalProvider({ children }: { children?: React.ReactNode }) {
             spacing={1}
             sx={{
               p: 2,
-              height: 'inherit',
             }}
           >
             <Navbar
@@ -536,121 +534,110 @@ export function TerminalProvider({ children }: { children?: React.ReactNode }) {
                 lookingForSomeone={selectedConversationId && !selectedConversation}
               />
             )}
-          </Stack>
 
-          {/* footer controls */}
-          <Box
-            sx={{
-              top: 'auto',
-              bottom: 0,
-              position: 'absolute',
-
-              borderTop: '1px solid',
-              borderTopColor: blueGrey[100],
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'flex-start',
-              gap: 2,
-              width: '100%',
-            }}
-          >
-            <Stack
-              spacing={1}
-              direction={'row'}
-              alignItems={'center'}
-              justifyContent={'flex-start'}
+            {/* footer controls */}
+            <Box
               sx={{
-                color: 'GrayText',
-                p: 1,
-                flex: 1,
+                mt: 'auto',
+
+                borderTop: '1px solid',
+                borderTopColor: blueGrey[100],
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'flex-start',
+                gap: 2,
+                width: '100%',
               }}
             >
-              <IconButton
-                onClick={handleClick}
-                size="small"
-                sx={{ mr: 'auto', borderRadius: 1 }}
-                aria-controls={open ? 'account-menu' : undefined}
-                aria-haspopup="true"
-                aria-expanded={open ? 'true' : undefined}
-              >
-                <Avatar alt={user.displayName} src={user.photoURL} />
-              </IconButton>
-
-              <Box
+              <Stack
+                spacing={1}
+                direction={'row'}
+                alignItems={'center'}
+                justifyContent={'flex-start'}
                 sx={{
-                  mr: 'auto',
+                  color: 'GrayText',
+                  p: 1,
+                  flex: 1,
                 }}
-                component="div"
               >
-                <Button size={'small'} color={'secondary'} variant="text">
-                  flow
-                </Button>
-              </Box>
-
-              <Tooltip title="Sound configuration">
-                <IconButton color="inherit" size="small">
-                  <FiHeadphones />
+                <IconButton
+                  onClick={handleClick}
+                  size="small"
+                  sx={{ mr: 'auto', borderRadius: 1 }}
+                  aria-controls={open ? 'account-menu' : undefined}
+                  aria-haspopup="true"
+                  aria-expanded={open ? 'true' : undefined}
+                >
+                  <Avatar alt={user.displayName} src={user.photoURL} />
                 </IconButton>
-              </Tooltip>
-              <Tooltip title="Desktop modes">
-                <IconButton color="inherit" size="small">
-                  <FiMonitor />
-                </IconButton>
-              </Tooltip>
-            </Stack>
 
-            <Menu
-              anchorEl={anchorEl}
-              id="account-menu"
-              open={open}
-              onClose={handleClose}
-              onClick={handleClose}
-              PaperProps={{
-                elevation: 0,
-                sx: {
-                  overflow: 'visible',
-                  filter: 'drop-shadow(0px 2px 8px rgba(0,0,0,0.32))',
-                  mt: 1.5,
-                  '& .MuiAvatar-root': {
-                    width: 32,
-                    height: 32,
-                    ml: -0.5,
-                    mr: 1,
+                <Box
+                  sx={{
+                    mr: 'auto',
+                  }}
+                  component="div"
+                >
+                  <Button size={'small'} color={'secondary'} variant="text">
+                    flow
+                  </Button>
+                </Box>
+
+                <Tooltip title="Sound configuration">
+                  <IconButton color="inherit" size="small">
+                    <FiHeadphones />
+                  </IconButton>
+                </Tooltip>
+                <Tooltip title="Desktop modes">
+                  <IconButton color="inherit" size="small">
+                    <FiMonitor />
+                  </IconButton>
+                </Tooltip>
+              </Stack>
+
+              <Menu
+                anchorEl={anchorEl}
+                id="account-menu"
+                open={open}
+                onClose={handleClose}
+                onClick={handleClose}
+                PaperProps={{
+                  elevation: 0,
+                  sx: {
+                    overflow: 'visible',
+                    filter: 'drop-shadow(0px 2px 8px rgba(0,0,0,0.32))',
+                    mt: 1.5,
+                    '& .MuiAvatar-root': {
+                      width: 32,
+                      height: 32,
+                      ml: -0.5,
+                      mr: 1,
+                    },
+                    '&:before': {
+                      content: '""',
+                      display: 'block',
+                      position: 'absolute',
+                      top: 0,
+                      right: 14,
+                      width: 10,
+                      height: 10,
+                      bgcolor: 'background.paper',
+                      transform: 'translateY(-50%) rotate(45deg)',
+                      zIndex: 0,
+                    },
                   },
-                  '&:before': {
-                    content: '""',
-                    display: 'block',
-                    position: 'absolute',
-                    top: 0,
-                    right: 14,
-                    width: 10,
-                    height: 10,
-                    bgcolor: 'background.paper',
-                    transform: 'translateY(-50%) rotate(45deg)',
-                    zIndex: 0,
-                  },
-                },
-              }}
-              transformOrigin={{ horizontal: 'right', vertical: 'top' }}
-              anchorOrigin={{ horizontal: 'right', vertical: 'bottom' }}
-            >
-              <MenuItem>
-                <Avatar /> Profile
-              </MenuItem>
-              <MenuItem>
-                <Avatar /> My account
-              </MenuItem>
-
-              <Divider />
-
-              <MenuItem onClick={logout}>
-                <ListItemIcon>
-                  <FiLogOut />
-                </ListItemIcon>
-                <Typography color="warning">Logout</Typography>
-              </MenuItem>
-            </Menu>
-          </Box>
+                }}
+                transformOrigin={{ horizontal: 'right', vertical: 'top' }}
+                anchorOrigin={{ horizontal: 'right', vertical: 'bottom' }}
+              >
+                <MenuItem onClick={logout}>
+                  <ListItemIcon>
+                    <FiLogOut />
+                  </ListItemIcon>
+                  <Typography color="warning">Logout</Typography>
+                </MenuItem>
+              </Menu>
+            </Box>
+          </Stack>
         </Grid>
 
         <MainPanel />