[8.7] [UnifiedFieldList] Remove wrapping field names on dot to rather allow copying it (#153478) (#153534)

# Backport

This will backport the following commits from `main` to `8.7`:
- [[UnifiedFieldList] Remove wrapping field names on dot to rather allow
copying it (#153478)](https://github.com/elastic/kibana/pull/153478)

<!--- Backport version: 8.9.7 -->

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

<!--BACKPORT [{"author":{"name":"Julia
Rechkunova","email":"julia.rechkunova@elastic.co"},"sourceCommit":{"committedDate":"2023-03-23T11:27:09Z","message":"[UnifiedFieldList]
Remove wrapping field names on dot to rather allow copying it
(#153478)\n\nCloses
https://github.com/elastic/kibana/issues/153353\r\n\r\n##
Summary\r\n\r\nThis PR enables users to copy original/unmodified field
names from the\r\nfield list.\r\n\r\n<img width=\"500\" alt=\"Screenshot
2023-03-22 at 18 41
36\"\r\nsrc=\"https://user-images.githubusercontent.com/1415710/226991956-4708f9c1-dd39-4010-aa87-76fd7668ebaf.png\">","sha":"b0d4d2ecc22c9d9b6a4e31519e84ae024bcbfdaa","branchLabelMapping":{"^v8.8.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:fix","Team:DataDiscovery","backport:prev-minor","v8.8.0"],"number":153478,"url":"https://github.com/elastic/kibana/pull/153478","mergeCommit":{"message":"[UnifiedFieldList]
Remove wrapping field names on dot to rather allow copying it
(#153478)\n\nCloses
https://github.com/elastic/kibana/issues/153353\r\n\r\n##
Summary\r\n\r\nThis PR enables users to copy original/unmodified field
names from the\r\nfield list.\r\n\r\n<img width=\"500\" alt=\"Screenshot
2023-03-22 at 18 41
36\"\r\nsrc=\"https://user-images.githubusercontent.com/1415710/226991956-4708f9c1-dd39-4010-aa87-76fd7668ebaf.png\">","sha":"b0d4d2ecc22c9d9b6a4e31519e84ae024bcbfdaa"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v8.8.0","labelRegex":"^v8.8.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/153478","number":153478,"mergeCommit":{"message":"[UnifiedFieldList]
Remove wrapping field names on dot to rather allow copying it
(#153478)\n\nCloses
https://github.com/elastic/kibana/issues/153353\r\n\r\n##
Summary\r\n\r\nThis PR enables users to copy original/unmodified field
names from the\r\nfield list.\r\n\r\n<img width=\"500\" alt=\"Screenshot
2023-03-22 at 18 41
36\"\r\nsrc=\"https://user-images.githubusercontent.com/1415710/226991956-4708f9c1-dd39-4010-aa87-76fd7668ebaf.png\">","sha":"b0d4d2ecc22c9d9b6a4e31519e84ae024bcbfdaa"}}]}]
BACKPORT-->

src/plugins/discover/public/application/main/components/sidebar/discover_field.tsx

@@ -29,7 +29,6 @@ import {
   FieldPopoverHeaderProps,
   FieldPopoverVisualize,
   getFieldIconProps,
-  wrapFieldNameOnDot,
 } from '@kbn/unified-field-list-plugin/public';
 import { DiscoverFieldStats } from './discover_field_stats';
 import { DiscoverFieldDetails } from './deprecated_stats/discover_field_details';
@@ -77,12 +76,12 @@ const FieldName: React.FC<{ field: DataViewField; highlight?: string }> = memo(
 
     return (
       <EuiHighlight
-        search={wrapFieldNameOnDot(highlight)}
+        search={highlight || ''}
         data-test-subj={`field-${field.name}`}
         title={title}
         className="dscSidebarField__name"
       >
-        {wrapFieldNameOnDot(field.displayName)}
+        {field.displayName}
       </EuiHighlight>
     );
   }

src/plugins/unified_field_list/public/index.ts

@@ -92,7 +92,6 @@ export {
   type QuerySubscriberParams,
 } from './hooks/use_query_subscriber';
 
-export { wrapFieldNameOnDot } from './utils/wrap_field_name_on_dot';
 export {
   getFieldTypeName,
   getFieldTypeDescription,

src/plugins/unified_field_list/public/utils/wrap_field_name_on_dot.test.ts

@@ -1,22 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
- * in compliance with, at your election, the Elastic License 2.0 or the Server
- * Side Public License, v 1.
- */
-
-import { stubLogstashDataView as dataView } from '@kbn/data-views-plugin/common/data_view.stub';
-import { wrapFieldNameOnDot } from './wrap_field_name_on_dot';
-
-describe('UnifiedFieldList wrapFieldNameOnDot()', () => {
-  it(`should work correctly for simple names`, () => {
-    expect(wrapFieldNameOnDot(dataView.getFieldByName('extension')?.name)).toBe('extension');
-  });
-
-  it(`should work correctly for longer names`, () => {
-    expect(wrapFieldNameOnDot(dataView.getFieldByName('extension.keyword')?.name)).toBe(
-      'extension.​keyword'
-    );
-  });
-});

src/plugins/unified_field_list/public/utils/wrap_field_name_on_dot.ts

@@ -1,19 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
- * in compliance with, at your election, the Elastic License 2.0 or the Server
- * Side Public License, v 1.
- */
-
-/**
- * Wraps field name on dot
- * @param str
- * @public
- */
-export function wrapFieldNameOnDot(str?: string): string {
-  // u200B is a non-width white-space character, which allows
-  // the browser to efficiently word-wrap right after the dot
-  // without us having to draw a lot of extra DOM elements, etc
-  return str ? str.replace(/\./g, '.\u200B') : '';
-}

x-pack/plugins/lens/public/datasources/form_based/field_item.tsx

@@ -26,7 +26,6 @@ import {
   FieldPopoverVisualize,
   FieldIcon,
   getFieldIconProps,
-  wrapFieldNameOnDot,
 } from '@kbn/unified-field-list-plugin/public';
 import { generateFilters, getEsQueryConfig } from '@kbn/data-plugin/public';
 import { DragDrop } from '../../drag_drop';
@@ -214,11 +213,7 @@ export const InnerFieldItem = function InnerFieldItem(props: FieldItemProps) {
                 ),
               }}
               fieldIcon={lensFieldIcon}
-              fieldName={
-                <EuiHighlight search={wrapFieldNameOnDot(highlight)}>
-                  {wrapFieldNameOnDot(field.displayName)}
-                </EuiHighlight>
-              }
+              fieldName={<EuiHighlight search={highlight || ''}>{field.displayName}</EuiHighlight>}
               fieldInfoIcon={lensInfoIcon}
             />
           </DragDrop>

x-pack/plugins/lens/public/datasources/text_based/datapanel.tsx

@@ -21,7 +21,6 @@ import {
   FieldListFilters,
   FieldIcon,
   GetCustomFieldType,
-  wrapFieldNameOnDot,
   FieldListGrouped,
   FieldListGroupedProps,
   FieldsGroupNames,
@@ -132,9 +131,7 @@ export function TextBasedDataPanel({
             onClick={() => {}}
             fieldIcon={<FieldIcon type={getCustomFieldType(field)} />}
             fieldName={
-              <EuiHighlight search={wrapFieldNameOnDot(fieldSearchHighlight)}>
-                {wrapFieldNameOnDot(field.name)}
-              </EuiHighlight>
+              <EuiHighlight search={fieldSearchHighlight || ''}>{field.name}</EuiHighlight>
             }
           />
         </DragDrop>