[9.0] [UII] Allow creating a new agentless integration to open status flyout automatically (#214503) (#214670)

# Backport This will backport the following commits from `main` to `9.0`: - [[UII] Allow creating a new agentless integration to open status flyout automatically (#214503)](https://github.com/elastic/kibana/pull/214503)  ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport)  Co-authored-by: Jen Huang <its.jenetic@gmail.com>
2025-04-24 09:48:58 -04:00 · 2025-03-19 23:58:47 +01:00 · 2025-03-19 23:58:47 +01:00 · f6876a4349
commit f6876a4349
parent 1c10748cf4
4 changed files with 67 additions and 27 deletions
--- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/hooks/navigation.tsx
+++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/hooks/navigation.tsx
@ -86,38 +86,56 @@ export const useOnSaveNavigate = (params: UseOnSaveNavigateParams) => {
        return;
      }
      const hasNoAgentPolicies = policy.policy_ids.length === 0;
-      const packagePolicyPath =
-        hasNoAgentPolicies || policy.supports_agentless
-          ? getPath('integration_details_policies', {
-              pkgkey: pkgKeyFromPackageInfo(policy.package!),
-            })
-          : getPath('policy_details', {
-              policyId: policy.policy_ids[0], // TODO navigates to first policy
-            });
-      const [onSaveNavigateTo, onSaveQueryParams]: [
-        Parameters<ApplicationStart['navigateToApp']>,
-        CreatePackagePolicyRouteState['onSaveQueryParams']
-      ] = routeState?.onSaveNavigateTo
-        ? [routeState.onSaveNavigateTo, routeState?.onSaveQueryParams]
-        : [
-            [
-              hasNoAgentPolicies || policy.supports_agentless ? INTEGRATIONS_PLUGIN_ID : PLUGIN_ID,
-              {
-                path: packagePolicyPath,
-              },
-            ],
+      let onSaveNavigateTo: Parameters<ApplicationStart['navigateToApp']>;
+      let onSaveQueryParams: CreatePackagePolicyRouteState['onSaveQueryParams'];
+
+      if (routeState?.onSaveNavigateTo) {
+        onSaveNavigateTo = routeState.onSaveNavigateTo;
+        onSaveQueryParams = routeState?.onSaveQueryParams;
+      } else {
+        // If agentless or no agent policies, navigate to the integration's policies table
+        if ((policy.supports_agentless || hasNoAgentPolicies) && !queryParamsPolicyId) {
+          onSaveNavigateTo = [
+            INTEGRATIONS_PLUGIN_ID,
            {
-              showAddAgentHelp: true,
-              openEnrollmentFlyout: true,
+              path: getPath('integration_details_policies', {
+                pkgkey: pkgKeyFromPackageInfo(policy.package!),
+              }),
            },
          ];

+          if (policy.supports_agentless) {
+            onSaveQueryParams = {
+              openEnrollmentFlyout: { policyIdAsValue: true },
+            };
+          } else {
+            onSaveQueryParams = routeState?.onSaveQueryParams;
+          }
+        }
+        // Otherwise, navigate to the policy's first agent policy details page
+        // or the overridden policy id from query param instead
+        // TODO: handle case where package policy belongs to multiple agent policies
+        else {
+          onSaveNavigateTo = [
+            PLUGIN_ID,
+            {
+              path: getPath('policy_details', {
+                policyId: queryParamsPolicyId || policy.policy_ids[0],
+              }),
+            },
+          ];
+
+          onSaveQueryParams = {
+            showAddAgentHelp: true,
+            openEnrollmentFlyout: true,
+          };
+        }
+      }
+
      const [appId, options] = onSaveNavigateTo;
      if (options?.path) {
        const pathWithQueryString = appendOnSaveQueryParamsToPath({
-          // In cases where we want to navigate back to a new/existing policy, we need to override the initial `path`
-          // value and navigate to the actual agent policy instead
-          path: queryParamsPolicyId ? packagePolicyPath : options.path,
+          path: options.path,
          policy,
          mappingOptions: onSaveQueryParams,
          paramsToApply,
--- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/single_page_layout/hooks/form.tsx
+++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/single_page_layout/hooks/form.tsx
@ -465,7 +465,12 @@ export function useOnSubmit({
          setFormState('SUBMITTED_NO_AGENTS');
          return;
        }
-        onSaveNavigate(data!.item);
+
+        if (isAgentlessConfigured) {
+          onSaveNavigate(data!.item, ['openEnrollmentFlyout']);
+        } else {
+          onSaveNavigate(data!.item);
+        }

        notifications.toasts.addSuccess({
          title: i18n.translate('xpack.fleet.createPackagePolicy.addedNotificationTitle', {
--- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/single_page_layout/index.test.tsx
+++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/single_page_layout/index.test.tsx
@ -464,7 +464,7 @@ describe('When on the package policy create page', () => {
        await setupSaveNavigate(routeState, queryParamsPolicyId);

        expect(useStartServices().application.navigateToApp).toHaveBeenCalledWith(PLUGIN_ID, {
-          path: '/policies/agent-policy-1?openEnrollmentFlyout=true',
+          path: '/save/url/here?openEnrollmentFlyout=true',
        });
      });

--- a/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/components/agentless_table.tsx
+++ b/x-pack/platform/plugins/shared/fleet/public/applications/integrations/sections/epm/screens/detail/policies/components/agentless_table.tsx
@ -10,6 +10,8 @@ import { EuiBadge, EuiBasicTable, EuiLink } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { FormattedRelative, FormattedMessage } from '@kbn/i18n-react';

+import { useLocation } from 'react-router-dom';
+
 import type {
  Agent,
  AgentPolicy,
@ -109,9 +111,24 @@ export const AgentlessPackagePoliciesTable = ({
  }, [agentsKuery, canReadAgents, notifications.toasts]);

  // Flyout state
+  const { search } = useLocation();
+  const queryParams = useMemo(() => new URLSearchParams(search), [search]);
  const [flyoutOpenForPolicyId, setFlyoutOpenForPolicyId] = useState<string>();
  const [flyoutPackagePolicy, setFlyoutPackagePolicy] = useState<PackagePolicy>();
  const [flyoutAgentPolicy, setFlyoutAgentPolicy] = useState<AgentPolicy>();
+  useEffect(() => {
+    const flyoutAgentPolicyIdFromQuery = queryParams.get('openEnrollmentFlyout');
+    if (flyoutAgentPolicyIdFromQuery) {
+      const pp = packagePolicies.find((p) =>
+        p.packagePolicy.policy_ids.includes(flyoutAgentPolicyIdFromQuery)
+      );
+      if (pp) {
+        setFlyoutOpenForPolicyId(flyoutAgentPolicyIdFromQuery);
+        setFlyoutPackagePolicy(pp.packagePolicy);
+        setFlyoutAgentPolicy(pp.agentPolicies[0]);
+      }
+    }
+  }, [packagePolicies, queryParams]);

  return (
    <>