diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_panel.test.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_panel.test.tsx index a1804a6ad7e6c..2527a9b793e54 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_panel.test.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_panel.test.tsx @@ -304,6 +304,107 @@ describe('PackagePolicyInputPanel', () => { ], }, }, + // Duplicated items to make sure they show up in the UI as we now only show multiple switches/descriptions when theres more than one input + { + input: 'logfile', + title: 'Sample logs hidden in agentless (duplicated)', + template_path: 'stream.yml.hbs', + vars: [ + { + name: 'paths', + type: 'text', + title: 'Paths', + multi: false, + default: ['/var/log/*.log'], + required: false, + show_user: true, + hide_in_deployment_modes: ['agentless'], + }, + ], + description: 'Collect sample logs - hidden in agentless', + data_stream: { + title: 'Default data stream', + release: 'ga', + type: 'logs', + package: 'agentless_test_package', + dataset: 'agentless_test_package.default_data_stream', + path: 'default_data_stream', + elasticsearch: { + 'ingest_pipeline.name': 'default', + }, + ingest_pipeline: 'default', + streams: [ + { + input: 'logfile', + title: 'Sample logs hidden in agentless', + template_path: 'stream.yml.hbs', + vars: [ + { + name: 'paths', + type: 'text', + title: 'Paths', + multi: false, + default: ['/var/log/*.log'], + required: false, + show_user: true, + hide_in_deployment_modes: ['agentless'], + }, + ], + description: 'Collect sample logs - hidden in agentless', + }, + ], + }, + }, + { + input: 'logfile', + title: 'Sample logs on Agentless (duplicated)', + template_path: 'stream.yml.hbs', + vars: [ + { + name: 'paths', + type: 'text', + title: 'Paths', + multi: true, + default: ['/var/log/*.log'], + required: false, + show_user: true, + hide_in_deployment_modes: ['default'], + }, + ], + description: 'Collect sample logs on Agentless only', + data_stream: { + title: 'Logs Stream on Agentless', + release: 'ga', + type: 'logs', + package: 'agentless_test_package', + dataset: 'agentless_test_package.logs_stream', + path: 'logs_stream', + elasticsearch: { + 'ingest_pipeline.name': 'default', + }, + ingest_pipeline: 'default', + streams: [ + { + input: 'logfile', + title: 'Sample logs on Agentless', + template_path: 'stream.yml.hbs', + vars: [ + { + name: 'paths', + type: 'text', + title: 'Paths', + multi: true, + default: ['/var/log/*.log'], + required: false, + show_user: true, + hide_in_deployment_modes: ['default'], + }, + ], + description: 'Collect sample logs on Agentless only', + }, + ], + }, + }, ]; const mockUpdatePackagePolicyInput = jest.fn().mockImplementation((val: any) => { return undefined; @@ -424,6 +525,18 @@ describe('PackagePolicyInputPanel', () => { ).toBeInTheDocument(); }); }); + it('should not render multiple toggles when theres only one stream', async () => { + // Only send one input and then it should not be rendered, only the top level switch should render + render(mockPackageInfo, mockPackageInputStreams.slice(0, 1)); + await waitFor(async () => { + expect( + await renderResult.findByTestId('PackagePolicy.InputStreamConfig.Switch') + ).toBeInTheDocument(); + expect( + await renderResult.queryByText('Sample logs hidden in agentless') + ).not.toBeInTheDocument(); + }); + }); it('should render inputs when hide_in_deployment_modes is not present', async () => { const packageInputStreams: RegistryStreamWithDataStream[] = [ @@ -475,6 +588,55 @@ describe('PackagePolicyInputPanel', () => { ], }, }, + // Duplicated items to make sure they show up in the UI as we now only show multiple switches/descriptions when theres more than one input + { + input: 'logfile', + title: 'Sample logs (duplicated)', + template_path: 'stream.yml.hbs', + vars: [ + { + name: 'paths', + type: 'text', + title: 'Paths', + multi: false, + default: ['/var/log/*.log'], + required: false, + show_user: true, + }, + ], + description: 'Collect sample logs (duplicated)', + data_stream: { + title: 'Default data stream', + release: 'ga', + type: 'logs', + package: 'agentless_test_package', + dataset: 'agentless_test_package.default_data_stream', + path: 'default_data_stream', + elasticsearch: { + 'ingest_pipeline.name': 'default', + }, + ingest_pipeline: 'default', + streams: [ + { + input: 'logfile', + title: 'Sample logs', + template_path: 'stream.yml.hbs', + vars: [ + { + name: 'paths', + type: 'text', + title: 'Paths', + multi: false, + default: ['/var/log/*.log'], + required: false, + show_user: true, + }, + ], + description: 'Collect sample log - hidden in agentless', + }, + ], + }, + }, ]; const packageInfo = { ...mockPackageInfo, @@ -520,7 +682,7 @@ describe('PackagePolicyInputPanel', () => { ).toBeInTheDocument(); }); await waitFor(async () => { - expect(await renderResult.findByText('Sample logs')).toBeInTheDocument(); + expect(await renderResult.queryByText('Sample logs')).toBeInTheDocument(); }); await waitFor(async () => { expect(await renderResult.findByText('Collect sample logs')).toBeInTheDocument(); diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_panel.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_panel.tsx index 7949508da9238..ca91397547048 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_panel.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_panel.tsx @@ -6,6 +6,7 @@ */ import React, { useState, Fragment, memo, useMemo, useCallback } from 'react'; +import ReactMarkdown from 'react-markdown'; import styled from 'styled-components'; import { FormattedMessage } from '@kbn/i18n-react'; import { @@ -94,7 +95,7 @@ export const PackagePolicyInputPanel: React.FunctionComponent<{ }) => { const defaultDataStreamId = useDataStreamId(); const { isAgentlessEnabled } = useAgentless(); - + const showTopLevelDescription = packagePolicyInput.streams.length === 1; // Showing streams toggle state const [isShowingStreams, setIsShowingStreams] = useState(() => shouldShowStreamsByDefault( @@ -196,7 +197,17 @@ export const PackagePolicyInputPanel: React.FunctionComponent<{ } }} /> + + {/* show the description under the top level toggle if theres only one stream */} + {showTopLevelDescription && ( + + + {String(inputStreams[0].packageInputStream.description)} + + + )} + {hasErrors ? ( @@ -259,6 +270,7 @@ export const PackagePolicyInputPanel: React.FunctionComponent<{ data-test-subj="PackagePolicy.InputStreamConfig" packageInfo={packageInfo} packageInputStream={packageInputStream} + totalStreams={inputStreams.length} packagePolicyInputStream={packagePolicyInputStream!} updatePackagePolicyInputStream={( updatedStream: Partial diff --git a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_stream.tsx b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_stream.tsx index 246b6db8d8e35..fc3d5c3962201 100644 --- a/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_stream.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_stream.tsx @@ -65,6 +65,7 @@ interface Props { inputStreamValidationResults: PackagePolicyConfigValidationResults; forceShowErrors?: boolean; isEditPage?: boolean; + totalStreams?: number; } export const PackagePolicyInputStreamConfig = memo( @@ -76,6 +77,7 @@ export const PackagePolicyInputStreamConfig = memo( inputStreamValidationResults, forceShowErrors, isEditPage, + totalStreams, }) => { const config = useConfig(); const isExperimentalDataStreamSettingsEnabled = @@ -92,7 +94,7 @@ export const PackagePolicyInputStreamConfig = memo( !!packagePolicyInputStream.id && packagePolicyInputStream.id === defaultDataStreamId; const isPackagePolicyEdit = !!packagePolicyId; - + const shouldShowStreamsToggles = totalStreams ? totalStreams > 1 : true; const customDatasetVar = packagePolicyInputStream.vars?.[DATASET_VAR_NAME]; const customDatasetVarValue = customDatasetVar?.value?.dataset || customDatasetVar?.value; @@ -182,7 +184,7 @@ export const PackagePolicyInputStreamConfig = memo( alignItems="flexStart" justifyContent="spaceBetween" > - {packageInfo.type !== 'input' && ( + {packageInfo.type !== 'input' && shouldShowStreamsToggles && ( ( ) : null} - {packageInfo.type !== 'input' && packageInputStream.description ? ( + {packageInfo.type !== 'input' && + packageInputStream.description && + shouldShowStreamsToggles ? ( <>