[Cloud Security] fix agent count to show correct pop-up modal (#181503)

## Summary

Summarize your PR. If it involves visual changes include a screenshot or
gif.

This PR fixes agent count to for the following cases:
* If current agent policy is New agent policy, then AWS CloudFormation
when the agent count is 0
* if current agent policy is Existing agent policy with an agent , then
show confirmation agent modal
* If current agent policy is Agentless policy, then navigate to fleet
agent policies page.

`isDirty` and `currentAgentPolicy` states will used be to circumvent the
race condition `useEffect` that sets SetupTechnology when we first
navigate to the add CSPM integration page.
* `currentAgentPolicy` state keep current agentPolicy and reset agent
count when we switch from `agentless` to `agent-based`
* `isDirty` helps exit out
`x-pack/plugins/cloud_security_posture/public/components/fleet_extensions/setup_technology_selector/use_setup_technology.ts`
`useEffect` race condition once we initialize `setupTechnology` state on
page load.

x-pack/plugins/cloud_security_posture/public/components/fleet_extensions/policy_template_form.tsx

@@ -549,7 +549,7 @@ export const CspPolicyTemplateForm = memo<PackagePolicyReplaceDefineStepExtensio
     // Handling validation state
     const [isValid, setIsValid] = useState(true);
     const input = getSelectedOption(newPolicy.inputs, integration);
-    const { isAgentlessAvailable, setupTechnology, setSetupTechnology } = useSetupTechnology({
+    const { isAgentlessAvailable, setupTechnology, updateSetupTechnology } = useSetupTechnology({
       input,
       agentPolicy,
       agentlessPolicy,
@@ -767,7 +767,7 @@ export const CspPolicyTemplateForm = memo<PackagePolicyReplaceDefineStepExtensio
           <SetupTechnologySelector
             disabled={isEditPage}
             setupTechnology={setupTechnology}
-            onSetupTechnologyChange={setSetupTechnology}
+            onSetupTechnologyChange={updateSetupTechnology}
           />
         )}
 

x-pack/plugins/cloud_security_posture/public/components/fleet_extensions/setup_technology_selector/use_setup_technology.ts

@@ -38,8 +38,15 @@ export const useSetupTechnology = ({
     return SetupTechnology.AGENT_BASED;
   });
 
+  const [isDirty, setIsDirty] = useState<boolean>(false);
+
+  const updateSetupTechnology = (value: SetupTechnology) => {
+    setSetupTechnology(value);
+    setIsDirty(true);
+  };
+
   useEffect(() => {
-    if (isEditPage) {
+    if (isEditPage || isDirty) {
       return;
     }
 
@@ -58,7 +65,7 @@ export const useSetupTechnology = ({
     } else {
       setSetupTechnology(SetupTechnology.AGENT_BASED);
     }
-  }, [agentPolicyId, agentlessPolicyId, isAgentlessAvailable, isEditPage]);
+  }, [agentPolicyId, agentlessPolicyId, isAgentlessAvailable, isDirty, isEditPage]);
 
   useEffect(() => {
     if (isEditPage) {
@@ -74,5 +81,6 @@ export const useSetupTechnology = ({
     isAgentlessAvailable,
     setupTechnology,
     setSetupTechnology,
+    updateSetupTechnology,
   };
 };

x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/single_page_layout/hooks/setup_technology.ts

@@ -37,7 +37,7 @@ export function useSetupTechnology({
 }: {
   updateNewAgentPolicy: (policy: NewAgentPolicy) => void;
   newAgentPolicy: NewAgentPolicy;
-  updateAgentPolicy: (policy: AgentPolicy) => void;
+  updateAgentPolicy: (policy: AgentPolicy | undefined) => void;
   setSelectedPolicyTab: (tab: SelectedPolicyTab) => void;
 }) {
   const { isAgentlessEnabled } = useAgentlessPolicy();
@@ -75,8 +75,8 @@ export function useSetupTechnology({
       } else if (setupTechnology === SetupTechnology.AGENT_BASED) {
         updateNewAgentPolicy(newAgentPolicy);
         setSelectedPolicyTab(SelectedPolicyTab.NEW);
+        updateAgentPolicy(undefined);
       }
-
       setSelectedSetupTechnology(setupTechnology);
     },
     [

x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/single_page_layout/index.tsx

@@ -226,10 +226,15 @@ export const CreatePackagePolicySinglePage: CreatePackagePolicyParams = ({
       }
     };
 
+    if (selectedPolicyTab === SelectedPolicyTab.NEW) {
+      setAgentCount(0);
+      return;
+    }
+
     if (isFleetEnabled && agentPolicyId) {
       getAgentCount();
     }
-  }, [agentPolicyId, isFleetEnabled]);
+  }, [agentPolicyId, selectedPolicyTab, isFleetEnabled]);
 
   const handleExtensionViewOnChange = useCallback<
     PackagePolicyEditExtensionComponentProps['onChange']