Fix loading detection

This commit is contained in:
Rene Pfeuffer
2020-02-21 07:37:55 +01:00
parent c4a801a7be
commit 264f6efd04

View File

@@ -105,7 +105,6 @@ class FileTree extends React.Component<Props, State> {
return ( return (
<div className="panel-block"> <div className="panel-block">
{this.renderSourcesTable()} {this.renderSourcesTable()}
{lastHunk.loading && <Loading />}
{lastHunk.tree?.truncated && <Button label={t("sources.loadMore")} action={this.loadMore} />} {lastHunk.tree?.truncated && <Button label={t("sources.loadMore")} action={this.loadMore} />}
</div> </div>
); );
@@ -124,6 +123,10 @@ class FileTree extends React.Component<Props, State> {
}); });
} }
if (hunks.every(hunk => hunk.loading)) {
return <Loading />;
}
hunks hunks
.filter(hunk => !hunk.loading) .filter(hunk => !hunk.loading)
.forEach(hunk => { .forEach(hunk => {
@@ -144,23 +147,26 @@ class FileTree extends React.Component<Props, State> {
} }
return ( return (
<table className="table table-hover table-sm is-fullwidth"> <>
<thead> <table className="table table-hover table-sm is-fullwidth">
<tr> <thead>
<FixedWidthTh /> <tr>
<th>{t("sources.file-tree.name")}</th> <FixedWidthTh />
<th className="is-hidden-mobile">{t("sources.file-tree.length")}</th> <th>{t("sources.file-tree.name")}</th>
<th className="is-hidden-mobile">{t("sources.file-tree.commitDate")}</th> <th className="is-hidden-mobile">{t("sources.file-tree.length")}</th>
<th className="is-hidden-touch">{t("sources.file-tree.description")}</th> <th className="is-hidden-mobile">{t("sources.file-tree.commitDate")}</th>
{binder.hasExtension("repos.sources.tree.row.right") && <th className="is-hidden-mobile" />} <th className="is-hidden-touch">{t("sources.file-tree.description")}</th>
</tr> {binder.hasExtension("repos.sources.tree.row.right") && <th className="is-hidden-mobile" />}
</thead> </tr>
<tbody> </thead>
{files.map((file: any) => ( <tbody>
<FileTreeLeaf key={file.name} file={file} baseUrl={baseUrlWithRevision} /> {files.map((file: any) => (
))} <FileTreeLeaf key={file.name} file={file} baseUrl={baseUrlWithRevision} />
</tbody> ))}
</table> </tbody>
</table>
{hunks[hunks.length - 1].loading && <Loading />}
</>
); );
} }
return <Notification type="info">{t("sources.noSources")}</Notification>; return <Notification type="info">{t("sources.noSources")}</Notification>;
@@ -185,7 +191,6 @@ const mapStateToProps = (state: any, ownProps: Props) => {
const hunkCount = getHunkCount(state, repository, revision, path); const hunkCount = getHunkCount(state, repository, revision, path);
const hunks = []; const hunks = [];
for (let i = 0; i < hunkCount; ++i) { for (let i = 0; i < hunkCount; ++i) {
console.log(`getting data for hunk ${i}`);
const tree = getSources(state, repository, revision, path, i); const tree = getSources(state, repository, revision, path, i);
const loading = isFetchSourcesPending(state, repository, revision, path, i); const loading = isFetchSourcesPending(state, repository, revision, path, i);
hunks.push({ hunks.push({