diff --git a/web/src/js/__tests__/components/FlowTable/__snapshots__/FlowColumnsSpec.js.snap b/web/src/js/__tests__/components/FlowTable/__snapshots__/FlowColumnsSpec.js.snap index d69465074..98ba8a109 100644 --- a/web/src/js/__tests__/components/FlowTable/__snapshots__/FlowColumnsSpec.js.snap +++ b/web/src/js/__tests__/components/FlowTable/__snapshots__/FlowColumnsSpec.js.snap @@ -109,6 +109,11 @@ exports[`FlowColumns Components should render SizeColumn 1`] = ` exports[`FlowColumns Components should render StatusColumn 1`] = ` `; diff --git a/web/src/js/__tests__/components/FlowTable/__snapshots__/FlowRowSpec.js.snap b/web/src/js/__tests__/components/FlowTable/__snapshots__/FlowRowSpec.js.snap index b065b7462..786488a00 100644 --- a/web/src/js/__tests__/components/FlowTable/__snapshots__/FlowRowSpec.js.snap +++ b/web/src/js/__tests__/components/FlowTable/__snapshots__/FlowRowSpec.js.snap @@ -30,6 +30,11 @@ exports[`FlowRow Component should render correctly 1`] = ` 200 diff --git a/web/src/js/components/FlowTable/FlowColumns.jsx b/web/src/js/components/FlowTable/FlowColumns.jsx index e60ed4874..07b54a324 100644 --- a/web/src/js/components/FlowTable/FlowColumns.jsx +++ b/web/src/js/components/FlowTable/FlowColumns.jsx @@ -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 ( - {flow.response && flow.response.status_code} + {flow.response && flow.response.status_code} ) }