frishi/threetwo
1
0
Fork 0
Code Issues 9 Pull Requests 6 Actions Packages Projects Releases 2 Wiki Activity

🔧 Fixed jankiness with Downloads Panel

Browse Source
This commit is contained in:
Rishi Ghan
2021-12-06 08:42:24 -08:00
parent e6952b44bf
commit 1b57092d3b
2 changed files with 37 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/client/components/ComicDetail/ComicVineMatchPanel.tsx
View File

@@ -44,9 +44,6 @@ export const ComicVineMatchPanel = (comicVineData): ReactElement => {
</div> </div>
</div> </div>
</div> </div>
<div className="search-results-container"> <div className="search-results-container">
{!isEmpty(comicVineSearchResults) && ( {!isEmpty(comicVineSearchResults) && (
<MatchResult <MatchResult

70
src/client/components/ComicDetail/DownloadsPanel.tsx
View File

@@ -37,14 +37,14 @@ export const DownloadsPanel = (
if (!isEmpty(userSettings)) { if (!isEmpty(userSettings)) {
dispatch( dispatch(
getBundlesForComic(props.comicObjectId, ADCPPSocket, { getBundlesForComic(props.comicObjectId, ADCPPSocket, {
username: `${userSettings.directConnect.client.username}`, username: `${userSettings.directConnect.client.host.username}`,
password: `${userSettings.directConnect.client.password}`, password: `${userSettings.directConnect.client.host.password}`,
}), }),
); );
dispatch( dispatch(
getDownloadProgress(props.comicObjectId, ADCPPSocket, { getDownloadProgress(props.comicObjectId, ADCPPSocket, {
username: `${userSettings.directConnect.client.username}`, username: `${userSettings.directConnect.client.host.username}`,
password: `${userSettings.directConnect.client.password}`, password: `${userSettings.directConnect.client.host.password}`,
}), }),
); );
} }
@@ -89,19 +89,18 @@ export const DownloadsPanel = (
}; };
const Bundles = (props) => { const Bundles = (props) => {
return ( return !isEmpty(props.data) ? (
<table className="table is-striped"> <div className="column is-full">
<thead> <table className="table is-striped">
<tr> <thead>
<th>Filename</th> <tr>
<th>Size</th> <th>Filename</th>
<th>Download Time</th> <th>Size</th>
</tr> <th>Download Time</th>
</thead> </tr>
<tbody> </thead>
{!isNil(props.data) && <tbody>
props.data && {map(props.data, (bundle) => (
map(props.data, (bundle) => (
<tr key={bundle.id}> <tr key={bundle.id}>
<td> <td>
<h5>{ellipsize(bundle.name, 58)}</h5> <h5>{ellipsize(bundle.name, 58)}</h5>
@@ -115,29 +114,34 @@ export const DownloadsPanel = (
</td> </td>
</tr> </tr>
))} ))}
</tbody> </tbody>
</table> </table>
</div>
) : (
<div className="column is-full"> {"No Downloads Found"} </div>
); );
}; };
return !isNil(props.data) ? ( return !isNil(props.data) ? (
<div className="columns"> <>
{!isNil(downloadProgressTick) ? ( {!isNil(downloadProgressTick) ? (
<ProgressTick data={downloadProgressTick} /> <ProgressTick data={downloadProgressTick} />
) : null} ) : null}
{!isEmpty(ADCPPSocket) ? ( <div className="columns">
<Bundles data={bundles} /> {!isEmpty(ADCPPSocket) ? (
) : ( <Bundles data={bundles} />
<div className="column is-three-fifths"> ) : (
<article className="message is-info"> <div className="column is-three-fifths">
<div className="message-body is-size-6 is-family-secondary"> <article className="message is-info">
AirDC++ is not configured. Please configure it in{" "} <div className="message-body is-size-6 is-family-secondary">
<code>Settings</code>. AirDC++ is not configured. Please configure it in{" "}
</div> <code>Settings</code>.
</article> </div>
</div> </article>
)} </div>
</div> )}
</div>
</>
) : null; ) : null;
}; };