forked from patternfly/patternfly-react-demo-app
/
Status.js
executable file
·93 lines (84 loc) · 2.24 KB
/
Status.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
import * as React from 'react';
import { Grid, ListView, ListViewItem, ListViewIcon, ListViewInfoItem, Row, Col } from 'patternfly-react';
import { ZuulApiRoot } from './constants';
class QueueStatus extends React.Component {
render() {
return (<Row><Col sm={11}>{this.props.queue.name}</Col></Row>);
}
}
class PipelineStatus extends React.Component {
render() {
return (<ListViewItem
leftContent={<ListViewIcon />}
additionalInfo={[
<ListViewInfoItem />,
<ListViewInfoItem />,
<ListViewInfoItem />,
]}
heading={this.props.pipeline.name}
description={this.props.pipeline.description}
>{this.props.pipeline.change_queues.map(item => (
<QueueStatus queue={item} />
))}</ListViewItem>);
}
}
class Status extends React.Component {
constructor(props) {
super(props);
this.state = {
error: null,
isLoaded: false,
items: []
};
}
componentDidMount() {
fetch(ZuulApiRoot + "/status")
.then(res => res.json())
.then(
(result) => {
this.setState({
isLoaded: true,
items: result.pipelines
});
},
// Note: it's important to handle errors here
// instead of a catch() block so that we don't swallow
// exceptions from actual bugs in components.
(error) => {
this.setState({
isLoaded: true,
error
});
}
)
}
render() {
const { error, isLoaded, items } = this.state;
if (error) {
return <div>Error: {error.message}</div>;
} else if (!isLoaded) {
return <div>Loading...</div>;
} else {
return (
<ListView>
{items.map(item => (
<PipelineStatus pipeline={item} />
))}
</ListView>
);
}
}
}
const StatusPage = () => (
<Grid fluid className="container-pf-nav-pf-vertical">
<Grid.Row>
<Grid.Col xs={12}>
<div className="page-header">
<h1>Status Page</h1>
</div>
</Grid.Col>
</Grid.Row>
<Status />
</Grid>
);
export default StatusPage;