[Security Solution] Fixes create/edit rule form subtechnique selectio…

…n bug (elastic#170465) (cherry picked from commit 41cacd1)
kibanamachine · Nov 10, 2023 · 7662a39 · 7662a39
1 parent 51bebd8
commit 7662a39
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 10 deletions.
diff --git a/...lugins/security_solution/public/detections/components/rules/mitre/subtechnique_fields.tsx b/...lugins/security_solution/public/detections/components/rules/mitre/subtechnique_fields.tsx
@@ -13,7 +13,6 @@ import {
   EuiFlexGroup,
   EuiFlexItem,
 } from '@elastic/eui';
-import { camelCase } from 'lodash/fp';
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import styled from 'styled-components';
 
@@ -110,9 +109,9 @@ export const MitreAttackSubtechniqueFields: React.FC<AddSubtechniqueProps> = ({
   }, [field, onFieldChange, techniqueIndex, technique, threatIndex]);
 
   const updateSubtechnique = useCallback(
-    (index: number, value: string) => {
+    (index: number, optionId: string) => {
       const threats = [...(field.value as Threats)];
-      const { id, reference, name } = subtechniquesOptions.find((t) => t.value === value) || {
+      const { id, reference, name } = subtechniquesOptions.find((t) => t.id === optionId) ?? {
         id: '',
         name: '',
         reference: '',
@@ -170,15 +169,15 @@ export const MitreAttackSubtechniqueFields: React.FC<AddSubtechniqueProps> = ({
                 : []),
               ...options.map((option) => ({
                 inputDisplay: <>{option.label}</>,
-                value: option.value,
+                value: option.id,
                 disabled,
               })),
             ]}
             prepend={`${field.label} ${i18n.SUBTECHNIQUE}`}
             aria-label=""
             onChange={updateSubtechnique.bind(null, index)}
             fullWidth={true}
-            valueOfSelected={camelCase(subtechnique.name)}
+            valueOfSelected={subtechnique.id}
             data-test-subj="mitreAttackSubtechnique"
             disabled={disabled}
             placeholder={i18n.SUBTECHNIQUE_PLACEHOLDER}

diff --git a/...k/plugins/security_solution/public/detections/components/rules/mitre/technique_fields.tsx b/...k/plugins/security_solution/public/detections/components/rules/mitre/technique_fields.tsx
@@ -13,7 +13,7 @@ import {
   EuiFlexGroup,
   EuiFlexItem,
 } from '@elastic/eui';
-import { kebabCase, camelCase } from 'lodash/fp';
+import { kebabCase } from 'lodash/fp';
 import React, { useCallback, useEffect, useState } from 'react';
 import styled, { css } from 'styled-components';
 
@@ -105,9 +105,9 @@ export const MitreAttackTechniqueFields: React.FC<AddTechniqueProps> = ({
   }, [field, threatIndex, onFieldChange]);
 
   const updateTechnique = useCallback(
-    (index: number, value: string) => {
+    (index: number, optionId: string) => {
       const threats = [...(field.value as Threats)];
-      const { id, reference, name } = techniquesOptions.find((t) => t.value === value) || {
+      const { id, reference, name } = techniquesOptions.find((t) => t.id === optionId) ?? {
         id: '',
         name: '',
         reference: '',
@@ -153,15 +153,15 @@ export const MitreAttackTechniqueFields: React.FC<AddTechniqueProps> = ({
                 : []),
               ...options.map((option) => ({
                 inputDisplay: <>{option.label}</>,
-                value: option.value,
+                value: option.id,
                 disabled,
               })),
             ]}
             prepend={`${field.label} ${i18n.TECHNIQUE}`}
             aria-label=""
             onChange={updateTechnique.bind(null, index)}
             fullWidth={true}
-            valueOfSelected={camelCase(technique.name)}
+            valueOfSelected={technique.id}
             data-test-subj="mitreAttackTechnique"
             disabled={disabled}
             placeholder={i18n.TECHNIQUE_PLACEHOLDER}