From 41cacd1e0c5c3f480eaad84e9d914731c448bb02 Mon Sep 17 00:00:00 2001
From: Davis Plumlee <56367316+dplumlee@users.noreply.github.com>
Date: Fri, 10 Nov 2023 12:01:34 -0500
Subject: [PATCH] [Security Solution] Fixes create/edit rule form subtechnique
 selection bug (#170465)

---
 .../components/rules/mitre/subtechnique_fields.tsx     |  9 ++++-----
 .../components/rules/mitre/technique_fields.tsx        | 10 +++++-----
 2 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/x-pack/plugins/security_solution/public/detections/components/rules/mitre/subtechnique_fields.tsx b/x-pack/plugins/security_solution/public/detections/components/rules/mitre/subtechnique_fields.tsx
index efc542f9757a1..7645bc2c2c579 100644
--- a/x-pack/plugins/security_solution/public/detections/components/rules/mitre/subtechnique_fields.tsx
+++ b/x-pack/plugins/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,7 +169,7 @@ export const MitreAttackSubtechniqueFields: React.FC<AddSubtechniqueProps> = ({
                 : []),
               ...options.map((option) => ({
                 inputDisplay: <>{option.label}</>,
-                value: option.value,
+                value: option.id,
                 disabled,
               })),
             ]}
@@ -178,7 +177,7 @@ export const MitreAttackSubtechniqueFields: React.FC<AddSubtechniqueProps> = ({
             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/x-pack/plugins/security_solution/public/detections/components/rules/mitre/technique_fields.tsx b/x-pack/plugins/security_solution/public/detections/components/rules/mitre/technique_fields.tsx
index 0215204a98cbd..bb677801ecaa9 100644
--- a/x-pack/plugins/security_solution/public/detections/components/rules/mitre/technique_fields.tsx
+++ b/x-pack/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,7 +153,7 @@ export const MitreAttackTechniqueFields: React.FC<AddTechniqueProps> = ({
                 : []),
               ...options.map((option) => ({
                 inputDisplay: <>{option.label}</>,
-                value: option.value,
+                value: option.id,
                 disabled,
               })),
             ]}
@@ -161,7 +161,7 @@ export const MitreAttackTechniqueFields: React.FC<AddTechniqueProps> = ({
             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}