Add throbber while waiting for builds to load

This commit is contained in:
Ian Minoso 2016-12-15 12:57:18 -08:00
parent 2730c26b2e
commit 149dd46076
4 changed files with 50 additions and 17 deletions

View file

@ -1,14 +1,19 @@
import * as React from 'react';
import * as moment from "moment";
import Throbber from "./throbber";
export default class Build extends React.Component<any, any> {
render () {
let builds: any = this.props.data;
let buildsTable: any = [];
let table: any;
if (Object.keys(builds).length === 0) {
buildsTable.push('Loading')
table = <Throbber />
}
else {
// Get Builds
builds.forEach((element, i) => {
let tags: Array<any> = []
element.tags.forEach(tag => {
@ -31,22 +36,29 @@ export default class Build extends React.Component<any, any> {
</tr>
)
});
// Build the table
table = (
<table className="co-table">
<thead>
<tr>
<td></td>
<td>BUILD ID</td>
<td>TRIGGERED BY</td>
<td>DATE STARTED</td>
<td>TAGS</td>
</tr>
</thead>
<tbody>
{buildsTable}
</tbody>
</table>
);
}
return(
<table className="co-table">
<thead>
<tr>
<td></td>
<td>BUILD ID</td>
<td>TRIGGERED BY</td>
<td>DATE STARTED</td>
<td>TAGS</td>
</tr>
</thead>
<tbody>
{buildsTable}
</tbody>
</table>
<div className="row">
{table}
</div>
);
}
}
}