reuterShawn/remnantchat
1
0
Fork 0
forked from Shiloh/remnantchat
Code Pull Requests Activity

refactor(shell): move MuiDrawer out of PeerList

Browse Source
This commit is contained in:
Jeremy Kahn 2023-10-12 09:03:38 -05:00
parent c170edb692
commit dfd4131959
2 changed files with 32 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/components/Shell/PeerList.tsx
View File

@ -1,6 +1,5 @@
import { PropsWithChildren } from 'react'
import { Route, Routes } from 'react-router-dom'
import MuiDrawer from '@mui/material/Drawer'
import List from '@mui/material/List'
import ListItemIcon from '@mui/material/ListItemIcon'
import ListItemText from '@mui/material/ListItemText'
@ -28,7 +27,6 @@ export const peerListWidth = 300
export interface PeerListProps extends PropsWithChildren {
userId: string
roomId: string | undefined
isPeerListOpen: boolean
onPeerListClose: () => void
peerList: Peer[]
peerConnectionTypes: Record<string, PeerConnectionType>
@ -40,7 +38,6 @@ export interface PeerListProps extends PropsWithChildren {
export const PeerList = ({
userId,
roomId,
isPeerListOpen,
onPeerListClose,
peerList,
peerConnectionTypes,
@ -49,23 +46,7 @@ export const PeerList = ({
connectionTestResults,
}: PeerListProps) => {
return (
<MuiDrawer
sx={{
flexShrink: 0,
pointerEvents: 'none',
width: peerListWidth,
'& .MuiDrawer-paper': {
width: peerListWidth,
boxSizing: 'border-box',
},
...(isPeerListOpen && {
pointerEvents: 'auto',
}),
}}
variant="persistent"
anchor="right"
open={isPeerListOpen}
>
<>
<PeerListHeader>
<IconButton onClick={onPeerListClose} aria-label="Close peer list">
<ChevronRightIcon />
@ -132,6 +113,6 @@ export const PeerList = ({
</>
) : null}
</List>
</MuiDrawer>
</>
)
}

42
src/components/Shell/Shell.tsx
View File

@ -11,6 +11,7 @@ import CssBaseline from '@mui/material/CssBaseline'
import { ThemeProvider, createTheme } from '@mui/material/styles'
import Box from '@mui/material/Box'
import { AlertColor } from '@mui/material/Alert'
import MuiDrawer from '@mui/material/Drawer'
import { useWindowSize } from '@react-hook/window-size'
import { ShellContext } from 'contexts/ShellContext'
@ -26,7 +27,7 @@ import { UpgradeDialog } from './UpgradeDialog'
import { ShellAppBar } from './ShellAppBar'
import { NotificationArea } from './NotificationArea'
import { RouteContent } from './RouteContent'
import { PeerList } from './PeerList'
import { PeerList, peerListWidth } from './PeerList'
import { QRCodeDialog } from './QRCodeDialog'
import { RoomShareDialog } from './RoomShareDialog'
import { useConnectionTest } from './useConnectionTest'
@ -366,17 +367,34 @@ export const Shell = ({ appNeedsUpdate, children, userPeerId }: ShellProps) => {
>
<ErrorBoundary>{children}</ErrorBoundary>
</RouteContent>
<PeerList
userId={userPeerId}
roomId={roomId}
isPeerListOpen={isPeerListOpen}
onPeerListClose={handlePeerListClick}
peerList={peerList}
peerConnectionTypes={peerConnectionTypes}
audioState={audioState}
peerAudios={peerAudios}
connectionTestResults={connectionTestResults}
/>
<MuiDrawer
sx={{
flexShrink: 0,
pointerEvents: 'none',
width: peerListWidth,
'& .MuiDrawer-paper': {
width: peerListWidth,
boxSizing: 'border-box',
},
...(isPeerListOpen && {
pointerEvents: 'auto',
}),
}}
variant="persistent"
anchor="right"
open={isPeerListOpen}
>
<PeerList
userId={userPeerId}
roomId={roomId}
onPeerListClose={handlePeerListClick}
peerList={peerList}
peerConnectionTypes={peerConnectionTypes}
audioState={audioState}
peerAudios={peerAudios}
connectionTestResults={connectionTestResults}
/>
</MuiDrawer>
<QRCodeDialog
isOpen={isQRCodeDialogOpen}
handleClose={handleQRCodeDialogClose}