Fix override value column width for Severity Override

nikitaindik · Sep 8, 2024 · e50ece0 · e50ece0
1 parent 24fea79
commit e50ece0
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 11 deletions.
diff --git a/...on/public/detection_engine/rule_management/components/rule_details/rule_about_section.tsx b/...on/public/detection_engine/rule_management/components/rule_details/rule_about_section.tsx
@@ -43,10 +43,10 @@ const OverrideColumn = styled(EuiFlexItem)`
   text-overflow: ellipsis;
 `;
 
-const OverrideValueColumn = styled(EuiFlexItem)`
-  width: 30px;
-  max-width: 30px;
+const OverrideValueColumn = styled.div`
+  width: 50px;
   overflow: hidden;
+  white-space: nowrap;
   text-overflow: ellipsis;
 `;
 
@@ -96,16 +96,18 @@ export const SeverityMappingItem = ({ severityMappingItem }: SeverityMappingItem
         <span data-test-subj="severityOverrideField">{`${severityMappingItem.field}:`}</span>
       </EuiToolTip>
     </OverrideColumn>
-    <OverrideValueColumn>
+    <EuiFlexItem grow={false}>
       <EuiToolTip
         content={severityMappingItem.value}
         data-test-subj={`severityOverrideValue-${severityMappingItem.value}`}
       >
-        <span data-test-subj="severityOverrideValue">
-          {defaultToEmptyTag(severityMappingItem.value)}
-        </span>
+        <OverrideValueColumn>
+          <span data-test-subj="severityOverrideValue">
+            {defaultToEmptyTag(severityMappingItem.value)}
+          </span>
+        </OverrideValueColumn>
       </EuiToolTip>
-    </OverrideValueColumn>
+    </EuiFlexItem>
     <EuiFlexItem grow={false}>
       <EuiIcon type={'sortRight'} />
     </EuiFlexItem>

diff --git a/...etails/three_way_diff/final_readonly/fields/severity_mapping/severity_mapping.stories.tsx b/...etails/three_way_diff/final_readonly/fields/severity_mapping/severity_mapping.stories.tsx
@@ -39,13 +39,13 @@ Default.args = {
         field: 'event.severity',
         operator: 'equals',
         severity: 'low',
-        value: 'not severe',
+        value: 'LOW',
       },
       {
-        field: 'event.severity',
+        field: 'google_workspace.alert.metadata.severity',
         operator: 'equals',
         severity: 'high',
-        value: 'pretty severe',
+        value: 'VERY HIGH',
       },
     ],
   },