1import {PropsWithChildren} from 'react';
 2import Box from '@mui/material/Box';
 3import {ThemeProvider} from '@mui/material/styles';
 4import theme from '../../theme';
 5import useMediaQuery from '@mui/material/useMediaQuery';
 6
 7const MapWrapper = ({children}: PropsWithChildren) => {
 8  const mobile = useMediaQuery(theme.breakpoints.down('md'));
 9  return (
10    <ThemeProvider theme={theme}>
11      <Box
12        id="map"
13        width="100%"
14        height={mobile ? '40vh' : '50vh'}
15        sx={{position: 'relative'}}
16      >
17        {children}
18      </Box>
19    </ThemeProvider>
20  );
21};
22
23export default MapWrapper;