[Entity Analytics] Add entity resolution UI to service flyout

x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_details_left/index.tsx

@@ -25,6 +25,7 @@ export interface ServiceDetailsPanelProps extends Record<string, unknown> {
   identityFields: IdentityFields;
   path?: PanelPath;
   scopeId: string;
+  entityStoreEntityId?: string;
 }
 export interface ServiceDetailsExpandableFlyoutProps extends FlyoutPanelProps {
   key: 'service_details';
@@ -37,12 +38,13 @@ export const ServiceDetailsPanel = ({
   identityFields,
   path,
   scopeId,
+  entityStoreEntityId,
 }: ServiceDetailsPanelProps) => {
   const serviceName = useMemo(
     () => getServiceNameFromEntityIdentifiers(identityFields ?? {}),
     [identityFields]
   );
-  const tabs = useTabs(serviceName, scopeId);
+  const tabs = useTabs(serviceName, scopeId, entityStoreEntityId);
 
   const { selectedTabId, setSelectedTabId } = useSelectedTab(
     isRiskScoreExist,

x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_details_left/tabs.tsx

@@ -6,17 +6,30 @@
  */
 
 import { useMemo } from 'react';
-import { getRiskInputTab } from '../../../entity_analytics/components/entity_details_flyout';
+import {
+  getRiskInputTab,
+  getResolutionGroupTab,
+} from '../../../entity_analytics/components/entity_details_flyout';
 import { EntityType } from '../../../../common/entity_analytics/types';
 import type { LeftPanelTabsType } from '../shared/components/left_panel/left_panel_header';
 
-export const useTabs = (name: string, scopeId: string): LeftPanelTabsType =>
+export const useTabs = (
+  name: string,
+  scopeId: string,
+  entityStoreEntityId?: string
+): LeftPanelTabsType =>
   useMemo(() => {
-    return [
+    const riskTab = [
       getRiskInputTab({
         entityName: name,
         entityType: EntityType.service,
         scopeId,
       }),
     ];
-  }, [name, scopeId]);
+
+    const resolutionTab = entityStoreEntityId
+      ? [getResolutionGroupTab({ entityId: entityStoreEntityId, entityType: 'service' })]
+      : [];
+
+    return [...riskTab, ...resolutionTab];
+  }, [name, scopeId, entityStoreEntityId]);

x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/content.tsx

@@ -19,6 +19,7 @@ import { ObservedEntity } from '../shared/components/observed_entity';
 import type { ObservedEntityData } from '../shared/components/observed_entity/types';
 import { useObservedServiceItems } from './hooks/use_observed_service_items';
 import type { EntityDetailsPath } from '../shared/components/left_panel/left_panel_header';
+import { ResolutionSection } from '../../../entity_analytics/components/entity_resolution/resolution_section';
 
 export const OBSERVED_SERVICE_QUERY_ID = 'observedServiceDetailsQuery';
 
@@ -32,6 +33,7 @@ interface ServicePanelContentProps {
   onAssetCriticalityChange: () => void;
   openDetailsPanel: (path: EntityDetailsPath) => void;
   entityRecord?: Entity;
+  entityStoreEntityId?: string;
 }
 
 export const ServicePanelContent = ({
@@ -44,6 +46,7 @@ export const ServicePanelContent = ({
   scopeId,
   openDetailsPanel,
   onAssetCriticalityChange,
+  entityStoreEntityId,
 }: ServicePanelContentProps) => {
   const observedFields = useObservedServiceItems(observedService);
 
@@ -63,6 +66,12 @@ export const ServicePanelContent = ({
           <EuiHorizontalRule />
         </>
       )}
+      {entityStoreEntityId && (
+        <>
+          <ResolutionSection entityId={entityStoreEntityId} openDetailsPanel={openDetailsPanel} />
+          <EuiHorizontalRule />
+        </>
+      )}
       <AssetCriticalityAccordion
         entity={{ name: serviceName, type: EntityType.service }}
         onChange={onAssetCriticalityChange}

x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/hooks/use_navigate_to_service_details.ts

@@ -18,13 +18,15 @@ interface UseNavigateToServiceDetailsParams {
   serviceName: string;
   scopeId: string;
   isRiskScoreExist: boolean;
+  entityStoreEntityId?: string;
 }
 
 export const useNavigateToServiceDetails = ({
   entityId,
   serviceName,
   scopeId,
   isRiskScoreExist,
+  entityStoreEntityId,
 }: UseNavigateToServiceDetailsParams): ((path: EntityDetailsPath) => void) => {
   const { telemetry } = useKibana().services;
   const { openLeftPanel } = useExpandableFlyoutApi();
@@ -42,10 +44,19 @@ export const useNavigateToServiceDetails = ({
           scopeId,
           entityId,
           serviceName,
+          entityStoreEntityId,
           path,
         },
       });
     },
-    [isRiskScoreExist, openLeftPanel, scopeId, entityId, serviceName, telemetry]
+    [
+      isRiskScoreExist,
+      openLeftPanel,
+      scopeId,
+      entityId,
+      serviceName,
+      entityStoreEntityId,
+      telemetry,
+    ]
   );
 };

x-pack/solutions/security/plugins/security_solution/public/flyout/entity_details/service_right/index.tsx

@@ -51,8 +51,13 @@ const FIRST_RECORD_PAGINATION = {
 
 export const ServicePanel = ({ contextID, scopeId, entityId, serviceName }: ServicePanelProps) => {
   const entityStoreV2Enabled = useUiSetting<boolean>(FF_ENABLE_ENTITY_STORE_V2, false);
+  const serviceStoreIdentityFields = useMemo(
+    () => (!entityId && serviceName ? { 'service.name': serviceName } : undefined),
+    [entityId, serviceName]
+  );
   const entityFromStoreResult = useEntityFromStore({
     entityId,
+    identityFields: serviceStoreIdentityFields,
     entityType: 'service',
     skip: !entityStoreV2Enabled,
   });
@@ -107,19 +112,30 @@ export const ServicePanel = ({ contextID, scopeId, entityId, serviceName }: Serv
     setQuery,
   });
 
+  const entityStoreEntityId = entityStoreV2Enabled
+    ? entityFromStoreResult.entityRecord?.entity?.id
+    : undefined;
+
   const openDetailsPanel = useNavigateToServiceDetails({
     serviceName,
     entityId,
     scopeId,
     isRiskScoreExist,
+    entityStoreEntityId,
   });
 
+  const defaultTab = useMemo(() => {
+    if (isRiskScoreExist) return EntityDetailsLeftPanelTab.RISK_INPUTS;
+    if (entityStoreEntityId) return EntityDetailsLeftPanelTab.RESOLUTION_GROUP;
+    return EntityDetailsLeftPanelTab.RISK_INPUTS;
+  }, [isRiskScoreExist, entityStoreEntityId]);
+
   const openPanelFirstTab = useCallback(
     () =>
       openDetailsPanel({
-        tab: EntityDetailsLeftPanelTab.RISK_INPUTS,
+        tab: defaultTab,
       }),
-    [openDetailsPanel]
+    [openDetailsPanel, defaultTab]
   );
 
   if (observedService.isLoading) {
@@ -129,7 +145,7 @@ export const ServicePanel = ({ contextID, scopeId, entityId, serviceName }: Serv
   return (
     <>
       <FlyoutNavigation
-        flyoutIsExpandable={isRiskScoreExist}
+        flyoutIsExpandable={isRiskScoreExist || !!entityStoreEntityId}
         expandDetails={openPanelFirstTab}
         isRulePreview={scopeId === TableId.rulePreview}
       />
@@ -144,6 +160,7 @@ export const ServicePanel = ({ contextID, scopeId, entityId, serviceName }: Serv
         contextID={contextID}
         scopeId={scopeId}
         openDetailsPanel={openDetailsPanel}
+        entityStoreEntityId={entityStoreEntityId}
       />
     </>
   );