removing servicecolor from waterfall item and adding it to errormark

elastic · Jan 7, 2020 · 6ad0f3a · 6ad0f3a
1 parent af9e22e
commit 6ad0f3a
Show file tree

Hide file tree

Showing 6 changed files with 153 additions and 129 deletions.
diff --git a/...onDetails/WaterfallWithSummmary/WaterfallContainer/Marks/__test__/get_error_marks.test.ts b/...onDetails/WaterfallWithSummmary/WaterfallContainer/Marks/__test__/get_error_marks.test.ts
@@ -10,14 +10,14 @@ import { getErrorMarks } from '../get_error_marks';
 describe('getErrorMarks', () => {
   describe('returns empty array', () => {
     it('when items are missing', () => {
-      expect(getErrorMarks([])).toEqual([]);
+      expect(getErrorMarks([], {})).toEqual([]);
     });
     it('when any error is available', () => {
       const items = [
         { docType: 'span' },
         { docType: 'transaction' }
       ] as IWaterfallItem[];
-      expect(getErrorMarks(items)).toEqual([]);
+      expect(getErrorMarks(items, {})).toEqual([]);
     });
   });
 
@@ -27,34 +27,70 @@ describe('getErrorMarks', () => {
         docType: 'error',
         offset: 10,
         skew: 5,
-        custom: { error: { id: 1 } },
-        serviceColor: 'blue'
+        doc: { error: { id: 1 }, service: { name: 'opbeans-java' } }
       } as unknown,
       { docType: 'transaction' },
       {
         docType: 'error',
         offset: 50,
         skew: 0,
-        custom: { error: { id: 2 } },
-        serviceColor: 'red'
+        doc: { error: { id: 2 }, service: { name: 'opbeans-node' } }
       } as unknown
     ] as IWaterfallItem[];
-    expect(getErrorMarks(items)).toEqual([
+    expect(
+      getErrorMarks(items, { 'opbeans-java': 'red', 'opbeans-node': 'blue' })
+    ).toEqual([
       {
         type: 'errorMark',
         offset: 15,
         verticalLine: false,
         id: 1,
-        error: { error: { id: 1 } },
+        error: { error: { id: 1 }, service: { name: 'opbeans-java' } },
+        serviceColor: 'red'
+      },
+      {
+        type: 'errorMark',
+        offset: 50,
+        verticalLine: false,
+        id: 2,
+        error: { error: { id: 2 }, service: { name: 'opbeans-node' } },
         serviceColor: 'blue'
+      }
+    ]);
+  });
+
+  it('returns error marks without service color', () => {
+    const items = [
+      {
+        docType: 'error',
+        offset: 10,
+        skew: 5,
+        doc: { error: { id: 1 }, service: { name: 'opbeans-java' } }
+      } as unknown,
+      { docType: 'transaction' },
+      {
+        docType: 'error',
+        offset: 50,
+        skew: 0,
+        doc: { error: { id: 2 }, service: { name: 'opbeans-node' } }
+      } as unknown
+    ] as IWaterfallItem[];
+    expect(getErrorMarks(items, {})).toEqual([
+      {
+        type: 'errorMark',
+        offset: 15,
+        verticalLine: false,
+        id: 1,
+        error: { error: { id: 1 }, service: { name: 'opbeans-java' } },
+        serviceColor: undefined
       },
       {
         type: 'errorMark',
         offset: 50,
         verticalLine: false,
         id: 2,
-        error: { error: { id: 2 } },
-        serviceColor: 'red'
+        error: { error: { id: 2 }, service: { name: 'opbeans-node' } },
+        serviceColor: undefined
       }
     ]);
   });

diff --git a/.../app/TransactionDetails/WaterfallWithSummmary/WaterfallContainer/Marks/get_error_marks.ts b/.../app/TransactionDetails/WaterfallWithSummmary/WaterfallContainer/Marks/get_error_marks.ts
@@ -7,7 +7,8 @@ import { isEmpty } from 'lodash';
 import { ErrorRaw } from '../../../../../../../typings/es_schemas/raw/ErrorRaw';
 import {
   IWaterfallItem,
-  IWaterfallError
+  IWaterfallError,
+  IServiceColors
 } from '../Waterfall/waterfall_helpers/waterfall_helpers';
 import { Mark } from '.';
 
@@ -17,7 +18,10 @@ export interface ErrorMark extends Mark {
   serviceColor?: string;
 }
 
-export const getErrorMarks = (items: IWaterfallItem[]): ErrorMark[] => {
+export const getErrorMarks = (
+  items: IWaterfallItem[],
+  serviceColors: IServiceColors
+): ErrorMark[] => {
   if (isEmpty(items)) {
     return [];
   }
@@ -30,6 +34,6 @@ export const getErrorMarks = (items: IWaterfallItem[]): ErrorMark[] => {
     verticalLine: false,
     id: error.doc.error.id,
     error: error.doc,
-    serviceColor: error.serviceColor
+    serviceColor: serviceColors[error.doc.service.name]
   }));
 };
diff --git a/...p/TransactionDetails/WaterfallWithSummmary/WaterfallContainer/Waterfall/WaterfallItem.tsx b/...p/TransactionDetails/WaterfallWithSummmary/WaterfallContainer/Waterfall/WaterfallItem.tsx
@@ -124,9 +124,7 @@ const SpanActionToolTip: React.FC<SpanActionToolTipProps> = ({
 }) => {
   if (item?.docType === 'span') {
     return (
-      <EuiToolTip
-        content={`${item.doc.span.subtype}.${item.doc.span.action}`}
-      >
+      <EuiToolTip content={`${item.doc.span.subtype}.${item.doc.span.action}`}>
         <>{children}</>
       </EuiToolTip>
     );

diff --git a/...nents/app/TransactionDetails/WaterfallWithSummmary/WaterfallContainer/Waterfall/index.tsx b/...nents/app/TransactionDetails/WaterfallWithSummmary/WaterfallContainer/Waterfall/index.tsx
@@ -80,7 +80,7 @@ export const Waterfall: React.FC<Props> = ({
   const { serviceColors, duration } = waterfall;
 
   const agentMarks = getAgentMarks(waterfall.entryTransaction);
-  const errorMarks = getErrorMarks(waterfall.items);
+  const errorMarks = getErrorMarks(waterfall.items, serviceColors);
 
   const renderWaterfallItem = (item: IWaterfallItem) => {
     if (item.docType === 'error') {