diff options
Diffstat (limited to 'client/src/components/Desktop.tsx')
-rw-r--r-- | client/src/components/Desktop.tsx | 29 |
1 files changed, 29 insertions, 0 deletions
diff --git a/client/src/components/Desktop.tsx b/client/src/components/Desktop.tsx new file mode 100644 index 0000000..13de4ee --- /dev/null +++ b/client/src/components/Desktop.tsx @@ -0,0 +1,29 @@ +import React from 'react'; +import { useContext } from 'react'; +import { Link } from 'react-router-dom'; +import { Button, IconButton } from '@mui/material'; +import DarkModeIcon from '@mui/icons-material/DarkMode'; +import LightModeIcon from '@mui/icons-material/LightMode'; +import { useTheme } from '@mui/material/styles'; +import { ThemeContext } from '../ThemeContextProvider'; +import pages from '../pages'; + +function Desktop() { + const theme = useTheme(); + const { toggleColorMode } = useContext(ThemeContext); + + return ( + <div style={{ marginLeft: 'auto' }}> + {pages.map((page) => ( + <Button color="inherit" component={Link} to={page?.to} key={page?.name}> + {page?.name} + </Button> + ))} + <IconButton color="inherit" onClick={toggleColorMode}> + {theme.palette.mode === 'dark' ? <LightModeIcon /> : <DarkModeIcon />} + </IconButton> + </div> + ); +} + +export default Desktop; |