Use red on scatterplot for traces if any spans have an error=true tag (…

…jaegertracing#951)

* Use red on scatterplot for traces if any spans have an error=true tag

Signed-off-by: Ed Snible <snible@us.ibm.com>

* Used 'yarn prettier' to appease 'yarn lint'

Signed-off-by: Ed Snible <snible@us.ibm.com>
Signed-off-by: VladislavBryukhanov <gfedcba625@gmail.com>

packages/jaeger-ui/src/components/SearchTracePage/SearchResults/ScatterPlot.js

@@ -34,6 +34,7 @@ function ScatterPlotImpl(props) {
           left: 50,
         }}
         width={containerWidth}
+        colorType="literal"
         height={200}
       >
         <XAxis

packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.js

@@ -39,6 +39,7 @@ import reduxFormFieldAdapter from '../../../utils/redux-form-field-adapter';
 
 import type { FetchedTrace } from '../../../types';
 import type { SearchQuery } from '../../../types/search';
+import type { KeyValuePair } from '../../../types/trace';
 
 import './index.css';
 
@@ -155,6 +156,8 @@ export class UnconnectedSearchResults extends React.PureComponent<SearchResultsP
     }
     const cohortIds = new Set(diffCohort.map(datum => datum.id));
     const searchUrl = queryOfResults ? getUrl(stripEmbeddedState(queryOfResults)) : getUrl();
+    const isErrorTag = ({ key, value }: KeyValuePair) =>
+      key === 'error' && (value === true || value === 'true');
     return (
       <div className="SearchResults">
         <div className="SearchResults--header">
@@ -167,6 +170,7 @@ export class UnconnectedSearchResults extends React.PureComponent<SearchResultsP
                   traceID: t.traceID,
                   size: t.spans.length,
                   name: t.traceName,
+                  color: t.spans.some(sp => sp.tags.some(isErrorTag)) ? 'red' : '#12939A',
                 }))}
                 onValueClick={t => {
                   goToTrace(t.traceID);