[Fleet] Do not display add agent for managed policy in integration details (#123160)

x-pack/plugins/fleet/public/applications/integrations/sections/epm/screens/detail/policies/components/package_policy_agents_cell.test.tsx

@@ -10,12 +10,13 @@ import React from 'react';
 import { act } from '@testing-library/react';
 
 import { createIntegrationsTestRendererMock } from '../../../../../../../../mock';
+import type { AgentPolicy } from '../../../../../../types';
 
 import { PackagePolicyAgentsCell } from './package_policy_agents_cell';
 
 function renderCell({
   agentCount = 0,
-  agentPolicyId = '123',
+  agentPolicy = {} as AgentPolicy,
   onAddAgent = () => {},
   hasHelpPopover = false,
 }) {
@@ -24,7 +25,7 @@ function renderCell({
   return renderer.render(
     <PackagePolicyAgentsCell
       agentCount={agentCount}
-      agentPolicyId={agentPolicyId}
+      agentPolicy={agentPolicy}
       onAddAgent={onAddAgent}
       hasHelpPopover={hasHelpPopover}
     />
@@ -39,6 +40,18 @@ describe('PackagePolicyAgentsCell', () => {
     });
   });
 
+  test('it should not display add agent if policy is managed', async () => {
+    const utils = renderCell({
+      agentCount: 0,
+      agentPolicy: {
+        is_managed: true,
+      } as AgentPolicy,
+    });
+    await act(async () => {
+      expect(utils.queryByText('Add agent')).not.toBeInTheDocument();
+    });
+  });
+
   test('it should display only count if count > 0', async () => {
     const utils = renderCell({ agentCount: 9999 });
     await act(async () => {

x-pack/plugins/fleet/public/applications/integrations/sections/epm/screens/detail/policies/components/package_policy_agents_cell.tsx

@@ -11,6 +11,7 @@ import { EuiButton } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
 
 import { LinkedAgentCount, AddAgentHelpPopover } from '../../../../../../components';
+import type { AgentPolicy } from '../../../../../../types';
 
 const AddAgentButton = ({ onAddAgent }: { onAddAgent: () => void }) => (
   <EuiButton iconType="plusInCircle" data-test-subj="addAgentButton" onClick={onAddAgent} size="s">
@@ -38,21 +39,21 @@ const AddAgentButtonWithPopover = ({ onAddAgent }: { onAddAgent: () => void }) =
 };
 
 export const PackagePolicyAgentsCell = ({
-  agentPolicyId,
+  agentPolicy,
   agentCount = 0,
   onAddAgent,
   hasHelpPopover = false,
 }: {
-  agentPolicyId: string;
+  agentPolicy: AgentPolicy;
   agentCount?: number;
   hasHelpPopover?: boolean;
   onAddAgent: () => void;
 }) => {
-  if (agentCount > 0) {
+  if (agentCount > 0 || agentPolicy.is_managed) {
     return (
       <LinkedAgentCount
         count={agentCount}
-        agentPolicyId={agentPolicyId}
+        agentPolicyId={agentPolicy.id}
         className="eui-textTruncate"
       />
     );

x-pack/plugins/fleet/public/applications/integrations/sections/epm/screens/detail/policies/package_policies.tsx

@@ -298,7 +298,7 @@ export const PackagePoliciesPage = ({ name, version }: PackagePoliciesPanelProps
         render({ agentPolicy, packagePolicy }: InMemoryPackagePolicyAndAgentPolicy) {
           return (
             <PackagePolicyAgentsCell
-              agentPolicyId={agentPolicy.id}
+              agentPolicy={agentPolicy}
               agentCount={agentPolicy.agents}
               onAddAgent={() => setFlyoutOpenForPolicyId(agentPolicy.id)}
               hasHelpPopover={showAddAgentHelpForPackagePolicyId === packagePolicy.id}

x-pack/plugins/fleet/public/components/package_policy_actions_menu.test.tsx

@@ -119,3 +119,21 @@ test('Should be able to delete integration from a non-managed policy', async ()
     expect(utils.queryByText('Delete integration')).not.toBeNull();
   });
 });
+
+test('Should show add button if the policy is not managed and showAddAgent=true', async () => {
+  const agentPolicy = createMockAgentPolicy();
+  const packagePolicy = createMockPackagePolicy({ hasUpgrade: true });
+  const { utils } = renderMenu({ agentPolicy, packagePolicy, showAddAgent: true });
+  await act(async () => {
+    expect(utils.queryByText('Add agent')).not.toBeNull();
+  });
+});
+
+test('Should not show add button if the policy is managed and showAddAgent=true', async () => {
+  const agentPolicy = createMockAgentPolicy({ is_managed: true });
+  const packagePolicy = createMockPackagePolicy({ hasUpgrade: true });
+  const { utils } = renderMenu({ agentPolicy, packagePolicy, showAddAgent: true });
+  await act(async () => {
+    expect(utils.queryByText('Add agent')).toBeNull();
+  });
+});

x-pack/plugins/fleet/public/components/package_policy_actions_menu.tsx

@@ -57,7 +57,7 @@ export const PackagePolicyActionsMenu: React.FunctionComponent<{
     //     defaultMessage="View integration"
     //   />
     // </EuiContextMenuItem>,
-    ...(showAddAgent
+    ...(showAddAgent && !agentPolicy.is_managed
       ? [
           <EuiContextMenuItem
             icon="plusInCircle"