Improved display of log types. (#753)

* Improved display of log types. Signed-off-by: AWSHurneyt <[email protected]> * Fixed cypress tests. Signed-off-by: AWSHurneyt <[email protected]> * Updated cypress workflow. Signed-off-by: AWSHurneyt <[email protected]> * Fixed cypress tests. Fixed flyout. Fixed rule form. Signed-off-by: AWSHurneyt <[email protected]> * Updated snapshots. Signed-off-by: AWSHurneyt <[email protected]> * Updated log type labels usage. Adjusted cypress tests. Signed-off-by: AWSHurneyt <[email protected]> * Updated snapshots. Signed-off-by: AWSHurneyt <[email protected]> --------- Signed-off-by: AWSHurneyt <[email protected]> (cherry picked from commit 7d90bb1)
opensearch-project · Oct 25, 2023 · 12b0377 · 12b0377
1 parent e74f599
commit 12b0377
Show file tree

Hide file tree

Showing 24 changed files with 94 additions and 185 deletions.
diff --git a/.github/workflows/cypress-workflow.yml b/.github/workflows/cypress-workflow.yml
@@ -87,7 +87,7 @@ jobs:
       - name: Run OpenSearch-Dashboards server
         run: |
           cd OpenSearch-Dashboards
-          yarn start --no-base-path --no-watch &
+          yarn start --no-base-path --no-watch --server.host="0.0.0.0" &
         shell: bash
 
       # Window is slow so wait longer

diff --git a/cypress/integration/1_detectors.spec.js b/cypress/integration/1_detectors.spec.js
@@ -10,6 +10,7 @@ import dns_name_rule_data from '../fixtures/integration_tests/rule/create_dns_ru
 import dns_type_rule_data from '../fixtures/integration_tests/rule/create_dns_rule_with_type_selection.json';
 import _ from 'lodash';
 import { getMappingFields } from '../../public/pages/Detectors/utils/helpers';
+import { getLogTypeLabel } from '../../public/pages/LogTypes/utils/helpers';
 
 const cypressIndexDns = 'cypress-index-dns';
 const cypressIndexWindows = 'cypress-index-windows';
@@ -114,9 +115,9 @@ const validatePendingFieldMappingsPanel = (mappings) => {
 const fillDetailsForm = (detectorName, dataSource) => {
   getNameField().type(detectorName);
   getDataSourceField().selectComboboxItem(dataSource);
-  getDataSourceField().blur();
-  getLogTypeField().selectComboboxItem(cypressLogTypeDns);
-  getLogTypeField().blur();
+  getDataSourceField().focus().blur();
+  getLogTypeField().selectComboboxItem(getLogTypeLabel(cypressLogTypeDns));
+  getLogTypeField().focus().blur();
 };
 
 const createDetector = (detectorName, dataSource, expectFailure) => {
@@ -126,7 +127,7 @@ const createDetector = (detectorName, dataSource, expectFailure) => {
 
   cy.getElementByText('.euiAccordion .euiTitle', 'Detection rules (14 selected)')
     .click({ force: true, timeout: 5000 })
-    .then(() => cy.contains('.euiTable .euiTableRow', 'Dns'));
+    .then(() => cy.contains('.euiTable .euiTableRow', getLogTypeLabel(cypressLogTypeDns)));
 
   cy.getElementByText('.euiAccordion .euiTitle', 'Field mapping - optional');
   cy.get('[aria-controls="mappedTitleFieldsAccordion"]').then(($btn) => {

diff --git a/cypress/integration/2_rules.spec.js b/cypress/integration/2_rules.spec.js
@@ -4,6 +4,7 @@
  */
 
 import { OPENSEARCH_DASHBOARDS_URL } from '../support/constants';
+import { getLogTypeLabel } from '../../public/pages/LogTypes/utils/helpers';
 
 const uniqueId = Cypress._.random(0, 1e6);
 const SAMPLE_RULE = {
@@ -55,7 +56,9 @@ const checkRulesFlyout = () => {
       cy.get('[data-test-subj="rule_flyout_rule_name"]').contains(SAMPLE_RULE.name);
 
       // Validate log type
-      cy.get('[data-test-subj="rule_flyout_rule_log_type"]').contains(SAMPLE_RULE.logType);
+      cy.get('[data-test-subj="rule_flyout_rule_log_type"]').contains(
+        getLogTypeLabel(SAMPLE_RULE.logType)
+      );
 
       // Validate description
       cy.get('[data-test-subj="rule_flyout_rule_description"]').contains(SAMPLE_RULE.description);
@@ -161,7 +164,7 @@ const fillCreateForm = () => {
   getAuthorField().type(`${SAMPLE_RULE.author}`);
 
   // rule details
-  getLogTypeField().selectComboboxItem(SAMPLE_RULE.logType);
+  getLogTypeField().selectComboboxItem(getLogTypeLabel(SAMPLE_RULE.logType));
   getRuleLevelField().selectComboboxItem(SAMPLE_RULE.severity);
 
   // rule detection
@@ -284,7 +287,7 @@ describe('Rules', () => {
       getLogTypeField().focus().blur();
       getLogTypeField().containsError('Log type is required');
 
-      getLogTypeField().selectComboboxItem(SAMPLE_RULE.logType);
+      getLogTypeField().selectComboboxItem(getLogTypeLabel(SAMPLE_RULE.logType));
       getLogTypeField().focus().blur().shouldNotHaveError();
     });
 
@@ -425,7 +428,7 @@ describe('Rules', () => {
       // log field
       getLogTypeField().clearCombobox();
       toastShouldExist();
-      getLogTypeField().selectComboboxItem(SAMPLE_RULE.logType);
+      getLogTypeField().selectComboboxItem(getLogTypeLabel(SAMPLE_RULE.logType));
 
       // severity field
       getRuleLevelField().clearCombobox();
@@ -550,8 +553,10 @@ describe('Rules', () => {
       SAMPLE_RULE.logType = 'dns';
       YAML_RULE_LINES[2] = `product: ${SAMPLE_RULE.logType}`;
       YAML_RULE_LINES[3] = `title: ${SAMPLE_RULE.name}`;
-      getLogTypeField().selectComboboxItem(SAMPLE_RULE.logType);
-      getLogTypeField().containsValue(SAMPLE_RULE.logType).contains(SAMPLE_RULE.logType);
+      getLogTypeField().selectComboboxItem(getLogTypeLabel(SAMPLE_RULE.logType));
+      getLogTypeField()
+        .containsValue(SAMPLE_RULE.logType)
+        .contains(getLogTypeLabel(SAMPLE_RULE.logType));
 
       SAMPLE_RULE.description += ' edited';
       YAML_RULE_LINES[4] = `description: ${SAMPLE_RULE.description}`;

diff --git a/cypress/integration/3_alerts.spec.js b/cypress/integration/3_alerts.spec.js
@@ -10,6 +10,7 @@ import aliasMappings from '../fixtures/sample_alias_mappings.json';
 import indexDoc from '../fixtures/sample_document.json';
 import ruleSettings from '../fixtures/integration_tests/rule/create_windows_usb_rule.json';
 import { createDetector } from '../support/helpers';
+import { getLogTypeLabel } from '../../public/pages/LogTypes/utils/helpers';
 
 const indexName = 'test-index';
 const detectorName = 'test-detector';
@@ -118,7 +119,9 @@ describe('Alerts', () => {
         expect($tr, `timestamp`).to.contain(date);
         expect($tr, `rule name`).to.contain('Cypress USB Rule');
         expect($tr, `detector name`).to.contain(testDetector.name);
-        expect($tr, `log type`).to.contain('System Activity: Windows');
+        expect($tr, `log type`).to.contain(
+          `System Activity: ${getLogTypeLabel(testDetector.detector_type)}`
+        );
       });
 
       // Close the flyout
@@ -189,7 +192,9 @@ describe('Alerts', () => {
         cy.get('[data-test-subj="finding-details-flyout-rule-severity"]').contains('High');
 
         // Confirm the rule category
-        cy.get('[data-test-subj="finding-details-flyout-rule-category"]').contains('Windows');
+        cy.get('[data-test-subj="finding-details-flyout-rule-category"]').contains(
+          getLogTypeLabel(testDetector.detector_type)
+        );
 
         // Confirm the rule description
         cy.get('[data-test-subj="finding-details-flyout-rule-description"]').contains(

diff --git a/cypress/integration/4_findings.spec.js b/cypress/integration/4_findings.spec.js
@@ -9,6 +9,7 @@ import aliasMappings from '../fixtures/sample_alias_mappings.json';
 import indexDoc from '../fixtures/sample_document.json';
 import ruleSettings from '../fixtures/integration_tests/rule/create_windows_usb_rule.json';
 import { createDetector } from '../support/helpers';
+import { getLogTypeLabel } from '../../public/pages/LogTypes/utils/helpers';
 
 const indexName = 'test-index';
 const detectorName = 'test-detector';
@@ -52,7 +53,7 @@ describe('Findings', () => {
     cy.contains('No items found').should('not.exist');
 
     // Check for expected findings
-    cy.contains('System Activity: Windows');
+    cy.contains(`System Activity: ${getLogTypeLabel(testDetector.detector_type)}`);
     cy.contains('High');
   });
 

diff --git a/cypress/integration/5_integrations.spec.js b/cypress/integration/5_integrations.spec.js
diff --git a/public/pages/Correlations/containers/CreateCorrelationRule.tsx b/public/pages/Correlations/containers/CreateCorrelationRule.tsx
@@ -297,7 +297,7 @@ export const CreateCorrelationRule: React.FC<CreateCorrelationRuleProps> = (
                                 label:
                                   ruleTypes.find(
                                     (logType) =>
-                                      logType.label.toLowerCase() === query.logType.toLowerCase()
+                                      logType.value.toLowerCase() === query.logType.toLowerCase()
                                   )?.label || query.logType,
                               },
                             ]

diff --git a/public/pages/Correlations/utils/constants.tsx b/public/pages/Correlations/utils/constants.tsx
@@ -9,7 +9,7 @@ import { ruleSeverity, ruleTypes } from '../../Rules/utils/constants';
 import { FilterItem } from '../components/FilterGroup';
 import { EuiIcon, EuiTitle } from '@elastic/eui';
 import { logTypeCategories, logTypesByCategories } from '../../../utils/constants';
-import _ from 'lodash';
+import { getLogTypeLabel } from '../../LogTypes/utils/helpers';
 
 export const graphRenderOptions = {
   nodes: {
@@ -67,7 +67,7 @@ export const getDefaultLogTypeFilterItemOptions: () => FilterItem[] = () => {
 
     logTypes.forEach(({ name }) => {
       options.push({
-        name: _.capitalize(name),
+        name: getLogTypeLabel(name),
         id: name,
         checked: 'on',
         visible: true,

diff --git a/...es/CreateDetector/components/DefineDetector/components/DetectionRules/utils/constants.tsx b/...es/CreateDetector/components/DefineDetector/components/DetectionRules/utils/constants.tsx
@@ -7,6 +7,7 @@ import { EuiBasicTableColumn, EuiLink, EuiSwitch } from '@elastic/eui';
 import { capitalizeFirstLetter } from '../../../../../../../utils/helpers';
 import React, { ReactNode } from 'react';
 import { RuleItem } from '../types/interfaces';
+import { getLogTypeLabel } from '../../../../../../LogTypes/utils/helpers';
 
 export type ActiveToggleOnChangeEvent = React.BaseSyntheticEvent<
   React.MouseEvent<HTMLButtonElement>,
@@ -51,7 +52,7 @@ export const getRulesColumns = (
       name: 'Log type',
       width: '10%',
       sortable: true,
-      render: (logType: string) => capitalizeFirstLetter(logType),
+      render: (logType: string) => getLogTypeLabel(logType),
     },
     {
       field: 'library',

diff --git a/...c/pages/CreateDetector/components/DefineDetector/components/DetectorType/DetectorType.tsx b/...c/pages/CreateDetector/components/DefineDetector/components/DetectorType/DetectorType.tsx
@@ -13,6 +13,7 @@ import { ruleTypes } from '../../../../../Rules/utils/constants';
 import ConfigureFieldMapping from '../../../ConfigureFieldMapping';
 import { ConfigureFieldMappingProps } from '../../../ConfigureFieldMapping/containers/ConfigureFieldMapping';
 import { getLogTypeOptions } from '../../../../../../utils/helpers';
+import { getLogTypeLabel } from '../../../../../LogTypes/utils/helpers';
 
 interface DetectorTypeProps {
   detectorType: string;
@@ -97,9 +98,11 @@ export default class DetectorType extends Component<DetectorTypeProps, DetectorT
             options={this.detectorTypeOptions}
             singleSelection={{ asPlainText: true }}
             onChange={(e) => {
-              this.onChange(e[0]?.label || '');
+              this.onChange(e[0]?.value || '');
             }}
-            selectedOptions={detectorType ? [{ value: detectorType, label: detectorType }] : []}
+            selectedOptions={
+              detectorType ? [{ value: detectorType, label: getLogTypeLabel(detectorType) }] : []
+            }
           />
         </EuiFormRow>
 

diff --git a/public/pages/Detectors/components/DetectorBasicDetailsView/DetectorBasicDetailsView.tsx b/public/pages/Detectors/components/DetectorBasicDetailsView/DetectorBasicDetailsView.tsx
@@ -10,6 +10,7 @@ import { createTextDetailsGroup, parseSchedule } from '../../../../utils/helpers
 import moment from 'moment';
 import { DEFAULT_EMPTY_DATA, logTypesWithDashboards } from '../../../../utils/constants';
 import { Detector } from '../../../../../types';
+import { getLogTypeLabel } from '../../../LogTypes/utils/helpers';
 
 export interface DetectorBasicDetailsViewProps {
   detector: Detector;
@@ -77,7 +78,7 @@ export const DetectorBasicDetailsView: React.FC<DetectorBasicDetailsViewProps> =
             </>
           ),
         },
-        { label: 'Log type', content: detector_type.toLowerCase() },
+        { label: 'Log type', content: getLogTypeLabel(detector_type.toLowerCase()) },
         {
           label: 'Detector dashboard',
           content: (dashboardId ? (

diff --git a/.../components/DetectorBasicDetailsView/__snapshots__/DetectorBasicDetailsView.test.tsx.snap b/.../components/DetectorBasicDetailsView/__snapshots__/DetectorBasicDetailsView.test.tsx.snap
@@ -258,7 +258,7 @@ Object {
                     data-test-subj="text-details-group-content-log-type"
                     id="some_html_id"
                   >
-                    detector_type
+                    Detector Type
                   </div>
                 </div>
               </div>
@@ -684,7 +684,7 @@ Object {
                   data-test-subj="text-details-group-content-log-type"
                   id="some_html_id"
                 >
-                  detector_type
+                  Detector Type
                 </div>
               </div>
             </div>

diff --git a/public/pages/Detectors/containers/Detector/__snapshots__/DetectorDetails.test.tsx.snap b/public/pages/Detectors/containers/Detector/__snapshots__/DetectorDetails.test.tsx.snap
@@ -1945,7 +1945,7 @@ exports[`<DetectorDetails /> spec renders the component 1`] = `
                                 onBlur={[Function]}
                                 onFocus={[Function]}
                               >
-                                detector_type
+                                Detector Type
                               </div>
                             </EuiText>
                           </div>