🔧 Fixes for DOMNesting issues on the Downloads page
Signed-off-by: Rishi Ghan <rishi.ghan@gmail.com>
This commit is contained in:
@@ -3,7 +3,6 @@ import { getTransfers } from "../../actions/airdcpp.actions";
|
|||||||
import { useDispatch, useSelector } from "react-redux";
|
import { useDispatch, useSelector } from "react-redux";
|
||||||
import { AirDCPPSocketContext } from "../../context/AirDCPPSocket";
|
import { AirDCPPSocketContext } from "../../context/AirDCPPSocket";
|
||||||
import { isEmpty, isNil, isUndefined } from "lodash";
|
import { isEmpty, isNil, isUndefined } from "lodash";
|
||||||
import { searchIssue } from "../../actions/fileops.actions";
|
|
||||||
import { determineCoverFile } from "../../shared/utils/metadata.utils";
|
import { determineCoverFile } from "../../shared/utils/metadata.utils";
|
||||||
import MetadataPanel from "../shared/MetadataPanel";
|
import MetadataPanel from "../shared/MetadataPanel";
|
||||||
|
|
||||||
@@ -47,7 +46,6 @@ export const Downloads = (props: IDownloadsProps): ReactElement => {
|
|||||||
})
|
})
|
||||||
setBundles(foo);
|
setBundles(foo);
|
||||||
}
|
}
|
||||||
|
|
||||||
}, [issueBundles])
|
}, [issueBundles])
|
||||||
|
|
||||||
return !isNil(bundles) ?
|
return !isNil(bundles) ?
|
||||||
@@ -56,9 +54,9 @@ export const Downloads = (props: IDownloadsProps): ReactElement => {
|
|||||||
<h1 className="title">Downloads</h1>
|
<h1 className="title">Downloads</h1>
|
||||||
<div className="columns">
|
<div className="columns">
|
||||||
<div className="column is-half">
|
<div className="column is-half">
|
||||||
{bundles.map(bundle => {
|
{bundles.map((bundle, idx) => {
|
||||||
console.log(bundle);
|
console.log(bundle);
|
||||||
return <>
|
return <div key={idx}>
|
||||||
<MetadataPanel
|
<MetadataPanel
|
||||||
data={bundle}
|
data={bundle}
|
||||||
imageStyle={{ maxWidth: 80 }}
|
imageStyle={{ maxWidth: 80 }}
|
||||||
@@ -70,30 +68,33 @@ export const Downloads = (props: IDownloadsProps): ReactElement => {
|
|||||||
margin: "0 0 8px 0",
|
margin: "0 0 8px 0",
|
||||||
}} />
|
}} />
|
||||||
|
|
||||||
<table className="table is-size-7">
|
<table className="table is-size-7">
|
||||||
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>Name</th>
|
<th>Name</th>
|
||||||
<th>Size</th>
|
<th>Size</th>
|
||||||
<th>Type</th>
|
<th>Type</th>
|
||||||
<th>Bundle ID</th>
|
<th>Bundle ID</th>
|
||||||
</tr>
|
</tr>
|
||||||
|
</thead>
|
||||||
{bundle.acquisition.directconnect.downloads.map((bundle) => {
|
<tbody>
|
||||||
return(<tr>
|
{bundle.acquisition.directconnect.downloads.map((bundle, idx) => {
|
||||||
|
return (<tr key={idx}>
|
||||||
<td>{bundle.name}</td>
|
<td>{bundle.name}</td>
|
||||||
<td>{bundle.size}</td>
|
<td>{bundle.size}</td>
|
||||||
<td>{bundle.type.str}</td>
|
<td>{bundle.type.str}</td>
|
||||||
<td><span className="tag is-warning">{bundle.bundleId}</span></td>
|
<td><span className="tag is-warning">{bundle.bundleId}</span></td>
|
||||||
</tr>)
|
</tr>)
|
||||||
})}
|
})}
|
||||||
</table>
|
</tbody>
|
||||||
|
</table>
|
||||||
{/* <pre>{JSON.stringify(bundle.acquisition.directconnect.downloads, null, 2)}</pre> */}
|
{/* <pre>{JSON.stringify(bundle.acquisition.directconnect.downloads, null, 2)}</pre> */}
|
||||||
</>
|
</div>
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</div> : <div>asd</div>;
|
</div> : <div>There are no downloads.</div>;
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Downloads;
|
export default Downloads;
|
||||||
|
|||||||
Reference in New Issue
Block a user