[APM] Disable popover for grouped edges in Service Map

elastic · Jun 20, 2024 · 8acbefb · 8acbefb
1 parent 1e1e35b
commit 8acbefb
Showing 1 changed file with 18 additions and 11 deletions.
diff --git a/...ck/plugins/observability_solution/apm/public/components/app/service_map/popover/index.tsx b/...ck/plugins/observability_solution/apm/public/components/app/service_map/popover/index.tsx
@@ -54,11 +54,15 @@ function getContentsComponent(
     return ResourceContents;
   }
 
-  if (isTraceExplorerEnabled && selectedElementData.source && selectedElementData.target) {
+  if (isTraceExplorerEnabled && selectedElementData.sourceData && selectedElementData.targetData) {
     return EdgeContents;
   }
 
-  return DependencyContents;
+  if (selectedElementData.label) {
+    return DependencyContents;
+  }
+
+  return null;
 }
 
 export interface ContentsProps {
@@ -100,7 +104,6 @@ export function Popover({ focusedServiceName, environment, kuery, start, end }:
   const x = box ? box.x1 + box.w / 2 : -10000;
   const y = box ? box.y1 + box.h / 2 : -10000;
 
-  const isOpen = !!selectedElement;
   const triggerStyle: CSSProperties = {
     background: 'transparent',
     height: renderedHeight,
@@ -177,6 +180,8 @@ export function Popover({ focusedServiceName, environment, kuery, start, end }:
 
   const ContentsComponent = getContentsComponent(selectedElementData, isTraceExplorerEnabled);
 
+  const isOpen = !!selectedElement && !!ContentsComponent;
+
   return (
     <EuiPopover
       anchorPosition={'upCenter'}
@@ -205,14 +210,16 @@ export function Popover({ focusedServiceName, environment, kuery, start, end }:
           </EuiTitle>
           <EuiHorizontalRule margin="xs" />
         </EuiFlexItem>
-        <ContentsComponent
-          onFocusClick={onFocusClick}
-          elementData={selectedElementData}
-          environment={environment}
-          kuery={kuery}
-          start={start}
-          end={end}
-        />
+        {ContentsComponent && (
+          <ContentsComponent
+            onFocusClick={onFocusClick}
+            elementData={selectedElementData}
+            environment={environment}
+            kuery={kuery}
+            start={start}
+            end={end}
+          />
+        )}
       </EuiFlexGroup>
     </EuiPopover>
   );