fix(discover): break new lines in table cell (#7207)

* fix(discover): break new lines in table cell

fixes #7177

Signed-off-by: Joshua Li <joshuali925@gmail.com>

* Changeset file for PR #7207 created/updated

---------

Signed-off-by: Joshua Li <joshuali925@gmail.com>
Co-authored-by: opensearch-changeset-bot[bot] <154024398+opensearch-changeset-bot[bot]@users.noreply.github.com>
(cherry picked from commit 4ff4c3c)
Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

changelogs/fragments/7207.yml

@@ -0,0 +1,2 @@
+fix:
+- Break new lines in table cell in legacy discover ([#7207](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/7207))

src/plugins/discover/public/application/components/default_discover_table/_table_cell.scss

@@ -104,3 +104,7 @@ $osdDocTableCellPadding: calc($ouiSizeM / 2); // corresponds to DataGrid medium
     font-size: inherit !important;
   }
 }
+
+.osdDocTableCell__dataField {
+  white-space: pre-wrap;
+}

src/plugins/discover/public/application/components/default_discover_table/table_cell.tsx

@@ -34,8 +34,11 @@ const TableCellUI = ({
 }: TableCellProps) => {
   const content = (
     <>
-      {/* eslint-disable-next-line react/no-danger */}
-      <span dangerouslySetInnerHTML={{ __html: sanitizedCellValue }} />
+      <span
+        className="osdDocTableCell__dataField"
+        // eslint-disable-next-line react/no-danger
+        dangerouslySetInnerHTML={{ __html: sanitizedCellValue }}
+      />
       <span className="osdDocTableCell__filter">
         <EuiToolTip
           content={i18n.translate('discover.filterForValue', {