Shiloh/remnantchat
Shiloh/remnantchat
1
0
Fork 1
Code Issues Pull Requests Packages Projects 4 Releases Wiki Activity

feat: default sidebars to open on wide screens

Browse Source
This commit is contained in:
Jeremy Kahn 2023-03-15 09:24:32 -05:00 committed by Jeremy Kahn
parent dab98f02c2
commit 446ca466c7
1 changed files with 20 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
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 { useWindowSize } from '@react-hook/window-size'
import { ShellContext } from 'contexts/ShellContext'
import { SettingsContext } from 'contexts/SettingsContext'
@ -34,8 +35,24 @@ export interface ShellProps extends PropsWithChildren {
export const Shell = ({ appNeedsUpdate, children, userPeerId }: ShellProps) => {
const { getUserSettings, updateUserSettings } = useContext(SettingsContext)
const { colorMode } = getUserSettings()
const theme = useMemo(
() =>
createTheme({
palette: {
mode: colorMode,
},
}),
[colorMode]
)
const [windowWidth] = useWindowSize()
const defaultSidebarsOpen = windowWidth >= theme.breakpoints.values.lg
const [isAlertShowing, setIsAlertShowing] = useState(false)
const [isDrawerOpen, setIsDrawerOpen] = useState(false)
const [isDrawerOpen, setIsDrawerOpen] = useState(defaultSidebarsOpen)
const [isQRCodeDialogOpen, setIsQRCodeDialogOpen] = useState(false)
const [isRoomShareDialogOpen, setIsRoomShareDialogOpen] = useState(false)
const [doShowPeers, setDoShowPeers] = useState(false)
@ -48,7 +65,7 @@ export const Shell = ({ appNeedsUpdate, children, userPeerId }: ShellProps) => {
const [numberOfPeers, setNumberOfPeers] = useState(1)
const [roomId, setRoomId] = useState<string | undefined>(undefined)
const [password, setPassword] = useState<string | undefined>(undefined)
const [isPeerListOpen, setIsPeerListOpen] = useState(false)
const [isPeerListOpen, setIsPeerListOpen] = useState(defaultSidebarsOpen)
const [peerList, setPeerList] = useState<Peer[]>([]) // except you
const [tabHasFocus, setTabHasFocus] = useState(true)
const [audioState, setAudioState] = useState<AudioState>(AudioState.STOPPED)
@ -129,18 +146,6 @@ export const Shell = ({ appNeedsUpdate, children, userPeerId }: ShellProps) => {
]
)
const { colorMode } = getUserSettings()
const theme = useMemo(
() =>
createTheme({
palette: {
mode: colorMode,
},
}),
[colorMode]
)
const handleAlertClose = (
_event?: SyntheticEvent | Event,
reason?: string
@ -220,7 +225,7 @@ export const Shell = ({ appNeedsUpdate, children, userPeerId }: ShellProps) => {
const handleBlur = () => {
setTabHasFocus(false)
}
const handleFullscreen = (event: Event) => {
const handleFullscreen = () => {
setIsFullscreen(!!document.fullscreenElement)
}
window.addEventListener('focus', handleFocus)