[8.x] [Security Solution] Fix whitespace/newlines for exception comme…

…nts (#208959) (#210568)

# Backport

This will backport the following commits from `main` to `8.x`:
- [[Security Solution] Fix whitespace/newlines for exception comments
(#208959)](#208959)

<!--- Backport version: 9.6.4 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Marshall
Main","email":"55718608+marshallmain@users.noreply.github.com"},"sourceCommit":{"committedDate":"2025-02-10T23:17:49Z","message":"[Security
Solution] Fix whitespace/newlines for exception comments (#208959)\n\n##
Summary\r\n\r\nFixes
https://github.com/elastic/kibana/issues/208956\r\n\r\n##
Before\r\n\r\n![image](https://github.com/user-attachments/assets/aa9b00e9-da70-4ff2-be18-4073235e8a85)\r\n\r\n##
After\r\n\r\n![image](https://github.com/user-attachments/assets/0fa2a69c-836d-4e98-8ecb-be88d1170519)","sha":"1b8bdcff677773afa1ac42a1410ca58e0db49964","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","v9.0.0","backport:prev-minor","Team:Detection
Engine","v8.18.0","v9.1.0","v8.19.0"],"title":"[Security Solution] Fix
whitespace/newlines for exception
comments","number":208959,"url":"https://github.com/elastic/kibana/pull/208959","mergeCommit":{"message":"[Security
Solution] Fix whitespace/newlines for exception comments (#208959)\n\n##
Summary\r\n\r\nFixes
https://github.com/elastic/kibana/issues/208956\r\n\r\n##
Before\r\n\r\n![image](https://github.com/user-attachments/assets/aa9b00e9-da70-4ff2-be18-4073235e8a85)\r\n\r\n##
After\r\n\r\n![image](https://github.com/user-attachments/assets/0fa2a69c-836d-4e98-8ecb-be88d1170519)","sha":"1b8bdcff677773afa1ac42a1410ca58e0db49964"}},"sourceBranch":"main","suggestedTargetBranches":["8.x"],"targetPullRequestStates":[{"branch":"9.0","label":"v9.0.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"url":"https://github.com/elastic/kibana/pull/210480","number":210480,"state":"MERGED","mergeCommit":{"sha":"b3c129502eff48d1b8292962391afe57c09626a5","message":"[9.0]
[Security Solution] Fix whitespace/newlines for exception comments
(#208959) (#210480)\n\n# Backport\n\nThis will backport the following
commits from `main` to `9.0`:\n- [[Security Solution] Fix
whitespace/newlines for exception
comments\n(#208959)](https://github.com/elastic/kibana/pull/208959)\n\n<!---
Backport version: 9.4.3 -->\n\n### Questions ?\nPlease refer to the
[Backport
tool\ndocumentation](https://github.com/sqren/backport)\n\n<!--BACKPORT
[{\"author\":{\"name\":\"Marshall\nMain\",\"email\":\"55718608+marshallmain@users.noreply.github.com\"},\"sourceCommit\":{\"committedDate\":\"2025-02-10T23:17:49Z\",\"message\":\"[Security\nSolution]
Fix whitespace/newlines for exception comments
(#208959)\\n\\n##\nSummary\\r\\n\\r\\nFixes\nhttps://github.com//issues/208956\\r\\n\\r\\n##\nBefore\\r\\n\\r\\n![image](https://github.com/user-attachments/assets/aa9b00e9-da70-4ff2-be18-4073235e8a85)\\r\\n\\r\\n##\nAfter\\r\\n\\r\\n![image](https://github.com/user-attachments/assets/0fa2a69c-836d-4e98-8ecb-be88d1170519)\",\"sha\":\"1b8bdcff677773afa1ac42a1410ca58e0db49964\",\"branchLabelMapping\":{\"^v9.1.0$\":\"main\",\"^v8.19.0$\":\"8.x\",\"^v(\\\\d+).(\\\\d+).\\\\d+$\":\"$1.$2\"}},\"sourcePullRequest\":{\"labels\":[\"release_note:skip\",\"backport:prev-minor\",\"Team:Detection\nEngine\",\"v9.1.0\"],\"title\":\"[Security
Solution] Fix whitespace/newlines\nfor
exception\ncomments\",\"number\":208959,\"url\":\"https://github.com/elastic/kibana/pull/208959\",\"mergeCommit\":{\"message\":\"[Security\nSolution]
Fix whitespace/newlines for exception comments
(#208959)\\n\\n##\nSummary\\r\\n\\r\\nFixes\nhttps://github.com//issues/208956\\r\\n\\r\\n##\nBefore\\r\\n\\r\\n![image](https://github.com/user-attachments/assets/aa9b00e9-da70-4ff2-be18-4073235e8a85)\\r\\n\\r\\n##\nAfter\\r\\n\\r\\n![image](https://github.com/user-attachments/assets/0fa2a69c-836d-4e98-8ecb-be88d1170519)\",\"sha\":\"1b8bdcff677773afa1ac42a1410ca58e0db49964\"}},\"sourceBranch\":\"main\",\"suggestedTargetBranches\":[],\"targetPullRequestStates\":[{\"branch\":\"main\",\"label\":\"v9.1.0\",\"branchLabelMappingKey\":\"^v9.1.0$\",\"isSourceBranch\":true,\"state\":\"MERGED\",\"url\":\"https://github.com/elastic/kibana/pull/208959\",\"number\":208959,\"mergeCommit\":{\"message\":\"[Security\nSolution]
Fix whitespace/newlines for exception comments
(#208959)\\n\\n##\nSummary\\r\\n\\r\\nFixes\nhttps://github.com//issues/208956\\r\\n\\r\\n##\nBefore\\r\\n\\r\\n![image](https://github.com/user-attachments/assets/aa9b00e9-da70-4ff2-be18-4073235e8a85)\\r\\n\\r\\n##\nAfter\\r\\n\\r\\n![image](https://github.com/user-attachments/assets/0fa2a69c-836d-4e98-8ecb-be88d1170519)\",\"sha\":\"1b8bdcff677773afa1ac42a1410ca58e0db49964\"}}]}]\nBACKPORT-->\n\nCo-authored-by:
Marshall Main
<55718608+marshallmain@users.noreply.github.com>"}},{"branch":"8.18","label":"v8.18.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"url":"https://github.com/elastic/kibana/pull/210567","number":210567,"state":"OPEN"},{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/208959","number":208959,"mergeCommit":{"message":"[Security
Solution] Fix whitespace/newlines for exception comments (#208959)\n\n##
Summary\r\n\r\nFixes
https://github.com/elastic/kibana/issues/208956\r\n\r\n##
Before\r\n\r\n![image](https://github.com/user-attachments/assets/aa9b00e9-da70-4ff2-be18-4073235e8a85)\r\n\r\n##
After\r\n\r\n![image](https://github.com/user-attachments/assets/0fa2a69c-836d-4e98-8ecb-be88d1170519)","sha":"1b8bdcff677773afa1ac42a1410ca58e0db49964"}},{"branch":"8.x","label":"v8.19.0","branchLabelMappingKey":"^v8.19.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

x-pack/solutions/security/plugins/security_solution/public/detection_engine/rule_exceptions/utils/helpers.tsx

@@ -12,6 +12,8 @@ import { capitalize, get, omit } from 'lodash';
 import type { Moment } from 'moment';
 import moment from 'moment';
 
+import { css } from '@emotion/react';
+
 import type {
   CommentsArray,
   Comment,
@@ -74,6 +76,10 @@ export const formatOperatingSystems = (osTypes: string[]): string => {
     .join(', ');
 };
 
+const commentCss = css`
+  white-space: pre-wrap;
+`;
+
 /**
  * Formats ExceptionItem.comments into EuiCommentList format
  *
@@ -85,7 +91,11 @@ export const getFormattedComments = (comments: CommentsArray): EuiCommentProps[]
     timestamp: moment(commentItem.created_at).format('on MMM Do YYYY @ HH:mm:ss'),
     event: i18n.COMMENT_EVENT,
     timelineAvatar: <EuiAvatar size="l" name={commentItem.created_by.toUpperCase()} />,
-    children: <EuiText size="s">{commentItem.comment}</EuiText>,
+    children: (
+      <EuiText size="s" css={commentCss}>
+        {commentItem.comment}
+      </EuiText>
+    ),
     actions: (
       <WithCopyToClipboard
         data-test-subj="copy-to-clipboard"

x-pack/solutions/security/plugins/security_solution/public/exceptions/utils/ui.helpers.tsx

@@ -11,10 +11,16 @@ import { EuiText, EuiAvatar } from '@elastic/eui';
 
 import type { CommentsArray } from '@kbn/securitysolution-io-ts-list-types';
 
+import { css } from '@emotion/react';
+
 import moment from 'moment';
 import * as i18n from './translations';
 import { WithCopyToClipboard } from '../../common/lib/clipboard/with_copy_to_clipboard';
 
+const commentCss = css`
+  white-space: pre-wrap;
+`;
+
 /**
  * Formats ExceptionItem.comments into EuiCommentList format
  *
@@ -26,7 +32,11 @@ export const getFormattedComments = (comments: CommentsArray): EuiCommentProps[]
     timestamp: moment(commentItem.created_at).format('on MMM Do YYYY @ HH:mm:ss'),
     event: i18n.COMMENT_EVENT,
     timelineAvatar: <EuiAvatar size="l" name={commentItem.created_by.toUpperCase()} />,
-    children: <EuiText size="s">{commentItem.comment}</EuiText>,
+    children: (
+      <EuiText size="s" css={commentCss}>
+        {commentItem.comment}
+      </EuiText>
+    ),
     actions: (
       <WithCopyToClipboard
         data-test-subj="copy-to-clipboard"