summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorZuul <zuul@review.openstack.org>2018-12-31 17:11:57 +0000
committerGerrit Code Review <review@openstack.org>2018-12-31 17:11:57 +0000
commit972f91962c45d1e91706723f207fa6fb0ec5db5f (patch)
treeb9c29221886de3001b4830d0fb263d557d96f682
parent000c92b81b0222f3c0b535f124114dad2f3c7b3b (diff)
parented1d588785fc336fc5933e26083c843357a929db (diff)
Merge "web: refactor build page using a container"
-rw-r--r--web/src/containers/build/Build.jsx89
-rw-r--r--web/src/pages/Build.jsx60
2 files changed, 91 insertions, 58 deletions
diff --git a/web/src/containers/build/Build.jsx b/web/src/containers/build/Build.jsx
new file mode 100644
index 0000000..6df86a5
--- /dev/null
+++ b/web/src/containers/build/Build.jsx
@@ -0,0 +1,89 @@
1// Copyright 2018 Red Hat, Inc
2//
3// Licensed under the Apache License, Version 2.0 (the "License"); you may
4// not use this file except in compliance with the License. You may obtain
5// a copy of the License at
6//
7// http://www.apache.org/licenses/LICENSE-2.0
8//
9// Unless required by applicable law or agreed to in writing, software
10// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
11// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
12// License for the specific language governing permissions and limitations
13// under the License.
14
15import * as React from 'react'
16import PropTypes from 'prop-types'
17import { connect } from 'react-redux'
18import { Link } from 'react-router-dom'
19import { Panel } from 'react-bootstrap'
20
21
22class Build extends React.Component {
23 static propTypes = {
24 build: PropTypes.object,
25 tenant: PropTypes.object,
26 }
27
28 render () {
29 const { build } = this.props
30 const rows = []
31 const myColumns = [
32 'job_name', 'result', 'voting',
33 'pipeline', 'start_time', 'end_time', 'duration',
34 'project', 'branch', 'change', 'patchset', 'oldrev', 'newrev',
35 'ref', 'new_rev', 'ref_url', 'log_url']
36
37 myColumns.forEach(column => {
38 let label = column
39 let value = build[column]
40 if (column === 'job_name') {
41 label = 'job'
42 value = (
43 <Link to={this.props.tenant.linkPrefix + '/job/' + value}>
44 {value}
45 </Link>
46 )
47 }
48 if (column === 'voting') {
49 if (value) {
50 value = 'true'
51 } else {
52 value = 'false'
53 }
54 }
55 if (value && (column === 'log_url' || column === 'ref_url')) {
56 value = <a href={value}>{value}</a>
57 }
58 if (column === 'log_url') {
59 label = 'log url'
60 }
61 if (column === 'ref_url') {
62 label = 'ref url'
63 }
64 if (value) {
65 rows.push({key: label, value: value})
66 }
67 })
68 return (
69 <Panel>
70 <Panel.Heading>Build result {build.uuid}</Panel.Heading>
71 <Panel.Body>
72 <table className="table table-striped table-bordered">
73 <tbody>
74 {rows.map(item => (
75 <tr key={item.key}>
76 <td>{item.key}</td>
77 <td>{item.value}</td>
78 </tr>
79 ))}
80 </tbody>
81 </table>
82 </Panel.Body>
83 </Panel>
84 )
85 }
86}
87
88
89export default connect(state => ({tenant: state.tenant}))(Build)
diff --git a/web/src/pages/Build.jsx b/web/src/pages/Build.jsx
index 818b2a8..30d74de 100644
--- a/web/src/pages/Build.jsx
+++ b/web/src/pages/Build.jsx
@@ -15,11 +15,10 @@
15import * as React from 'react' 15import * as React from 'react'
16import { connect } from 'react-redux' 16import { connect } from 'react-redux'
17import PropTypes from 'prop-types' 17import PropTypes from 'prop-types'
18import { Link } from 'react-router-dom'
19import { Panel } from 'react-bootstrap'
20 18
21import { fetchBuildIfNeeded } from '../actions/build' 19import { fetchBuildIfNeeded } from '../actions/build'
22import Refreshable from '../containers/Refreshable' 20import Refreshable from '../containers/Refreshable'
21import Build from '../containers/build/Build'
23 22
24 23
25class BuildPage extends Refreshable { 24class BuildPage extends Refreshable {
@@ -42,67 +41,12 @@ class BuildPage extends Refreshable {
42 render () { 41 render () {
43 const { remoteData } = this.props 42 const { remoteData } = this.props
44 const build = remoteData.builds[this.props.match.params.buildId] 43 const build = remoteData.builds[this.props.match.params.buildId]
45 if (!build) {
46 return (<p>Loading...</p>)
47 }
48 const rows = []
49 const myColumns = [
50 'job_name', 'result', 'voting',
51 'pipeline', 'start_time', 'end_time', 'duration',
52 'project', 'branch', 'change', 'patchset', 'oldrev', 'newrev',
53 'ref', 'new_rev', 'ref_url', 'log_url']
54
55 myColumns.forEach(column => {
56 let label = column
57 let value = build[column]
58 if (column === 'job_name') {
59 label = 'job'
60 value = (
61 <Link to={this.props.tenant.linkPrefix + '/job/' + value}>
62 {value}
63 </Link>
64 )
65 }
66 if (column === 'voting') {
67 if (value) {
68 value = 'true'
69 } else {
70 value = 'false'
71 }
72 }
73 if (value && (column === 'log_url' || column === 'ref_url')) {
74 value = <a href={value}>{value}</a>
75 }
76 if (column === 'log_url') {
77 label = 'log url'
78 }
79 if (column === 'ref_url') {
80 label = 'ref url'
81 }
82 if (value) {
83 rows.push({key: label, value: value})
84 }
85 })
86 return ( 44 return (
87 <React.Fragment> 45 <React.Fragment>
88 <div style={{float: 'right'}}> 46 <div style={{float: 'right'}}>
89 {this.renderSpinner()} 47 {this.renderSpinner()}
90 </div> 48 </div>
91 <Panel> 49 {build && <Build build={build}/>}
92 <Panel.Heading>Build result {build.uuid}</Panel.Heading>
93 <Panel.Body>
94 <table className="table table-striped table-bordered">
95 <tbody>
96 {rows.map(item => (
97 <tr key={item.key}>
98 <td>{item.key}</td>
99 <td>{item.value}</td>
100 </tr>
101 ))}
102 </tbody>
103 </table>
104 </Panel.Body>
105 </Panel>
106 </React.Fragment> 50 </React.Fragment>
107 ) 51 )
108 } 52 }