[Fleet] show dataset combo box for input packages

x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/dataset_combo.tsx

@@ -0,0 +1,66 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React, { useEffect, useState } from 'react';
+import { EuiComboBox } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+
+export const DatasetComboBox: React.FC<{
+  value: any;
+  onChange: (newValue: any) => void;
+  datasets: string[];
+}> = ({ value, onChange, datasets }) => {
+  const datasetOptions = datasets.map((dataset: string) => ({ label: dataset })) ?? [];
+  const defaultOption = 'generic';
+  const [selectedOptions, setSelectedOptions] = useState<Array<{ label: string }>>([
+    {
+      label: value ?? defaultOption,
+    },
+  ]);
+
+  useEffect(() => {
+    if (!value) onChange(defaultOption);
+  }, [value, defaultOption, onChange]);
+
+  const onDatasetChange = (newSelectedOptions: Array<{ label: string }>) => {
+    setSelectedOptions(newSelectedOptions);
+    onChange(newSelectedOptions[0]?.label);
+  };
+
+  const onCreateOption = (searchValue: string = '') => {
+    const normalizedSearchValue = searchValue.trim().toLowerCase();
+    if (!normalizedSearchValue) {
+      return;
+    }
+    const newOption = {
+      label: searchValue,
+    };
+    setSelectedOptions([newOption]);
+    onChange(searchValue);
+  };
+
+  return (
+    <EuiComboBox
+      aria-label={i18n.translate('xpack.fleet.datasetCombo.ariaLabel', {
+        defaultMessage: 'Dataset combo box',
+      })}
+      placeholder={i18n.translate('xpack.fleet.datasetCombo.placeholder', {
+        defaultMessage: 'Select a dataset',
+      })}
+      singleSelection={{ asPlainText: true }}
+      options={datasetOptions}
+      selectedOptions={selectedOptions}
+      onCreateOption={onCreateOption}
+      onChange={onDatasetChange}
+      customOptionText={i18n.translate('xpack.fleet.datasetCombo.customOptionText', {
+        defaultMessage: 'Add {searchValue} as a custom option',
+        values: { searchValue: '{searchValue}' },
+      })}
+      isClearable={false}
+    />
+  );
+};

x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/order_datasets.test.ts

@@ -0,0 +1,30 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { orderDatasets } from './order_datasets';
+
+describe('orderDatasets', () => {
+  it('should move datasets up that match name', () => {
+    const datasets = orderDatasets(
+      ['system.memory', 'elastic_agent', 'elastic_agent.filebeat', 'system.cpu'],
+      'elastic_agent'
+    );
+
+    expect(datasets).toEqual([
+      'elastic_agent',
+      'elastic_agent.filebeat',
+      'system.cpu',
+      'system.memory',
+    ]);
+  });
+
+  it('should order alphabetically if name does not match', () => {
+    const datasets = orderDatasets(['system.memory', 'elastic_agent'], 'nginx');
+
+    expect(datasets).toEqual(['elastic_agent', 'system.memory']);
+  });
+});

x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/order_datasets.ts

@@ -0,0 +1,16 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { partition } from 'lodash';
+
+export function orderDatasets(datasetList: string[], name: string): string[] {
+  const [relevantDatasets, otherDatasets] = partition(datasetList.sort(), (record) =>
+    record.startsWith(name)
+  );
+  const datasets = relevantDatasets.concat(otherDatasets);
+  return datasets;
+}

x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/steps/components/package_policy_input_stream.tsx

@@ -8,6 +8,7 @@
 import React, { useState, Fragment, memo, useMemo, useEffect, useRef, useCallback } from 'react';
 import ReactMarkdown from 'react-markdown';
 import styled from 'styled-components';
+import { uniq } from 'lodash';
 import { FormattedMessage } from '@kbn/i18n-react';
 import {
   EuiFlexGrid,
@@ -22,6 +23,8 @@ import {
 } from '@elastic/eui';
 import { useRouteMatch } from 'react-router-dom';
 
+import { useGetDataStreams } from '../../../../../../../../hooks';
+
 import { mapPackageReleaseToIntegrationCardRelease } from '../../../../../../../../services/package_prerelease';
 
 import { getRegistryDataStreamAssetBaseName } from '../../../../../../../../../common/services';
@@ -41,6 +44,7 @@ import { PackagePolicyEditorDatastreamMappings } from '../../datastream_mappings
 
 import { PackagePolicyInputVarField } from './package_policy_input_var_field';
 import { useDataStreamId } from './hooks';
+import { orderDatasets } from './order_datasets';
 
 const ScrollAnchor = styled.div`
   display: none;
@@ -175,6 +179,11 @@ export const PackagePolicyInputStreamConfig = memo<Props>(
       });
     };
 
+    const { data: dataStreamsData } = useGetDataStreams();
+    const datasetList =
+      uniq(dataStreamsData?.data_streams.map((dataStream) => dataStream.dataset)) ?? [];
+    const datasets = orderDatasets(datasetList, packageInfo.name);
+
     return (
       <>
         <EuiFlexGrid columns={2}>
@@ -252,6 +261,8 @@ export const PackagePolicyInputStreamConfig = memo<Props>(
                       }}
                       errors={inputStreamValidationResults?.vars![varName]}
                       forceShowErrors={forceShowErrors}
+                      packageType={packageInfo.type}
+                      datasets={datasets}
                     />
                   </EuiFlexItem>
                 );
@@ -311,6 +322,8 @@ export const PackagePolicyInputStreamConfig = memo<Props>(
                             }}
                             errors={inputStreamValidationResults?.vars![varName]}
                             forceShowErrors={forceShowErrors}
+                            packageType={packageInfo.type}
+                            datasets={datasets}
                           />
                         </EuiFlexItem>
                       );