Fix BottomLink warning
During local development the component causes a warning to be logged - details in changeset. This doesn't affect prod deployments seems to be dev mode only. Signed-off-by: Iain Billett <iain@roadie.io>
This commit is contained in:
@@ -0,0 +1,14 @@
|
||||
---
|
||||
'@backstage/core-components': patch
|
||||
---
|
||||
|
||||
Fix warning produced by BottomLink component
|
||||
|
||||
During development, we noticed warnings such as:
|
||||
|
||||
```
|
||||
react_devtools_backend.js:2842 Warning: validateDOMNesting(...): <div> cannot appear as a descendant of <p>.
|
||||
```
|
||||
|
||||
The BottomLink component renders a Box component within a Typography component which leads to a div tag within a p tag.
|
||||
This change inverts that ordering without changing the visual appearance.
|
||||
@@ -49,11 +49,11 @@ export const BottomLink = ({ link, title, onClick }: BottomLinkProps) => {
|
||||
<Divider />
|
||||
<Link to={link} onClick={onClick} underline="none">
|
||||
<Box display="flex" alignItems="center" className={classes.root}>
|
||||
<Typography>
|
||||
<Box className={classes.boxTitle} fontWeight="fontWeightBold" m={1}>
|
||||
{title}
|
||||
</Box>
|
||||
</Typography>
|
||||
<Box className={classes.boxTitle} fontWeight="fontWeightBold" m={1}>
|
||||
<Typography>
|
||||
<strong>{title}</strong>
|
||||
</Typography>
|
||||
</Box>
|
||||
<ArrowIcon className={classes.arrow} />
|
||||
</Box>
|
||||
</Link>
|
||||
|
||||
Reference in New Issue
Block a user