Merge pull request #3351 from arun-94/master

#3312 Change colors according to the HTTP status code
This commit is contained in:
Maximilian Hils 2018-10-21 14:48:58 +02:00 committed by GitHub
commit e8d76d050d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 29 additions and 1 deletions

View File

@ -109,6 +109,11 @@ exports[`FlowColumns Components should render SizeColumn 1`] = `
exports[`FlowColumns Components should render StatusColumn 1`] = `
<td
className="col-status"
style={
Object {
"color": "darkred",
}
}
/>
`;

View File

@ -30,6 +30,11 @@ exports[`FlowRow Component should render correctly 1`] = `
</td>
<td
className="col-status"
style={
Object {
"color": "darkgreen",
}
}
>
200
</td>

View File

@ -90,8 +90,26 @@ MethodColumn.headerClass = 'col-method'
MethodColumn.headerName = 'Method'
export function StatusColumn({ flow }) {
let color = 'darkred';
if (flow.response !== null && 100 <= flow.response.status_code && flow.response.status_code < 200) {
color = 'green'
}
else if (flow.response !== null && 200 <= flow.response.status_code && flow.response.status_code < 300) {
color = 'darkgreen'
}
else if (flow.response !== null && 300 <= flow.response.status_code && flow.response.status_code < 400) {
color = 'lightblue'
}
else if (flow.response !== null && 400 <= flow.response.status_code && flow.response.status_code < 500) {
color = 'lightred'
}
else if (flow.response !== null && 500 <= flow.response.status_code && flow.response.status_code < 600) {
color = 'lightred'
}
return (
<td className="col-status">{flow.response && flow.response.status_code}</td>
<td className="col-status" style={{color: color}}>{flow.response && flow.response.status_code}</td>
)
}