Feature/update dependency mui to v5.x (#332)

* Update dependency "mui" to v5.x

Update to v5.13.3

Fixes issue of "SxProps" not being exported by "@mui/material"

* Update dependency "mui" to v5.x - Fix grid item size

Update to v5.13.3

Fixes issue of "SxProps" not being exported by "@mui/material"

* Update dependency "mui" to v5.x - Replace "ListItem" with "ListItemButton"

* Update dependency "mui" to v5.x - Fix tsc issue

* Update dependency "mui" to v5.x - Prevent reader white screen

Due to "initialChapter" being a function returning an object, it causes a re-render everytime due to it (the object) being used as a dependency.
This caused a white screen when skipping to the previous or next chapter
This commit is contained in:
schroda
2023-06-04 21:13:07 +02:00
committed by GitHub
parent 6911f60eb4
commit 1ce27ea939
11 changed files with 192 additions and 120 deletions

View File

@@ -7,7 +7,7 @@
*/
import React from 'react';
import { ListItem, styled, Box } from '@mui/material';
import { styled, Box, ListItemButton } from '@mui/material';
import { Link as RRDLink, useLocation } from 'react-router-dom';
import { useTheme } from '@mui/material/styles';
import { NavbarItem } from 'typings';
@@ -55,7 +55,7 @@ export default function MobileBottomBar({ navBarItems }: IProps) {
<BottomNavContainer>
{navBarItems.map(({ path, title, IconComponent, SelectedIconComponent }: NavbarItem) => (
<Link to={path} key={path}>
<ListItem disableRipple button sx={{ justifyContent: 'center', padding: '8px' }} key={title}>
<ListItemButton disableRipple sx={{ justifyContent: 'center', padding: '8px' }} key={title}>
<Box display="flex" flexDirection="column" alignItems="center">
{iconFor(path, IconComponent, SelectedIconComponent)}
<Box
@@ -73,7 +73,7 @@ export default function MobileBottomBar({ navBarItems }: IProps) {
{t(title)}
</Box>
</Box>
</ListItem>
</ListItemButton>
</Link>
))}
</BottomNavContainer>