Minor bug fixes for trace analytics v2 (#1894)

* minor bug fixes for trace analytics

Signed-off-by: Shenoy Pratik <[email protected]>
(cherry picked from commit 3df8e90)

* add mode param to attributes useEffect

Signed-off-by: Shenoy Pratik <[email protected]>
(cherry picked from commit 11c2239)

Author: ps48

public/components/trace_analytics/components/common/plots/__tests__/__snapshots__/service_map_scale.test.tsx.snap

@@ -85,6 +85,7 @@ exports[`Service map scale component renders service map scale plot 1`] = `
             "zeroline": false,
           },
           "yaxis": Object {
+            "color": "0,0,0",
             "fixedrange": true,
             "range": Array [
               0,
@@ -205,6 +206,7 @@ exports[`Service map scale component renders service map scale plot 1`] = `
               "zeroline": false,
             },
             "yaxis": Object {
+              "color": "0,0,0",
               "fixedrange": true,
               "range": Array [
                 0,

public/components/trace_analytics/components/common/plots/service_map_scale.tsx

@@ -7,6 +7,7 @@ import { EuiFlexGroup, EuiFlexItem, EuiSpacer, EuiText } from '@elastic/eui';
 import merge from 'lodash/merge';
 import React, { useEffect, useState } from 'react';
 import { BarOrientation } from '../../../../../../common/constants/shared';
+import { uiSettingsService } from '../../../../../../common/utils';
 import { Plt } from '../../../../visualizations/plotly/plot';
 import unmatchedNode from '../../../images/unmatched_node.png';
 import { getServiceMapScaleColor } from '../helper_functions';
@@ -88,6 +89,7 @@ export function ServiceMapScale(props: {
           showticklabels: true,
           tickvals: props.ticks,
           ticktexts: props.ticks,
+          color: uiSettingsService.get('theme:darkMode') ? '255,255,255' : '0,0,0',
         },
         margin: {
           l: 0,

public/components/trace_analytics/components/services/__tests__/__snapshots__/services_table.test.tsx.snap

@@ -1933,9 +1933,12 @@ exports[`Services table component renders jaeger services table 1`] = `
                                         className="euiFlexItem euiFlexItem--flexGrowZero"
                                         onClick={[Function]}
                                       >
-                                        <EuiLink>
+                                        <EuiLink
+                                          data-test-subj="service-flyout-action-btnundefined"
+                                        >
                                           <button
                                             className="euiLink euiLink--primary"
+                                            data-test-subj="service-flyout-action-btnundefined"
                                             disabled={false}
                                             type="button"
                                           >
@@ -4176,9 +4179,12 @@ exports[`Services table component renders services table 1`] = `
                                         className="euiFlexItem euiFlexItem--flexGrowZero"
                                         onClick={[Function]}
                                       >
-                                        <EuiLink>
+                                        <EuiLink
+                                          data-test-subj="service-flyout-action-btnundefined"
+                                        >
                                           <button
                                             className="euiLink euiLink--primary"
+                                            data-test-subj="service-flyout-action-btnundefined"
                                             disabled={false}
                                             type="button"
                                           >

public/components/trace_analytics/components/services/services_table.tsx

@@ -245,7 +245,7 @@ export function ServicesTable(props: ServicesTableProps) {
           render: (_item: any, row: any) => (
             <EuiFlexGroup justifyContent="center">
               <EuiFlexItem grow={false} onClick={() => setCurrentSelectedService(row.name)}>
-                <EuiLink>
+                <EuiLink data-test-subj={'service-flyout-action-btn' + row.itemId}>
                   <EuiIcon type="inspect" color="primary" />
                 </EuiLink>
               </EuiFlexItem>

public/components/trace_analytics/home.tsx

@@ -156,7 +156,7 @@ export const Home = (props: HomeProps) => {
 
   useEffect(() => {
     if (mode === 'data_prepper') fetchAttributesFields();
-  }, []);
+  }, [mode]);
 
   const serviceBreadcrumbs = [
     {