woggioni-opencode-agent/bee-dashboard
1
0
Fork 0
Code Actions Packages Releases Activity

fix: Setting explicit Typography components to fix invalid DOM (#25)

Browse Source 
* fix: Setting explicit Typography components to fix invalid DOM

Typography, by default, uses <p> as it's underlying component. When used
to embed other components it resulted in a DOM errors like: "<p> cannot appear
as descendant of <p>"... and more.

fix: Linting

* chore: apply suggestions from code review

Co-authored-by: Vojtech Simetka <vojtech@simetka.cz>
This commit is contained in:
Andrew LeTourneau
2021-03-29 03:23:12 -05:00
committed by GitHub
parent 0cab024b69
commit 325a59098e
15 changed files with 37 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/status/StatusCard.tsx
+6 -6
View File
@@ -105,7 +105,7 @@ function StatusCard(props: IProps) {
</span>
</div>
<div>
<Typography variant="subtitle2" gutterBottom>
<Typography component="div" variant="subtitle2" gutterBottom>
<span>AGENT: </span>
<a href='https://github.com/ethersphere/bee' rel='noreferrer' target='_blank'>Bee</a>
<span>{props.nodeReadiness?.version ? ` v${props.nodeReadiness.version}` : '-'}</span>
@@ -123,20 +123,20 @@ function StatusCard(props: IProps) {
<a href='#'>update</a>
}
</Typography>
<Typography variant="subtitle2" gutterBottom>
<Typography component="div" variant="subtitle2" gutterBottom>
<span>PUBLIC KEY: </span>
<span>{ props.nodeAddresses.public_key ? props.nodeAddresses.public_key : '-' }</span>
</Typography>
<Typography variant="subtitle2" gutterBottom>
<Typography component="div" variant="subtitle2" gutterBottom>
<span>PSS PUBLIC KEY: </span>
<span>{ props.nodeAddresses.pss_public_key ? props.nodeAddresses.pss_public_key : '-' }</span>
</Typography>
<Typography variant="subtitle2" gutterBottom>
<Typography style={{marginTop:'20px'}}>
<Typography component="div" variant="subtitle2" gutterBottom>
<Typography component="div" style={{marginTop:'20px'}}>
<span>OVERLAY ADDRESS (PEER ID): </span>
<span>{ props.nodeAddresses.overlay ? props.nodeAddresses.overlay : '-' }</span>
</Typography>
<Typography onClick={() => setUnderlayAddresessVisible(!underlayAddressesVisible)}>
<Typography component="div" onClick={() => setUnderlayAddresessVisible(!underlayAddressesVisible)}>
<Button color="primary" style={{padding: 0, marginTop:'6px'}}>
{ underlayAddressesVisible ?
<ArrowDropUp style={{fontSize:'12px'}} /> :