From fdd33659c89250d5a1e88da9eb05c283f13fd502 Mon Sep 17 00:00:00 2001
From: shivindera <shivindera@gmail.com>
Date: Mon, 31 Jan 2022 23:37:40 +0100
Subject: [PATCH 01/35] ability to set human readable title of data view &
 ability to edit data view

---
 src/plugins/data_view_editor/README.md        |  11 +-
 .../public/components/data_view_editor.tsx    |   2 +
 .../data_view_editor_flyout_content.tsx       |  68 ++++++++--
 .../data_view_flyout_content_container.tsx    |  33 ++++-
 .../public/components/footer/footer.tsx       |   9 +-
 .../public/components/form_fields/index.ts    |   1 +
 .../form_fields/readable_title_field.tsx      | 120 ++++++++++++++++++
 .../components/form_fields/title_field.tsx    |   6 +-
 .../public/components/form_schema.ts          |  21 ++-
 .../public/components/index.ts                |   2 +-
 .../status_message.test.tsx.snap              |  12 +-
 .../status_message/status_message.tsx         |  14 +-
 src/plugins/data_view_editor/public/types.ts  |   3 +
 .../__snapshots__/utils.test.ts.snap          |   4 +-
 .../edit_index_pattern/edit_index_pattern.tsx |  66 +++++++---
 .../index_header/index_header.tsx             | 115 +++++++++++++----
 .../index_pattern_table.tsx                   |  17 ++-
 .../public/components/types.ts                |   1 +
 .../public/components/utils.test.ts           |   2 +
 .../public/components/utils.ts                |   5 +-
 .../data_views/common/data_view.stub.ts       |   2 +
 .../__snapshots__/data_view.test.ts.snap      |   2 +
 .../__snapshots__/data_views.test.ts.snap     |   2 +
 .../common/data_views/data_view.test.ts       |   4 +-
 .../data_views/common/data_views/data_view.ts |   8 ++
 .../common/data_views/data_views.test.ts      |   4 +-
 .../common/data_views/data_views.ts           |  20 ++-
 src/plugins/data_views/common/types.ts        |   4 +
 28 files changed, 457 insertions(+), 101 deletions(-)
 create mode 100644 src/plugins/data_view_editor/public/components/form_fields/readable_title_field.tsx

diff --git a/src/plugins/data_view_editor/README.md b/src/plugins/data_view_editor/README.md
index c40fe16b15d72..9d207ada12bba 100644
--- a/src/plugins/data_view_editor/README.md
+++ b/src/plugins/data_view_editor/README.md
@@ -1,6 +1,6 @@
 # Data view editor
 
-Create data views from within Kibana apps. 
+Create data views from within Kibana apps.
 
 ## How to use
 
@@ -10,11 +10,11 @@ You will then receive in the start contract of the dataViewEditor plugin the fol
 
 ### `userPermissions.editDataView(): boolean`
 
-Convenience method that uses the `core.application.capabilities` api to determine whether the user can create or edit the data view. 
+Convenience method that uses the `core.application.capabilities` api to determine whether the user can create or edit the data view.
 
 ### `openEditor(options: DataViewEditorProps): CloseEditor`
 
-Use this method to display the data view editor to create an index pattern.  
+Use this method to display the data view editor to create an index pattern.
 
 #### `options`
 
@@ -34,6 +34,10 @@ The default index pattern type can be optionally specified as `rollup`.
 
 The editor can require a timestamp field on the index pattern.
 
+`editData: DataView` (optional)
+
+Data View object passed to edit an existing Data View.
+
 ### IndexPatternEditorComponent
 
 This the React component interface equivalent to `openEditor`. It takes the same arguments -
@@ -44,5 +48,6 @@ This the React component interface equivalent to `openEditor`. It takes the same
   onCancel={...}
   defaultTypeIsRollup={false}
   requireTimestampField={false}
+  editData={...}
 />
 ```
diff --git a/src/plugins/data_view_editor/public/components/data_view_editor.tsx b/src/plugins/data_view_editor/public/components/data_view_editor.tsx
index 18af3c4ebd6d5..f984b8451b061 100644
--- a/src/plugins/data_view_editor/public/components/data_view_editor.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_editor.tsx
@@ -23,6 +23,7 @@ export const DataViewEditor = ({
   services,
   defaultTypeIsRollup = false,
   requireTimestampField = false,
+  editData,
 }: DataViewEditorPropsWithServices) => {
   const { Provider: KibanaReactContextProvider } =
     createKibanaReactContext<DataViewEditorContext>(services);
@@ -35,6 +36,7 @@ export const DataViewEditor = ({
           onCancel={onCancel}
           defaultTypeIsRollup={defaultTypeIsRollup}
           requireTimestampField={requireTimestampField}
+          editData={editData}
         />
       </EuiFlyout>
     </KibanaReactContextProvider>
diff --git a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
index 3c62d6f5eb8c4..1ea3d1ddac0cc 100644
--- a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
@@ -13,6 +13,7 @@ import memoizeOne from 'memoize-one';
 import { DataViewField } from '../../../data_views/public';
 
 import {
+  DataView,
   IndexPatternSpec,
   Form,
   useForm,
@@ -39,6 +40,7 @@ import {
   TimestampField,
   TypeField,
   TitleField,
+  ReadableTitleField,
   schema,
   Footer,
   AdvancedParamsContent,
@@ -58,25 +60,45 @@ export interface Props {
   onCancel: () => void;
   defaultTypeIsRollup?: boolean;
   requireTimestampField?: boolean;
+  editData?: DataView;
 }
 
 const editorTitle = i18n.translate('indexPatternEditor.title', {
   defaultMessage: 'Create data view',
 });
 
+const editorTitleEditMode = i18n.translate('indexPatternEditor.titleEditMode', {
+  defaultMessage: 'Edit data view',
+});
+
 const IndexPatternEditorFlyoutContentComponent = ({
   onSave,
   onCancel,
   defaultTypeIsRollup,
   requireTimestampField = false,
+  editData,
 }: Props) => {
   const {
     services: { http, dataViews, uiSettings, searchClient },
   } = useKibana<DataViewEditorContext>();
 
   const { form } = useForm<IndexPatternConfig, FormInternal>({
+    // Prefill with data if editData exists
     defaultValue: {
       type: defaultTypeIsRollup ? INDEX_PATTERN_TYPE.ROLLUP : INDEX_PATTERN_TYPE.DEFAULT,
+      ...(editData
+        ? {
+            title: editData.title,
+            id: editData.id,
+            readableTitle: editData.readableTitle,
+            readableTitleDescription: editData.readableTitleDescription,
+            ...(editData.timeFieldName
+              ? {
+                  timestampField: { label: editData.timeFieldName, value: editData.timeFieldName },
+                }
+              : {}),
+          }
+        : {}),
     },
     schema,
     onSubmit: async (formData, isValid) => {
@@ -88,6 +110,8 @@ const IndexPatternEditorFlyoutContentComponent = ({
         title: formData.title,
         timeFieldName: formData.timestampField?.value,
         id: formData.id,
+        readableTitle: formData.readableTitle,
+        readableTitleDescription: formData.readableTitleDescription,
       };
 
       if (type === INDEX_PATTERN_TYPE.ROLLUP && rollupIndex) {
@@ -152,17 +176,19 @@ const IndexPatternEditorFlyoutContentComponent = ({
     });
   }, [http, allowHidden, searchClient]);
 
-  // loading list of index patterns
+  // loading list of data views
   useEffect(() => {
     loadSources();
     const getTitles = async () => {
       const indexPatternTitles = await dataViews.getTitles();
 
-      setExistingIndexPatterns(indexPatternTitles);
+      setExistingIndexPatterns(
+        editData ? indexPatternTitles.filter((v) => v !== editData.title) : indexPatternTitles
+      );
       setIsLoadingIndexPatterns(false);
     };
     getTitles();
-  }, [http, dataViews, loadSources]);
+  }, [http, dataViews, editData, loadSources]);
 
   // loading rollup info
   useEffect(() => {
@@ -220,11 +246,6 @@ const IndexPatternEditorFlyoutContentComponent = ({
     ]
   );
 
-  useEffect(() => {
-    loadTimestampFieldOptions(title);
-    getFields().timestampField?.setValue('');
-  }, [loadTimestampFieldOptions, title, getFields]);
-
   const reloadMatchedIndices = useCallback(
     async (newTitle: string) => {
       const isRollupIndex = (indexName: string) =>
@@ -274,9 +295,25 @@ const IndexPatternEditorFlyoutContentComponent = ({
     [http, allowHidden, allSources, type, rollupIndicesCapabilities, searchClient, isLoadingSources]
   );
 
+  // If editData exists, loadSources so that MatchedIndices can be loaded for the Timestampfields
+  useEffect(() => {
+    if (editData) loadSources();
+  }, [editData, loadSources]);
+
+  useEffect(() => {
+    if (editData) reloadMatchedIndices(editData.title);
+  }, [editData, allSources, reloadMatchedIndices]);
+
+  useEffect(() => {
+    loadTimestampFieldOptions(editData ? editData.title : title);
+    if (!editData) getFields().timestampField?.setValue('');
+  }, [loadTimestampFieldOptions, title, getFields, editData]);
+
   const onTypeChange = useCallback(
     (newType) => {
       form.setFieldValue('title', '');
+      form.setFieldValue('readableTitle', '');
+      form.setFieldValue('readableTitleDescription', '');
       form.setFieldValue('timestampField', '');
       if (newType === INDEX_PATTERN_TYPE.ROLLUP) {
         form.setFieldValue('allowHidden', false);
@@ -296,7 +333,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
 
   const indexPatternTypeSelect = showIndexPatternTypeSelect() ? (
     <>
-      <EuiSpacer size="m" />
+      <EuiSpacer size="l" />
       <EuiFlexGroup>
         <EuiFlexItem>
           <TypeField onChange={onTypeChange} />
@@ -321,11 +358,17 @@ const IndexPatternEditorFlyoutContentComponent = ({
       <FlyoutPanels.Group flyoutClassName={'indexPatternEditorFlyout'} maxWidth={1180}>
         <FlyoutPanels.Item className="fieldEditor__mainFlyoutPanel" border="right">
           <EuiTitle data-test-subj="flyoutTitle">
-            <h2>{editorTitle}</h2>
+            <h2>{editData ? editorTitleEditMode : editorTitle}</h2>
           </EuiTitle>
           <Form form={form} className="indexPatternEditor__form">
             {indexPatternTypeSelect}
-            <EuiSpacer size="m" />
+            <EuiSpacer size="l" />
+            <EuiFlexGroup>
+              <EuiFlexItem>
+                <ReadableTitleField editData={editData} />
+              </EuiFlexItem>
+            </EuiFlexGroup>
+            <EuiSpacer size="l" />
             <EuiFlexGroup>
               <EuiFlexItem>
                 <TitleField
@@ -337,7 +380,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
                 />
               </EuiFlexItem>
             </EuiFlexGroup>
-            <EuiSpacer size="m" />
+            <EuiSpacer size="l" />
             <EuiFlexGroup>
               <EuiFlexItem>
                 <TimestampField
@@ -355,6 +398,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
             onCancel={onCancel}
             onSubmit={() => form.submit()}
             submitDisabled={form.isSubmitted && !form.isValid}
+            isEdit={!!editData}
           />
         </FlyoutPanels.Item>
         <FlyoutPanels.Item>
diff --git a/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx b/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
index bf42582db8e3f..c86e9817b1891 100644
--- a/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
@@ -18,6 +18,7 @@ const IndexPatternFlyoutContentContainer = ({
   onCancel = () => {},
   defaultTypeIsRollup,
   requireTimestampField = false,
+  editData,
 }: DataViewEditorProps) => {
   const {
     services: { dataViews, notifications },
@@ -25,14 +26,31 @@ const IndexPatternFlyoutContentContainer = ({
 
   const onSaveClick = async (indexPatternSpec: IndexPatternSpec) => {
     try {
-      const indexPattern = await dataViews.createAndSave(indexPatternSpec);
+      let indexPattern;
+      if (editData) {
+        const {
+          readableTitle = '',
+          readableTitleDescription = '',
+          timeFieldName,
+          title = '',
+        } = indexPatternSpec;
+        editData.title = title;
+        editData.readableTitle = readableTitle;
+        editData.readableTitleDescription = readableTitleDescription;
+        editData.timeFieldName = timeFieldName;
+        indexPattern = await dataViews.updateSavedObject(editData);
+      } else {
+        indexPattern = await dataViews.createAndSave(indexPatternSpec);
+      }
 
-      const message = i18n.translate('indexPatternEditor.saved', {
-        defaultMessage: "Saved '{indexPatternTitle}'",
-        values: { indexPatternTitle: indexPattern.title },
-      });
-      notifications.toasts.addSuccess(message);
-      await onSave(indexPattern);
+      if (indexPattern && !(indexPattern instanceof Error)) {
+        const message = i18n.translate('indexPatternEditor.saved', {
+          defaultMessage: "Saved '{indexPatternTitle}'",
+          values: { indexPatternTitle: indexPattern.title },
+        });
+        notifications.toasts.addSuccess(message);
+        await onSave(indexPattern);
+      }
     } catch (e) {
       const title = i18n.translate('indexPatternEditor.dataView.unableSaveLabel', {
         defaultMessage: 'Failed to save data view.',
@@ -48,6 +66,7 @@ const IndexPatternFlyoutContentContainer = ({
       onCancel={onCancel}
       defaultTypeIsRollup={defaultTypeIsRollup}
       requireTimestampField={requireTimestampField}
+      editData={editData}
     />
   );
 };
diff --git a/src/plugins/data_view_editor/public/components/footer/footer.tsx b/src/plugins/data_view_editor/public/components/footer/footer.tsx
index 7c20ede540c09..dde04fd767323 100644
--- a/src/plugins/data_view_editor/public/components/footer/footer.tsx
+++ b/src/plugins/data_view_editor/public/components/footer/footer.tsx
@@ -21,6 +21,7 @@ interface FooterProps {
   onCancel: () => void;
   onSubmit: () => void;
   submitDisabled: boolean;
+  isEdit: boolean;
 }
 
 const closeButtonLabel = i18n.translate('indexPatternEditor.editor.flyoutCloseButtonLabel', {
@@ -31,7 +32,11 @@ const saveButtonLabel = i18n.translate('indexPatternEditor.editor.flyoutSaveButt
   defaultMessage: 'Create data view',
 });
 
-export const Footer = ({ onCancel, onSubmit, submitDisabled }: FooterProps) => {
+const editButtonLabel = i18n.translate('indexPatternEditor.editor.flyoutEditButtonLabel', {
+  defaultMessage: 'Edit data view',
+});
+
+export const Footer = ({ onCancel, onSubmit, submitDisabled, isEdit }: FooterProps) => {
   return (
     <EuiFlyoutFooter className="indexPatternEditor__footer">
       <EuiFlexGroup justifyContent="spaceBetween" alignItems="center">
@@ -54,7 +59,7 @@ export const Footer = ({ onCancel, onSubmit, submitDisabled }: FooterProps) => {
             fill
             disabled={submitDisabled}
           >
-            {saveButtonLabel}
+            {isEdit ? editButtonLabel : saveButtonLabel}
           </EuiButton>
         </EuiFlexItem>
       </EuiFlexGroup>
diff --git a/src/plugins/data_view_editor/public/components/form_fields/index.ts b/src/plugins/data_view_editor/public/components/form_fields/index.ts
index 0d2091c065771..98bd64fbf7be5 100644
--- a/src/plugins/data_view_editor/public/components/form_fields/index.ts
+++ b/src/plugins/data_view_editor/public/components/form_fields/index.ts
@@ -6,6 +6,7 @@
  * Side Public License, v 1.
  */
 
+export { ReadableTitleField } from './readable_title_field';
 export { TimestampField } from './timestamp_field';
 export { TypeField } from './type_field';
 export { TitleField } from './title_field';
diff --git a/src/plugins/data_view_editor/public/components/form_fields/readable_title_field.tsx b/src/plugins/data_view_editor/public/components/form_fields/readable_title_field.tsx
new file mode 100644
index 0000000000000..1fe5f8c832509
--- /dev/null
+++ b/src/plugins/data_view_editor/public/components/form_fields/readable_title_field.tsx
@@ -0,0 +1,120 @@
+/*
+ * 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 React, { ChangeEvent, useState } from 'react';
+import { i18n } from '@kbn/i18n';
+import { EuiFormRow, EuiFieldText, EuiLink, EuiText, EuiTextArea, EuiSpacer } from '@elastic/eui';
+import { DataView, UseField } from '../../shared_imports';
+import { IndexPatternConfig } from '../../types';
+
+interface ReadableTitleFieldProps {
+  editData?: DataView;
+}
+
+export const ReadableTitleField = ({ editData }: ReadableTitleFieldProps) => {
+  const [showDescription, setShowDescription] = useState<boolean>(
+    !!(editData && editData.readableTitleDescription)
+  );
+
+  return (
+    <>
+      <UseField<string, IndexPatternConfig>
+        path="readableTitle"
+        componentProps={{
+          euiFieldProps: {
+            'aria-label': i18n.translate('indexPatternEditor.form.readableTitleAriaLabel', {
+              defaultMessage: 'Title field optional',
+            }),
+          },
+        }}
+      >
+        {(field) => {
+          return (
+            <EuiFormRow
+              label={field.label}
+              labelAppend={
+                <EuiText size="xs" color="subdued">
+                  {i18n.translate('indexPatternEditor.form.optional', {
+                    defaultMessage: 'Optional',
+                  })}
+                </EuiText>
+              }
+              fullWidth
+            >
+              <EuiFieldText
+                value={field.value}
+                onChange={(e: ChangeEvent<HTMLInputElement>) => {
+                  field.setValue(e.target.value);
+                }}
+                fullWidth
+                data-test-subj="createIndexPatternReadableTitleInput"
+              />
+            </EuiFormRow>
+          );
+        }}
+      </UseField>
+      {showDescription ? (
+        <>
+          <EuiSpacer size="l" />
+          <UseField<string, IndexPatternConfig>
+            path="readableTitleDescription"
+            componentProps={{
+              euiFieldProps: {
+                'aria-label': i18n.translate(
+                  'indexPatternEditor.form.readableTitleDescriptionLabel',
+                  {
+                    defaultMessage: 'Title description field optional',
+                  }
+                ),
+              },
+            }}
+          >
+            {(field) => {
+              return (
+                <EuiFormRow
+                  label={field.label}
+                  labelAppend={
+                    <EuiText size="xs" color="subdued">
+                      {i18n.translate('indexPatternEditor.form.optional', {
+                        defaultMessage: 'Optional',
+                      })}
+                    </EuiText>
+                  }
+                  helpText={
+                    typeof field.helpText === 'function' ? field.helpText() : field.helpText
+                  }
+                  fullWidth
+                >
+                  <EuiTextArea
+                    value={field.value}
+                    onChange={(e: ChangeEvent<HTMLTextAreaElement>) => {
+                      field.setValue(e.target.value);
+                    }}
+                    fullWidth
+                    rows={2}
+                    data-test-subj="createIndexPatternReadableTitleDescriptionInput"
+                    maxLength={150}
+                  />
+                </EuiFormRow>
+              );
+            }}
+          </UseField>
+        </>
+      ) : (
+        <>
+          <EuiSpacer size="s" />
+          <EuiLink onClick={() => setShowDescription(true)}>
+            {i18n.translate('indexPatternEditor.form.addDescription', {
+              defaultMessage: 'Add description',
+            })}
+          </EuiLink>
+        </>
+      )}
+    </>
+  );
+};
diff --git a/src/plugins/data_view_editor/public/components/form_fields/title_field.tsx b/src/plugins/data_view_editor/public/components/form_fields/title_field.tsx
index f97ddd31770a0..c821f124cf1fb 100644
--- a/src/plugins/data_view_editor/public/components/form_fields/title_field.tsx
+++ b/src/plugins/data_view_editor/public/components/form_fields/title_field.tsx
@@ -62,7 +62,7 @@ const createTitlesNoDupesValidator = (
     if (namesNotAllowed.includes(value)) {
       return {
         message: i18n.translate('indexPatternEditor.dataViewExists.ValidationErrorMessage', {
-          defaultMessage: 'A data view with this title already exists.',
+          defaultMessage: 'A data view with this name already exists.',
         }),
       };
     }
@@ -92,7 +92,7 @@ const createMatchesIndicesValidator = ({
       return;
     }
 
-    // A rollup index pattern needs to match one and only one rollup index.
+    // A rollup data view needs to match one and only one rollup index.
     const rollupIndexMatches = matchedIndicesResult.exactMatchedIndices.filter((matchedIndex) =>
       rollupIndices.includes(matchedIndex.name)
     );
@@ -186,7 +186,7 @@ export const TitleField = ({
       componentProps={{
         euiFieldProps: {
           'aria-label': i18n.translate('indexPatternEditor.form.titleAriaLabel', {
-            defaultMessage: 'Title field',
+            defaultMessage: 'Data View field',
           }),
         },
       }}
diff --git a/src/plugins/data_view_editor/public/components/form_schema.ts b/src/plugins/data_view_editor/public/components/form_schema.ts
index a6df0c4206d2a..0ab03eaf500a0 100644
--- a/src/plugins/data_view_editor/public/components/form_schema.ts
+++ b/src/plugins/data_view_editor/public/components/form_schema.ts
@@ -13,23 +13,38 @@ import { INDEX_PATTERN_TYPE } from '../types';
 export const schema = {
   title: {
     label: i18n.translate('indexPatternEditor.editor.form.titleLabel', {
-      defaultMessage: 'Name',
+      defaultMessage: 'Data View',
     }),
     defaultValue: '',
     helpText: i18n.translate('indexPatternEditor.validations.titleHelpText', {
       defaultMessage:
-        'Enter an index pattern that matches one or more data sources. Use an asterisk (*) to match multiple characters. Spaces and the characters , /, ?, ", <, >, | are not allowed.',
+        'Enter a data view that matches one or more data sources. Use an asterisk (*) to match multiple characters. Spaces and the characters , /, ?, ", <, >, | are not allowed.',
     }),
     validations: [
       {
         validator: fieldValidators.emptyField(
           i18n.translate('indexPatternEditor.validations.titleIsRequiredErrorMessage', {
-            defaultMessage: 'A name is required.',
+            defaultMessage: 'A Data View is required.',
           })
         ),
       },
     ],
   },
+  readableTitle: {
+    label: i18n.translate('indexPatternEditor.editor.form.readableTitleLabel', {
+      defaultMessage: 'Title',
+    }),
+    defaultValue: '',
+  },
+  readableTitleDescription: {
+    label: i18n.translate('indexPatternEditor.editor.form.readableTitleDescriptionLabel', {
+      defaultMessage: 'Description',
+    }),
+    defaultValue: '',
+    helpText: i18n.translate('indexPatternEditor.validations.readableTitleDescriptionHelpText', {
+      defaultMessage: '150 characters max',
+    }),
+  },
   timestampField: {
     label: i18n.translate('indexPatternEditor.editor.form.timeFieldLabel', {
       defaultMessage: 'Timestamp field',
diff --git a/src/plugins/data_view_editor/public/components/index.ts b/src/plugins/data_view_editor/public/components/index.ts
index 0486b6d72215c..982914015bab6 100644
--- a/src/plugins/data_view_editor/public/components/index.ts
+++ b/src/plugins/data_view_editor/public/components/index.ts
@@ -12,7 +12,7 @@ export { IndexPatternEditorFlyoutContent } from './data_view_editor_flyout_conte
 export { DataViewEditor } from './data_view_editor';
 
 export { schema } from './form_schema';
-export { TimestampField, TypeField, TitleField } from './form_fields';
+export { ReadableTitleField, TimestampField, TypeField, TitleField } from './form_fields';
 export { EmptyPrompts } from './empty_prompts';
 export { PreviewPanel } from './preview_panel';
 export { LoadingIndices } from './loading_indices';
diff --git a/src/plugins/data_view_editor/public/components/preview_panel/status_message/__snapshots__/status_message.test.tsx.snap b/src/plugins/data_view_editor/public/components/preview_panel/status_message/__snapshots__/status_message.test.tsx.snap
index 4fd36e61c3f7d..47f660716b3de 100644
--- a/src/plugins/data_view_editor/public/components/preview_panel/status_message/__snapshots__/status_message.test.tsx.snap
+++ b/src/plugins/data_view_editor/public/components/preview_panel/status_message/__snapshots__/status_message.test.tsx.snap
@@ -10,7 +10,7 @@ exports[`StatusMessage should render with exact matches 1`] = `
     <span>
        
       <FormattedMessage
-        defaultMessage="Your index pattern matches {sourceCount} {sourceCount, plural, one {source} other {sources} }."
+        defaultMessage="Your data view matches {sourceCount} {sourceCount, plural, one {source} other {sources} }."
         id="indexPatternEditor.status.successLabel.successDetail"
         values={
           Object {
@@ -31,7 +31,7 @@ exports[`StatusMessage should render with no partial matches 1`] = `
   title={
     <span>
       <FormattedMessage
-        defaultMessage="The index pattern you entered doesn't match any data streams, indices, or index aliases. You can match {strongIndices}."
+        defaultMessage="The data view you entered doesn't match any data streams, indices, or index aliases. You can match {strongIndices}."
         id="indexPatternEditor.status.notMatchLabel.notMatchDetail"
         values={
           Object {
@@ -62,7 +62,7 @@ exports[`StatusMessage should render with partial matches 1`] = `
   title={
     <span>
       <FormattedMessage
-        defaultMessage="Your index pattern doesn't match any data streams, indices, or index aliases, but {strongIndices} {matchedIndicesLength, plural, one {is} other {are} } similar."
+        defaultMessage="Your data view doesn't match any data streams, indices, or index aliases, but {strongIndices} {matchedIndicesLength, plural, one {is} other {are} } similar."
         id="indexPatternEditor.status.partialMatchLabel.partialMatchDetail"
         values={
           Object {
@@ -94,7 +94,7 @@ exports[`StatusMessage should render without a query 1`] = `
   title={
     <span>
       <FormattedMessage
-        defaultMessage="Your index pattern can match {sourceCount, plural, one {# source} other {# sources} }."
+        defaultMessage="Your data view can match {sourceCount, plural, one {# source} other {# sources} }."
         id="indexPatternEditor.status.matchAnyLabel.matchAnyDetail"
         values={
           Object {
@@ -115,7 +115,7 @@ exports[`StatusMessage should show that no indices exist 1`] = `
   title={
     <span>
       <FormattedMessage
-        defaultMessage="No data streams, indices, or index aliases match your index pattern."
+        defaultMessage="No data streams, indices, or index aliases match your data view."
         id="indexPatternEditor.status.noSystemIndicesLabel"
         values={Object {}}
       />
@@ -132,7 +132,7 @@ exports[`StatusMessage should show that system indices exist 1`] = `
   title={
     <span>
       <FormattedMessage
-        defaultMessage="No data streams, indices, or index aliases match your index pattern."
+        defaultMessage="No data streams, indices, or index aliases match your data view."
         id="indexPatternEditor.status.noSystemIndicesLabel"
         values={Object {}}
       />
diff --git a/src/plugins/data_view_editor/public/components/preview_panel/status_message/status_message.tsx b/src/plugins/data_view_editor/public/components/preview_panel/status_message/status_message.tsx
index 139586324ec21..d88b20e788e42 100644
--- a/src/plugins/data_view_editor/public/components/preview_panel/status_message/status_message.tsx
+++ b/src/plugins/data_view_editor/public/components/preview_panel/status_message/status_message.tsx
@@ -25,7 +25,7 @@ const NoMatchStatusMessage = (allIndicesLength: number) => (
   <span>
     <FormattedMessage
       id="indexPatternEditor.status.notMatchLabel.notMatchDetail"
-      defaultMessage="The index pattern you entered doesn't match any data streams, indices, or index aliases.
+      defaultMessage="The data view you entered doesn't match any data streams, indices, or index aliases.
   You can match {strongIndices}."
       values={{
         strongIndices: (
@@ -49,7 +49,7 @@ const NoMatchNoIndicesStatusMessage = () => (
   <span>
     <FormattedMessage
       id="indexPatternEditor.status.notMatchLabel.notMatchNoIndicesDetail"
-      defaultMessage="The index pattern you entered doesn't match any data streams, indices, or index aliases."
+      defaultMessage="The data view you entered doesn't match any data streams, indices, or index aliases."
     />
   </span>
 );
@@ -75,7 +75,7 @@ export const StatusMessage: React.FC<StatusMessageProps> = ({
         <span>
           <FormattedMessage
             id="indexPatternEditor.status.matchAnyLabel.matchAnyDetail"
-            defaultMessage="Your index pattern can match {sourceCount, plural,
+            defaultMessage="Your data view can match {sourceCount, plural,
               one {# source}
               other {# sources}
             }."
@@ -88,7 +88,7 @@ export const StatusMessage: React.FC<StatusMessageProps> = ({
         <span>
           <FormattedMessage
             id="indexPatternEditor.status.noSystemIndicesWithPromptLabel"
-            defaultMessage="No data streams, indices, or index aliases match your index pattern."
+            defaultMessage="No data streams, indices, or index aliases match your data view."
           />
         </span>
       );
@@ -97,7 +97,7 @@ export const StatusMessage: React.FC<StatusMessageProps> = ({
         <span>
           <FormattedMessage
             id="indexPatternEditor.status.noSystemIndicesLabel"
-            defaultMessage="No data streams, indices, or index aliases match your index pattern."
+            defaultMessage="No data streams, indices, or index aliases match your data view."
           />
         </span>
       );
@@ -110,7 +110,7 @@ export const StatusMessage: React.FC<StatusMessageProps> = ({
         &nbsp;
         <FormattedMessage
           id="indexPatternEditor.status.successLabel.successDetail"
-          defaultMessage="Your index pattern matches {sourceCount} {sourceCount, plural,
+          defaultMessage="Your data view matches {sourceCount} {sourceCount, plural,
             one {source}
             other {sources}
           }."
@@ -127,7 +127,7 @@ export const StatusMessage: React.FC<StatusMessageProps> = ({
       <span>
         <FormattedMessage
           id="indexPatternEditor.status.partialMatchLabel.partialMatchDetail"
-          defaultMessage="Your index pattern doesn't match any data streams, indices, or index aliases, but {strongIndices}
+          defaultMessage="Your data view doesn't match any data streams, indices, or index aliases, but {strongIndices}
           {matchedIndicesLength, plural,
             one {is}
             other {are}
diff --git a/src/plugins/data_view_editor/public/types.ts b/src/plugins/data_view_editor/public/types.ts
index cfeee1df979d8..cd92bb076697d 100644
--- a/src/plugins/data_view_editor/public/types.ts
+++ b/src/plugins/data_view_editor/public/types.ts
@@ -49,6 +49,7 @@ export interface DataViewEditorProps {
    * Sets whether a timestamp field is required to create an index pattern. Defaults to false.
    */
   requireTimestampField?: boolean;
+  editData?: DataView;
 }
 
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
@@ -167,6 +168,8 @@ export interface IndexPatternConfig {
   allowHidden: boolean;
   id?: string;
   type: INDEX_PATTERN_TYPE;
+  readableTitle?: string;
+  readableTitleDescription?: string;
 }
 
 export interface FormInternal extends Omit<IndexPatternConfig, 'timestampField'> {
diff --git a/src/plugins/data_view_management/public/components/__snapshots__/utils.test.ts.snap b/src/plugins/data_view_management/public/components/__snapshots__/utils.test.ts.snap
index 3a25a78472b50..7e97c1c087035 100644
--- a/src/plugins/data_view_management/public/components/__snapshots__/utils.test.ts.snap
+++ b/src/plugins/data_view_management/public/components/__snapshots__/utils.test.ts.snap
@@ -5,6 +5,7 @@ Array [
   Object {
     "default": true,
     "id": "test",
+    "info": undefined,
     "sort": "0test name",
     "tags": Array [
       Object {
@@ -17,9 +18,10 @@ Array [
   Object {
     "default": false,
     "id": "test1",
+    "info": "test name 1 description",
     "sort": "1test name 1",
     "tags": Array [],
-    "title": "test name 1",
+    "title": "Test Name 1",
   },
 ]
 `;
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
index 6b0d7912ce598..15f9be4b9ad35 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
@@ -8,10 +8,11 @@
 
 import { filter } from 'lodash';
 import React, { useEffect, useState, useCallback } from 'react';
-import { withRouter, RouteComponentProps } from 'react-router-dom';
+import { withRouter, RouteComponentProps, useLocation } from 'react-router-dom';
 import {
   EuiFlexGroup,
   EuiFlexItem,
+  EuiHorizontalRule,
   EuiSpacer,
   EuiBadge,
   EuiText,
@@ -65,7 +66,7 @@ const securitySolution = 'security-solution';
 
 export const EditIndexPattern = withRouter(
   ({ indexPattern, history, location }: EditIndexPatternProps) => {
-    const { application, uiSettings, overlays, chrome, dataViews } =
+    const { application, uiSettings, overlays, chrome, dataViews, IndexPatternEditor } =
       useKibana<IndexPatternManagmentContext>().services;
     const [fields, setFields] = useState<DataViewField[]>(indexPattern.getNonScriptedFields());
     const [conflictedFields, setConflictedFields] = useState<DataViewField[]>(
@@ -73,6 +74,7 @@ export const EditIndexPattern = withRouter(
     );
     const [defaultIndex, setDefaultIndex] = useState<string>(uiSettings.get('defaultIndex'));
     const [tags, setTags] = useState<any[]>([]);
+    const [showEditDialog, setShowEditDialog] = useState<boolean>(false);
 
     useEffect(() => {
       setFields(indexPattern.getNonScriptedFields());
@@ -117,6 +119,23 @@ export const EditIndexPattern = withRouter(
       });
     };
 
+    const isRollup = new URLSearchParams(useLocation().search).get('type') === 'rollup';
+    const displayIndexPatternEditor = showEditDialog ? (
+      <IndexPatternEditor
+        onSave={(iPattern) => {
+          history.push(`patterns/${iPattern.id}`);
+        }}
+        onCancel={() => setShowEditDialog(false)}
+        defaultTypeIsRollup={isRollup}
+        editData={indexPattern}
+      />
+    ) : (
+      <></>
+    );
+    const editPattern = () => {
+      setShowEditDialog(true);
+    };
+
     const timeFilterHeader = i18n.translate(
       'indexPatternManagement.editIndexPattern.timeFilterHeader',
       {
@@ -150,27 +169,33 @@ export const EditIndexPattern = withRouter(
         <IndexHeader
           indexPattern={indexPattern}
           setDefault={setDefaultPattern}
-          {...(userEditPermission ? { deleteIndexPatternClick: removePattern } : {})}
+          {...(userEditPermission
+            ? { deleteIndexPatternClick: removePattern, editIndexPatternClick: editPattern }
+            : {})}
           defaultIndex={defaultIndex}
         >
+          <EuiHorizontalRule margin="none" />
           {showTagsSection && (
-            <EuiFlexGroup wrap gutterSize="s">
-              {Boolean(indexPattern.timeFieldName) && (
-                <EuiFlexItem grow={false}>
-                  <EuiBadge color="warning">{timeFilterHeader}</EuiBadge>
-                </EuiFlexItem>
-              )}
-              {indexPattern.id && indexPattern.id.indexOf(securitySolution) === 0 && (
-                <EuiFlexItem grow={false}>
-                  <EuiBadge>{securityDataView}</EuiBadge>
-                </EuiFlexItem>
-              )}
-              {tags.map((tag: any) => (
-                <EuiFlexItem grow={false} key={tag.key}>
-                  <EuiBadge color="hollow">{tag.name}</EuiBadge>
-                </EuiFlexItem>
-              ))}
-            </EuiFlexGroup>
+            <>
+              <EuiSpacer size="l" />
+              <EuiFlexGroup wrap gutterSize="s">
+                {Boolean(indexPattern.timeFieldName) && (
+                  <EuiFlexItem grow={false}>
+                    <EuiBadge color="warning">{timeFilterHeader}</EuiBadge>
+                  </EuiFlexItem>
+                )}
+                {indexPattern.id && indexPattern.id.indexOf(securitySolution) === 0 && (
+                  <EuiFlexItem grow={false}>
+                    <EuiBadge>{securityDataView}</EuiBadge>
+                  </EuiFlexItem>
+                )}
+                {tags.map((tag: any) => (
+                  <EuiFlexItem grow={false} key={tag.key}>
+                    <EuiBadge color="hollow">{tag.name}</EuiBadge>
+                  </EuiFlexItem>
+                ))}
+              </EuiFlexGroup>
+            </>
           )}
           <EuiSpacer size="m" />
           <EuiText>
@@ -209,6 +234,7 @@ export const EditIndexPattern = withRouter(
             setFields(indexPattern.getNonScriptedFields());
           }}
         />
+        {displayIndexPatternEditor}
       </div>
     );
   }
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
index b64aed5c0811c..6b935a7c2bfec 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
@@ -6,15 +6,16 @@
  * Side Public License, v 1.
  */
 
-import React from 'react';
+import React, { useState } from 'react';
 import { i18n } from '@kbn/i18n';
-import { EuiButtonIcon, EuiPageHeader, EuiToolTip } from '@elastic/eui';
+import { EuiButtonEmpty, EuiFlexGroup, EuiFlexItem, EuiPageHeader, EuiPopover } from '@elastic/eui';
 import { DataView } from 'src/plugins/data_views/public';
 
 interface IndexHeaderProps {
   indexPattern: DataView;
   defaultIndex?: string;
   setDefault?: () => void;
+  editIndexPatternClick?: () => void;
   deleteIndexPatternClick?: () => void;
 }
 
@@ -23,7 +24,15 @@ const setDefaultAriaLabel = i18n.translate('indexPatternManagement.editDataView.
 });
 
 const setDefaultTooltip = i18n.translate('indexPatternManagement.editDataView.setDefaultTooltip', {
-  defaultMessage: 'Set as default data view.',
+  defaultMessage: 'Set as default',
+});
+
+const editAriaLabel = i18n.translate('indexPatternManagement.editDataView.editAria', {
+  defaultMessage: 'Edit data view.',
+});
+
+const editTooltip = i18n.translate('indexPatternManagement.editDataView.editTooltip', {
+  defaultMessage: 'Edit',
 });
 
 const removeAriaLabel = i18n.translate('indexPatternManagement.editDataView.removeAria', {
@@ -31,42 +40,94 @@ const removeAriaLabel = i18n.translate('indexPatternManagement.editDataView.remo
 });
 
 const removeTooltip = i18n.translate('indexPatternManagement.editDataView.removeTooltip', {
-  defaultMessage: 'Delete data view.',
+  defaultMessage: 'Delete',
 });
 
 export const IndexHeader: React.FC<IndexHeaderProps> = ({
   defaultIndex,
   indexPattern,
   setDefault,
+  editIndexPatternClick,
   deleteIndexPatternClick,
   children,
 }) => {
+  const [openActions, setOpenActions] = useState<boolean>(false);
+
+  const title = indexPattern.readableTitle ? indexPattern.readableTitle : indexPattern.title;
+
   return (
     <EuiPageHeader
-      pageTitle={<span data-test-subj="indexPatternTitle">{indexPattern.title}</span>}
+      pageTitle={<span data-test-subj="indexPatternTitle">{title}</span>}
+      description={
+        indexPattern.readableTitleDescription ? indexPattern.readableTitleDescription : null
+      }
       rightSideItems={[
-        defaultIndex !== indexPattern.id && setDefault && (
-          <EuiToolTip content={setDefaultTooltip}>
-            <EuiButtonIcon
-              color="text"
-              onClick={setDefault}
-              iconType="starFilled"
-              aria-label={setDefaultAriaLabel}
-              data-test-subj="setDefaultIndexPatternButton"
-            />
-          </EuiToolTip>
-        ),
-        deleteIndexPatternClick && (
-          <EuiToolTip content={removeTooltip}>
-            <EuiButtonIcon
-              color="danger"
-              onClick={deleteIndexPatternClick}
-              iconType="trash"
-              aria-label={removeAriaLabel}
-              data-test-subj="deleteIndexPatternButton"
-            />
-          </EuiToolTip>
-        ),
+        <EuiPopover
+          button={
+            <EuiButtonEmpty
+              iconType="arrowDown"
+              iconSide="right"
+              onClick={() => setOpenActions(true)}
+            >
+              Actions
+            </EuiButtonEmpty>
+          }
+          isOpen={openActions}
+          closePopover={() => setOpenActions(false)}
+          anchorPosition="downRight"
+        >
+          <EuiFlexGroup
+            alignItems="flexStart"
+            direction="column"
+            onClick={() => setOpenActions(false)}
+          >
+            {defaultIndex !== indexPattern.id && setDefault && (
+              <EuiFlexItem>
+                <EuiButtonEmpty
+                  color="text"
+                  onClick={setDefault}
+                  iconSide="left"
+                  iconType="starFilled"
+                  aria-label={setDefaultAriaLabel}
+                  data-test-subj="setDefaultIndexPatternButton"
+                  size="s"
+                >
+                  {setDefaultTooltip}
+                </EuiButtonEmpty>
+              </EuiFlexItem>
+            )}
+            {editIndexPatternClick && (
+              <EuiFlexItem>
+                <EuiButtonEmpty
+                  color="text"
+                  onClick={editIndexPatternClick}
+                  iconSide="left"
+                  iconType="pencil"
+                  aria-label={editAriaLabel}
+                  data-test-subj="editIndexPatternButton"
+                  size="s"
+                >
+                  {editTooltip}
+                </EuiButtonEmpty>
+              </EuiFlexItem>
+            )}
+            {deleteIndexPatternClick && (
+              <EuiFlexItem>
+                <EuiButtonEmpty
+                  color="text"
+                  onClick={deleteIndexPatternClick}
+                  iconSide="left"
+                  iconType="trash"
+                  aria-label={removeAriaLabel}
+                  data-test-subj="deleteIndexPatternButton"
+                  size="s"
+                >
+                  {removeTooltip}
+                </EuiButtonEmpty>
+              </EuiFlexItem>
+            )}
+          </EuiFlexGroup>
+        </EuiPopover>,
       ].filter(Boolean)}
     >
       {children}
diff --git a/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx b/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
index 965fcdb6d8818..264bfe27bcdac 100644
--- a/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
+++ b/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
@@ -15,6 +15,7 @@ import {
   EuiSpacer,
   EuiFlexItem,
   EuiFlexGroup,
+  EuiIconTip,
 } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
 import { RouteComponentProps, withRouter, useLocation } from 'react-router-dom';
@@ -118,6 +119,7 @@ export const IndexPatternTable = ({
         name: string,
         index: {
           id: string;
+          info?: string;
           tags?: Array<{
             key: string;
             name: string;
@@ -128,7 +130,20 @@ export const IndexPatternTable = ({
           <EuiFlexGroup gutterSize="s" wrap>
             <EuiFlexItem grow={false} css={flexItemStyles}>
               <EuiButtonEmpty size="s" {...reactRouterNavigate(history, `patterns/${index.id}`)}>
-                {name}
+                <span>
+                  {name}
+                  {index.info ? (
+                    <>
+                      &nbsp;
+                      <EuiIconTip
+                        type="iInCircle"
+                        color="text"
+                        aria-label={index.info}
+                        content={index.info}
+                      />{' '}
+                    </>
+                  ) : null}
+                </span>
               </EuiButtonEmpty>
             </EuiFlexItem>
             {index.id && index.id.indexOf(securitySolution) === 0 && (
diff --git a/src/plugins/data_view_management/public/components/types.ts b/src/plugins/data_view_management/public/components/types.ts
index 3ead700732b91..36212c11c6a6a 100644
--- a/src/plugins/data_view_management/public/components/types.ts
+++ b/src/plugins/data_view_management/public/components/types.ts
@@ -15,6 +15,7 @@ export interface IndexPatternCreationOption {
 export interface IndexPatternTableItem {
   id: string;
   title: string;
+  info?: string;
   default: boolean;
   tag?: string[];
   sort: string;
diff --git a/src/plugins/data_view_management/public/components/utils.test.ts b/src/plugins/data_view_management/public/components/utils.test.ts
index cb318b79e223d..564be2a4ac3af 100644
--- a/src/plugins/data_view_management/public/components/utils.test.ts
+++ b/src/plugins/data_view_management/public/components/utils.test.ts
@@ -19,6 +19,8 @@ const indexPatternContractMock = {
       {
         id: 'test1',
         title: 'test name 1',
+        readableTitle: 'Test Name 1',
+        readableTitleDescription: 'test name 1 description',
       },
     ])
   ),
diff --git a/src/plugins/data_view_management/public/components/utils.ts b/src/plugins/data_view_management/public/components/utils.ts
index 3024c172ac441..e64526f5366e7 100644
--- a/src/plugins/data_view_management/public/components/utils.ts
+++ b/src/plugins/data_view_management/public/components/utils.ts
@@ -38,13 +38,14 @@ export async function getIndexPatterns(
 ) {
   const existingIndexPatterns = await indexPatternsService.getIdsWithTitle(true);
   const indexPatternsListItems = existingIndexPatterns.map((idxPattern) => {
-    const { id, title } = idxPattern;
+    const { id, title, readableTitle, readableTitleDescription } = idxPattern;
     const isDefault = defaultIndex === id;
     const tags = getTags(idxPattern, isDefault);
 
     return {
       id,
-      title,
+      title: readableTitle ? readableTitle : title,
+      info: readableTitleDescription,
       default: isDefault,
       tags,
       // the prepending of 0 at the default pattern takes care of prioritization
diff --git a/src/plugins/data_views/common/data_view.stub.ts b/src/plugins/data_views/common/data_view.stub.ts
index 2eb6d4f5d7813..be403eed70eda 100644
--- a/src/plugins/data_views/common/data_view.stub.ts
+++ b/src/plugins/data_views/common/data_view.stub.ts
@@ -57,6 +57,8 @@ export function stubbedSavedObjectDataView(
       timeFieldName: 'time',
       fields: JSON.stringify(stubLogstashFieldSpecMap),
       title: 'title',
+      readableTitle: 'Title',
+      readableTitleDescription: 'Title Description',
     },
     version: '2',
     references: [],
diff --git a/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap b/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
index 731b5ba6e260c..c1ffb86f73767 100644
--- a/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
+++ b/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
@@ -775,6 +775,8 @@ Object {
     },
   },
   "id": "test-pattern",
+  "readableTitle": "Title",
+  "readableTitleDescription": "Title Description",
   "runtimeFieldMap": Object {
     "runtime_field": Object {
       "script": Object {
diff --git a/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap b/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
index 50bc27b15922a..0395ca5f55c15 100644
--- a/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
+++ b/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
@@ -40,6 +40,8 @@ Object {
   },
   "fields": Object {},
   "id": "id",
+  "readableTitle": "Kibana *",
+  "readableTitleDescription": "Kibana * Description",
   "runtimeFieldMap": Object {
     "aRuntimeField": Object {
       "script": Object {
diff --git a/src/plugins/data_views/common/data_views/data_view.test.ts b/src/plugins/data_views/common/data_views/data_view.test.ts
index 40a3a06c869ab..2bb5ade3587fd 100644
--- a/src/plugins/data_views/common/data_views/data_view.test.ts
+++ b/src/plugins/data_views/common/data_views/data_view.test.ts
@@ -46,7 +46,7 @@ function create(id: string) {
   const {
     type,
     version,
-    attributes: { timeFieldName, fields, title },
+    attributes: { timeFieldName, fields, title, readableTitle, readableTitleDescription },
   } = stubbedSavedObjectIndexPattern(id);
 
   return new IndexPattern({
@@ -57,6 +57,8 @@ function create(id: string) {
       timeFieldName,
       fields: { ...JSON.parse(fields), runtime_field: runtimeField },
       title,
+      readableTitle,
+      readableTitleDescription,
       runtimeFieldMap,
     },
     fieldFormats: fieldFormatsMock,
diff --git a/src/plugins/data_views/common/data_views/data_view.ts b/src/plugins/data_views/common/data_views/data_view.ts
index 67a127407f94a..7bb4ff4692039 100644
--- a/src/plugins/data_views/common/data_views/data_view.ts
+++ b/src/plugins/data_views/common/data_views/data_view.ts
@@ -85,6 +85,8 @@ export class DataView implements IIndexPattern {
    * prevents errors when index pattern exists before indices
    */
   public readonly allowNoIndex: boolean = false;
+  public readableTitle: string = '';
+  public readableTitleDescription: string = '';
 
   constructor({ spec = {}, fieldFormats, shortDotsEnable = false, metaFields = [] }: DataViewDeps) {
     // set dependencies
@@ -112,6 +114,8 @@ export class DataView implements IIndexPattern {
     this.fieldAttrs = spec.fieldAttrs || {};
     this.allowNoIndex = spec.allowNoIndex || false;
     this.runtimeFieldMap = spec.runtimeFieldMap || {};
+    this.readableTitle = spec.readableTitle || '';
+    this.readableTitleDescription = spec.readableTitleDescription || '';
   }
 
   /**
@@ -210,6 +214,8 @@ export class DataView implements IIndexPattern {
       runtimeFieldMap: this.runtimeFieldMap,
       fieldAttrs: this.fieldAttrs,
       allowNoIndex: this.allowNoIndex,
+      readableTitle: this.readableTitle,
+      readableTitleDescription: this.readableTitleDescription,
     };
   }
 
@@ -295,6 +301,8 @@ export class DataView implements IIndexPattern {
       typeMeta: JSON.stringify(this.typeMeta ?? {}),
       allowNoIndex: this.allowNoIndex ? this.allowNoIndex : undefined,
       runtimeFieldMap: runtimeFieldMap ? JSON.stringify(runtimeFieldMap) : undefined,
+      readableTitle: this.readableTitle,
+      readableTitleDescription: this.readableTitleDescription,
     };
   }
 
diff --git a/src/plugins/data_views/common/data_views/data_views.test.ts b/src/plugins/data_views/common/data_views/data_views.test.ts
index 7f566464add2f..d34cc23c51a36 100644
--- a/src/plugins/data_views/common/data_views/data_views.test.ts
+++ b/src/plugins/data_views/common/data_views/data_views.test.ts
@@ -33,6 +33,8 @@ const savedObject = {
   version: 'version',
   attributes: {
     title: 'kibana-*',
+    readableTitle: 'Kibana *',
+    readableTitleDescription: 'Kibana * Description',
     timeFieldName: '@timestamp',
     fields: '[]',
     sourceFilters: '[{"value":"item1"},{"value":"item2"}]',
@@ -159,7 +161,7 @@ describe('IndexPatterns', () => {
     expect(await indexPatterns.getIds()).toEqual(['id']);
     expect(savedObjectsClient.find).toHaveBeenCalledWith({
       type: 'index-pattern',
-      fields: ['title', 'type', 'typeMeta'],
+      fields: ['title', 'type', 'typeMeta', 'readableTitle', 'readableTitleDescription'],
       perPage: 10000,
     });
   });
diff --git a/src/plugins/data_views/common/data_views/data_views.ts b/src/plugins/data_views/common/data_views/data_views.ts
index 26e1683b60006..30def6cc809f8 100644
--- a/src/plugins/data_views/common/data_views/data_views.ts
+++ b/src/plugins/data_views/common/data_views/data_views.ts
@@ -39,11 +39,14 @@ import { DuplicateDataViewError, DataViewInsufficientAccessError } from '../erro
 
 const MAX_ATTEMPTS_TO_RESOLVE_CONFLICTS = 3;
 
-export type IndexPatternSavedObjectAttrs = Pick<DataViewAttributes, 'title' | 'type' | 'typeMeta'>;
+export type IndexPatternSavedObjectAttrs = Pick<
+  DataViewAttributes,
+  'title' | 'type' | 'typeMeta' | 'readableTitle' | 'readableTitleDescription'
+>;
 
 export type IndexPatternListSavedObjectAttrs = Pick<
   DataViewAttributes,
-  'title' | 'type' | 'typeMeta'
+  'title' | 'type' | 'typeMeta' | 'readableTitle' | 'readableTitleDescription'
 >;
 
 export interface DataViewListItem {
@@ -51,6 +54,8 @@ export interface DataViewListItem {
   title: string;
   type?: string;
   typeMeta?: TypeMeta;
+  readableTitle?: string;
+  readableTitleDescription?: string;
 }
 
 /**
@@ -115,7 +120,7 @@ export class DataViewsService {
   private async refreshSavedObjectsCache() {
     const so = await this.savedObjectsClient.find<IndexPatternSavedObjectAttrs>({
       type: DATA_VIEW_SAVED_OBJECT_TYPE,
-      fields: ['title', 'type', 'typeMeta'],
+      fields: ['title', 'type', 'typeMeta', 'readableTitle', 'readableTitleDescription'],
       perPage: 10000,
     });
     this.savedObjectsCache = so;
@@ -185,6 +190,8 @@ export class DataViewsService {
       title: obj?.attributes?.title,
       type: obj?.attributes?.type,
       typeMeta: obj?.attributes?.typeMeta && JSON.parse(obj?.attributes?.typeMeta),
+      readableTitle: obj?.attributes?.readableTitle,
+      readableTitleDescription: obj?.attributes?.readableTitleDescription,
     }));
   };
 
@@ -391,6 +398,8 @@ export class DataViewsService {
         type,
         fieldAttrs,
         allowNoIndex,
+        readableTitle,
+        readableTitleDescription,
       },
     } = savedObject;
 
@@ -416,6 +425,8 @@ export class DataViewsService {
       fieldAttrs: parsedFieldAttrs,
       allowNoIndex,
       runtimeFieldMap: parsedRuntimeFieldMap,
+      readableTitle,
+      readableTitleDescription,
     };
   };
 
@@ -599,7 +610,7 @@ export class DataViewsService {
     indexPattern: DataView,
     saveAttempts: number = 0,
     ignoreErrors: boolean = false
-  ): Promise<void | Error> {
+  ): Promise<DataView | void | Error> {
     if (!indexPattern.id) return;
     if (!(await this.getCanSave())) {
       throw new DataViewInsufficientAccessError(indexPattern.id);
@@ -624,6 +635,7 @@ export class DataViewsService {
       .then((resp) => {
         indexPattern.id = resp.id;
         indexPattern.version = resp.version;
+        return indexPattern;
       })
       .catch(async (err) => {
         if (err?.res?.status === 409 && saveAttempts++ < MAX_ATTEMPTS_TO_RESOLVE_CONFLICTS) {
diff --git a/src/plugins/data_views/common/types.ts b/src/plugins/data_views/common/types.ts
index db0e19cca32b4..dbbe9538b1322 100644
--- a/src/plugins/data_views/common/types.ts
+++ b/src/plugins/data_views/common/types.ts
@@ -67,6 +67,8 @@ export interface DataViewAttributes {
    * prevents errors when index pattern exists before indices
    */
   allowNoIndex?: boolean;
+  readableTitle?: string;
+  readableTitleDescription?: string;
 }
 
 /**
@@ -257,6 +259,8 @@ export interface DataViewSpec {
   runtimeFieldMap?: Record<string, RuntimeField>;
   fieldAttrs?: FieldAttrs;
   allowNoIndex?: boolean;
+  readableTitle?: string;
+  readableTitleDescription?: string;
 }
 
 /**

From 1aaaccf46730d8823f96f90f5c710f94182c09a7 Mon Sep 17 00:00:00 2001
From: shivindera <shivindera@gmail.com>
Date: Tue, 1 Feb 2022 00:38:53 +0100
Subject: [PATCH 02/35] add readable data view title to discover

---
 .../discover_index_pattern_management.test.tsx.snap |  2 ++
 .../main/components/sidebar/change_indexpattern.tsx |  4 ++--
 .../components/sidebar/discover_index_pattern.tsx   | 13 +++++++++----
 .../application/main/components/sidebar/types.ts    |  1 +
 4 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap b/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
index 94aa55ff23853..d12165496205f 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
+++ b/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
@@ -654,6 +654,8 @@ exports[`Discover DataView Management renders correctly 1`] = `
           "_source",
         ],
         "originalSavedObjectBody": Object {},
+        "readableTitle": "",
+        "readableTitleDescription": "",
         "resetOriginalSavedObjectBody": [Function],
         "runtimeFieldMap": Object {},
         "setFieldFormat": [Function],
diff --git a/src/plugins/discover/public/application/main/components/sidebar/change_indexpattern.tsx b/src/plugins/discover/public/application/main/components/sidebar/change_indexpattern.tsx
index ceee905cff6fa..1e2b5b8a32ec2 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/change_indexpattern.tsx
+++ b/src/plugins/discover/public/application/main/components/sidebar/change_indexpattern.tsx
@@ -76,8 +76,8 @@ export function ChangeIndexPattern({
           {...selectableProps}
           searchable
           singleSelection="always"
-          options={indexPatternRefs.map(({ title, id }) => ({
-            label: title,
+          options={indexPatternRefs.map(({ title, id, readableTitle }) => ({
+            label: readableTitle ? readableTitle : title,
             key: id,
             value: id,
             checked: id === indexPatternId ? 'on' : undefined,
diff --git a/src/plugins/discover/public/application/main/components/sidebar/discover_index_pattern.tsx b/src/plugins/discover/public/application/main/components/sidebar/discover_index_pattern.tsx
index 6965f3af374ca..1182710682f80 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/discover_index_pattern.tsx
+++ b/src/plugins/discover/public/application/main/components/sidebar/discover_index_pattern.tsx
@@ -38,16 +38,21 @@ export function DiscoverIndexPattern({
   const options: IndexPatternRef[] = (indexPatternList || []).map((entity) => ({
     id: entity.id,
     title: entity.attributes!.title,
+    readableTitle: entity.attributes?.readableTitle,
   }));
-  const { id: selectedId, title: selectedTitle } = selectedIndexPattern || {};
+  const {
+    id: selectedId,
+    title: selectedTitle,
+    readableTitle: selectedReadableTitle,
+  } = selectedIndexPattern || {};
 
   const [selected, setSelected] = useState({
     id: selectedId,
-    title: selectedTitle || '',
+    title: selectedReadableTitle ? selectedReadableTitle : selectedTitle || '',
   });
   useEffect(() => {
-    const { id, title } = selectedIndexPattern;
-    setSelected({ id, title });
+    const { id, title, readableTitle } = selectedIndexPattern;
+    setSelected({ id, title: readableTitle ? readableTitle : title });
   }, [selectedIndexPattern]);
   if (!selectedId) {
     return null;
diff --git a/src/plugins/discover/public/application/main/components/sidebar/types.ts b/src/plugins/discover/public/application/main/components/sidebar/types.ts
index c0db99953e2c8..f35402ccdf80e 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/types.ts
+++ b/src/plugins/discover/public/application/main/components/sidebar/types.ts
@@ -9,6 +9,7 @@
 export interface IndexPatternRef {
   id: string;
   title: string;
+  readableTitle?: string;
 }
 
 export interface FieldDetails {

From 7f9a0fefa136b47835f7e3db0e369347039c9e98 Mon Sep 17 00:00:00 2001
From: shivindera <shivindera@gmail.com>
Date: Thu, 10 Feb 2022 19:53:55 +0100
Subject: [PATCH 03/35] fix for failing API test

---
 .../data_views/server/rest_api_routes/create_data_view.ts       | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/plugins/data_views/server/rest_api_routes/create_data_view.ts b/src/plugins/data_views/server/rest_api_routes/create_data_view.ts
index 4b103ba87662c..320b3df5e354c 100644
--- a/src/plugins/data_views/server/rest_api_routes/create_data_view.ts
+++ b/src/plugins/data_views/server/rest_api_routes/create_data_view.ts
@@ -72,6 +72,8 @@ const dataViewSpecSchema = schema.object({
   ),
   allowNoIndex: schema.maybe(schema.boolean()),
   runtimeFieldMap: schema.maybe(schema.recordOf(schema.string(), runtimeFieldSpecSchema)),
+  readableTitle: schema.maybe(schema.string()),
+  readableTitleDescription: schema.maybe(schema.string()),
 });
 
 const registerCreateDataViewRouteFactory =

From 56e357885704d080dae9cf5deb8d18ba699132f9 Mon Sep 17 00:00:00 2001
From: shivindera <shivindera@gmail.com>
Date: Tue, 22 Feb 2022 18:15:53 +0100
Subject: [PATCH 04/35] fix and add functional tests

---
 .../data_view_editor_flyout_content.tsx       |  6 +-
 .../data_view_flyout_content_container.tsx    |  4 +-
 .../form_fields/readable_title_field.tsx      | 20 ++---
 .../public/components/form_schema.ts          |  6 +-
 src/plugins/data_view_editor/public/types.ts  |  2 +-
 .../index_header/index_header.tsx             | 10 ++-
 .../public/components/utils.test.ts           |  2 +-
 .../public/components/utils.ts                |  4 +-
 .../data_views/common/data_view.stub.ts       |  2 +-
 .../__snapshots__/data_view.test.ts.snap      |  2 +-
 .../__snapshots__/data_views.test.ts.snap     |  2 +-
 .../common/data_views/data_view.test.ts       |  4 +-
 .../data_views/common/data_views/data_view.ts |  8 +-
 .../common/data_views/data_views.test.ts      |  4 +-
 .../common/data_views/data_views.ts           | 14 ++--
 src/plugins/data_views/common/types.ts        |  4 +-
 .../rest_api_routes/create_data_view.ts       |  2 +-
 ...ver_index_pattern_management.test.tsx.snap |  2 +-
 .../_index_pattern_create_delete.js           | 22 +++++-
 test/functional/page_objects/settings_page.ts | 74 ++++++++++++++++++-
 20 files changed, 147 insertions(+), 47 deletions(-)

diff --git a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
index 6d36c94d783ad..605408218f657 100644
--- a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
@@ -91,7 +91,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
             title: editData.title,
             id: editData.id,
             readableTitle: editData.readableTitle,
-            readableTitleDescription: editData.readableTitleDescription,
+            readableDescription: editData.readableDescription,
             ...(editData.timeFieldName
               ? {
                   timestampField: { label: editData.timeFieldName, value: editData.timeFieldName },
@@ -111,7 +111,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
         timeFieldName: formData.timestampField?.value,
         id: formData.id,
         readableTitle: formData.readableTitle,
-        readableTitleDescription: formData.readableTitleDescription,
+        readableDescription: formData.readableDescription,
       };
 
       if (type === INDEX_PATTERN_TYPE.ROLLUP && rollupIndex) {
@@ -313,7 +313,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
     (newType) => {
       form.setFieldValue('title', '');
       form.setFieldValue('readableTitle', '');
-      form.setFieldValue('readableTitleDescription', '');
+      form.setFieldValue('readableDescription', '');
       form.setFieldValue('timestampField', '');
       if (newType === INDEX_PATTERN_TYPE.ROLLUP) {
         form.setFieldValue('allowHidden', false);
diff --git a/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx b/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
index 9397dc25572cd..370865971b9e0 100644
--- a/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
@@ -30,13 +30,13 @@ const IndexPatternFlyoutContentContainer = ({
       if (editData) {
         const {
           readableTitle = '',
-          readableTitleDescription = '',
+          readableDescription = '',
           timeFieldName,
           title = '',
         } = dataViewSpec;
         editData.title = title;
         editData.readableTitle = readableTitle;
-        editData.readableTitleDescription = readableTitleDescription;
+        editData.readableDescription = readableDescription;
         editData.timeFieldName = timeFieldName;
         indexPattern = await dataViews.updateSavedObject(editData);
       } else {
diff --git a/src/plugins/data_view_editor/public/components/form_fields/readable_title_field.tsx b/src/plugins/data_view_editor/public/components/form_fields/readable_title_field.tsx
index 1fe5f8c832509..9a893961b3251 100644
--- a/src/plugins/data_view_editor/public/components/form_fields/readable_title_field.tsx
+++ b/src/plugins/data_view_editor/public/components/form_fields/readable_title_field.tsx
@@ -18,7 +18,7 @@ interface ReadableTitleFieldProps {
 
 export const ReadableTitleField = ({ editData }: ReadableTitleFieldProps) => {
   const [showDescription, setShowDescription] = useState<boolean>(
-    !!(editData && editData.readableTitleDescription)
+    !!(editData && editData.readableDescription)
   );
 
   return (
@@ -62,15 +62,12 @@ export const ReadableTitleField = ({ editData }: ReadableTitleFieldProps) => {
         <>
           <EuiSpacer size="l" />
           <UseField<string, IndexPatternConfig>
-            path="readableTitleDescription"
+            path="readableDescription"
             componentProps={{
               euiFieldProps: {
-                'aria-label': i18n.translate(
-                  'indexPatternEditor.form.readableTitleDescriptionLabel',
-                  {
-                    defaultMessage: 'Title description field optional',
-                  }
-                ),
+                'aria-label': i18n.translate('indexPatternEditor.form.readableDescriptionLabel', {
+                  defaultMessage: 'Title description field optional',
+                }),
               },
             }}
           >
@@ -97,7 +94,7 @@ export const ReadableTitleField = ({ editData }: ReadableTitleFieldProps) => {
                     }}
                     fullWidth
                     rows={2}
-                    data-test-subj="createIndexPatternReadableTitleDescriptionInput"
+                    data-test-subj="createIndexPatternReadableDescriptionInput"
                     maxLength={150}
                   />
                 </EuiFormRow>
@@ -108,7 +105,10 @@ export const ReadableTitleField = ({ editData }: ReadableTitleFieldProps) => {
       ) : (
         <>
           <EuiSpacer size="s" />
-          <EuiLink onClick={() => setShowDescription(true)}>
+          <EuiLink
+            onClick={() => setShowDescription(true)}
+            data-test-subj="showIndexPatternReadableDescriptionInput"
+          >
             {i18n.translate('indexPatternEditor.form.addDescription', {
               defaultMessage: 'Add description',
             })}
diff --git a/src/plugins/data_view_editor/public/components/form_schema.ts b/src/plugins/data_view_editor/public/components/form_schema.ts
index 8c9a9bafd7efe..f9fb460581be7 100644
--- a/src/plugins/data_view_editor/public/components/form_schema.ts
+++ b/src/plugins/data_view_editor/public/components/form_schema.ts
@@ -51,12 +51,12 @@ export const schema = {
     }),
     defaultValue: '',
   },
-  readableTitleDescription: {
-    label: i18n.translate('indexPatternEditor.editor.form.readableTitleDescriptionLabel', {
+  readableDescription: {
+    label: i18n.translate('indexPatternEditor.editor.form.readableDescriptionLabel', {
       defaultMessage: 'Description',
     }),
     defaultValue: '',
-    helpText: i18n.translate('indexPatternEditor.validations.readableTitleDescriptionHelpText', {
+    helpText: i18n.translate('indexPatternEditor.validations.readableDescriptionHelpText', {
       defaultMessage: '150 characters max',
     }),
   },
diff --git a/src/plugins/data_view_editor/public/types.ts b/src/plugins/data_view_editor/public/types.ts
index cd92bb076697d..648510387492f 100644
--- a/src/plugins/data_view_editor/public/types.ts
+++ b/src/plugins/data_view_editor/public/types.ts
@@ -169,7 +169,7 @@ export interface IndexPatternConfig {
   id?: string;
   type: INDEX_PATTERN_TYPE;
   readableTitle?: string;
-  readableTitleDescription?: string;
+  readableDescription?: string;
 }
 
 export interface FormInternal extends Omit<IndexPatternConfig, 'timestampField'> {
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
index f439aea026c5a..0f746c45e2da9 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
@@ -20,6 +20,10 @@ interface IndexHeaderProps {
   canSave: boolean;
 }
 
+const openActionsAriaLabel = i18n.translate('indexPatternManagement.editDataView.openAcionsAria', {
+  defaultMessage: 'Open Data View Actions',
+});
+
 const setDefaultAriaLabel = i18n.translate('indexPatternManagement.editDataView.setDefaultAria', {
   defaultMessage: 'Set as default data view.',
 });
@@ -61,7 +65,9 @@ export const IndexHeader: React.FC<IndexHeaderProps> = ({
     <EuiPageHeader
       pageTitle={<span data-test-subj="indexPatternTitle">{title}</span>}
       description={
-        indexPattern.readableTitleDescription ? indexPattern.readableTitleDescription : null
+        indexPattern.readableDescription ? (
+          <span data-test-subj="indexPatternDescription">{indexPattern.readableDescription}</span>
+        ) : null
       }
       rightSideItems={[
         <EuiPopover
@@ -70,6 +76,8 @@ export const IndexHeader: React.FC<IndexHeaderProps> = ({
               iconType="arrowDown"
               iconSide="right"
               onClick={() => setOpenActions(true)}
+              aria-label={openActionsAriaLabel}
+              data-test-subj="openDataViewActions"
             >
               Actions
             </EuiButtonEmpty>
diff --git a/src/plugins/data_view_management/public/components/utils.test.ts b/src/plugins/data_view_management/public/components/utils.test.ts
index 564be2a4ac3af..07496b98ae83d 100644
--- a/src/plugins/data_view_management/public/components/utils.test.ts
+++ b/src/plugins/data_view_management/public/components/utils.test.ts
@@ -20,7 +20,7 @@ const indexPatternContractMock = {
         id: 'test1',
         title: 'test name 1',
         readableTitle: 'Test Name 1',
-        readableTitleDescription: 'test name 1 description',
+        readableDescription: 'test name 1 description',
       },
     ])
   ),
diff --git a/src/plugins/data_view_management/public/components/utils.ts b/src/plugins/data_view_management/public/components/utils.ts
index e64526f5366e7..1a63671b3d547 100644
--- a/src/plugins/data_view_management/public/components/utils.ts
+++ b/src/plugins/data_view_management/public/components/utils.ts
@@ -38,14 +38,14 @@ export async function getIndexPatterns(
 ) {
   const existingIndexPatterns = await indexPatternsService.getIdsWithTitle(true);
   const indexPatternsListItems = existingIndexPatterns.map((idxPattern) => {
-    const { id, title, readableTitle, readableTitleDescription } = idxPattern;
+    const { id, title, readableTitle, readableDescription } = idxPattern;
     const isDefault = defaultIndex === id;
     const tags = getTags(idxPattern, isDefault);
 
     return {
       id,
       title: readableTitle ? readableTitle : title,
-      info: readableTitleDescription,
+      info: readableDescription,
       default: isDefault,
       tags,
       // the prepending of 0 at the default pattern takes care of prioritization
diff --git a/src/plugins/data_views/common/data_view.stub.ts b/src/plugins/data_views/common/data_view.stub.ts
index be403eed70eda..23bce8a171c44 100644
--- a/src/plugins/data_views/common/data_view.stub.ts
+++ b/src/plugins/data_views/common/data_view.stub.ts
@@ -58,7 +58,7 @@ export function stubbedSavedObjectDataView(
       fields: JSON.stringify(stubLogstashFieldSpecMap),
       title: 'title',
       readableTitle: 'Title',
-      readableTitleDescription: 'Title Description',
+      readableDescription: 'Title Description',
     },
     version: '2',
     references: [],
diff --git a/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap b/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
index c1ffb86f73767..22cbf5db4333e 100644
--- a/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
+++ b/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
@@ -776,7 +776,7 @@ Object {
   },
   "id": "test-pattern",
   "readableTitle": "Title",
-  "readableTitleDescription": "Title Description",
+  "readableDescription": "Title Description",
   "runtimeFieldMap": Object {
     "runtime_field": Object {
       "script": Object {
diff --git a/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap b/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
index 0395ca5f55c15..e1eecc3cc0dfb 100644
--- a/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
+++ b/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
@@ -41,7 +41,7 @@ Object {
   "fields": Object {},
   "id": "id",
   "readableTitle": "Kibana *",
-  "readableTitleDescription": "Kibana * Description",
+  "readableDescription": "Kibana * Description",
   "runtimeFieldMap": Object {
     "aRuntimeField": Object {
       "script": Object {
diff --git a/src/plugins/data_views/common/data_views/data_view.test.ts b/src/plugins/data_views/common/data_views/data_view.test.ts
index 2bb5ade3587fd..014c3606b590d 100644
--- a/src/plugins/data_views/common/data_views/data_view.test.ts
+++ b/src/plugins/data_views/common/data_views/data_view.test.ts
@@ -46,7 +46,7 @@ function create(id: string) {
   const {
     type,
     version,
-    attributes: { timeFieldName, fields, title, readableTitle, readableTitleDescription },
+    attributes: { timeFieldName, fields, title, readableTitle, readableDescription },
   } = stubbedSavedObjectIndexPattern(id);
 
   return new IndexPattern({
@@ -58,7 +58,7 @@ function create(id: string) {
       fields: { ...JSON.parse(fields), runtime_field: runtimeField },
       title,
       readableTitle,
-      readableTitleDescription,
+      readableDescription,
       runtimeFieldMap,
     },
     fieldFormats: fieldFormatsMock,
diff --git a/src/plugins/data_views/common/data_views/data_view.ts b/src/plugins/data_views/common/data_views/data_view.ts
index 7bb4ff4692039..0660f80696938 100644
--- a/src/plugins/data_views/common/data_views/data_view.ts
+++ b/src/plugins/data_views/common/data_views/data_view.ts
@@ -86,7 +86,7 @@ export class DataView implements IIndexPattern {
    */
   public readonly allowNoIndex: boolean = false;
   public readableTitle: string = '';
-  public readableTitleDescription: string = '';
+  public readableDescription: string = '';
 
   constructor({ spec = {}, fieldFormats, shortDotsEnable = false, metaFields = [] }: DataViewDeps) {
     // set dependencies
@@ -115,7 +115,7 @@ export class DataView implements IIndexPattern {
     this.allowNoIndex = spec.allowNoIndex || false;
     this.runtimeFieldMap = spec.runtimeFieldMap || {};
     this.readableTitle = spec.readableTitle || '';
-    this.readableTitleDescription = spec.readableTitleDescription || '';
+    this.readableDescription = spec.readableDescription || '';
   }
 
   /**
@@ -215,7 +215,7 @@ export class DataView implements IIndexPattern {
       fieldAttrs: this.fieldAttrs,
       allowNoIndex: this.allowNoIndex,
       readableTitle: this.readableTitle,
-      readableTitleDescription: this.readableTitleDescription,
+      readableDescription: this.readableDescription,
     };
   }
 
@@ -302,7 +302,7 @@ export class DataView implements IIndexPattern {
       allowNoIndex: this.allowNoIndex ? this.allowNoIndex : undefined,
       runtimeFieldMap: runtimeFieldMap ? JSON.stringify(runtimeFieldMap) : undefined,
       readableTitle: this.readableTitle,
-      readableTitleDescription: this.readableTitleDescription,
+      readableDescription: this.readableDescription,
     };
   }
 
diff --git a/src/plugins/data_views/common/data_views/data_views.test.ts b/src/plugins/data_views/common/data_views/data_views.test.ts
index d34cc23c51a36..72655e426991f 100644
--- a/src/plugins/data_views/common/data_views/data_views.test.ts
+++ b/src/plugins/data_views/common/data_views/data_views.test.ts
@@ -34,7 +34,7 @@ const savedObject = {
   attributes: {
     title: 'kibana-*',
     readableTitle: 'Kibana *',
-    readableTitleDescription: 'Kibana * Description',
+    readableDescription: 'Kibana * Description',
     timeFieldName: '@timestamp',
     fields: '[]',
     sourceFilters: '[{"value":"item1"},{"value":"item2"}]',
@@ -161,7 +161,7 @@ describe('IndexPatterns', () => {
     expect(await indexPatterns.getIds()).toEqual(['id']);
     expect(savedObjectsClient.find).toHaveBeenCalledWith({
       type: 'index-pattern',
-      fields: ['title', 'type', 'typeMeta', 'readableTitle', 'readableTitleDescription'],
+      fields: ['title', 'type', 'typeMeta', 'readableTitle', 'readableDescription'],
       perPage: 10000,
     });
   });
diff --git a/src/plugins/data_views/common/data_views/data_views.ts b/src/plugins/data_views/common/data_views/data_views.ts
index 6b240b5885d64..042483f92223b 100644
--- a/src/plugins/data_views/common/data_views/data_views.ts
+++ b/src/plugins/data_views/common/data_views/data_views.ts
@@ -41,12 +41,12 @@ const MAX_ATTEMPTS_TO_RESOLVE_CONFLICTS = 3;
 
 export type IndexPatternSavedObjectAttrs = Pick<
   DataViewAttributes,
-  'title' | 'type' | 'typeMeta' | 'readableTitle' | 'readableTitleDescription'
+  'title' | 'type' | 'typeMeta' | 'readableTitle' | 'readableDescription'
 >;
 
 export type IndexPatternListSavedObjectAttrs = Pick<
   DataViewAttributes,
-  'title' | 'type' | 'typeMeta' | 'readableTitle' | 'readableTitleDescription'
+  'title' | 'type' | 'typeMeta' | 'readableTitle' | 'readableDescription'
 >;
 
 export interface DataViewListItem {
@@ -55,7 +55,7 @@ export interface DataViewListItem {
   type?: string;
   typeMeta?: TypeMeta;
   readableTitle?: string;
-  readableTitleDescription?: string;
+  readableDescription?: string;
 }
 
 export interface DataViewsServiceDeps {
@@ -114,7 +114,7 @@ export class DataViewsService {
   private async refreshSavedObjectsCache() {
     const so = await this.savedObjectsClient.find<IndexPatternSavedObjectAttrs>({
       type: DATA_VIEW_SAVED_OBJECT_TYPE,
-      fields: ['title', 'type', 'typeMeta', 'readableTitle', 'readableTitleDescription'],
+      fields: ['title', 'type', 'typeMeta', 'readableTitle', 'readableDescription'],
       perPage: 10000,
     });
     this.savedObjectsCache = so;
@@ -185,7 +185,7 @@ export class DataViewsService {
       type: obj?.attributes?.type,
       typeMeta: obj?.attributes?.typeMeta && JSON.parse(obj?.attributes?.typeMeta),
       readableTitle: obj?.attributes?.readableTitle,
-      readableTitleDescription: obj?.attributes?.readableTitleDescription,
+      readableDescription: obj?.attributes?.readableDescription,
     }));
   };
 
@@ -393,7 +393,7 @@ export class DataViewsService {
         fieldAttrs,
         allowNoIndex,
         readableTitle,
-        readableTitleDescription,
+        readableDescription,
       },
     } = savedObject;
 
@@ -420,7 +420,7 @@ export class DataViewsService {
       allowNoIndex,
       runtimeFieldMap: parsedRuntimeFieldMap,
       readableTitle,
-      readableTitleDescription,
+      readableDescription,
     };
   };
 
diff --git a/src/plugins/data_views/common/types.ts b/src/plugins/data_views/common/types.ts
index 1d3af8ecd66ed..78b023b9140f3 100644
--- a/src/plugins/data_views/common/types.ts
+++ b/src/plugins/data_views/common/types.ts
@@ -68,7 +68,7 @@ export interface DataViewAttributes {
    */
   allowNoIndex?: boolean;
   readableTitle?: string;
-  readableTitleDescription?: string;
+  readableDescription?: string;
 }
 
 /**
@@ -250,7 +250,7 @@ export interface DataViewSpec {
   fieldAttrs?: FieldAttrs;
   allowNoIndex?: boolean;
   readableTitle?: string;
-  readableTitleDescription?: string;
+  readableDescription?: string;
 }
 
 export interface SourceFilter {
diff --git a/src/plugins/data_views/server/rest_api_routes/create_data_view.ts b/src/plugins/data_views/server/rest_api_routes/create_data_view.ts
index 320b3df5e354c..990942552db82 100644
--- a/src/plugins/data_views/server/rest_api_routes/create_data_view.ts
+++ b/src/plugins/data_views/server/rest_api_routes/create_data_view.ts
@@ -73,7 +73,7 @@ const dataViewSpecSchema = schema.object({
   allowNoIndex: schema.maybe(schema.boolean()),
   runtimeFieldMap: schema.maybe(schema.recordOf(schema.string(), runtimeFieldSpecSchema)),
   readableTitle: schema.maybe(schema.string()),
-  readableTitleDescription: schema.maybe(schema.string()),
+  readableDescription: schema.maybe(schema.string()),
 });
 
 const registerCreateDataViewRouteFactory =
diff --git a/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap b/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
index f037cc49b3dae..8781dfa37e67a 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
+++ b/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
@@ -656,7 +656,7 @@ exports[`Discover DataView Management renders correctly 1`] = `
         ],
         "originalSavedObjectBody": Object {},
         "readableTitle": "",
-        "readableTitleDescription": "",
+        "readableDescription": "",
         "resetOriginalSavedObjectBody": [Function],
         "runtimeFieldMap": Object {},
         "setFieldFormat": [Function],
diff --git a/test/functional/apps/management/_index_pattern_create_delete.js b/test/functional/apps/management/_index_pattern_create_delete.js
index a07141a073d64..895de756ac042 100644
--- a/test/functional/apps/management/_index_pattern_create_delete.js
+++ b/test/functional/apps/management/_index_pattern_create_delete.js
@@ -60,7 +60,7 @@ export default function ({ getService, getPageObjects }) {
 
         await retry.try(async () => {
           expect(await testSubjects.getVisibleText('createIndexPatternStatusMessage')).to.contain(
-            `The index pattern you entered doesn\'t match any data streams, indices, or index aliases.`
+            `The data view you entered doesn\'t match any data streams, indices, or index aliases.`
           );
         });
       });
@@ -116,6 +116,26 @@ export default function ({ getService, getPageObjects }) {
       });
     });
 
+    describe('edit index pattern', () => {
+      it('edit index pattern details on edit click', async () => {
+        await PageObjects.settings.editIndexPattern(
+          'logstash-*',
+          '@timestamp',
+          'Logstash Star',
+          'Logstash Star description'
+        );
+
+        await retry.try(async () => {
+          expect(await testSubjects.getVisibleText('indexPatternTitle')).to.contain(
+            `Logstash Star`
+          );
+          expect(await testSubjects.getVisibleText('indexPatternDescription')).to.contain(
+            `Logstash Star description`
+          );
+        });
+      });
+    });
+
     describe('index pattern deletion', function indexDelete() {
       before(function () {
         const expectedAlertText = 'Delete data view?';
diff --git a/test/functional/page_objects/settings_page.ts b/test/functional/page_objects/settings_page.ts
index b1e4aa823821b..72a24a1c78b88 100644
--- a/test/functional/page_objects/settings_page.ts
+++ b/test/functional/page_objects/settings_page.ts
@@ -160,6 +160,30 @@ export class SettingsPageObject extends FtrService {
     return await this.find.displayedByCssSelector('option[value="' + selection + '"]');
   }
 
+  async getReadableTitleField() {
+    return this.testSubjects.find('createIndexPatternReadableTitleInput');
+  }
+
+  async setReadableTitleField(indexPatternTitle: string) {
+    const field = await this.getReadableTitleField();
+    field.clearValue();
+    field.type(indexPatternTitle);
+  }
+
+  async getReadableDescriptionField() {
+    const exists = await this.testSubjects.exists('showIndexPatternReadableDescriptionInput');
+    if (exists) {
+      await this.testSubjects.click('showIndexPatternReadableDescriptionInput');
+    }
+    return this.testSubjects.find('createIndexPatternReadableDescriptionInput');
+  }
+
+  async setReadableDescriptionField(indexPatternDescription: string) {
+    const field = await this.getReadableDescriptionField();
+    field.clearValue();
+    field.type(indexPatternDescription);
+  }
+
   async getSaveIndexPatternButton() {
     return await this.testSubjects.find('saveIndexPatternButton');
   }
@@ -169,11 +193,18 @@ export class SettingsPageObject extends FtrService {
   }
 
   async clickDefaultIndexButton() {
+    await this.testSubjects.click('openDataViewActions');
     await this.testSubjects.click('setDefaultIndexPatternButton');
     await this.header.waitUntilLoadingHasFinished();
   }
 
+  async clickEditIndexButton() {
+    await this.testSubjects.click('openDataViewActions');
+    await this.testSubjects.click('editIndexPatternButton');
+  }
+
   async clickDeletePattern() {
+    await this.testSubjects.click('openDataViewActions');
     await this.testSubjects.click('deleteIndexPatternButton');
   }
 
@@ -380,7 +411,9 @@ export class SettingsPageObject extends FtrService {
     indexPatternName: string,
     // null to bypass default value
     timefield: string | null = '@timestamp',
-    isStandardIndexPattern = true
+    isStandardIndexPattern = true,
+    indexPatternTitle?: string,
+    indexPatternDescription?: string
   ) {
     await this.retry.try(async () => {
       await this.header.waitUntilLoadingHasFinished();
@@ -411,6 +444,12 @@ export class SettingsPageObject extends FtrService {
       if (timefield) {
         await this.selectTimeFieldOption(timefield);
       }
+      if (indexPatternTitle) {
+        await this.setReadableTitleField(indexPatternTitle);
+      }
+      if (indexPatternDescription) {
+        await this.setReadableDescriptionField(indexPatternDescription);
+      }
       await (await this.getSaveIndexPatternButton()).click();
     });
     await this.header.waitUntilLoadingHasFinished();
@@ -433,6 +472,39 @@ export class SettingsPageObject extends FtrService {
     return await this.getIndexPatternIdFromUrl();
   }
 
+  async editIndexPattern(
+    indexPatternName: string,
+    // null to bypass default value
+    timefield: string | null = '@timestamp',
+    indexPatternTitle?: string,
+    indexPatternDescription?: string
+  ) {
+    if (!indexPatternName) {
+      throw new Error('No Data View name provided for edit');
+    }
+
+    const exists = await this.hasIndexPattern(indexPatternName);
+    if (!exists) {
+      throw new Error('Data view for edit does not exist');
+    }
+
+    this.clickEditIndexButton();
+    await this.header.waitUntilLoadingHasFinished();
+    if (timefield) {
+      await this.selectTimeFieldOption(timefield);
+    }
+    if (indexPatternTitle) {
+      await this.setReadableTitleField(indexPatternTitle);
+    }
+    if (indexPatternDescription) {
+      await this.setReadableDescriptionField(indexPatternDescription);
+    }
+    await (await this.getSaveIndexPatternButton()).click();
+
+    await this.header.waitUntilLoadingHasFinished();
+    return await this.getIndexPatternIdFromUrl();
+  }
+
   async clickAddNewIndexPatternButton() {
     await this.common.scrollKibanaBodyTop();
 

From 5fb16a5330cba8da986c880bd485273052f4f65a Mon Sep 17 00:00:00 2001
From: shivindera <shivindera@gmail.com>
Date: Tue, 22 Feb 2022 19:19:06 +0100
Subject: [PATCH 05/35] add missing lens support

---
 .../indexpattern_datasource/change_indexpattern.tsx    |  4 ++--
 .../lens/public/indexpattern_datasource/datapanel.tsx  | 10 ++++++++--
 .../lens/public/indexpattern_datasource/layerpanel.tsx | 10 ++++++++--
 .../lens/public/indexpattern_datasource/types.ts       |  1 +
 4 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/change_indexpattern.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/change_indexpattern.tsx
index d5fabb9d7ef80..3b96c6c714e2d 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/change_indexpattern.tsx
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/change_indexpattern.tsx
@@ -85,9 +85,9 @@ export function ChangeIndexPattern({
             {...selectableProps}
             searchable
             singleSelection="always"
-            options={indexPatternRefs.map(({ title, id }) => ({
+            options={indexPatternRefs.map(({ title, id, readableTitle }) => ({
               key: id,
-              label: title,
+              label: readableTitle ? readableTitle : title,
               value: id,
               checked: id === indexPatternId ? 'on' : undefined,
             }))}
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx
index 199131564f7c4..4fc19b6832c94 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx
@@ -594,7 +594,13 @@ export const InnerIndexPatternDataPanel = function InnerIndexPatternDataPanel({
   );
 
   const [popoverOpen, setPopoverOpen] = useState(false);
-
+  const triggerLabel = indexPatternRefs.reduce(
+    (title, indexPatt) =>
+      indexPatt.title === currentIndexPattern.title && indexPatt.readableTitle
+        ? indexPatt.readableTitle
+        : title,
+    currentIndexPattern.title
+  );
   return (
     <ChildDragDropProvider {...dragDropContext}>
       <EuiFlexGroup
@@ -614,7 +620,7 @@ export const InnerIndexPatternDataPanel = function InnerIndexPatternDataPanel({
               <ChangeIndexPattern
                 data-test-subj="indexPattern-switcher"
                 trigger={{
-                  label: currentIndexPattern.title,
+                  label: triggerLabel,
                   title: currentIndexPattern.title,
                   'data-test-subj': 'indexPattern-switch-link',
                   fontWeight: 'bold',
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/layerpanel.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/layerpanel.tsx
index f8548321e49bd..d0c2bf0398f35 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/layerpanel.tsx
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/layerpanel.tsx
@@ -26,13 +26,19 @@ export function LayerPanel({ state, layerId, onChangeIndexPattern }: IndexPatter
   const notFoundTitleLabel = i18n.translate('xpack.lens.layerPanel.missingDataView', {
     defaultMessage: 'Data view not found',
   });
-
+  const triggerLabel = state.indexPatternRefs.reduce(
+    (title, indexPatt) =>
+      indexPatt.title === indexPattern.title && indexPatt.readableTitle
+        ? indexPatt.readableTitle
+        : title,
+    indexPattern?.title || notFoundTitleLabel
+  );
   return (
     <I18nProvider>
       <ChangeIndexPattern
         data-test-subj="indexPattern-switcher"
         trigger={{
-          label: indexPattern?.title || notFoundTitleLabel,
+          label: triggerLabel,
           title: indexPattern?.title || notFoundTitleLabel,
           'data-test-subj': 'lns_layerIndexPatternLabel',
           size: 's',
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/types.ts b/x-pack/plugins/lens/public/indexpattern_datasource/types.ts
index 5bb4d58ed20fa..ac526e3f57de3 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/types.ts
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/types.ts
@@ -104,4 +104,5 @@ export interface IndexPatternPrivateState {
 export interface IndexPatternRef {
   id: string;
   title: string;
+  readableTitle: string;
 }

From cd7cf91f56441569780f252f86fb1bad6ce69622 Mon Sep 17 00:00:00 2001
From: shivindera <shivindera@gmail.com>
Date: Tue, 22 Feb 2022 19:28:29 +0100
Subject: [PATCH 06/35] update snapshots after name change

---
 .../common/data_views/__snapshots__/data_view.test.ts.snap      | 2 +-
 .../common/data_views/__snapshots__/data_views.test.ts.snap     | 2 +-
 .../discover_index_pattern_management.test.tsx.snap             | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap b/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
index 22cbf5db4333e..ea1f2b0aaddfe 100644
--- a/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
+++ b/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
@@ -775,8 +775,8 @@ Object {
     },
   },
   "id": "test-pattern",
-  "readableTitle": "Title",
   "readableDescription": "Title Description",
+  "readableTitle": "Title",
   "runtimeFieldMap": Object {
     "runtime_field": Object {
       "script": Object {
diff --git a/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap b/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
index e1eecc3cc0dfb..4ba7831479a23 100644
--- a/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
+++ b/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
@@ -40,8 +40,8 @@ Object {
   },
   "fields": Object {},
   "id": "id",
-  "readableTitle": "Kibana *",
   "readableDescription": "Kibana * Description",
+  "readableTitle": "Kibana *",
   "runtimeFieldMap": Object {
     "aRuntimeField": Object {
       "script": Object {
diff --git a/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap b/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
index 8781dfa37e67a..576684e952b8e 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
+++ b/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
@@ -655,8 +655,8 @@ exports[`Discover DataView Management renders correctly 1`] = `
           "_source",
         ],
         "originalSavedObjectBody": Object {},
-        "readableTitle": "",
         "readableDescription": "",
+        "readableTitle": "",
         "resetOriginalSavedObjectBody": [Function],
         "runtimeFieldMap": Object {},
         "setFieldFormat": [Function],

From 2295bb07a303c655ee267e7a9e04f9b4a91cdeb4 Mon Sep 17 00:00:00 2001
From: shivindera <shivindera@gmail.com>
Date: Tue, 22 Feb 2022 23:57:12 +0100
Subject: [PATCH 07/35] fix for broken test and type checks

---
 .../public/indexpattern_datasource/change_indexpattern.tsx     | 3 ++-
 x-pack/plugins/lens/public/indexpattern_datasource/types.ts    | 2 +-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/change_indexpattern.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/change_indexpattern.tsx
index 3b96c6c714e2d..b6c847e3ba4d5 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/change_indexpattern.tsx
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/change_indexpattern.tsx
@@ -87,7 +87,8 @@ export function ChangeIndexPattern({
             singleSelection="always"
             options={indexPatternRefs.map(({ title, id, readableTitle }) => ({
               key: id,
-              label: readableTitle ? readableTitle : title,
+              label: readableTitle ? `${readableTitle} (${title})` : title,
+              searchableLabel: title,
               value: id,
               checked: id === indexPatternId ? 'on' : undefined,
             }))}
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/types.ts b/x-pack/plugins/lens/public/indexpattern_datasource/types.ts
index ac526e3f57de3..dfdde420ccbda 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/types.ts
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/types.ts
@@ -104,5 +104,5 @@ export interface IndexPatternPrivateState {
 export interface IndexPatternRef {
   id: string;
   title: string;
-  readableTitle: string;
+  readableTitle?: string;
 }

From 54ff3e06eb4bac349e1b00542ffcd1d9739af870 Mon Sep 17 00:00:00 2001
From: shivindera <shivindera@gmail.com>
Date: Wed, 23 Feb 2022 11:58:20 +0100
Subject: [PATCH 08/35] fix condition check

---
 .../plugins/lens/public/indexpattern_datasource/layerpanel.tsx  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/layerpanel.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/layerpanel.tsx
index d0c2bf0398f35..52c8f4bd93680 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/layerpanel.tsx
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/layerpanel.tsx
@@ -28,7 +28,7 @@ export function LayerPanel({ state, layerId, onChangeIndexPattern }: IndexPatter
   });
   const triggerLabel = state.indexPatternRefs.reduce(
     (title, indexPatt) =>
-      indexPatt.title === indexPattern.title && indexPatt.readableTitle
+      indexPatt.title === indexPattern?.title && indexPatt.readableTitle
         ? indexPatt.readableTitle
         : title,
     indexPattern?.title || notFoundTitleLabel

From b839a08f9025de43170dc896e2b64ce49b3a4e4d Mon Sep 17 00:00:00 2001
From: shivindera <shivindera@gmail.com>
Date: Mon, 4 Apr 2022 02:43:10 +0200
Subject: [PATCH 09/35] remove description, rename readableTitle to name and
 fixes

---
 config/kibana.yml                             |   1 +
 .../data_view_editor_flyout_content.tsx       |  13 +-
 .../data_view_flyout_content_container.tsx    |  10 +-
 .../public/components/footer/footer.tsx       |   2 +-
 .../public/components/form_fields/index.ts    |   2 +-
 .../components/form_fields/name_field.tsx     |  57 +++++++++
 .../form_fields/readable_title_field.tsx      | 120 ------------------
 .../components/form_fields/title_field.tsx    |   4 +-
 .../public/components/form_schema.ts          |  17 +--
 .../public/components/index.ts                |   2 +-
 .../status_message/status_message.tsx         |   2 +-
 src/plugins/data_view_editor/public/types.ts  |   3 +-
 .../public/components/breadcrumbs.ts          |   2 +-
 .../create_edit_field/create_edit_field.tsx   |   2 +-
 .../edit_index_pattern/edit_index_pattern.tsx |   2 +-
 .../index_header/index_header.tsx             |  11 +-
 .../index_pattern_table.tsx                   |  22 ++--
 .../public/components/types.ts                |   1 +
 .../public/components/utils.test.ts           |   3 +-
 .../public/components/utils.ts                |   7 +-
 .../data_views/common/data_view.stub.ts       |   3 +-
 .../__snapshots__/data_view.test.ts.snap      |   3 +-
 .../__snapshots__/data_views.test.ts.snap     |   3 +-
 .../common/data_views/data_view.test.ts       |   5 +-
 .../data_views/common/data_views/data_view.ts |  17 +--
 .../common/data_views/data_views.test.ts      |   5 +-
 .../common/data_views/data_views.ts           |  18 +--
 src/plugins/data_views/common/types.ts        |   6 +-
 .../rest_api_routes/create_data_view.ts       |   3 +-
 ...ver_index_pattern_management.test.tsx.snap |   3 +-
 .../sidebar/change_indexpattern.tsx           |   4 +-
 .../sidebar/discover_index_pattern.tsx        |  10 +-
 .../main/components/sidebar/types.ts          |   2 +-
 .../public/finder/saved_object_finder.tsx     |  15 ++-
 .../components/sidebar/sidebar_title.tsx      |   4 +-
 .../index_pattern_select/combo_box_select.tsx |   4 +-
 .../index_pattern_select.tsx                  |   2 +-
 .../apps/discover/_data_view_editor.ts        |   2 +-
 test/functional/page_objects/settings_page.ts |  46 ++-----
 .../apps/discover/data_view_ccs.ts            |   2 +-
 .../plugins/lens/saved_objects_finder.tsx     |  15 ++-
 .../change_indexpattern.tsx                   |   5 +-
 .../indexpattern_datasource/datapanel.tsx     |   9 +-
 .../indexpattern_datasource/layerpanel.tsx    |   9 +-
 .../public/indexpattern_datasource/loader.ts  |   3 +-
 .../public/indexpattern_datasource/types.ts   |   3 +-
 46 files changed, 177 insertions(+), 307 deletions(-)
 create mode 100644 src/plugins/data_view_editor/public/components/form_fields/name_field.tsx
 delete mode 100644 src/plugins/data_view_editor/public/components/form_fields/readable_title_field.tsx

diff --git a/config/kibana.yml b/config/kibana.yml
index 50ddad9a4b32a..70d71845ac0c9 100644
--- a/config/kibana.yml
+++ b/config/kibana.yml
@@ -9,6 +9,7 @@
 # The default is 'localhost', which usually means remote machines will not be able to connect.
 # To allow connections from remote users, set this parameter to a non-loopback address.
 #server.host: "localhost"
+server.host: '0.0.0.0'
 
 # Enables you to specify a path to mount Kibana at if you are running behind a proxy.
 # Use the `server.rewriteBasePath` setting to tell Kibana if it should remove the basePath
diff --git a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
index d6f5f6439d311..c4353f2d5e5c5 100644
--- a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
@@ -40,7 +40,7 @@ import {
   TimestampField,
   TypeField,
   TitleField,
-  ReadableTitleField,
+  NameField,
   schema,
   Footer,
   AdvancedParamsContent,
@@ -90,8 +90,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
         ? {
             title: editData.title,
             id: editData.id,
-            readableTitle: editData.readableTitle,
-            readableDescription: editData.readableDescription,
+            name: editData.name,
             ...(editData.timeFieldName
               ? {
                   timestampField: { label: editData.timeFieldName, value: editData.timeFieldName },
@@ -110,8 +109,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
         title: formData.title,
         timeFieldName: formData.timestampField?.value,
         id: formData.id,
-        readableTitle: formData.readableTitle,
-        readableDescription: formData.readableDescription,
+        name: formData.name,
       };
 
       if (type === INDEX_PATTERN_TYPE.ROLLUP && rollupIndex) {
@@ -311,8 +309,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
   const onTypeChange = useCallback(
     (newType) => {
       form.setFieldValue('title', '');
-      form.setFieldValue('readableTitle', '');
-      form.setFieldValue('readableDescription', '');
+      form.setFieldValue('name', '');
       form.setFieldValue('timestampField', '');
       if (newType === INDEX_PATTERN_TYPE.ROLLUP) {
         form.setFieldValue('allowHidden', false);
@@ -364,7 +361,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
             <EuiSpacer size="l" />
             <EuiFlexGroup>
               <EuiFlexItem>
-                <ReadableTitleField editData={editData} />
+                <NameField editData={editData} />
               </EuiFlexItem>
             </EuiFlexGroup>
             <EuiSpacer size="l" />
diff --git a/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx b/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
index 370865971b9e0..b22c63035320b 100644
--- a/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
@@ -28,15 +28,9 @@ const IndexPatternFlyoutContentContainer = ({
     try {
       let indexPattern;
       if (editData) {
-        const {
-          readableTitle = '',
-          readableDescription = '',
-          timeFieldName,
-          title = '',
-        } = dataViewSpec;
+        const { name = '', timeFieldName, title = '' } = dataViewSpec;
         editData.title = title;
-        editData.readableTitle = readableTitle;
-        editData.readableDescription = readableDescription;
+        editData.name = name;
         editData.timeFieldName = timeFieldName;
         indexPattern = await dataViews.updateSavedObject(editData);
       } else {
diff --git a/src/plugins/data_view_editor/public/components/footer/footer.tsx b/src/plugins/data_view_editor/public/components/footer/footer.tsx
index dde04fd767323..c54ff4136b685 100644
--- a/src/plugins/data_view_editor/public/components/footer/footer.tsx
+++ b/src/plugins/data_view_editor/public/components/footer/footer.tsx
@@ -33,7 +33,7 @@ const saveButtonLabel = i18n.translate('indexPatternEditor.editor.flyoutSaveButt
 });
 
 const editButtonLabel = i18n.translate('indexPatternEditor.editor.flyoutEditButtonLabel', {
-  defaultMessage: 'Edit data view',
+  defaultMessage: 'Save',
 });
 
 export const Footer = ({ onCancel, onSubmit, submitDisabled, isEdit }: FooterProps) => {
diff --git a/src/plugins/data_view_editor/public/components/form_fields/index.ts b/src/plugins/data_view_editor/public/components/form_fields/index.ts
index 98bd64fbf7be5..a6ddb0fdf0abf 100644
--- a/src/plugins/data_view_editor/public/components/form_fields/index.ts
+++ b/src/plugins/data_view_editor/public/components/form_fields/index.ts
@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-export { ReadableTitleField } from './readable_title_field';
+export { NameField } from './name_field';
 export { TimestampField } from './timestamp_field';
 export { TypeField } from './type_field';
 export { TitleField } from './title_field';
diff --git a/src/plugins/data_view_editor/public/components/form_fields/name_field.tsx b/src/plugins/data_view_editor/public/components/form_fields/name_field.tsx
new file mode 100644
index 0000000000000..33ac5879552a0
--- /dev/null
+++ b/src/plugins/data_view_editor/public/components/form_fields/name_field.tsx
@@ -0,0 +1,57 @@
+/*
+ * 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 React, { ChangeEvent } from 'react';
+import { i18n } from '@kbn/i18n';
+import { EuiFormRow, EuiFieldText, EuiText } from '@elastic/eui';
+import { DataView, UseField } from '../../shared_imports';
+import { IndexPatternConfig } from '../../types';
+
+interface NameFieldProps {
+  editData?: DataView;
+}
+
+export const NameField = ({ editData }: NameFieldProps) => {
+  return (
+    <UseField<string, IndexPatternConfig>
+      path="name"
+      componentProps={{
+        euiFieldProps: {
+          'aria-label': i18n.translate('indexPatternEditor.form.nameAriaLabel', {
+            defaultMessage: 'Title field optional',
+          }),
+        },
+      }}
+    >
+      {(field) => {
+        return (
+          <EuiFormRow
+            label={field.label}
+            labelAppend={
+              <EuiText size="xs" color="subdued">
+                {i18n.translate('indexPatternEditor.form.optional', {
+                  defaultMessage: 'Optional',
+                })}
+              </EuiText>
+            }
+            fullWidth
+          >
+            <EuiFieldText
+              value={field.value}
+              onChange={(e: ChangeEvent<HTMLInputElement>) => {
+                field.setValue(e.target.value);
+              }}
+              fullWidth
+              data-test-subj="createIndexPatternNameInput"
+            />
+          </EuiFormRow>
+        );
+      }}
+    </UseField>
+  );
+};
diff --git a/src/plugins/data_view_editor/public/components/form_fields/readable_title_field.tsx b/src/plugins/data_view_editor/public/components/form_fields/readable_title_field.tsx
deleted file mode 100644
index 9a893961b3251..0000000000000
--- a/src/plugins/data_view_editor/public/components/form_fields/readable_title_field.tsx
+++ /dev/null
@@ -1,120 +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 React, { ChangeEvent, useState } from 'react';
-import { i18n } from '@kbn/i18n';
-import { EuiFormRow, EuiFieldText, EuiLink, EuiText, EuiTextArea, EuiSpacer } from '@elastic/eui';
-import { DataView, UseField } from '../../shared_imports';
-import { IndexPatternConfig } from '../../types';
-
-interface ReadableTitleFieldProps {
-  editData?: DataView;
-}
-
-export const ReadableTitleField = ({ editData }: ReadableTitleFieldProps) => {
-  const [showDescription, setShowDescription] = useState<boolean>(
-    !!(editData && editData.readableDescription)
-  );
-
-  return (
-    <>
-      <UseField<string, IndexPatternConfig>
-        path="readableTitle"
-        componentProps={{
-          euiFieldProps: {
-            'aria-label': i18n.translate('indexPatternEditor.form.readableTitleAriaLabel', {
-              defaultMessage: 'Title field optional',
-            }),
-          },
-        }}
-      >
-        {(field) => {
-          return (
-            <EuiFormRow
-              label={field.label}
-              labelAppend={
-                <EuiText size="xs" color="subdued">
-                  {i18n.translate('indexPatternEditor.form.optional', {
-                    defaultMessage: 'Optional',
-                  })}
-                </EuiText>
-              }
-              fullWidth
-            >
-              <EuiFieldText
-                value={field.value}
-                onChange={(e: ChangeEvent<HTMLInputElement>) => {
-                  field.setValue(e.target.value);
-                }}
-                fullWidth
-                data-test-subj="createIndexPatternReadableTitleInput"
-              />
-            </EuiFormRow>
-          );
-        }}
-      </UseField>
-      {showDescription ? (
-        <>
-          <EuiSpacer size="l" />
-          <UseField<string, IndexPatternConfig>
-            path="readableDescription"
-            componentProps={{
-              euiFieldProps: {
-                'aria-label': i18n.translate('indexPatternEditor.form.readableDescriptionLabel', {
-                  defaultMessage: 'Title description field optional',
-                }),
-              },
-            }}
-          >
-            {(field) => {
-              return (
-                <EuiFormRow
-                  label={field.label}
-                  labelAppend={
-                    <EuiText size="xs" color="subdued">
-                      {i18n.translate('indexPatternEditor.form.optional', {
-                        defaultMessage: 'Optional',
-                      })}
-                    </EuiText>
-                  }
-                  helpText={
-                    typeof field.helpText === 'function' ? field.helpText() : field.helpText
-                  }
-                  fullWidth
-                >
-                  <EuiTextArea
-                    value={field.value}
-                    onChange={(e: ChangeEvent<HTMLTextAreaElement>) => {
-                      field.setValue(e.target.value);
-                    }}
-                    fullWidth
-                    rows={2}
-                    data-test-subj="createIndexPatternReadableDescriptionInput"
-                    maxLength={150}
-                  />
-                </EuiFormRow>
-              );
-            }}
-          </UseField>
-        </>
-      ) : (
-        <>
-          <EuiSpacer size="s" />
-          <EuiLink
-            onClick={() => setShowDescription(true)}
-            data-test-subj="showIndexPatternReadableDescriptionInput"
-          >
-            {i18n.translate('indexPatternEditor.form.addDescription', {
-              defaultMessage: 'Add description',
-            })}
-          </EuiLink>
-        </>
-      )}
-    </>
-  );
-};
diff --git a/src/plugins/data_view_editor/public/components/form_fields/title_field.tsx b/src/plugins/data_view_editor/public/components/form_fields/title_field.tsx
index c821f124cf1fb..c33fb323951b3 100644
--- a/src/plugins/data_view_editor/public/components/form_fields/title_field.tsx
+++ b/src/plugins/data_view_editor/public/components/form_fields/title_field.tsx
@@ -92,7 +92,7 @@ const createMatchesIndicesValidator = ({
       return;
     }
 
-    // A rollup data view needs to match one and only one rollup index.
+    // A rollup index pattern needs to match one and only one rollup index.
     const rollupIndexMatches = matchedIndicesResult.exactMatchedIndices.filter((matchedIndex) =>
       rollupIndices.includes(matchedIndex.name)
     );
@@ -222,7 +222,7 @@ export const TitleField = ({
               }}
               isLoading={field.isValidating}
               fullWidth
-              data-test-subj="createIndexPatternNameInput"
+              data-test-subj="createIndexPatternTitleInput"
             />
           </EuiFormRow>
         );
diff --git a/src/plugins/data_view_editor/public/components/form_schema.ts b/src/plugins/data_view_editor/public/components/form_schema.ts
index f9fb460581be7..7060b3a394de7 100644
--- a/src/plugins/data_view_editor/public/components/form_schema.ts
+++ b/src/plugins/data_view_editor/public/components/form_schema.ts
@@ -25,7 +25,7 @@ export const singleAstriskValidator = (
 export const schema = {
   title: {
     label: i18n.translate('indexPatternEditor.editor.form.titleLabel', {
-      defaultMessage: 'Data View',
+      defaultMessage: 'Index pattern',
     }),
     defaultValue: '',
     helpText: i18n.translate('indexPatternEditor.validations.titleHelpText', {
@@ -45,21 +45,12 @@ export const schema = {
       },
     ],
   },
-  readableTitle: {
-    label: i18n.translate('indexPatternEditor.editor.form.readableTitleLabel', {
-      defaultMessage: 'Title',
+  name: {
+    label: i18n.translate('indexPatternEditor.editor.form.nameLabel', {
+      defaultMessage: 'Name',
     }),
     defaultValue: '',
   },
-  readableDescription: {
-    label: i18n.translate('indexPatternEditor.editor.form.readableDescriptionLabel', {
-      defaultMessage: 'Description',
-    }),
-    defaultValue: '',
-    helpText: i18n.translate('indexPatternEditor.validations.readableDescriptionHelpText', {
-      defaultMessage: '150 characters max',
-    }),
-  },
   timestampField: {
     label: i18n.translate('indexPatternEditor.editor.form.timeFieldLabel', {
       defaultMessage: 'Timestamp field',
diff --git a/src/plugins/data_view_editor/public/components/index.ts b/src/plugins/data_view_editor/public/components/index.ts
index 982914015bab6..a788f111633a1 100644
--- a/src/plugins/data_view_editor/public/components/index.ts
+++ b/src/plugins/data_view_editor/public/components/index.ts
@@ -12,7 +12,7 @@ export { IndexPatternEditorFlyoutContent } from './data_view_editor_flyout_conte
 export { DataViewEditor } from './data_view_editor';
 
 export { schema } from './form_schema';
-export { ReadableTitleField, TimestampField, TypeField, TitleField } from './form_fields';
+export { NameField, TimestampField, TypeField, TitleField } from './form_fields';
 export { EmptyPrompts } from './empty_prompts';
 export { PreviewPanel } from './preview_panel';
 export { LoadingIndices } from './loading_indices';
diff --git a/src/plugins/data_view_editor/public/components/preview_panel/status_message/status_message.tsx b/src/plugins/data_view_editor/public/components/preview_panel/status_message/status_message.tsx
index d88b20e788e42..53bd942e15edf 100644
--- a/src/plugins/data_view_editor/public/components/preview_panel/status_message/status_message.tsx
+++ b/src/plugins/data_view_editor/public/components/preview_panel/status_message/status_message.tsx
@@ -25,7 +25,7 @@ const NoMatchStatusMessage = (allIndicesLength: number) => (
   <span>
     <FormattedMessage
       id="indexPatternEditor.status.notMatchLabel.notMatchDetail"
-      defaultMessage="The data view you entered doesn't match any data streams, indices, or index aliases.
+      defaultMessage="The index pattern you entered doesn't match any data streams, indices, or index aliases.
   You can match {strongIndices}."
       values={{
         strongIndices: (
diff --git a/src/plugins/data_view_editor/public/types.ts b/src/plugins/data_view_editor/public/types.ts
index 018ace8741e01..c5f3f8b0e4566 100644
--- a/src/plugins/data_view_editor/public/types.ts
+++ b/src/plugins/data_view_editor/public/types.ts
@@ -153,8 +153,7 @@ export interface IndexPatternConfig {
   allowHidden: boolean;
   id?: string;
   type: INDEX_PATTERN_TYPE;
-  readableTitle?: string;
-  readableDescription?: string;
+  name?: string;
 }
 
 export interface FormInternal extends Omit<IndexPatternConfig, 'timestampField'> {
diff --git a/src/plugins/data_view_management/public/components/breadcrumbs.ts b/src/plugins/data_view_management/public/components/breadcrumbs.ts
index 244bce41f8fd4..473272c66e5fd 100644
--- a/src/plugins/data_view_management/public/components/breadcrumbs.ts
+++ b/src/plugins/data_view_management/public/components/breadcrumbs.ts
@@ -36,7 +36,7 @@ export function getEditBreadcrumbs(indexPattern: DataView) {
   return [
     ...getListBreadcrumbs(),
     {
-      text: indexPattern.title,
+      text: indexPattern.getName(),
       href: `/patterns/${indexPattern.id}`,
     },
   ];
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/create_edit_field/create_edit_field.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/create_edit_field/create_edit_field.tsx
index 2d8469975430b..04af93ce9d05d 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/create_edit_field/create_edit_field.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/create_edit_field/create_edit_field.tsx
@@ -59,7 +59,7 @@ export const CreateEditField = withRouter(
 
     const docFieldName = spec?.name || newFieldPlaceholder;
 
-    chrome.docTitle.change([docFieldName, indexPattern.title]);
+    chrome.docTitle.change([docFieldName, indexPattern.getName()]);
 
     const redirectAway = () => {
       history.push(
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
index f7b56951e53b4..62c51951961cc 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
@@ -131,7 +131,7 @@ export const EditIndexPattern = withRouter(
       defaultMessage: 'Data view details',
     });
 
-    chrome.docTitle.change(indexPattern.title);
+    chrome.docTitle.change(indexPattern.getName());
 
     const showTagsSection = Boolean(indexPattern.timeFieldName || (tags && tags.length > 0));
     const kibana = useKibana();
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
index 0f746c45e2da9..d78a86469fc8f 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
@@ -59,16 +59,9 @@ export const IndexHeader: React.FC<IndexHeaderProps> = ({
 }) => {
   const [openActions, setOpenActions] = useState<boolean>(false);
 
-  const title = indexPattern.readableTitle ? indexPattern.readableTitle : indexPattern.title;
-
   return (
     <EuiPageHeader
-      pageTitle={<span data-test-subj="indexPatternTitle">{title}</span>}
-      description={
-        indexPattern.readableDescription ? (
-          <span data-test-subj="indexPatternDescription">{indexPattern.readableDescription}</span>
-        ) : null
-      }
+      pageTitle={<span data-test-subj="indexPatternTitle">{indexPattern.getName()}</span>}
       rightSideItems={[
         <EuiPopover
           button={
@@ -124,7 +117,7 @@ export const IndexHeader: React.FC<IndexHeaderProps> = ({
             {canSave && (
               <EuiFlexItem>
                 <EuiButtonEmpty
-                  color="text"
+                  color="danger"
                   onClick={deleteIndexPatternClick}
                   iconSide="left"
                   iconType="trash"
diff --git a/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx b/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
index a7fe9a156883d..a26b28359770a 100644
--- a/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
+++ b/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
@@ -209,18 +209,16 @@ export const IndexPatternTable = ({
         <div>
           <EuiLink {...reactRouterNavigate(history, `patterns/${dataView.id}`)}>
             <span>
-              {name}
-              {dataView.info ? (
-                <>
-                  &nbsp;
-                  <EuiIconTip
-                    type="iInCircle"
-                    color="text"
-                    aria-label={dataView.info}
-                    content={dataView.info}
-                  />{' '}
-                </>
-              ) : null}
+              {dataView.getName()}
+              <>
+                &nbsp;
+                <EuiIconTip
+                  type="iInCircle"
+                  color="text"
+                  aria-label={dataView.title}
+                  content={dataView.title}
+                />{' '}
+              </>
             </span>
           </EuiLink>
           {dataView?.id?.indexOf(securitySolution) === 0 && (
diff --git a/src/plugins/data_view_management/public/components/types.ts b/src/plugins/data_view_management/public/components/types.ts
index 236f982c3d046..b8e72e56c70ba 100644
--- a/src/plugins/data_view_management/public/components/types.ts
+++ b/src/plugins/data_view_management/public/components/types.ts
@@ -20,4 +20,5 @@ export interface IndexPatternTableItem {
   tags?: Array<{ key: string; name: string }>;
   sort: string;
   namespaces?: string[];
+  getName: () => string;
 }
diff --git a/src/plugins/data_view_management/public/components/utils.test.ts b/src/plugins/data_view_management/public/components/utils.test.ts
index 07496b98ae83d..6576ba8cf9833 100644
--- a/src/plugins/data_view_management/public/components/utils.test.ts
+++ b/src/plugins/data_view_management/public/components/utils.test.ts
@@ -19,8 +19,7 @@ const indexPatternContractMock = {
       {
         id: 'test1',
         title: 'test name 1',
-        readableTitle: 'Test Name 1',
-        readableDescription: 'test name 1 description',
+        name: 'Test Name 1',
       },
     ])
   ),
diff --git a/src/plugins/data_view_management/public/components/utils.ts b/src/plugins/data_view_management/public/components/utils.ts
index cd906889c494e..947245c54e7a8 100644
--- a/src/plugins/data_view_management/public/components/utils.ts
+++ b/src/plugins/data_view_management/public/components/utils.ts
@@ -35,21 +35,22 @@ const isRollup = (indexPatternType: string = '') => {
 export async function getIndexPatterns(defaultIndex: string, dataViewsService: DataViewsContract) {
   const existingIndexPatterns = await dataViewsService.getIdsWithTitle(true);
   const indexPatternsListItems = existingIndexPatterns.map((idxPattern) => {
-    const { id, title, namespaces, readableTitle, readableDescription } = idxPattern;
+    const { id, title, namespaces, name } = idxPattern;
     const isDefault = defaultIndex === id;
     const tags = getTags(idxPattern, isDefault);
 
     return {
       id,
       namespaces,
-      title: readableTitle ? readableTitle : title,
-      info: readableDescription,
+      title,
+      name,
       default: isDefault,
       tags,
       // the prepending of 0 at the default pattern takes care of prioritization
       // so the sorting will but the default index on top
       // or on bottom of a the table
       sort: `${isDefault ? '0' : '1'}${title}`,
+      getName: () => (name ? name : title),
     };
   });
 
diff --git a/src/plugins/data_views/common/data_view.stub.ts b/src/plugins/data_views/common/data_view.stub.ts
index 23bce8a171c44..c4235aea0ab90 100644
--- a/src/plugins/data_views/common/data_view.stub.ts
+++ b/src/plugins/data_views/common/data_view.stub.ts
@@ -57,8 +57,7 @@ export function stubbedSavedObjectDataView(
       timeFieldName: 'time',
       fields: JSON.stringify(stubLogstashFieldSpecMap),
       title: 'title',
-      readableTitle: 'Title',
-      readableDescription: 'Title Description',
+      name: 'Name',
     },
     version: '2',
     references: [],
diff --git a/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap b/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
index b237c3b2d0041..38be2ae2d367f 100644
--- a/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
+++ b/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
@@ -801,8 +801,7 @@ Object {
     },
   },
   "id": "test-pattern",
-  "readableDescription": "Title Description",
-  "readableTitle": "Title",
+  "name": "Title",
   "runtimeFieldMap": Object {
     "runtime_field": Object {
       "script": Object {
diff --git a/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap b/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
index f81de5355ca3e..55fb93af6a5dc 100644
--- a/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
+++ b/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
@@ -41,8 +41,7 @@ Object {
   "fields": Object {},
   "id": "id",
   "namespaces": undefined,
-  "readableDescription": "Kibana * Description",
-  "readableTitle": "Kibana *",
+  "name": "Kibana *",
   "runtimeFieldMap": Object {
     "aRuntimeField": Object {
       "script": Object {
diff --git a/src/plugins/data_views/common/data_views/data_view.test.ts b/src/plugins/data_views/common/data_views/data_view.test.ts
index 25830fd8b0b3c..9435827a88d0f 100644
--- a/src/plugins/data_views/common/data_views/data_view.test.ts
+++ b/src/plugins/data_views/common/data_views/data_view.test.ts
@@ -48,7 +48,7 @@ function create(id: string) {
   const {
     type,
     version,
-    attributes: { timeFieldName, fields, title, readableTitle, readableDescription },
+    attributes: { timeFieldName, fields, title, name },
   } = stubbedSavedObjectIndexPattern(id);
 
   return new IndexPattern({
@@ -59,8 +59,7 @@ function create(id: string) {
       timeFieldName,
       fields: { ...JSON.parse(fields), runtime_field: runtimeField },
       title,
-      readableTitle,
-      readableDescription,
+      name,
       runtimeFieldMap,
     },
     fieldFormats: fieldFormatsMock,
diff --git a/src/plugins/data_views/common/data_views/data_view.ts b/src/plugins/data_views/common/data_views/data_view.ts
index f8f1b1a61d043..dbe63355dbddb 100644
--- a/src/plugins/data_views/common/data_views/data_view.ts
+++ b/src/plugins/data_views/common/data_views/data_view.ts
@@ -87,8 +87,7 @@ export class DataView implements IIndexPattern {
    * prevents errors when index pattern exists before indices
    */
   public readonly allowNoIndex: boolean = false;
-  public readableTitle: string = '';
-  public readableDescription: string = '';
+  public name: string = '';
 
   constructor({ spec = {}, fieldFormats, shortDotsEnable = false, metaFields = [] }: DataViewDeps) {
     // set dependencies
@@ -117,10 +116,14 @@ export class DataView implements IIndexPattern {
     this.allowNoIndex = spec.allowNoIndex || false;
     this.runtimeFieldMap = spec.runtimeFieldMap || {};
     this.namespaces = spec.namespaces || [];
-    this.readableTitle = spec.readableTitle || '';
-    this.readableDescription = spec.readableDescription || '';
+    this.name = spec.name || '';
   }
 
+  /**
+   * Get name of Data View
+   */
+  getName = () => (this.name ? this.name : this.title);
+
   /**
    * Get last saved saved object fields
    */
@@ -219,8 +222,7 @@ export class DataView implements IIndexPattern {
       runtimeFieldMap: this.runtimeFieldMap,
       fieldAttrs: this.fieldAttrs,
       allowNoIndex: this.allowNoIndex,
-      readableTitle: this.readableTitle,
-      readableDescription: this.readableDescription,
+      name: this.name,
     };
   }
 
@@ -306,8 +308,7 @@ export class DataView implements IIndexPattern {
       typeMeta: JSON.stringify(this.typeMeta ?? {}),
       allowNoIndex: this.allowNoIndex ? this.allowNoIndex : undefined,
       runtimeFieldMap: runtimeFieldMap ? JSON.stringify(runtimeFieldMap) : undefined,
-      readableTitle: this.readableTitle,
-      readableDescription: this.readableDescription,
+      name: this.name,
     };
   }
 
diff --git a/src/plugins/data_views/common/data_views/data_views.test.ts b/src/plugins/data_views/common/data_views/data_views.test.ts
index c3084e0bf494a..e05254a7f7c0f 100644
--- a/src/plugins/data_views/common/data_views/data_views.test.ts
+++ b/src/plugins/data_views/common/data_views/data_views.test.ts
@@ -33,8 +33,7 @@ const savedObject = {
   version: 'version',
   attributes: {
     title: 'kibana-*',
-    readableTitle: 'Kibana *',
-    readableDescription: 'Kibana * Description',
+    name: 'Kibana *',
     timeFieldName: '@timestamp',
     fields: '[]',
     sourceFilters: '[{"value":"item1"},{"value":"item2"}]',
@@ -161,7 +160,7 @@ describe('IndexPatterns', () => {
     expect(await indexPatterns.getIds()).toEqual(['id']);
     expect(savedObjectsClient.find).toHaveBeenCalledWith({
       type: 'index-pattern',
-      fields: ['title', 'type', 'typeMeta', 'readableTitle', 'readableDescription'],
+      fields: ['title', 'type', 'typeMeta', 'name'],
       perPage: 10000,
     });
   });
diff --git a/src/plugins/data_views/common/data_views/data_views.ts b/src/plugins/data_views/common/data_views/data_views.ts
index 2ce7f50df0f52..fa4e5de2b74b6 100644
--- a/src/plugins/data_views/common/data_views/data_views.ts
+++ b/src/plugins/data_views/common/data_views/data_views.ts
@@ -45,12 +45,12 @@ const MAX_ATTEMPTS_TO_RESOLVE_CONFLICTS = 3;
 
 export type IndexPatternSavedObjectAttrs = Pick<
   DataViewAttributes,
-  'title' | 'type' | 'typeMeta' | 'readableTitle' | 'readableDescription'
+  'title' | 'type' | 'typeMeta' | 'name'
 >;
 
 export type IndexPatternListSavedObjectAttrs = Pick<
   DataViewAttributes,
-  'title' | 'type' | 'typeMeta' | 'readableTitle' | 'readableDescription'
+  'title' | 'type' | 'typeMeta' | 'name'
 >;
 
 export interface DataViewListItem {
@@ -59,8 +59,7 @@ export interface DataViewListItem {
   title: string;
   type?: string;
   typeMeta?: TypeMeta;
-  readableTitle?: string;
-  readableDescription?: string;
+  name?: string;
 }
 
 export interface DataViewsServiceDeps {
@@ -157,7 +156,7 @@ export class DataViewsService {
   private async refreshSavedObjectsCache() {
     const so = await this.savedObjectsClient.find<IndexPatternSavedObjectAttrs>({
       type: DATA_VIEW_SAVED_OBJECT_TYPE,
-      fields: ['title', 'type', 'typeMeta', 'readableTitle', 'readableDescription'],
+      fields: ['title', 'type', 'typeMeta', 'name'],
       perPage: 10000,
     });
     this.savedObjectsCache = so;
@@ -228,8 +227,7 @@ export class DataViewsService {
       title: obj?.attributes?.title,
       type: obj?.attributes?.type,
       typeMeta: obj?.attributes?.typeMeta && JSON.parse(obj?.attributes?.typeMeta),
-      readableTitle: obj?.attributes?.readableTitle,
-      readableDescription: obj?.attributes?.readableDescription,
+      name: obj?.attributes?.name,
     }));
   };
 
@@ -437,8 +435,7 @@ export class DataViewsService {
         type,
         fieldAttrs,
         allowNoIndex,
-        readableTitle,
-        readableDescription,
+        name,
       },
     } = savedObject;
 
@@ -465,8 +462,7 @@ export class DataViewsService {
       fieldAttrs: parsedFieldAttrs,
       allowNoIndex,
       runtimeFieldMap: parsedRuntimeFieldMap,
-      readableTitle,
-      readableDescription,
+      name,
     };
   };
 
diff --git a/src/plugins/data_views/common/types.ts b/src/plugins/data_views/common/types.ts
index 5c53b2865e32e..6eb8f6ed65291 100644
--- a/src/plugins/data_views/common/types.ts
+++ b/src/plugins/data_views/common/types.ts
@@ -103,8 +103,7 @@ export interface DataViewAttributes {
    * prevents errors when index pattern exists before indices
    */
   allowNoIndex?: boolean;
-  readableTitle?: string;
-  readableDescription?: string;
+  name?: string;
 }
 
 /**
@@ -286,8 +285,7 @@ export interface DataViewSpec {
   fieldAttrs?: FieldAttrs;
   allowNoIndex?: boolean;
   namespaces?: string[];
-  readableTitle?: string;
-  readableDescription?: string;
+  name?: string;
 }
 
 export interface SourceFilter {
diff --git a/src/plugins/data_views/server/rest_api_routes/create_data_view.ts b/src/plugins/data_views/server/rest_api_routes/create_data_view.ts
index 3de40dd6b2ba1..57e988a115821 100644
--- a/src/plugins/data_views/server/rest_api_routes/create_data_view.ts
+++ b/src/plugins/data_views/server/rest_api_routes/create_data_view.ts
@@ -68,8 +68,7 @@ const dataViewSpecSchema = schema.object({
   ),
   allowNoIndex: schema.maybe(schema.boolean()),
   runtimeFieldMap: schema.maybe(schema.recordOf(schema.string(), runtimeFieldSchema)),
-  readableTitle: schema.maybe(schema.string()),
-  readableDescription: schema.maybe(schema.string()),
+  name: schema.maybe(schema.string()),
 });
 
 const registerCreateDataViewRouteFactory =
diff --git a/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap b/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
index ef51952362385..a0dc0addc39ec 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
+++ b/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
@@ -656,8 +656,7 @@ exports[`Discover DataView Management renders correctly 1`] = `
         ],
         "namespaces": Array [],
         "originalSavedObjectBody": Object {},
-        "readableDescription": "",
-        "readableTitle": "",
+        "name": "",
         "resetOriginalSavedObjectBody": [Function],
         "runtimeFieldMap": Object {},
         "setFieldFormat": [Function],
diff --git a/src/plugins/discover/public/application/main/components/sidebar/change_indexpattern.tsx b/src/plugins/discover/public/application/main/components/sidebar/change_indexpattern.tsx
index 1e2b5b8a32ec2..2a2db2d716e21 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/change_indexpattern.tsx
+++ b/src/plugins/discover/public/application/main/components/sidebar/change_indexpattern.tsx
@@ -76,8 +76,8 @@ export function ChangeIndexPattern({
           {...selectableProps}
           searchable
           singleSelection="always"
-          options={indexPatternRefs.map(({ title, id, readableTitle }) => ({
-            label: readableTitle ? readableTitle : title,
+          options={indexPatternRefs.map(({ title, id, name }) => ({
+            label: name ? name : title,
             key: id,
             value: id,
             checked: id === indexPatternId ? 'on' : undefined,
diff --git a/src/plugins/discover/public/application/main/components/sidebar/discover_index_pattern.tsx b/src/plugins/discover/public/application/main/components/sidebar/discover_index_pattern.tsx
index 1c44327b7b16c..0f0f7e6a019ff 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/discover_index_pattern.tsx
+++ b/src/plugins/discover/public/application/main/components/sidebar/discover_index_pattern.tsx
@@ -38,21 +38,21 @@ export function DiscoverIndexPattern({
   const options: IndexPatternRef[] = (indexPatternList || []).map((entity) => ({
     id: entity.id,
     title: entity.attributes!.title,
-    readableTitle: entity.attributes?.readableTitle,
+    name: entity.attributes?.name,
   }));
   const {
     id: selectedId,
     title: selectedTitle,
-    readableTitle: selectedReadableTitle,
+    getName: selectedGetName,
   } = selectedIndexPattern || {};
 
   const [selected, setSelected] = useState({
     id: selectedId,
-    title: selectedReadableTitle ? selectedReadableTitle : selectedTitle || '',
+    title: selectedGetName ? selectedGetName() : selectedTitle || '',
   });
   useEffect(() => {
-    const { id, title, readableTitle } = selectedIndexPattern;
-    setSelected({ id, title: readableTitle ? readableTitle : title });
+    const { id } = selectedIndexPattern;
+    setSelected({ id, title: selectedIndexPattern.getName() });
   }, [selectedIndexPattern]);
   if (!selectedId) {
     return null;
diff --git a/src/plugins/discover/public/application/main/components/sidebar/types.ts b/src/plugins/discover/public/application/main/components/sidebar/types.ts
index f35402ccdf80e..e434d55f729c2 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/types.ts
+++ b/src/plugins/discover/public/application/main/components/sidebar/types.ts
@@ -9,7 +9,7 @@
 export interface IndexPatternRef {
   id: string;
   title: string;
-  readableTitle?: string;
+  name?: string;
 }
 
 export interface FieldDetails {
diff --git a/src/plugins/saved_objects/public/finder/saved_object_finder.tsx b/src/plugins/saved_objects/public/finder/saved_object_finder.tsx
index a4c8f1f64276b..4f8f34c707d22 100644
--- a/src/plugins/saved_objects/public/finder/saved_object_finder.tsx
+++ b/src/plugins/saved_objects/public/finder/saved_object_finder.tsx
@@ -52,12 +52,14 @@ export interface SavedObjectMetaData<T = unknown> {
 
 interface FinderAttributes {
   title?: string;
+  name?: string;
   type: string;
 }
 
 interface SavedObjectFinderState {
   items: Array<{
     title: string | null;
+    name: string | null;
     id: SimpleSavedObject['id'];
     type: SimpleSavedObject['type'];
     savedObject: SimpleSavedObject<FinderAttributes>;
@@ -121,7 +123,7 @@ class SavedObjectFinderUi extends React.Component<
 
     const fields = Object.values(metaDataMap)
       .map((metaData) => metaData.includeFields || [])
-      .reduce((allFields, currentFields) => allFields.concat(currentFields), ['title']);
+      .reduce((allFields, currentFields) => allFields.concat(currentFields), ['title', 'name']);
 
     const perPage = this.props.uiSettings.get(LISTING_LIMIT_SETTING);
     const resp = await this.props.savedObjects.client.find<FinderAttributes>({
@@ -155,13 +157,14 @@ class SavedObjectFinderUi extends React.Component<
         page: 0,
         items: resp.savedObjects.map((savedObject) => {
           const {
-            attributes: { title },
+            attributes: { name, title },
             id,
             type,
           } = savedObject;
-
+          const titleToUse = typeof title === 'string' ? title : '';
           return {
-            title: typeof title === 'string' ? title : '',
+            title: titleToUse,
+            name: typeof name === 'string' ? name : titleToUse,
             id,
             type,
             savedObject,
@@ -462,7 +465,7 @@ class SavedObjectFinderUi extends React.Component<
               )!;
               const fullName = currentSavedObjectMetaData.getTooltipForSavedObject
                 ? currentSavedObjectMetaData.getTooltipForSavedObject(item.savedObject)
-                : `${item.title} (${currentSavedObjectMetaData!.name})`;
+                : `${item.name} (${currentSavedObjectMetaData!.name})`;
               const iconType = (
                 currentSavedObjectMetaData ||
                 ({
@@ -473,7 +476,7 @@ class SavedObjectFinderUi extends React.Component<
                 <EuiListGroupItem
                   key={item.id}
                   iconType={iconType}
-                  label={item.title}
+                  label={item.name}
                   onClick={
                     onChoose
                       ? () => {
diff --git a/src/plugins/vis_default_editor/public/components/sidebar/sidebar_title.tsx b/src/plugins/vis_default_editor/public/components/sidebar/sidebar_title.tsx
index af800c857f0cb..28e82765a254f 100644
--- a/src/plugins/vis_default_editor/public/components/sidebar/sidebar_title.tsx
+++ b/src/plugins/vis_default_editor/public/components/sidebar/sidebar_title.tsx
@@ -167,11 +167,11 @@ function SidebarTitle({ savedSearch, vis, isLinkedSearch, eventEmitter }: Sideba
         title={i18n.translate('visDefaultEditor.sidebar.indexPatternAriaLabel', {
           defaultMessage: 'Index pattern: {title}',
           values: {
-            title: vis.data.indexPattern!.title,
+            title: vis.data.indexPattern!.getName(),
           },
         })}
       >
-        {vis.data.indexPattern!.title}
+        {vis.data.indexPattern!.getName()}
       </h2>
     </EuiTitle>
   ) : (
diff --git a/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/combo_box_select.tsx b/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/combo_box_select.tsx
index be32104289d09..95202ba5e3a1c 100644
--- a/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/combo_box_select.tsx
+++ b/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/combo_box_select.tsx
@@ -23,7 +23,7 @@ type IdsWithTitle = Awaited<ReturnType<DataViewsService['getIdsWithTitle']>>;
 type SelectedOptions = EuiComboBoxProps<string>['selectedOptions'];
 
 const toComboBoxOptions = (options: IdsWithTitle) =>
-  options.map(({ title, id }) => ({ label: title, id }));
+  options.map(({ name, title, id }) => ({ label: name ? name : title, id }));
 
 export const ComboBoxSelect = ({
   fetchedIndex,
@@ -55,7 +55,7 @@ export const ComboBoxSelect = ({
         options = [
           {
             id: indexPattern.id,
-            label: indexPattern.title,
+            label: indexPattern.getName(),
           },
         ];
       }
diff --git a/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/index_pattern_select.tsx b/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/index_pattern_select.tsx
index 6cc1c8d1e6968..39b5a45e866bf 100644
--- a/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/index_pattern_select.tsx
+++ b/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/index_pattern_select.tsx
@@ -129,7 +129,7 @@ export const IndexPatternSelect = ({
         allowSwitchMode={allowIndexSwitchingMode}
         onIndexChange={onIndexChange}
         onModeChange={onModeChange}
-        placeholder={fetchedIndex.defaultIndex?.title ?? ''}
+        placeholder={fetchedIndex.defaultIndex?.getName() ?? ''}
         data-test-subj="metricsIndexPatternInput"
       />
     </EuiFormRow>
diff --git a/test/functional/apps/discover/_data_view_editor.ts b/test/functional/apps/discover/_data_view_editor.ts
index c67964fddf93b..76498a75b8e64 100644
--- a/test/functional/apps/discover/_data_view_editor.ts
+++ b/test/functional/apps/discover/_data_view_editor.ts
@@ -22,7 +22,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
   const createDataView = async (dataViewName: string) => {
     await PageObjects.discover.clickIndexPatternActions();
     await PageObjects.discover.clickCreateNewDataView();
-    await testSubjects.setValue('createIndexPatternNameInput', dataViewName, {
+    await testSubjects.setValue('createIndexPatternTitleInput', dataViewName, {
       clearWithKeyboard: true,
       typeCharByChar: true,
     });
diff --git a/test/functional/page_objects/settings_page.ts b/test/functional/page_objects/settings_page.ts
index 0a28ecf876c40..8dbdd2a92bda7 100644
--- a/test/functional/page_objects/settings_page.ts
+++ b/test/functional/page_objects/settings_page.ts
@@ -140,7 +140,7 @@ export class SettingsPageObject extends FtrService {
   }
 
   async getIndexPatternField() {
-    return this.testSubjects.find('createIndexPatternNameInput');
+    return this.testSubjects.find('createIndexPatternTitleInput');
   }
 
   async getTimeFieldNameField() {
@@ -160,28 +160,14 @@ export class SettingsPageObject extends FtrService {
     return await this.find.displayedByCssSelector('option[value="' + selection + '"]');
   }
 
-  async getReadableTitleField() {
-    return this.testSubjects.find('createIndexPatternReadableTitleInput');
-  }
-
-  async setReadableTitleField(indexPatternTitle: string) {
-    const field = await this.getReadableTitleField();
-    field.clearValue();
-    field.type(indexPatternTitle);
-  }
-
-  async getReadableDescriptionField() {
-    const exists = await this.testSubjects.exists('showIndexPatternReadableDescriptionInput');
-    if (exists) {
-      await this.testSubjects.click('showIndexPatternReadableDescriptionInput');
-    }
-    return this.testSubjects.find('createIndexPatternReadableDescriptionInput');
+  async getNameField() {
+    return this.testSubjects.find('createIndexPatternNameInput');
   }
 
-  async setReadableDescriptionField(indexPatternDescription: string) {
-    const field = await this.getReadableDescriptionField();
+  async setNameField(indexPatternName: string) {
+    const field = await this.getNameField();
     field.clearValue();
-    field.type(indexPatternDescription);
+    field.type(indexPatternName);
   }
 
   async getSaveIndexPatternButton() {
@@ -428,8 +414,7 @@ export class SettingsPageObject extends FtrService {
     // null to bypass default value
     timefield: string | null = '@timestamp',
     isStandardIndexPattern = true,
-    indexPatternTitle?: string,
-    indexPatternDescription?: string
+    indexPatternName?: string
   ) {
     await this.retry.try(async () => {
       await this.header.waitUntilLoadingHasFinished();
@@ -460,11 +445,8 @@ export class SettingsPageObject extends FtrService {
       if (timefield) {
         await this.selectTimeFieldOption(timefield);
       }
-      if (indexPatternTitle) {
-        await this.setReadableTitleField(indexPatternTitle);
-      }
-      if (indexPatternDescription) {
-        await this.setReadableDescriptionField(indexPatternDescription);
+      if (indexPatternName) {
+        await this.setNameField(indexPatternName);
       }
       await (await this.getSaveIndexPatternButton()).click();
     });
@@ -492,8 +474,7 @@ export class SettingsPageObject extends FtrService {
     indexPatternName: string,
     // null to bypass default value
     timefield: string | null = '@timestamp',
-    indexPatternTitle?: string,
-    indexPatternDescription?: string
+    indexPatternName?: string
   ) {
     if (!indexPatternName) {
       throw new Error('No Data View name provided for edit');
@@ -509,11 +490,8 @@ export class SettingsPageObject extends FtrService {
     if (timefield) {
       await this.selectTimeFieldOption(timefield);
     }
-    if (indexPatternTitle) {
-      await this.setReadableTitleField(indexPatternTitle);
-    }
-    if (indexPatternDescription) {
-      await this.setReadableDescriptionField(indexPatternDescription);
+    if (indexPatternName) {
+      await this.setNameField(indexPatternName);
     }
     await (await this.getSaveIndexPatternButton()).click();
 
diff --git a/test/functional_ccs/apps/discover/data_view_ccs.ts b/test/functional_ccs/apps/discover/data_view_ccs.ts
index 5fc39ff5705df..81ab59b16e094 100644
--- a/test/functional_ccs/apps/discover/data_view_ccs.ts
+++ b/test/functional_ccs/apps/discover/data_view_ccs.ts
@@ -20,7 +20,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
   const createDataView = async (dataViewName: string) => {
     await PageObjects.discover.clickIndexPatternActions();
     await PageObjects.discover.clickCreateNewDataView();
-    await testSubjects.setValue('createIndexPatternNameInput', dataViewName, {
+    await testSubjects.setValue('createIndexPatternTitleInput', dataViewName, {
       clearWithKeyboard: true,
       typeCharByChar: true,
     });
diff --git a/x-pack/plugins/cases/public/components/markdown_editor/plugins/lens/saved_objects_finder.tsx b/x-pack/plugins/cases/public/components/markdown_editor/plugins/lens/saved_objects_finder.tsx
index e33704c4d690f..762bed6277434 100644
--- a/x-pack/plugins/cases/public/components/markdown_editor/plugins/lens/saved_objects_finder.tsx
+++ b/x-pack/plugins/cases/public/components/markdown_editor/plugins/lens/saved_objects_finder.tsx
@@ -51,12 +51,14 @@ export interface SavedObjectMetaData<T = unknown> {
 
 interface FinderAttributes {
   title?: string;
+  name?: string;
   type: string;
 }
 
 interface SavedObjectFinderState {
   items: Array<{
     title: string | null;
+    name: string | null;
     id: SimpleSavedObject['id'];
     type: SimpleSavedObject['type'];
     savedObject: SimpleSavedObject<FinderAttributes>;
@@ -126,7 +128,7 @@ export class SavedObjectFinderUi extends React.Component<
 
     const fields = Object.values(metaDataMap)
       .map((metaData) => metaData.includeFields || [])
-      .reduce((allFields, currentFields) => allFields.concat(currentFields), ['title']);
+      .reduce((allFields, currentFields) => allFields.concat(currentFields), ['title', 'name']);
 
     const perPage = this.props.uiSettings.get(LISTING_LIMIT_SETTING);
     const resp = await this.props.savedObjects.client.find<FinderAttributes>({
@@ -160,13 +162,14 @@ export class SavedObjectFinderUi extends React.Component<
         page: 0,
         items: resp.savedObjects.map((savedObject) => {
           const {
-            attributes: { title },
+            attributes: { name, title },
             id,
             type,
           } = savedObject;
-
+          const titleToUse = typeof title === 'string' ? title : '';
           return {
-            title: typeof title === 'string' ? title : '',
+            title: titleToUse,
+            name: typeof name === 'string' ? name : titleToUse,
             id,
             type,
             savedObject,
@@ -491,7 +494,7 @@ export class SavedObjectFinderUi extends React.Component<
 
                 const fullName = currentSavedObjectMetaData.getTooltipForSavedObject
                   ? currentSavedObjectMetaData.getTooltipForSavedObject(item.savedObject)
-                  : `${item.title} (${currentSavedObjectMetaData.name})`;
+                  : `${item.name} (${currentSavedObjectMetaData.name})`;
 
                 const iconType = (
                   currentSavedObjectMetaData ||
@@ -504,7 +507,7 @@ export class SavedObjectFinderUi extends React.Component<
                   <EuiListGroupItem
                     key={item.id}
                     iconType={iconType}
-                    label={item.title}
+                    label={item.name}
                     onClick={
                       onChoose
                         ? () => {
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/change_indexpattern.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/change_indexpattern.tsx
index b6c847e3ba4d5..0526927259a6a 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/change_indexpattern.tsx
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/change_indexpattern.tsx
@@ -85,10 +85,9 @@ export function ChangeIndexPattern({
             {...selectableProps}
             searchable
             singleSelection="always"
-            options={indexPatternRefs.map(({ title, id, readableTitle }) => ({
+            options={indexPatternRefs.map(({ title, id, name }) => ({
               key: id,
-              label: readableTitle ? `${readableTitle} (${title})` : title,
-              searchableLabel: title,
+              label: name ? name : title,
               value: id,
               checked: id === indexPatternId ? 'on' : undefined,
             }))}
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx
index 9ae6bc399b9cb..ba021da6ef835 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx
@@ -602,13 +602,6 @@ export const InnerIndexPatternDataPanel = function InnerIndexPatternDataPanel({
   );
 
   const [popoverOpen, setPopoverOpen] = useState(false);
-  const triggerLabel = indexPatternRefs.reduce(
-    (title, indexPatt) =>
-      indexPatt.title === currentIndexPattern.title && indexPatt.readableTitle
-        ? indexPatt.readableTitle
-        : title,
-    currentIndexPattern.title
-  );
   return (
     <ChildDragDropProvider {...dragDropContext}>
       <EuiFlexGroup
@@ -628,7 +621,7 @@ export const InnerIndexPatternDataPanel = function InnerIndexPatternDataPanel({
               <ChangeIndexPattern
                 data-test-subj="indexPattern-switcher"
                 trigger={{
-                  label: triggerLabel,
+                  label: currentIndexPattern.name,
                   title: currentIndexPattern.title,
                   'data-test-subj': 'indexPattern-switch-link',
                   fontWeight: 'bold',
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/layerpanel.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/layerpanel.tsx
index 52c8f4bd93680..c6f8786237716 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/layerpanel.tsx
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/layerpanel.tsx
@@ -26,19 +26,12 @@ export function LayerPanel({ state, layerId, onChangeIndexPattern }: IndexPatter
   const notFoundTitleLabel = i18n.translate('xpack.lens.layerPanel.missingDataView', {
     defaultMessage: 'Data view not found',
   });
-  const triggerLabel = state.indexPatternRefs.reduce(
-    (title, indexPatt) =>
-      indexPatt.title === indexPattern?.title && indexPatt.readableTitle
-        ? indexPatt.readableTitle
-        : title,
-    indexPattern?.title || notFoundTitleLabel
-  );
   return (
     <I18nProvider>
       <ChangeIndexPattern
         data-test-subj="indexPattern-switcher"
         trigger={{
-          label: triggerLabel,
+          label: indexPattern?.name || notFoundTitleLabel,
           title: indexPattern?.title || notFoundTitleLabel,
           'data-test-subj': 'lns_layerIndexPatternLabel',
           size: 's',
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts b/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts
index a8ad1885b3350..045282375d71c 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts
@@ -65,7 +65,7 @@ export function convertDataViewIntoLensIndexPattern(dataView: DataView): IndexPa
     })
     .concat(documentField);
 
-  const { typeMeta, title, timeFieldName, fieldFormatMap } = dataView;
+  const { typeMeta, title, timeFieldName, fieldFormatMap, getName } = dataView;
   if (typeMeta?.aggs) {
     const aggs = Object.keys(typeMeta.aggs);
     newFields.forEach((field, index) => {
@@ -85,6 +85,7 @@ export function convertDataViewIntoLensIndexPattern(dataView: DataView): IndexPa
   return {
     id: dataView.id!, // id exists for sure because we got index patterns by id
     title,
+    name: getName(),
     timeFieldName,
     fieldFormatMap:
       fieldFormatMap &&
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/types.ts b/x-pack/plugins/lens/public/indexpattern_datasource/types.ts
index 2e70b9d37b7a7..0c7b72c34cfdb 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/types.ts
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/types.ts
@@ -52,6 +52,7 @@ export interface IndexPattern {
   fields: IndexPatternField[];
   getFieldByName(name: string): IndexPatternField | undefined;
   title: string;
+  name: string;
   timeFieldName?: string;
   fieldFormatMap?: Record<
     string,
@@ -105,5 +106,5 @@ export interface IndexPatternPrivateState {
 export interface IndexPatternRef {
   id: string;
   title: string;
-  readableTitle?: string;
+  name?: string;
 }

From eb27e8ccc0b39cd6b892b4d81d7b9f3402e5c010 Mon Sep 17 00:00:00 2001
From: shivindera <shivindera@gmail.com>
Date: Mon, 4 Apr 2022 02:45:30 +0200
Subject: [PATCH 10/35] revert kibana.yaml change

---
 config/kibana.yml | 1 -
 1 file changed, 1 deletion(-)

diff --git a/config/kibana.yml b/config/kibana.yml
index 70d71845ac0c9..50ddad9a4b32a 100644
--- a/config/kibana.yml
+++ b/config/kibana.yml
@@ -9,7 +9,6 @@
 # The default is 'localhost', which usually means remote machines will not be able to connect.
 # To allow connections from remote users, set this parameter to a non-loopback address.
 #server.host: "localhost"
-server.host: '0.0.0.0'
 
 # Enables you to specify a path to mount Kibana at if you are running behind a proxy.
 # Use the `server.rewriteBasePath` setting to tell Kibana if it should remove the basePath

From 06208a1e18e3ecb1a48237bcb38a6468647ac97a Mon Sep 17 00:00:00 2001
From: shivindera <shivindera@gmail.com>
Date: Mon, 4 Apr 2022 03:08:25 +0200
Subject: [PATCH 11/35] fixes for failed tests

---
 .../data_views/common/data_views/data_views.ts   |  2 +-
 .../management/_index_pattern_create_delete.ts   |  7 +------
 test/functional/page_objects/settings_page.ts    | 16 ++++++++--------
 3 files changed, 10 insertions(+), 15 deletions(-)

diff --git a/src/plugins/data_views/common/data_views/data_views.ts b/src/plugins/data_views/common/data_views/data_views.ts
index fa4e5de2b74b6..3fd421489f66d 100644
--- a/src/plugins/data_views/common/data_views/data_views.ts
+++ b/src/plugins/data_views/common/data_views/data_views.ts
@@ -108,7 +108,7 @@ export interface DataViewsServicePublicMethods {
     indexPattern: DataView,
     saveAttempts?: number,
     ignoreErrors?: boolean
-  ) => Promise<void | Error>;
+  ) => Promise<DataView | void | Error>;
 }
 
 export class DataViewsService {
diff --git a/test/functional/apps/management/_index_pattern_create_delete.ts b/test/functional/apps/management/_index_pattern_create_delete.ts
index 8de3494774a1d..82412a48f2938 100644
--- a/test/functional/apps/management/_index_pattern_create_delete.ts
+++ b/test/functional/apps/management/_index_pattern_create_delete.ts
@@ -120,12 +120,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
 
     describe('edit index pattern', () => {
       it('edit index pattern details on edit click', async () => {
-        await PageObjects.settings.editIndexPattern(
-          'logstash-*',
-          '@timestamp',
-          'Logstash Star',
-          'Logstash Star description'
-        );
+        await PageObjects.settings.editIndexPattern('logstash-*', '@timestamp', 'Logstash Star');
 
         await retry.try(async () => {
           expect(await testSubjects.getVisibleText('indexPatternTitle')).to.contain(
diff --git a/test/functional/page_objects/settings_page.ts b/test/functional/page_objects/settings_page.ts
index 8dbdd2a92bda7..0589ea4805351 100644
--- a/test/functional/page_objects/settings_page.ts
+++ b/test/functional/page_objects/settings_page.ts
@@ -164,10 +164,10 @@ export class SettingsPageObject extends FtrService {
     return this.testSubjects.find('createIndexPatternNameInput');
   }
 
-  async setNameField(indexPatternName: string) {
+  async setNameField(dataViewName: string) {
     const field = await this.getNameField();
     field.clearValue();
-    field.type(indexPatternName);
+    field.type(dataViewName);
   }
 
   async getSaveIndexPatternButton() {
@@ -414,7 +414,7 @@ export class SettingsPageObject extends FtrService {
     // null to bypass default value
     timefield: string | null = '@timestamp',
     isStandardIndexPattern = true,
-    indexPatternName?: string
+    dataViewName?: string
   ) {
     await this.retry.try(async () => {
       await this.header.waitUntilLoadingHasFinished();
@@ -445,8 +445,8 @@ export class SettingsPageObject extends FtrService {
       if (timefield) {
         await this.selectTimeFieldOption(timefield);
       }
-      if (indexPatternName) {
-        await this.setNameField(indexPatternName);
+      if (dataViewName) {
+        await this.setNameField(dataViewName);
       }
       await (await this.getSaveIndexPatternButton()).click();
     });
@@ -474,7 +474,7 @@ export class SettingsPageObject extends FtrService {
     indexPatternName: string,
     // null to bypass default value
     timefield: string | null = '@timestamp',
-    indexPatternName?: string
+    dataViewName?: string
   ) {
     if (!indexPatternName) {
       throw new Error('No Data View name provided for edit');
@@ -490,8 +490,8 @@ export class SettingsPageObject extends FtrService {
     if (timefield) {
       await this.selectTimeFieldOption(timefield);
     }
-    if (indexPatternName) {
-      await this.setNameField(indexPatternName);
+    if (dataViewName) {
+      await this.setNameField(dataViewName);
     }
     await (await this.getSaveIndexPatternButton()).click();
 

From 9221c428b4cb916a7fcac7ada4f49a415ef73c7b Mon Sep 17 00:00:00 2001
From: shivindera <shivindera@gmail.com>
Date: Mon, 11 Apr 2022 18:00:02 +0200
Subject: [PATCH 12/35] fixes for broken tests

---
 .../public/components/__snapshots__/utils.test.ts.snap   | 9 +++++++--
 .../data_views/__snapshots__/data_view.test.ts.snap      | 2 +-
 .../data_views/__snapshots__/data_views.test.ts.snap     | 2 +-
 src/plugins/discover/public/__mocks__/index_pattern.ts   | 2 ++
 .../public/__mocks__/index_pattern_with_timefield.ts     | 2 ++
 .../discover_index_pattern_management.test.tsx.snap      | 3 ++-
 .../main/components/sidebar/change_indexpattern.test.tsx | 6 +++---
 .../public/application/main/discover_main_app.test.tsx   | 2 +-
 .../public/finder/saved_object_finder.test.tsx           | 8 ++++----
 .../lens/public/indexpattern_datasource/loader.ts        | 4 ++--
 .../plugins/lens/public/indexpattern_datasource/types.ts | 2 +-
 11 files changed, 26 insertions(+), 16 deletions(-)

diff --git a/src/plugins/data_view_management/public/components/__snapshots__/utils.test.ts.snap b/src/plugins/data_view_management/public/components/__snapshots__/utils.test.ts.snap
index f22258232aea9..f6835dacc4d2d 100644
--- a/src/plugins/data_view_management/public/components/__snapshots__/utils.test.ts.snap
+++ b/src/plugins/data_view_management/public/components/__snapshots__/utils.test.ts.snap
@@ -4,8 +4,9 @@ exports[`getting index patterns 1`] = `
 Array [
   Object {
     "default": true,
+    "getName": [Function],
     "id": "test",
-    "info": undefined,
+    "name": undefined,
     "namespaces": undefined,
     "sort": "0test name",
     "tags": Array [
@@ -18,9 +19,13 @@ Array [
   },
   Object {
     "default": false,
+    "getName": [Function],
     "id": "test1",
-    "info": "test name 1 description",
+    "name": "Test Name 1",
+    "namespaces": undefined,
+    "sort": "1test name 1",
     "tags": Array [],
+    "title": "test name 1",
   },
 ]
 `;
diff --git a/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap b/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
index 38be2ae2d367f..a20ae520fe0c5 100644
--- a/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
+++ b/src/plugins/data_views/common/data_views/__snapshots__/data_view.test.ts.snap
@@ -801,7 +801,7 @@ Object {
     },
   },
   "id": "test-pattern",
-  "name": "Title",
+  "name": "Name",
   "runtimeFieldMap": Object {
     "runtime_field": Object {
       "script": Object {
diff --git a/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap b/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
index 55fb93af6a5dc..0d646f4afc28d 100644
--- a/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
+++ b/src/plugins/data_views/common/data_views/__snapshots__/data_views.test.ts.snap
@@ -40,8 +40,8 @@ Object {
   },
   "fields": Object {},
   "id": "id",
-  "namespaces": undefined,
   "name": "Kibana *",
+  "namespaces": undefined,
   "runtimeFieldMap": Object {
     "aRuntimeField": Object {
       "script": Object {
diff --git a/src/plugins/discover/public/__mocks__/index_pattern.ts b/src/plugins/discover/public/__mocks__/index_pattern.ts
index becaa9934afce..6bd04a6523d23 100644
--- a/src/plugins/discover/public/__mocks__/index_pattern.ts
+++ b/src/plugins/discover/public/__mocks__/index_pattern.ts
@@ -75,8 +75,10 @@ fields.getAll = () => {
 const indexPattern = {
   id: 'the-index-pattern-id',
   title: 'the-index-pattern-title',
+  name: 'The Index Pattern Name',
   metaFields: ['_index', '_score'],
   fields,
+  getName: () => 'The Index Pattern Name',
   getComputedFields: () => ({ docvalueFields: [], scriptFields: {}, storedFields: ['*'] }),
   getSourceFiltering: () => ({}),
   getFieldByName: jest.fn(() => ({})),
diff --git a/src/plugins/discover/public/__mocks__/index_pattern_with_timefield.ts b/src/plugins/discover/public/__mocks__/index_pattern_with_timefield.ts
index 01f3f537f0745..f611fbb2ecd03 100644
--- a/src/plugins/discover/public/__mocks__/index_pattern_with_timefield.ts
+++ b/src/plugins/discover/public/__mocks__/index_pattern_with_timefield.ts
@@ -61,8 +61,10 @@ fields.getAll = () => {
 const indexPattern = {
   id: 'index-pattern-with-timefield-id',
   title: 'index-pattern-with-timefield',
+  name: 'The Index Pattern With Timefield',
   metaFields: ['_index', '_score'],
   fields,
+  getName: () => 'The Index Pattern With Timefield',
   getComputedFields: () => ({}),
   getSourceFiltering: () => ({}),
   getFieldByName: (name: string) => fields.getByName(name),
diff --git a/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap b/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
index a0dc0addc39ec..aa71f74f9efce 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
+++ b/src/plugins/discover/public/application/main/components/sidebar/__snapshots__/discover_index_pattern_management.test.tsx.snap
@@ -647,6 +647,7 @@ exports[`Discover DataView Management renders correctly 1`] = `
         ],
         "flattenHit": [Function],
         "getFieldAttrs": [Function],
+        "getName": [Function],
         "getOriginalSavedObjectBody": [Function],
         "id": "logstash-*",
         "metaFields": Array [
@@ -654,9 +655,9 @@ exports[`Discover DataView Management renders correctly 1`] = `
           "_type",
           "_source",
         ],
+        "name": "",
         "namespaces": Array [],
         "originalSavedObjectBody": Object {},
-        "name": "",
         "resetOriginalSavedObjectBody": [Function],
         "runtimeFieldMap": Object {},
         "setFieldFormat": [Function],
diff --git a/src/plugins/discover/public/application/main/components/sidebar/change_indexpattern.test.tsx b/src/plugins/discover/public/application/main/components/sidebar/change_indexpattern.test.tsx
index a5e93c1d895bc..c36d91e642f9d 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/change_indexpattern.test.tsx
+++ b/src/plugins/discover/public/application/main/components/sidebar/change_indexpattern.test.tsx
@@ -24,7 +24,7 @@ function getProps() {
     ],
     onChangeIndexPattern: jest.fn(),
     trigger: {
-      label: indexPatternMock.title,
+      label: indexPatternMock.getName(),
       title: indexPatternMock.title,
       'data-test-subj': 'indexPattern-switch-link',
     },
@@ -55,7 +55,7 @@ describe('ChangeIndexPattern', () => {
     const props = getProps();
     const comp = shallowWithIntl(<ChangeIndexPattern {...props} />);
     await act(async () => {
-      selectIndexPatternPickerOption(comp, indexPatternMock.title);
+      selectIndexPatternPickerOption(comp, indexPatternMock.getName());
     });
     expect(props.onChangeIndexPattern).toHaveBeenCalledTimes(0);
   });
@@ -63,7 +63,7 @@ describe('ChangeIndexPattern', () => {
     const props = getProps();
     const comp = shallowWithIntl(<ChangeIndexPattern {...props} />);
     await act(async () => {
-      selectIndexPatternPickerOption(comp, indexPatternWithTimefieldMock.title);
+      selectIndexPatternPickerOption(comp, indexPatternWithTimefieldMock.getName());
     });
     expect(props.onChangeIndexPattern).toHaveBeenCalledTimes(1);
     expect(props.onChangeIndexPattern).toHaveBeenCalledWith(indexPatternWithTimefieldMock.id);
diff --git a/src/plugins/discover/public/application/main/discover_main_app.test.tsx b/src/plugins/discover/public/application/main/discover_main_app.test.tsx
index 86cd009b86d77..8367030dc1eb7 100644
--- a/src/plugins/discover/public/application/main/discover_main_app.test.tsx
+++ b/src/plugins/discover/public/application/main/discover_main_app.test.tsx
@@ -43,7 +43,7 @@ describe('DiscoverMainApp', () => {
     );
 
     expect(findTestSubject(component, 'indexPattern-switch-link').text()).toBe(
-      indexPatternMock.title
+      indexPatternMock.name
     );
   });
 });
diff --git a/src/plugins/saved_objects/public/finder/saved_object_finder.test.tsx b/src/plugins/saved_objects/public/finder/saved_object_finder.test.tsx
index 758ae14db8e17..ad2f8179d7b5d 100644
--- a/src/plugins/saved_objects/public/finder/saved_object_finder.test.tsx
+++ b/src/plugins/saved_objects/public/finder/saved_object_finder.test.tsx
@@ -69,7 +69,7 @@ describe('SavedObjectsFinder', () => {
 
     expect(core.savedObjects.client.find).toHaveBeenCalledWith({
       type: ['search'],
-      fields: ['title'],
+      fields: ['title', 'name'],
       search: undefined,
       page: 1,
       perPage: 10,
@@ -224,7 +224,7 @@ describe('SavedObjectsFinder', () => {
 
       expect(core.savedObjects.client.find).toHaveBeenCalledWith({
         type: ['search'],
-        fields: ['title'],
+        fields: ['title', 'name'],
         search: 'abc*',
         page: 1,
         perPage: 10,
@@ -267,7 +267,7 @@ describe('SavedObjectsFinder', () => {
 
       expect(core.savedObjects.client.find).toHaveBeenCalledWith({
         type: ['type1', 'type2'],
-        fields: ['title', 'field1', 'field2', 'field3'],
+        fields: ['title', 'name', 'field1', 'field2', 'field3'],
         search: 'abc*',
         page: 1,
         perPage: 10,
@@ -333,7 +333,7 @@ describe('SavedObjectsFinder', () => {
 
     expect(core.savedObjects.client.find).toHaveBeenCalledWith({
       type: ['search', 'vis'],
-      fields: ['title'],
+      fields: ['title', 'name'],
       search: undefined,
       page: 1,
       perPage: 10,
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts b/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts
index 045282375d71c..116d0dec7d76d 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts
@@ -65,7 +65,7 @@ export function convertDataViewIntoLensIndexPattern(dataView: DataView): IndexPa
     })
     .concat(documentField);
 
-  const { typeMeta, title, timeFieldName, fieldFormatMap, getName } = dataView;
+  const { typeMeta, title, name, timeFieldName, fieldFormatMap } = dataView;
   if (typeMeta?.aggs) {
     const aggs = Object.keys(typeMeta.aggs);
     newFields.forEach((field, index) => {
@@ -85,7 +85,7 @@ export function convertDataViewIntoLensIndexPattern(dataView: DataView): IndexPa
   return {
     id: dataView.id!, // id exists for sure because we got index patterns by id
     title,
-    name: getName(),
+    name: name ? name : title,
     timeFieldName,
     fieldFormatMap:
       fieldFormatMap &&
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/types.ts b/x-pack/plugins/lens/public/indexpattern_datasource/types.ts
index 0c7b72c34cfdb..a74a06724e7c1 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/types.ts
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/types.ts
@@ -52,7 +52,7 @@ export interface IndexPattern {
   fields: IndexPatternField[];
   getFieldByName(name: string): IndexPatternField | undefined;
   title: string;
-  name: string;
+  name?: string;
   timeFieldName?: string;
   fieldFormatMap?: Record<
     string,

From 97795656a36d8c6ac67bb75bb7f729b9039c1f86 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Mon, 18 Apr 2022 15:24:38 +0200
Subject: [PATCH 13/35] fix functional tests 2

---
 .../status_message.test.tsx.snap              | 12 +++++-----
 .../status_message/status_message.tsx         | 12 +++++-----
 .../index_pattern_table.tsx                   | 22 +++++++++----------
 .../_index_pattern_create_delete.ts           |  5 +----
 .../indexpattern_datasource/datapanel.tsx     |  4 +++-
 5 files changed, 26 insertions(+), 29 deletions(-)

diff --git a/src/plugins/data_view_editor/public/components/preview_panel/status_message/__snapshots__/status_message.test.tsx.snap b/src/plugins/data_view_editor/public/components/preview_panel/status_message/__snapshots__/status_message.test.tsx.snap
index 47f660716b3de..4fd36e61c3f7d 100644
--- a/src/plugins/data_view_editor/public/components/preview_panel/status_message/__snapshots__/status_message.test.tsx.snap
+++ b/src/plugins/data_view_editor/public/components/preview_panel/status_message/__snapshots__/status_message.test.tsx.snap
@@ -10,7 +10,7 @@ exports[`StatusMessage should render with exact matches 1`] = `
     <span>
        
       <FormattedMessage
-        defaultMessage="Your data view matches {sourceCount} {sourceCount, plural, one {source} other {sources} }."
+        defaultMessage="Your index pattern matches {sourceCount} {sourceCount, plural, one {source} other {sources} }."
         id="indexPatternEditor.status.successLabel.successDetail"
         values={
           Object {
@@ -31,7 +31,7 @@ exports[`StatusMessage should render with no partial matches 1`] = `
   title={
     <span>
       <FormattedMessage
-        defaultMessage="The data view you entered doesn't match any data streams, indices, or index aliases. You can match {strongIndices}."
+        defaultMessage="The index pattern you entered doesn't match any data streams, indices, or index aliases. You can match {strongIndices}."
         id="indexPatternEditor.status.notMatchLabel.notMatchDetail"
         values={
           Object {
@@ -62,7 +62,7 @@ exports[`StatusMessage should render with partial matches 1`] = `
   title={
     <span>
       <FormattedMessage
-        defaultMessage="Your data view doesn't match any data streams, indices, or index aliases, but {strongIndices} {matchedIndicesLength, plural, one {is} other {are} } similar."
+        defaultMessage="Your index pattern doesn't match any data streams, indices, or index aliases, but {strongIndices} {matchedIndicesLength, plural, one {is} other {are} } similar."
         id="indexPatternEditor.status.partialMatchLabel.partialMatchDetail"
         values={
           Object {
@@ -94,7 +94,7 @@ exports[`StatusMessage should render without a query 1`] = `
   title={
     <span>
       <FormattedMessage
-        defaultMessage="Your data view can match {sourceCount, plural, one {# source} other {# sources} }."
+        defaultMessage="Your index pattern can match {sourceCount, plural, one {# source} other {# sources} }."
         id="indexPatternEditor.status.matchAnyLabel.matchAnyDetail"
         values={
           Object {
@@ -115,7 +115,7 @@ exports[`StatusMessage should show that no indices exist 1`] = `
   title={
     <span>
       <FormattedMessage
-        defaultMessage="No data streams, indices, or index aliases match your data view."
+        defaultMessage="No data streams, indices, or index aliases match your index pattern."
         id="indexPatternEditor.status.noSystemIndicesLabel"
         values={Object {}}
       />
@@ -132,7 +132,7 @@ exports[`StatusMessage should show that system indices exist 1`] = `
   title={
     <span>
       <FormattedMessage
-        defaultMessage="No data streams, indices, or index aliases match your data view."
+        defaultMessage="No data streams, indices, or index aliases match your index pattern."
         id="indexPatternEditor.status.noSystemIndicesLabel"
         values={Object {}}
       />
diff --git a/src/plugins/data_view_editor/public/components/preview_panel/status_message/status_message.tsx b/src/plugins/data_view_editor/public/components/preview_panel/status_message/status_message.tsx
index 53bd942e15edf..139586324ec21 100644
--- a/src/plugins/data_view_editor/public/components/preview_panel/status_message/status_message.tsx
+++ b/src/plugins/data_view_editor/public/components/preview_panel/status_message/status_message.tsx
@@ -49,7 +49,7 @@ const NoMatchNoIndicesStatusMessage = () => (
   <span>
     <FormattedMessage
       id="indexPatternEditor.status.notMatchLabel.notMatchNoIndicesDetail"
-      defaultMessage="The data view you entered doesn't match any data streams, indices, or index aliases."
+      defaultMessage="The index pattern you entered doesn't match any data streams, indices, or index aliases."
     />
   </span>
 );
@@ -75,7 +75,7 @@ export const StatusMessage: React.FC<StatusMessageProps> = ({
         <span>
           <FormattedMessage
             id="indexPatternEditor.status.matchAnyLabel.matchAnyDetail"
-            defaultMessage="Your data view can match {sourceCount, plural,
+            defaultMessage="Your index pattern can match {sourceCount, plural,
               one {# source}
               other {# sources}
             }."
@@ -88,7 +88,7 @@ export const StatusMessage: React.FC<StatusMessageProps> = ({
         <span>
           <FormattedMessage
             id="indexPatternEditor.status.noSystemIndicesWithPromptLabel"
-            defaultMessage="No data streams, indices, or index aliases match your data view."
+            defaultMessage="No data streams, indices, or index aliases match your index pattern."
           />
         </span>
       );
@@ -97,7 +97,7 @@ export const StatusMessage: React.FC<StatusMessageProps> = ({
         <span>
           <FormattedMessage
             id="indexPatternEditor.status.noSystemIndicesLabel"
-            defaultMessage="No data streams, indices, or index aliases match your data view."
+            defaultMessage="No data streams, indices, or index aliases match your index pattern."
           />
         </span>
       );
@@ -110,7 +110,7 @@ export const StatusMessage: React.FC<StatusMessageProps> = ({
         &nbsp;
         <FormattedMessage
           id="indexPatternEditor.status.successLabel.successDetail"
-          defaultMessage="Your data view matches {sourceCount} {sourceCount, plural,
+          defaultMessage="Your index pattern matches {sourceCount} {sourceCount, plural,
             one {source}
             other {sources}
           }."
@@ -127,7 +127,7 @@ export const StatusMessage: React.FC<StatusMessageProps> = ({
       <span>
         <FormattedMessage
           id="indexPatternEditor.status.partialMatchLabel.partialMatchDetail"
-          defaultMessage="Your data view doesn't match any data streams, indices, or index aliases, but {strongIndices}
+          defaultMessage="Your index pattern doesn't match any data streams, indices, or index aliases, but {strongIndices}
           {matchedIndicesLength, plural,
             one {is}
             other {are}
diff --git a/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx b/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
index cce159db2028b..16e1151965d71 100644
--- a/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
+++ b/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
@@ -211,18 +211,16 @@ export const IndexPatternTable = ({
       render: (name: string, dataView: IndexPatternTableItem) => (
         <div>
           <EuiLink {...reactRouterNavigate(history, `patterns/${dataView.id}`)}>
-            <span>
-              {dataView.getName()}
-              <>
-                &nbsp;
-                <EuiIconTip
-                  type="iInCircle"
-                  color="text"
-                  aria-label={dataView.title}
-                  content={dataView.title}
-                />{' '}
-              </>
-            </span>
+            {dataView.getName()}
+            <>
+              &nbsp;
+              <EuiIconTip
+                type="iInCircle"
+                color="text"
+                aria-label={dataView.title}
+                content={dataView.title}
+              />{' '}
+            </>
           </EuiLink>
           {dataView?.id?.indexOf(securitySolution) === 0 && (
             <>
diff --git a/test/functional/apps/management/_index_pattern_create_delete.ts b/test/functional/apps/management/_index_pattern_create_delete.ts
index 82412a48f2938..eb982e46b1a73 100644
--- a/test/functional/apps/management/_index_pattern_create_delete.ts
+++ b/test/functional/apps/management/_index_pattern_create_delete.ts
@@ -60,7 +60,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
 
         await retry.try(async () => {
           expect(await testSubjects.getVisibleText('createIndexPatternStatusMessage')).to.contain(
-            `The data view you entered doesn\'t match any data streams, indices, or index aliases.`
+            `The index pattern you entered doesn\'t match any data streams, indices, or index aliases.`
           );
         });
       });
@@ -126,9 +126,6 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
           expect(await testSubjects.getVisibleText('indexPatternTitle')).to.contain(
             `Logstash Star`
           );
-          expect(await testSubjects.getVisibleText('indexPatternDescription')).to.contain(
-            `Logstash Star description`
-          );
         });
       });
     });
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx
index 72b615757fb54..47caef8502d2b 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx
@@ -623,7 +623,9 @@ export const InnerIndexPatternDataPanel = function InnerIndexPatternDataPanel({
               <ChangeIndexPattern
                 data-test-subj="indexPattern-switcher"
                 trigger={{
-                  label: currentIndexPattern.name,
+                  label: currentIndexPattern.name
+                    ? currentIndexPattern.name
+                    : currentIndexPattern.title,
                   title: currentIndexPattern.title,
                   'data-test-subj': 'indexPattern-switch-link',
                   fontWeight: 'bold',

From 01348aae9e2c6efa2d65562f2c3ceff725807923 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Mon, 18 Apr 2022 20:14:09 +0200
Subject: [PATCH 14/35] add confirm modal for edit

---
 .../edit_data_view_changed_modal.tsx          |  89 ++++++++++++
 .../data_view_editor_flyout_content.tsx       |  27 +++-
 .../index_header/index_header.tsx             | 131 +++++++++---------
 .../index_pattern_table.tsx                   |  20 +--
 .../public/components/types.ts                |   1 +
 test/functional/page_objects/settings_page.ts |   3 +
 6 files changed, 193 insertions(+), 78 deletions(-)
 create mode 100644 src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx

diff --git a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
new file mode 100644
index 0000000000000..cceac8186df77
--- /dev/null
+++ b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
@@ -0,0 +1,89 @@
+/*
+ * 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 React, { useState } from 'react';
+import { EuiCallOut, EuiSpacer, EuiConfirmModal, EuiFieldText, EuiFormRow } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+
+const geti18nTexts = (dataViewName?: string) => ({
+  cancelButtonText: i18n.translate(
+    'indexPatternManagement.editDataView.editConfirmationModal.cancelButtonLabel',
+    {
+      defaultMessage: 'Cancel',
+    }
+  ),
+  confirmButtonText: i18n.translate(
+    'indexPatternManagement.editDataView.editConfirmationModal.saveButtonLabel',
+    {
+      defaultMessage: 'Edit',
+    }
+  ),
+  warningEditingDataView: i18n.translate(
+    'indexPatternManagement.editDataView.editConfirmationModal.warningEditingDataView',
+    {
+      defaultMessage:
+        'Are you sure you want to edit this data view? Changing it might have unwanted outcomes.',
+    }
+  ),
+  typeConfirm: i18n.translate(
+    'indexPatternManagement.editDataView.editConfirmationModal.typeConfirm',
+    {
+      defaultMessage: 'Enter CHANGE to continue',
+    }
+  ),
+  titleConfirmChanges: i18n.translate(
+    'indexPatternManagement.editDataView.editConfirmationModal.title',
+    {
+      defaultMessage: `Edit {name}`,
+      values: {
+        name: dataViewName ? `'${dataViewName}'` : 'data view',
+      },
+    }
+  ),
+});
+
+interface Props {
+  dataViewName?: string;
+  onConfirm: () => void;
+  onCancel: () => void;
+}
+
+export const EditDataViewChangedModal: React.FC<Props> = ({
+  dataViewName,
+  onCancel,
+  onConfirm,
+}) => {
+  const i18nTexts = geti18nTexts(dataViewName);
+  const [confirmContent, setConfirmContent] = useState<string>('');
+
+  return (
+    <EuiConfirmModal
+      title={i18nTexts.titleConfirmChanges}
+      data-test-subj="runtimeFieldSaveConfirmModal"
+      cancelButtonText={i18nTexts.cancelButtonText}
+      confirmButtonText={i18nTexts.confirmButtonText}
+      confirmButtonDisabled={confirmContent?.toUpperCase() !== 'CHANGE'}
+      onCancel={onCancel}
+      onConfirm={onConfirm}
+    >
+      <EuiCallOut
+        color="warning"
+        title={i18nTexts.warningEditingDataView}
+        iconType="alert"
+        size="s"
+      />
+      <EuiSpacer />
+      <EuiFormRow label={i18nTexts.typeConfirm}>
+        <EuiFieldText
+          value={confirmContent}
+          onChange={(e) => setConfirmContent(e.target.value)}
+          data-test-subj="saveModalConfirmText"
+        />
+      </EuiFormRow>
+    </EuiConfirmModal>
+  );
+};
diff --git a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
index 538adc363e519..01757f12559b3 100644
--- a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
@@ -24,6 +24,7 @@ import {
 
 import { ensureMinimumTime, getIndices, extractTimeFields, getMatchedIndices } from '../lib';
 import { FlyoutPanels } from './flyout_panels';
+import { EditDataViewChangedModal } from './confirm_modals/edit_data_view_changed_modal';
 
 import {
   MatchedItem,
@@ -122,7 +123,11 @@ const IndexPatternEditorFlyoutContentComponent = ({
         };
       }
 
-      await onSave(indexPatternStub);
+      if (editData && !editDataViewChangedModal) {
+        setEditDataViewChangedModal(true);
+      } else {
+        await onSave(indexPatternStub);
+      }
     },
   });
 
@@ -157,6 +162,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
     partialMatchedIndices: [],
     visibleIndices: [],
   });
+  const [editDataViewChangedModal, setEditDataViewChangedModal] = useState(false);
 
   // load all data sources and set initial matchedIndices
   const loadSources = useCallback(() => {
@@ -349,6 +355,24 @@ const IndexPatternEditorFlyoutContentComponent = ({
     <></>
   );
 
+  const renderModal = () => {
+    if (editDataViewChangedModal) {
+      return (
+        <EditDataViewChangedModal
+          dataViewName={form.getFields().name.value as string}
+          onConfirm={() => {
+            form.submit();
+          }}
+          onCancel={() => {
+            setEditDataViewChangedModal(false);
+          }}
+        />
+      );
+    }
+
+    return null;
+  };
+
   return (
     <EmptyPrompts onCancel={onCancel} allSources={allSources} loadSources={loadSources}>
       <FlyoutPanels.Group flyoutClassName={'indexPatternEditorFlyout'} maxWidth={1180}>
@@ -410,6 +434,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
           )}
         </FlyoutPanels.Item>
       </FlyoutPanels.Group>
+      {renderModal()}
     </EmptyPrompts>
   );
 };
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
index e651d1630a7ec..69d26c78e90a1 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
@@ -8,7 +8,7 @@
 
 import React, { useState } from 'react';
 import { i18n } from '@kbn/i18n';
-import { EuiButtonEmpty, EuiFlexGroup, EuiFlexItem, EuiPageHeader, EuiPopover } from '@elastic/eui';
+import { EuiButtonEmpty, EuiContextMenu, EuiIcon, EuiPageHeader, EuiPopover } from '@elastic/eui';
 import { DataView } from '@kbn/data-views-plugin/public';
 
 interface IndexHeaderProps {
@@ -59,78 +59,73 @@ export const IndexHeader: React.FC<IndexHeaderProps> = ({
 }) => {
   const [openActions, setOpenActions] = useState<boolean>(false);
 
+  const panelItems = [
+    {
+      name: editTooltip,
+      icon: 'pencil',
+      onClick: () => {
+        if (editIndexPatternClick) editIndexPatternClick();
+        setOpenActions(false);
+      },
+      'data-test-subj': 'editIndexPatternButton',
+      'aria-label': editAriaLabel,
+    },
+    {
+      name: removeTooltip,
+      icon: <EuiIcon type="trash" size="m" color="danger" />,
+      onClick: () => {
+        if (deleteIndexPatternClick) deleteIndexPatternClick();
+        setOpenActions(false);
+      },
+      'data-test-subj': 'deleteIndexPatternButton',
+      'aria-label': removeAriaLabel,
+    },
+  ];
+  if (defaultIndex !== indexPattern.id) {
+    panelItems.unshift({
+      name: setDefaultTooltip,
+      icon: 'starFilled',
+      onClick: () => {
+        if (setDefault) setDefault();
+        setOpenActions(false);
+      },
+      'data-test-subj': 'setDefaultIndexPatternButton',
+      'aria-label': setDefaultAriaLabel,
+    });
+  }
+
   return (
     <EuiPageHeader
       pageTitle={<span data-test-subj="indexPatternTitle">{indexPattern.getName()}</span>}
       rightSideItems={[
-        <EuiPopover
-          button={
-            <EuiButtonEmpty
-              iconType="arrowDown"
-              iconSide="right"
-              onClick={() => setOpenActions(true)}
-              aria-label={openActionsAriaLabel}
-              data-test-subj="openDataViewActions"
-            >
-              Actions
-            </EuiButtonEmpty>
-          }
-          isOpen={openActions}
-          closePopover={() => setOpenActions(false)}
-          anchorPosition="downRight"
-        >
-          <EuiFlexGroup
-            alignItems="flexStart"
-            direction="column"
-            onClick={() => setOpenActions(false)}
+        canSave && (
+          <EuiPopover
+            button={
+              <EuiButtonEmpty
+                iconType="arrowDown"
+                iconSide="right"
+                onClick={() => setOpenActions(!openActions)}
+                aria-label={openActionsAriaLabel}
+                data-test-subj="openDataViewActions"
+              >
+                Actions
+              </EuiButtonEmpty>
+            }
+            isOpen={openActions}
+            closePopover={() => setOpenActions(false)}
+            anchorPosition="downRight"
           >
-            {defaultIndex !== indexPattern.id && setDefault && canSave && (
-              <EuiFlexItem>
-                <EuiButtonEmpty
-                  color="text"
-                  onClick={setDefault}
-                  iconSide="left"
-                  iconType="starFilled"
-                  aria-label={setDefaultAriaLabel}
-                  data-test-subj="setDefaultIndexPatternButton"
-                  size="s"
-                >
-                  {setDefaultTooltip}
-                </EuiButtonEmpty>
-              </EuiFlexItem>
-            )}
-            {canSave && (
-              <EuiFlexItem>
-                <EuiButtonEmpty
-                  color="text"
-                  onClick={editIndexPatternClick}
-                  iconSide="left"
-                  iconType="pencil"
-                  aria-label={editAriaLabel}
-                  data-test-subj="editIndexPatternButton"
-                  size="s"
-                >
-                  {editTooltip}
-                </EuiButtonEmpty>
-              </EuiFlexItem>
-            )}
-            {canSave && (
-              <EuiFlexItem>
-                <EuiButtonEmpty
-                  color="danger"
-                  onClick={deleteIndexPatternClick}
-                  iconSide="left"
-                  iconType="trash"
-                  aria-label={removeAriaLabel}
-                  data-test-subj="deleteIndexPatternButton"
-                  size="s"
-                >
-                  {removeTooltip}
-                </EuiButtonEmpty>
-              </EuiFlexItem>
-            )}
-          </EuiFlexGroup>
-        </EuiPopover>,
+            <EuiContextMenu
+              initialPanelId={0}
+              panels={[
+                {
+                  id: 0,
+                  items: panelItems,
+                },
+              ]}
+            />
+          </EuiPopover>
+        ),
       ].filter(Boolean)}
     >
       {children}
diff --git a/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx b/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
index 16e1151965d71..7470e3218d50e 100644
--- a/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
+++ b/src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
@@ -212,15 +212,17 @@ export const IndexPatternTable = ({
         <div>
           <EuiLink {...reactRouterNavigate(history, `patterns/${dataView.id}`)}>
             {dataView.getName()}
-            <>
-              &nbsp;
-              <EuiIconTip
-                type="iInCircle"
-                color="text"
-                aria-label={dataView.title}
-                content={dataView.title}
-              />{' '}
-            </>
+            {dataView.name ? (
+              <>
+                &nbsp;
+                <EuiIconTip
+                  type="iInCircle"
+                  color="text"
+                  aria-label={dataView.title}
+                  content={dataView.title}
+                />
+              </>
+            ) : null}
           </EuiLink>
           {dataView?.id?.indexOf(securitySolution) === 0 && (
             <>
diff --git a/src/plugins/data_view_management/public/components/types.ts b/src/plugins/data_view_management/public/components/types.ts
index b8e72e56c70ba..e884f45ab4a31 100644
--- a/src/plugins/data_view_management/public/components/types.ts
+++ b/src/plugins/data_view_management/public/components/types.ts
@@ -15,6 +15,7 @@ export interface IndexPatternCreationOption {
 export interface IndexPatternTableItem {
   id: string;
   title: string;
+  name?: string;
   info?: string;
   default: boolean;
   tags?: Array<{ key: string; name: string }>;
diff --git a/test/functional/page_objects/settings_page.ts b/test/functional/page_objects/settings_page.ts
index de46d505b4f9d..5133633fa7438 100644
--- a/test/functional/page_objects/settings_page.ts
+++ b/test/functional/page_objects/settings_page.ts
@@ -503,6 +503,9 @@ export class SettingsPageObject extends FtrService {
     }
     await (await this.getSaveIndexPatternButton()).click();
 
+    await this.testSubjects.find('changeWarning');
+    await this.confirmSave();
+
     await this.header.waitUntilLoadingHasFinished();
     return await this.getIndexPatternIdFromUrl();
   }

From 2abd560c5a198433f52ea52ac9db21c6e49ff44c Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Mon, 18 Apr 2022 21:38:36 +0200
Subject: [PATCH 15/35] update header to match figma

---
 .../edit_data_view_changed_modal.tsx          | 18 ++--
 .../edit_index_pattern/edit_index_pattern.tsx | 96 ++++++++-----------
 test/functional/page_objects/settings_page.ts |  2 +-
 3 files changed, 49 insertions(+), 67 deletions(-)

diff --git a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
index cceac8186df77..86f5e997c0273 100644
--- a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
+++ b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
@@ -11,32 +11,29 @@ import { i18n } from '@kbn/i18n';
 
 const geti18nTexts = (dataViewName?: string) => ({
   cancelButtonText: i18n.translate(
-    'indexPatternManagement.editDataView.editConfirmationModal.cancelButtonLabel',
+    'indexPatternEditor.editDataView.editConfirmationModal.cancelButtonLabel',
     {
       defaultMessage: 'Cancel',
     }
   ),
   confirmButtonText: i18n.translate(
-    'indexPatternManagement.editDataView.editConfirmationModal.saveButtonLabel',
+    'indexPatternEditor.editDataView.editConfirmationModal.saveButtonLabel',
     {
       defaultMessage: 'Edit',
     }
   ),
   warningEditingDataView: i18n.translate(
-    'indexPatternManagement.editDataView.editConfirmationModal.warningEditingDataView',
+    'indexPatternEditor.editDataView.editConfirmationModal.warningEditingDataView',
     {
       defaultMessage:
         'Are you sure you want to edit this data view? Changing it might have unwanted outcomes.',
     }
   ),
-  typeConfirm: i18n.translate(
-    'indexPatternManagement.editDataView.editConfirmationModal.typeConfirm',
-    {
-      defaultMessage: 'Enter CHANGE to continue',
-    }
-  ),
+  typeConfirm: i18n.translate('indexPatternEditor.editDataView.editConfirmationModal.typeConfirm', {
+    defaultMessage: 'Enter CHANGE to continue',
+  }),
   titleConfirmChanges: i18n.translate(
-    'indexPatternManagement.editDataView.editConfirmationModal.title',
+    'indexPatternEditor.editDataView.editConfirmationModal.title',
     {
       defaultMessage: `Edit {name}`,
       values: {
@@ -75,6 +72,7 @@ export const EditDataViewChangedModal: React.FC<Props> = ({
         title={i18nTexts.warningEditingDataView}
         iconType="alert"
         size="s"
+        data-test-subj="editDataViewWarning"
       />
       <EuiSpacer />
       <EuiFormRow label={i18nTexts.typeConfirm}>
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
index a87c56dab2136..05317716145fa 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
@@ -14,8 +14,6 @@ import {
   EuiHorizontalRule,
   EuiSpacer,
   EuiBadge,
-  EuiText,
-  EuiLink,
   EuiCallOut,
   EuiCode,
 } from '@elastic/eui';
@@ -33,13 +31,6 @@ export interface EditIndexPatternProps extends RouteComponentProps {
   indexPattern: DataView;
 }
 
-const mappingAPILink = i18n.translate(
-  'indexPatternManagement.editIndexPattern.timeFilterLabel.mappingAPILink',
-  {
-    defaultMessage: 'field mappings',
-  }
-);
-
 const mappingConflictHeader = i18n.translate(
   'indexPatternManagement.editIndexPattern.mappingConflictHeader',
   {
@@ -110,11 +101,17 @@ export const EditIndexPattern = withRouter(
       setShowEditDialog(true);
     };
 
-    const timeFilterHeader = i18n.translate(
-      'indexPatternManagement.editIndexPattern.timeFilterHeader',
+    const indexPatternHeading = i18n.translate(
+      'indexPatternManagement.editIndexPattern.indexPatternHeading',
       {
-        defaultMessage: "Time field: '{timeFieldName}'",
-        values: { timeFieldName: indexPattern.timeFieldName },
+        defaultMessage: 'Index pattern:',
+      }
+    );
+
+    const timeFilterHeading = i18n.translate(
+      'indexPatternManagement.editIndexPattern.timeFilterHeading',
+      {
+        defaultMessage: 'Time field:',
       }
     );
 
@@ -133,9 +130,6 @@ export const EditIndexPattern = withRouter(
 
     chrome.docTitle.change(indexPattern.getName());
 
-    const showTagsSection = Boolean(indexPattern.timeFieldName || (tags && tags.length > 0));
-    const kibana = useKibana();
-    const docsUrl = kibana.services.docLinks!.links.elasticsearch.mapping;
     const userEditPermission = dataViews.getCanSaveSync();
 
     const warning =
@@ -171,45 +165,35 @@ export const EditIndexPattern = withRouter(
           canSave={userEditPermission}
         >
           <EuiHorizontalRule margin="none" />
-          {showTagsSection && (
-            <>
-              <EuiSpacer size="l" />
-              <EuiFlexGroup wrap gutterSize="s">
-                {Boolean(indexPattern.timeFieldName) && (
-                  <EuiFlexItem grow={false}>
-                    <EuiBadge color="warning">{timeFilterHeader}</EuiBadge>
-                  </EuiFlexItem>
-                )}
-                {indexPattern.id && indexPattern.id.indexOf(securitySolution) === 0 && (
-                  <EuiFlexItem grow={false}>
-                    <EuiBadge>{securityDataView}</EuiBadge>
-                  </EuiFlexItem>
-                )}
-                {tags.map((tag: any) => (
-                  <EuiFlexItem grow={false} key={tag.key}>
-                    <EuiBadge color="hollow">{tag.name}</EuiBadge>
-                  </EuiFlexItem>
-                ))}
-              </EuiFlexGroup>
-            </>
-          )}
-          <EuiSpacer size="m" />
-          <EuiText>
-            <p>
-              <FormattedMessage
-                id="indexPatternManagement.editIndexPattern.timeFilterLabel.timeFilterDetail"
-                defaultMessage="View and edit fields in {indexPatternTitle}. Field attributes, such as type and searchability, are based on {mappingAPILink} in Elasticsearch."
-                values={{
-                  indexPatternTitle: <strong>{indexPattern.title}</strong>,
-                  mappingAPILink: (
-                    <EuiLink href={docsUrl} target="_blank" external>
-                      {mappingAPILink}
-                    </EuiLink>
-                  ),
-                }}
-              />{' '}
-            </p>
-          </EuiText>
+          <EuiSpacer size="l" />
+          <EuiFlexGroup wrap gutterSize="l" alignItems="center">
+            {Boolean(indexPattern.title) && (
+              <EuiFlexItem grow={false}>
+                <EuiFlexGroup gutterSize="none" alignItems="center">
+                  {indexPatternHeading}
+                  <EuiCode>{indexPattern.title}</EuiCode>
+                </EuiFlexGroup>
+              </EuiFlexItem>
+            )}
+            {Boolean(indexPattern.timeFieldName) && (
+              <EuiFlexItem grow={false}>
+                <EuiFlexGroup gutterSize="none" alignItems="center">
+                  {timeFilterHeading}
+                  <EuiCode>{indexPattern.timeFieldName}</EuiCode>
+                </EuiFlexGroup>
+              </EuiFlexItem>
+            )}
+            {indexPattern.id && indexPattern.id.indexOf(securitySolution) === 0 && (
+              <EuiFlexItem grow={false}>
+                <EuiBadge>{securityDataView}</EuiBadge>
+              </EuiFlexItem>
+            )}
+            {tags.map((tag: any) => (
+              <EuiFlexItem grow={false} key={tag.key}>
+                <EuiBadge color={tag.key === 'default' ? 'default' : 'hollow'}>{tag.name}</EuiBadge>
+              </EuiFlexItem>
+            ))}
+          </EuiFlexGroup>
           {conflictedFields.length > 0 && (
             <>
               <EuiSpacer />
@@ -219,7 +203,7 @@ export const EditIndexPattern = withRouter(
             </>
           )}
         </IndexHeader>
-        <EuiSpacer />
+        <EuiSpacer size="xl" />
         <Tabs
           indexPattern={indexPattern}
           saveIndexPattern={dataViews.updateSavedObject.bind(dataViews)}
diff --git a/test/functional/page_objects/settings_page.ts b/test/functional/page_objects/settings_page.ts
index 5133633fa7438..afa9a5b5369a6 100644
--- a/test/functional/page_objects/settings_page.ts
+++ b/test/functional/page_objects/settings_page.ts
@@ -503,7 +503,7 @@ export class SettingsPageObject extends FtrService {
     }
     await (await this.getSaveIndexPatternButton()).click();
 
-    await this.testSubjects.find('changeWarning');
+    await this.testSubjects.find('editDataViewWarning');
     await this.confirmSave();
 
     await this.header.waitUntilLoadingHasFinished();

From 505ff3fb8d4942e1fd91d10750fc8d17601e6f51 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Mon, 18 Apr 2022 22:01:45 +0200
Subject: [PATCH 16/35] fix data views with index pattern

---
 .../public/components/data_view_editor_flyout_content.tsx     | 2 +-
 .../public/components/form_fields/name_field.tsx              | 2 +-
 .../public/components/form_fields/title_field.tsx             | 4 ++--
 src/plugins/data_view_editor/public/components/form_schema.ts | 4 ++--
 4 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
index 01757f12559b3..3d13f4721d5bf 100644
--- a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
@@ -179,7 +179,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
     });
   }, [http, allowHidden]);
 
-  // loading list of data views
+  // loading list of index patterns
   useEffect(() => {
     loadSources();
     const getTitles = async () => {
diff --git a/src/plugins/data_view_editor/public/components/form_fields/name_field.tsx b/src/plugins/data_view_editor/public/components/form_fields/name_field.tsx
index 33ac5879552a0..2ece118052349 100644
--- a/src/plugins/data_view_editor/public/components/form_fields/name_field.tsx
+++ b/src/plugins/data_view_editor/public/components/form_fields/name_field.tsx
@@ -23,7 +23,7 @@ export const NameField = ({ editData }: NameFieldProps) => {
       componentProps={{
         euiFieldProps: {
           'aria-label': i18n.translate('indexPatternEditor.form.nameAriaLabel', {
-            defaultMessage: 'Title field optional',
+            defaultMessage: 'Name field optional',
           }),
         },
       }}
diff --git a/src/plugins/data_view_editor/public/components/form_fields/title_field.tsx b/src/plugins/data_view_editor/public/components/form_fields/title_field.tsx
index c33fb323951b3..8bedc17d64135 100644
--- a/src/plugins/data_view_editor/public/components/form_fields/title_field.tsx
+++ b/src/plugins/data_view_editor/public/components/form_fields/title_field.tsx
@@ -62,7 +62,7 @@ const createTitlesNoDupesValidator = (
     if (namesNotAllowed.includes(value)) {
       return {
         message: i18n.translate('indexPatternEditor.dataViewExists.ValidationErrorMessage', {
-          defaultMessage: 'A data view with this name already exists.',
+          defaultMessage: 'An index pattern with this name already exists.',
         }),
       };
     }
@@ -186,7 +186,7 @@ export const TitleField = ({
       componentProps={{
         euiFieldProps: {
           'aria-label': i18n.translate('indexPatternEditor.form.titleAriaLabel', {
-            defaultMessage: 'Data View field',
+            defaultMessage: 'Index pattern field',
           }),
         },
       }}
diff --git a/src/plugins/data_view_editor/public/components/form_schema.ts b/src/plugins/data_view_editor/public/components/form_schema.ts
index 7060b3a394de7..d1e03a1dc578c 100644
--- a/src/plugins/data_view_editor/public/components/form_schema.ts
+++ b/src/plugins/data_view_editor/public/components/form_schema.ts
@@ -30,13 +30,13 @@ export const schema = {
     defaultValue: '',
     helpText: i18n.translate('indexPatternEditor.validations.titleHelpText', {
       defaultMessage:
-        'Enter a data view that matches one or more data sources. Use an asterisk (*) to match multiple characters. Spaces and the characters , /, ?, ", <, >, | are not allowed.',
+        'Enter an index pattern that matches one or more data sources. Use an asterisk (*) to match multiple characters. Spaces and the characters , /, ?, ", <, >, | are not allowed.',
     }),
     validations: [
       {
         validator: fieldValidators.emptyField(
           i18n.translate('indexPatternEditor.validations.titleIsRequiredErrorMessage', {
-            defaultMessage: 'A Data View is required.',
+            defaultMessage: 'An Index pattern is required.',
           })
         ),
       },

From 878d18d9f747aaf621baea97a6cb38ba06ccdd05 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Mon, 18 Apr 2022 23:11:12 +0200
Subject: [PATCH 17/35] fix for badge breaking in test due to index change

---
 test/functional/page_objects/settings_page.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/test/functional/page_objects/settings_page.ts b/test/functional/page_objects/settings_page.ts
index afa9a5b5369a6..08680b372289c 100644
--- a/test/functional/page_objects/settings_page.ts
+++ b/test/functional/page_objects/settings_page.ts
@@ -471,7 +471,7 @@ export class SettingsPageObject extends FtrService {
 
     if (!isStandardIndexPattern) {
       const badges = await this.find.allByCssSelector('.euiBadge__text');
-      const text = await badges[1].getVisibleText();
+      const text = await badges[0].getVisibleText();
       expect(text).to.equal('Rollup');
     }
 

From acfc939da01006cb07af84bddc28dbbd2002c9f4 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Mon, 18 Apr 2022 23:13:40 +0200
Subject: [PATCH 18/35] remove unused translations

---
 x-pack/plugins/translations/translations/fr-FR.json | 3 ---
 x-pack/plugins/translations/translations/ja-JP.json | 3 ---
 x-pack/plugins/translations/translations/zh-CN.json | 3 ---
 3 files changed, 9 deletions(-)

diff --git a/x-pack/plugins/translations/translations/fr-FR.json b/x-pack/plugins/translations/translations/fr-FR.json
index 11a6e812fc6c5..9f2eafcf3f19f 100644
--- a/x-pack/plugins/translations/translations/fr-FR.json
+++ b/x-pack/plugins/translations/translations/fr-FR.json
@@ -3886,9 +3886,6 @@
     "indexPatternManagement.editIndexPattern.tabs.fieldsHeader": "Champs",
     "indexPatternManagement.editIndexPattern.tabs.scriptedHeader": "Champs scriptés",
     "indexPatternManagement.editIndexPattern.tabs.sourceHeader": "Filtres de champ",
-    "indexPatternManagement.editIndexPattern.timeFilterHeader": "Champ temporel : \"{timeFieldName}\"",
-    "indexPatternManagement.editIndexPattern.timeFilterLabel.mappingAPILink": "mappings de champ",
-    "indexPatternManagement.editIndexPattern.timeFilterLabel.timeFilterDetail": "Affichez et modifiez les champs dans {indexPatternTitle}. Les attributs de champ tels que le type et le niveau de recherche sont basés sur {mappingAPILink} dans Elasticsearch.",
     "indexPatternManagement.fieldTypeConflict": "Conflit de type de champ",
     "indexPatternManagement.formatHeader": "Format",
     "indexPatternManagement.formatLabel": "La mise en forme vous permet de contrôler la façon dont des valeurs spécifiques sont affichées. Cela peut également entraîner une modification complète des valeurs et empêcher la mise en surbrillance dans Discover de fonctionner.",
diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json
index 0932ab3c35dbf..c19d2f1a48019 100644
--- a/x-pack/plugins/translations/translations/ja-JP.json
+++ b/x-pack/plugins/translations/translations/ja-JP.json
@@ -4385,9 +4385,6 @@
     "indexPatternManagement.editIndexPattern.tabs.fieldsHeader": "フィールド",
     "indexPatternManagement.editIndexPattern.tabs.scriptedHeader": "スクリプトフィールド",
     "indexPatternManagement.editIndexPattern.tabs.sourceHeader": "フィールドフィルター",
-    "indexPatternManagement.editIndexPattern.timeFilterHeader": "時刻フィールド：「{timeFieldName}」",
-    "indexPatternManagement.editIndexPattern.timeFilterLabel.mappingAPILink": "フィールドマッピング",
-    "indexPatternManagement.editIndexPattern.timeFilterLabel.timeFilterDetail": "{indexPatternTitle}でフィールドを表示して編集します。型や検索可否などのフィールド属性はElasticsearchで{mappingAPILink}に基づきます。",
     "indexPatternManagement.fieldTypeConflict": "フィールドタイプの矛盾",
     "indexPatternManagement.formatHeader": "フォーマット",
     "indexPatternManagement.formatLabel": "書式設定は値の表示方法を制御します。この設定を変更すると、Discoverでのフィールド値とハイライトにも影響する場合があります。",
diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json
index 5b53d4a0c628e..d763d4fb15cd8 100644
--- a/x-pack/plugins/translations/translations/zh-CN.json
+++ b/x-pack/plugins/translations/translations/zh-CN.json
@@ -4392,9 +4392,6 @@
     "indexPatternManagement.editIndexPattern.tabs.fieldsHeader": "字段",
     "indexPatternManagement.editIndexPattern.tabs.scriptedHeader": "脚本字段",
     "indexPatternManagement.editIndexPattern.tabs.sourceHeader": "字段筛选",
-    "indexPatternManagement.editIndexPattern.timeFilterHeader": "时间字段：“{timeFieldName}”",
-    "indexPatternManagement.editIndexPattern.timeFilterLabel.mappingAPILink": "字段映射",
-    "indexPatternManagement.editIndexPattern.timeFilterLabel.timeFilterDetail": "查看和编辑 {indexPatternTitle} 中的字段。字段属性，如类型和可搜索性，基于 Elasticsearch 中的 {mappingAPILink}。",
     "indexPatternManagement.fieldTypeConflict": "字段类型冲突",
     "indexPatternManagement.formatHeader": "格式",
     "indexPatternManagement.formatLabel": "格式设置控制值的显示方式。更改此设置还可能影响字段值和字段在 Discover 中的突出显示。",

From ef4149ab0f80fbb2c1a66c3076bd54078892d16b Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Wed, 20 Apr 2022 15:12:23 +0200
Subject: [PATCH 19/35] comment fixes and add name to sample data

---
 src/plugins/data_view_editor/README.md             |  2 +-
 .../edit_data_view_changed_modal.tsx               |  4 ++--
 .../public/components/form_fields/name_field.tsx   | 14 ++------------
 .../data_sets/ecommerce/saved_objects.ts           |  1 +
 .../sample_data/data_sets/flights/saved_objects.ts |  1 +
 .../sample_data/data_sets/logs/saved_objects.ts    |  1 +
 6 files changed, 8 insertions(+), 15 deletions(-)

diff --git a/src/plugins/data_view_editor/README.md b/src/plugins/data_view_editor/README.md
index 9d207ada12bba..456de9a5afb9f 100644
--- a/src/plugins/data_view_editor/README.md
+++ b/src/plugins/data_view_editor/README.md
@@ -14,7 +14,7 @@ Convenience method that uses the `core.application.capabilities` api to determin
 
 ### `openEditor(options: DataViewEditorProps): CloseEditor`
 
-Use this method to display the data view editor to create an index pattern.
+Use this method to display the data view editor to create a data view.
 
 #### `options`
 
diff --git a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
index 86f5e997c0273..320bc1c814364 100644
--- a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
+++ b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
@@ -19,14 +19,14 @@ const geti18nTexts = (dataViewName?: string) => ({
   confirmButtonText: i18n.translate(
     'indexPatternEditor.editDataView.editConfirmationModal.saveButtonLabel',
     {
-      defaultMessage: 'Edit',
+      defaultMessage: 'Save',
     }
   ),
   warningEditingDataView: i18n.translate(
     'indexPatternEditor.editDataView.editConfirmationModal.warningEditingDataView',
     {
       defaultMessage:
-        'Are you sure you want to edit this data view? Changing it might have unwanted outcomes.',
+        'Are you sure you want to edit this data view? Anything that depends upon this might not work as expected.',
     }
   ),
   typeConfirm: i18n.translate('indexPatternEditor.editDataView.editConfirmationModal.typeConfirm', {
diff --git a/src/plugins/data_view_editor/public/components/form_fields/name_field.tsx b/src/plugins/data_view_editor/public/components/form_fields/name_field.tsx
index 2ece118052349..8b6a0cfb74b70 100644
--- a/src/plugins/data_view_editor/public/components/form_fields/name_field.tsx
+++ b/src/plugins/data_view_editor/public/components/form_fields/name_field.tsx
@@ -8,7 +8,7 @@
 
 import React, { ChangeEvent } from 'react';
 import { i18n } from '@kbn/i18n';
-import { EuiFormRow, EuiFieldText, EuiText } from '@elastic/eui';
+import { EuiFormRow, EuiFieldText } from '@elastic/eui';
 import { DataView, UseField } from '../../shared_imports';
 import { IndexPatternConfig } from '../../types';
 
@@ -30,17 +30,7 @@ export const NameField = ({ editData }: NameFieldProps) => {
     >
       {(field) => {
         return (
-          <EuiFormRow
-            label={field.label}
-            labelAppend={
-              <EuiText size="xs" color="subdued">
-                {i18n.translate('indexPatternEditor.form.optional', {
-                  defaultMessage: 'Optional',
-                })}
-              </EuiText>
-            }
-            fullWidth
-          >
+          <EuiFormRow label={field.label} fullWidth>
             <EuiFieldText
               value={field.value}
               onChange={(e: ChangeEvent<HTMLInputElement>) => {
diff --git a/src/plugins/home/server/services/sample_data/data_sets/ecommerce/saved_objects.ts b/src/plugins/home/server/services/sample_data/data_sets/ecommerce/saved_objects.ts
index 8a520d23c0a45..d9d8c44d56b80 100644
--- a/src/plugins/home/server/services/sample_data/data_sets/ecommerce/saved_objects.ts
+++ b/src/plugins/home/server/services/sample_data/data_sets/ecommerce/saved_objects.ts
@@ -22,6 +22,7 @@ export const getSavedObjects = (): SavedObject[] => [
       runtimeFieldMap: '{}',
       timeFieldName: 'order_date',
       title: 'kibana_sample_data_ecommerce',
+      name: 'Kibana Sample Data eCommerce',
       typeMeta: '{}',
     },
     coreMigrationVersion: '8.0.0',
diff --git a/src/plugins/home/server/services/sample_data/data_sets/flights/saved_objects.ts b/src/plugins/home/server/services/sample_data/data_sets/flights/saved_objects.ts
index 279ab629352c7..6180db51c4dd3 100644
--- a/src/plugins/home/server/services/sample_data/data_sets/flights/saved_objects.ts
+++ b/src/plugins/home/server/services/sample_data/data_sets/flights/saved_objects.ts
@@ -208,6 +208,7 @@ export const getSavedObjects = (): SavedObject[] => [
     migrationVersion: {},
     attributes: {
       title: 'kibana_sample_data_flights',
+      name: 'Kibana Sample Data Flights',
       timeFieldName: 'timestamp',
       fieldFormatMap:
         '{"hour_of_day":{"id":"number","params":{"pattern":"00"}},"AvgTicketPrice":{"id":"number","params":{"pattern":"$0,0.[00]"}}}',
diff --git a/src/plugins/home/server/services/sample_data/data_sets/logs/saved_objects.ts b/src/plugins/home/server/services/sample_data/data_sets/logs/saved_objects.ts
index a38dd2120e8f1..55ed75f7bcef3 100644
--- a/src/plugins/home/server/services/sample_data/data_sets/logs/saved_objects.ts
+++ b/src/plugins/home/server/services/sample_data/data_sets/logs/saved_objects.ts
@@ -370,6 +370,7 @@ export const getSavedObjects = (): SavedObject[] => [
     migrationVersion: {},
     attributes: {
       title: 'kibana_sample_data_logs',
+      name: 'Kibana Sample Data Logs',
       timeFieldName: 'timestamp',
       fieldFormatMap: '{"hour_of_day":{}}',
       runtimeFieldMap:

From 6548c28cb8ef239a28eb9f762de19b25e75c31f8 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Wed, 20 Apr 2022 17:21:39 +0200
Subject: [PATCH 20/35] fix test for adding names to sample data

---
 test/accessibility/apps/filter_panel.ts                   | 2 +-
 x-pack/test/functional/apps/dashboard/_async_dashboard.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/test/accessibility/apps/filter_panel.ts b/test/accessibility/apps/filter_panel.ts
index deb1e9512cd81..7507e41a756b1 100644
--- a/test/accessibility/apps/filter_panel.ts
+++ b/test/accessibility/apps/filter_panel.ts
@@ -18,7 +18,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
   describe('Filter panel', () => {
     before(async () => {
       await PageObjects.common.navigateToApp('discover');
-      await PageObjects.discover.selectIndexPattern('kibana_sample_data_flights');
+      await PageObjects.discover.selectIndexPattern('Kibana Sample Data Flights');
     });
 
     it('a11y test on add filter panel', async () => {
diff --git a/x-pack/test/functional/apps/dashboard/_async_dashboard.ts b/x-pack/test/functional/apps/dashboard/_async_dashboard.ts
index 89c58645b64b0..c8009bb9ee2cd 100644
--- a/x-pack/test/functional/apps/dashboard/_async_dashboard.ts
+++ b/x-pack/test/functional/apps/dashboard/_async_dashboard.ts
@@ -109,7 +109,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
       await browser.refresh();
       await PageObjects.header.waitUntilLoadingHasFinished();
       await appMenu.clickLink('Discover');
-      await PageObjects.discover.selectIndexPattern('kibana_sample_data_flights');
+      await PageObjects.discover.selectIndexPattern('Kibana Sample Data Flights');
       await PageObjects.timePicker.setCommonlyUsedTime('sample_data range');
       await retry.try(async function () {
         const hitCount = parseInt(await PageObjects.discover.getHitCount(), 10);

From 0737f5a58ec765ab9156fb1d8208606e6a26e0cf Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Thu, 21 Apr 2022 01:04:36 +0200
Subject: [PATCH 21/35] some ui changes

---
 .../data_view_editor_flyout_content.tsx       |  6 +-
 .../edit_index_pattern/edit_index_pattern.tsx | 22 ++++-
 .../index_header/index_header.tsx             | 99 ++++++-------------
 3 files changed, 53 insertions(+), 74 deletions(-)

diff --git a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
index 3d13f4721d5bf..264db2b71c05a 100644
--- a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
@@ -123,7 +123,11 @@ const IndexPatternEditorFlyoutContentComponent = ({
         };
       }
 
-      if (editData && !editDataViewChangedModal) {
+      if (
+        editData &&
+        editData.title !== form.getFields().title.value &&
+        !editDataViewChangedModal
+      ) {
         setEditDataViewChangedModal(true);
       } else {
         await onSave(indexPatternStub);
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
index 05317716145fa..d7269203b3ae8 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
@@ -8,6 +8,7 @@
 
 import React, { useEffect, useState, useCallback } from 'react';
 import { withRouter, RouteComponentProps, useLocation } from 'react-router-dom';
+import styled from 'styled-components';
 import {
   EuiFlexGroup,
   EuiFlexItem,
@@ -16,6 +17,7 @@ import {
   EuiBadge,
   EuiCallOut,
   EuiCode,
+  EuiText,
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n-react';
@@ -27,6 +29,10 @@ import { IndexHeader } from './index_header';
 import { getTags } from '../utils';
 import { removeDataView, RemoveDataViewProps } from './remove_data_view';
 
+const Code = styled(EuiCode)`
+  margin-left: 8px;
+`;
+
 export interface EditIndexPatternProps extends RouteComponentProps {
   indexPattern: DataView;
 }
@@ -170,16 +176,16 @@ export const EditIndexPattern = withRouter(
             {Boolean(indexPattern.title) && (
               <EuiFlexItem grow={false}>
                 <EuiFlexGroup gutterSize="none" alignItems="center">
-                  {indexPatternHeading}
-                  <EuiCode>{indexPattern.title}</EuiCode>
+                  <EuiText size="s">{indexPatternHeading}</EuiText>
+                  <Code>{indexPattern.title}</Code>
                 </EuiFlexGroup>
               </EuiFlexItem>
             )}
             {Boolean(indexPattern.timeFieldName) && (
               <EuiFlexItem grow={false}>
                 <EuiFlexGroup gutterSize="none" alignItems="center">
-                  {timeFilterHeading}
-                  <EuiCode>{indexPattern.timeFieldName}</EuiCode>
+                  <EuiText size="s">{timeFilterHeading}</EuiText>
+                  <Code>{indexPattern.timeFieldName}</Code>
                 </EuiFlexGroup>
               </EuiFlexItem>
             )}
@@ -190,7 +196,13 @@ export const EditIndexPattern = withRouter(
             )}
             {tags.map((tag: any) => (
               <EuiFlexItem grow={false} key={tag.key}>
-                <EuiBadge color={tag.key === 'default' ? 'default' : 'hollow'}>{tag.name}</EuiBadge>
+                {tag.key === 'default' ? (
+                  <EuiBadge iconType="starFilled" color="default">
+                    {tag.name}
+                  </EuiBadge>
+                ) : (
+                  <EuiBadge color="hollow">{tag.name}</EuiBadge>
+                )}
               </EuiFlexItem>
             ))}
           </EuiFlexGroup>
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
index 69d26c78e90a1..2d18f30e05b44 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
@@ -6,9 +6,9 @@
  * Side Public License, v 1.
  */
 
-import React, { useState } from 'react';
+import React from 'react';
 import { i18n } from '@kbn/i18n';
-import { EuiButtonEmpty, EuiContextMenu, EuiIcon, EuiPageHeader, EuiPopover } from '@elastic/eui';
+import { EuiButton, EuiButtonEmpty, EuiPageHeader } from '@elastic/eui';
 import { DataView } from '@kbn/data-views-plugin/public';
 
 interface IndexHeaderProps {
@@ -20,10 +20,6 @@ interface IndexHeaderProps {
   canSave: boolean;
 }
 
-const openActionsAriaLabel = i18n.translate('indexPatternManagement.editDataView.openAcionsAria', {
-  defaultMessage: 'Open Data View Actions',
-});
-
 const setDefaultAriaLabel = i18n.translate('indexPatternManagement.editDataView.setDefaultAria', {
   defaultMessage: 'Set as default data view.',
 });
@@ -57,74 +53,41 @@ export const IndexHeader: React.FC<IndexHeaderProps> = ({
   children,
   canSave,
 }) => {
-  const [openActions, setOpenActions] = useState<boolean>(false);
-
-  const panelItems = [
-    {
-      name: editTooltip,
-      icon: 'pencil',
-      onClick: () => {
-        if (editIndexPatternClick) editIndexPatternClick();
-        setOpenActions(false);
-      },
-      'data-test-subj': 'editIndexPatternButton',
-      'aria-label': editAriaLabel,
-    },
-    {
-      name: removeTooltip,
-      icon: <EuiIcon type="trash" size="m" color="danger" />,
-      onClick: () => {
-        if (deleteIndexPatternClick) deleteIndexPatternClick();
-        setOpenActions(false);
-      },
-      'data-test-subj': 'deleteIndexPatternButton',
-      'aria-label': removeAriaLabel,
-    },
-  ];
-  if (defaultIndex !== indexPattern.id) {
-    panelItems.unshift({
-      name: setDefaultTooltip,
-      icon: 'starFilled',
-      onClick: () => {
-        if (setDefault) setDefault();
-        setOpenActions(false);
-      },
-      'data-test-subj': 'setDefaultIndexPatternButton',
-      'aria-label': setDefaultAriaLabel,
-    });
-  }
-
   return (
     <EuiPageHeader
       pageTitle={<span data-test-subj="indexPatternTitle">{indexPattern.getName()}</span>}
       rightSideItems={[
         canSave && (
-          <EuiPopover
-            button={
-              <EuiButtonEmpty
-                iconType="arrowDown"
-                iconSide="right"
-                onClick={() => setOpenActions(!openActions)}
-                aria-label={openActionsAriaLabel}
-                data-test-subj="openDataViewActions"
-              >
-                Actions
-              </EuiButtonEmpty>
-            }
-            isOpen={openActions}
-            closePopover={() => setOpenActions(false)}
-            anchorPosition="downRight"
+          <EuiButton
+            fill
+            onClick={editIndexPatternClick}
+            iconType="pencil"
+            aria-label={editAriaLabel}
+            data-test-subj="editIndexPatternButton"
+          >
+            {editTooltip}
+          </EuiButton>
+        ),
+        defaultIndex !== indexPattern.id && setDefault && canSave && (
+          <EuiButton
+            onClick={setDefault}
+            iconType="starFilled"
+            aria-label={setDefaultAriaLabel}
+            data-test-subj="setDefaultIndexPatternButton"
+          >
+            {setDefaultTooltip}
+          </EuiButton>
+        ),
+        canSave && (
+          <EuiButtonEmpty
+            color="danger"
+            onClick={deleteIndexPatternClick}
+            iconType="trash"
+            aria-label={removeAriaLabel}
+            data-test-subj="deleteIndexPatternButton"
           >
-            <EuiContextMenu
-              initialPanelId={0}
-              panels={[
-                {
-                  id: 0,
-                  items: panelItems,
-                },
-              ]}
-            />
-          </EuiPopover>
+            {removeTooltip}
+          </EuiButtonEmpty>
         ),
       ].filter(Boolean)}
     >

From b0909c64f5d5d4ea9b22ea7fb80ab160d1d3ccef Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Thu, 21 Apr 2022 01:07:47 +0200
Subject: [PATCH 22/35] fix for failing tests for removing Actions

---
 test/functional/page_objects/settings_page.ts | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/test/functional/page_objects/settings_page.ts b/test/functional/page_objects/settings_page.ts
index 08680b372289c..2004b256eb5f0 100644
--- a/test/functional/page_objects/settings_page.ts
+++ b/test/functional/page_objects/settings_page.ts
@@ -192,18 +192,15 @@ export class SettingsPageObject extends FtrService {
   }
 
   async clickDefaultIndexButton() {
-    await this.testSubjects.click('openDataViewActions');
     await this.testSubjects.click('setDefaultIndexPatternButton');
     await this.header.waitUntilLoadingHasFinished();
   }
 
   async clickEditIndexButton() {
-    await this.testSubjects.click('openDataViewActions');
     await this.testSubjects.click('editIndexPatternButton');
   }
 
   async clickDeletePattern() {
-    await this.testSubjects.click('openDataViewActions');
     await this.testSubjects.click('deleteIndexPatternButton');
   }
 

From c13191eb7c275f9f5d87b0b23245bdd3fded6d3f Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Tue, 26 Apr 2022 16:17:14 +0200
Subject: [PATCH 23/35] comment fixes, change edit modal, fix breadcrumbs

---
 .../edit_data_view_changed_modal.tsx          | 113 ++++++------------
 .../data_view_editor_flyout_content.tsx       |  53 +++-----
 .../public/components/breadcrumbs.ts          |  20 ++--
 .../edit_index_pattern/edit_index_pattern.tsx |  19 ++-
 .../index_header/index_header.tsx             |   1 -
 .../edit_index_pattern/remove_data_view.tsx   |   2 +
 .../index_pattern_table/delete_modal_msg.tsx  |   3 +-
 .../management_app/management_app.tsx         |  11 +-
 .../management/public/utils/breadcrumbs.ts    |   6 +
 src/plugins/management/public/utils/index.ts  |   2 +-
 .../_index_pattern_create_delete.ts           |  10 +-
 test/functional/page_objects/settings_page.ts |  34 ++++--
 12 files changed, 123 insertions(+), 151 deletions(-)

diff --git a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
index 320bc1c814364..cb2be16f89602 100644
--- a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
+++ b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
@@ -5,83 +5,46 @@
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-import React, { useState } from 'react';
-import { EuiCallOut, EuiSpacer, EuiConfirmModal, EuiFieldText, EuiFormRow } from '@elastic/eui';
-import { i18n } from '@kbn/i18n';
 
-const geti18nTexts = (dataViewName?: string) => ({
-  cancelButtonText: i18n.translate(
-    'indexPatternEditor.editDataView.editConfirmationModal.cancelButtonLabel',
-    {
-      defaultMessage: 'Cancel',
-    }
-  ),
-  confirmButtonText: i18n.translate(
-    'indexPatternEditor.editDataView.editConfirmationModal.saveButtonLabel',
-    {
-      defaultMessage: 'Save',
-    }
-  ),
-  warningEditingDataView: i18n.translate(
-    'indexPatternEditor.editDataView.editConfirmationModal.warningEditingDataView',
-    {
-      defaultMessage:
-        'Are you sure you want to edit this data view? Anything that depends upon this might not work as expected.',
-    }
-  ),
-  typeConfirm: i18n.translate('indexPatternEditor.editDataView.editConfirmationModal.typeConfirm', {
-    defaultMessage: 'Enter CHANGE to continue',
-  }),
-  titleConfirmChanges: i18n.translate(
-    'indexPatternEditor.editDataView.editConfirmationModal.title',
-    {
-      defaultMessage: `Edit {name}`,
-      values: {
-        name: dataViewName ? `'${dataViewName}'` : 'data view',
-      },
-    }
-  ),
-});
+import { i18n } from '@kbn/i18n';
+import type { OverlayStart } from '@kbn/core/public';
 
-interface Props {
-  dataViewName?: string;
-  onConfirm: () => void;
-  onCancel: () => void;
+interface EditDataViewDeps {
+  dataViewName: string;
+  overlays: OverlayStart | undefined;
+  onEdit: () => void;
 }
 
-export const EditDataViewChangedModal: React.FC<Props> = ({
-  dataViewName,
-  onCancel,
-  onConfirm,
-}) => {
-  const i18nTexts = geti18nTexts(dataViewName);
-  const [confirmContent, setConfirmContent] = useState<string>('');
-
-  return (
-    <EuiConfirmModal
-      title={i18nTexts.titleConfirmChanges}
-      data-test-subj="runtimeFieldSaveConfirmModal"
-      cancelButtonText={i18nTexts.cancelButtonText}
-      confirmButtonText={i18nTexts.confirmButtonText}
-      confirmButtonDisabled={confirmContent?.toUpperCase() !== 'CHANGE'}
-      onCancel={onCancel}
-      onConfirm={onConfirm}
-    >
-      <EuiCallOut
-        color="warning"
-        title={i18nTexts.warningEditingDataView}
-        iconType="alert"
-        size="s"
-        data-test-subj="editDataViewWarning"
-      />
-      <EuiSpacer />
-      <EuiFormRow label={i18nTexts.typeConfirm}>
-        <EuiFieldText
-          value={confirmContent}
-          onChange={(e) => setConfirmContent(e.target.value)}
-          data-test-subj="saveModalConfirmText"
-        />
-      </EuiFormRow>
-    </EuiConfirmModal>
-  );
+export const editDataViewModal = ({ dataViewName, overlays, onEdit }: EditDataViewDeps) => {
+  overlays &&
+    overlays
+      .openConfirm(
+        i18n.translate('indexPatternEditor.editDataView.editConfirmationModal.modalDescription', {
+          defaultMessage:
+            'Are you sure you want to edit this data view? Anything that depends upon this might not work as expected.',
+        }),
+        {
+          confirmButtonText: i18n.translate(
+            'indexPatternEditor.editDataView.editConfirmationModal.editButton',
+            {
+              defaultMessage: 'Edit',
+            }
+          ),
+          title: i18n.translate(
+            'indexPatternEditor.editDataView.editConfirmationModal.editHeader',
+            {
+              defaultMessage: `Edit {name}`,
+              values: {
+                name: dataViewName,
+              },
+            }
+          ),
+          buttonColor: 'danger',
+        }
+      )
+      .then(async (isConfirmed) => {
+        if (isConfirmed) {
+          onEdit();
+        }
+      });
 };
diff --git a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
index 264db2b71c05a..261e6c3270184 100644
--- a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
@@ -24,7 +24,6 @@ import {
 
 import { ensureMinimumTime, getIndices, extractTimeFields, getMatchedIndices } from '../lib';
 import { FlyoutPanels } from './flyout_panels';
-import { EditDataViewChangedModal } from './confirm_modals/edit_data_view_changed_modal';
 
 import {
   MatchedItem,
@@ -49,6 +48,7 @@ import {
   PreviewPanel,
   RollupBetaWarning,
 } from '.';
+import { editDataViewModal } from './confirm_modals/edit_data_view_changed_modal';
 
 export interface Props {
   /**
@@ -80,7 +80,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
   editData,
 }: Props) => {
   const {
-    services: { http, dataViews, uiSettings, searchClient },
+    services: { http, dataViews, uiSettings, searchClient, overlays },
   } = useKibana<DataViewEditorContext>();
 
   const { form } = useForm<IndexPatternConfig, FormInternal>({
@@ -123,12 +123,14 @@ const IndexPatternEditorFlyoutContentComponent = ({
         };
       }
 
-      if (
-        editData &&
-        editData.title !== form.getFields().title.value &&
-        !editDataViewChangedModal
-      ) {
-        setEditDataViewChangedModal(true);
+      if (editData && editData.title !== formData.title) {
+        editDataViewModal({
+          dataViewName: formData.name || formData.title,
+          overlays,
+          onEdit: async () => {
+            await onSave(indexPatternStub);
+          },
+        });
       } else {
         await onSave(indexPatternStub);
       }
@@ -166,7 +168,6 @@ const IndexPatternEditorFlyoutContentComponent = ({
     partialMatchedIndices: [],
     visibleIndices: [],
   });
-  const [editDataViewChangedModal, setEditDataViewChangedModal] = useState(false);
 
   // load all data sources and set initial matchedIndices
   const loadSources = useCallback(() => {
@@ -187,7 +188,7 @@ const IndexPatternEditorFlyoutContentComponent = ({
   useEffect(() => {
     loadSources();
     const getTitles = async () => {
-      const indexPatternTitles = await dataViews.getTitles();
+      const indexPatternTitles = await dataViews.getTitles(editData ? true : false);
 
       setExistingIndexPatterns(
         editData ? indexPatternTitles.filter((v) => v !== editData.title) : indexPatternTitles
@@ -304,17 +305,16 @@ const IndexPatternEditorFlyoutContentComponent = ({
 
   // If editData exists, loadSources so that MatchedIndices can be loaded for the Timestampfields
   useEffect(() => {
-    if (editData) loadSources();
-  }, [editData, loadSources]);
-
-  useEffect(() => {
-    if (editData) reloadMatchedIndices(editData.title);
-  }, [editData, allSources, reloadMatchedIndices]);
+    if (editData) {
+      loadSources();
+      reloadMatchedIndices(editData.title);
+    }
+  }, [editData]);
 
   useEffect(() => {
     loadTimestampFieldOptions(editData ? editData.title : title);
     if (!editData) getFields().timestampField?.setValue('');
-  }, [loadTimestampFieldOptions, title, getFields, editData]);
+  }, [loadTimestampFieldOptions, title, getFields]);
 
   const onTypeChange = useCallback(
     (newType) => {
@@ -359,24 +359,6 @@ const IndexPatternEditorFlyoutContentComponent = ({
     <></>
   );
 
-  const renderModal = () => {
-    if (editDataViewChangedModal) {
-      return (
-        <EditDataViewChangedModal
-          dataViewName={form.getFields().name.value as string}
-          onConfirm={() => {
-            form.submit();
-          }}
-          onCancel={() => {
-            setEditDataViewChangedModal(false);
-          }}
-        />
-      );
-    }
-
-    return null;
-  };
-
   return (
     <EmptyPrompts onCancel={onCancel} allSources={allSources} loadSources={loadSources}>
       <FlyoutPanels.Group flyoutClassName={'indexPatternEditorFlyout'} maxWidth={1180}>
@@ -438,7 +420,6 @@ const IndexPatternEditorFlyoutContentComponent = ({
           )}
         </FlyoutPanels.Item>
       </FlyoutPanels.Group>
-      {renderModal()}
     </EmptyPrompts>
   );
 };
diff --git a/src/plugins/data_view_management/public/components/breadcrumbs.ts b/src/plugins/data_view_management/public/components/breadcrumbs.ts
index 4a62020d83599..838a13e40711f 100644
--- a/src/plugins/data_view_management/public/components/breadcrumbs.ts
+++ b/src/plugins/data_view_management/public/components/breadcrumbs.ts
@@ -9,42 +9,42 @@
 import { i18n } from '@kbn/i18n';
 import { DataView } from '@kbn/data-views-plugin/public';
 
-export function getListBreadcrumbs() {
+export function getListBreadcrumbs(withLink?: boolean) {
   return [
     {
       text: i18n.translate('indexPatternManagement.dataViews.listBreadcrumb', {
         defaultMessage: 'Data views',
       }),
-      href: `/`,
+      href: withLink ? `/` : '',
     },
   ];
 }
 
-export function getCreateBreadcrumbs() {
+export function getCreateBreadcrumbs(withLink?: boolean) {
   return [
-    ...getListBreadcrumbs(),
+    ...getListBreadcrumbs(true),
     {
       text: i18n.translate('indexPatternManagement.dataViews.createBreadcrumb', {
         defaultMessage: 'Create data view',
       }),
-      href: `/create`,
+      href: withLink ? `/create` : '',
     },
   ];
 }
 
-export function getEditBreadcrumbs(indexPattern: DataView) {
+export function getEditBreadcrumbs(indexPattern: DataView, withLink?: boolean) {
   return [
-    ...getListBreadcrumbs(),
+    ...getListBreadcrumbs(true),
     {
       text: indexPattern.getName(),
-      href: `/patterns/${indexPattern.id}`,
+      href: withLink ? `/patterns/${indexPattern.id}` : '',
     },
   ];
 }
 
 export function getEditFieldBreadcrumbs(indexPattern: DataView, fieldName: string) {
   return [
-    ...getEditBreadcrumbs(indexPattern),
+    ...getEditBreadcrumbs(indexPattern, true),
     {
       text: fieldName,
     },
@@ -53,7 +53,7 @@ export function getEditFieldBreadcrumbs(indexPattern: DataView, fieldName: strin
 
 export function getCreateFieldBreadcrumbs(indexPattern: DataView) {
   return [
-    ...getEditBreadcrumbs(indexPattern),
+    ...getEditBreadcrumbs(indexPattern, true),
     {
       text: i18n.translate('indexPatternManagement.indexPatterns.createFieldBreadcrumb', {
         defaultMessage: 'Create field',
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
index d7269203b3ae8..906e8c6b43e52 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/edit_index_pattern.tsx
@@ -8,7 +8,6 @@
 
 import React, { useEffect, useState, useCallback } from 'react';
 import { withRouter, RouteComponentProps, useLocation } from 'react-router-dom';
-import styled from 'styled-components';
 import {
   EuiFlexGroup,
   EuiFlexItem,
@@ -29,9 +28,9 @@ import { IndexHeader } from './index_header';
 import { getTags } from '../utils';
 import { removeDataView, RemoveDataViewProps } from './remove_data_view';
 
-const Code = styled(EuiCode)`
-  margin-left: 8px;
-`;
+const codeStyle = {
+  marginLeft: '8px',
+};
 
 export interface EditIndexPatternProps extends RouteComponentProps {
   indexPattern: DataView;
@@ -93,9 +92,7 @@ export const EditIndexPattern = withRouter(
     const isRollup = new URLSearchParams(useLocation().search).get('type') === 'rollup';
     const displayIndexPatternEditor = showEditDialog ? (
       <IndexPatternEditor
-        onSave={(iPattern) => {
-          history.push(`patterns/${iPattern.id}`);
-        }}
+        onSave={() => setShowEditDialog(false)}
         onCancel={() => setShowEditDialog(false)}
         defaultTypeIsRollup={isRollup}
         editData={indexPattern}
@@ -145,7 +142,7 @@ export const EditIndexPattern = withRouter(
           id="indexPatternManagement.editDataView.deleteWarningWithNamespaces"
           defaultMessage="Delete the data view {dataViewName} from every space it is shared in. You can't undo this action."
           values={{
-            dataViewName: <EuiCode>{indexPattern.title}</EuiCode>,
+            dataViewName: <EuiCode>{indexPattern.getName()}</EuiCode>,
           }}
         />
       ) : (
@@ -153,7 +150,7 @@ export const EditIndexPattern = withRouter(
           id="indexPatternManagement.editDataView.deleteWarning"
           defaultMessage="The data view {dataViewName} will be deleted. You can't undo this action."
           values={{
-            dataViewName: <EuiCode>{indexPattern.title}</EuiCode>,
+            dataViewName: <EuiCode>{indexPattern.getName()}</EuiCode>,
           }}
         />
       );
@@ -177,7 +174,7 @@ export const EditIndexPattern = withRouter(
               <EuiFlexItem grow={false}>
                 <EuiFlexGroup gutterSize="none" alignItems="center">
                   <EuiText size="s">{indexPatternHeading}</EuiText>
-                  <Code>{indexPattern.title}</Code>
+                  <EuiCode style={codeStyle}>{indexPattern.title}</EuiCode>
                 </EuiFlexGroup>
               </EuiFlexItem>
             )}
@@ -185,7 +182,7 @@ export const EditIndexPattern = withRouter(
               <EuiFlexItem grow={false}>
                 <EuiFlexGroup gutterSize="none" alignItems="center">
                   <EuiText size="s">{timeFilterHeading}</EuiText>
-                  <Code>{indexPattern.timeFieldName}</Code>
+                  <EuiCode style={codeStyle}>{indexPattern.timeFieldName}</EuiCode>
                 </EuiFlexGroup>
               </EuiFlexItem>
             )}
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
index 2d18f30e05b44..7a9423e4c9d0c 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/index_header/index_header.tsx
@@ -59,7 +59,6 @@ export const IndexHeader: React.FC<IndexHeaderProps> = ({
       rightSideItems={[
         canSave && (
           <EuiButton
-            fill
             onClick={editIndexPatternClick}
             iconType="pencil"
             aria-label={editAriaLabel}
diff --git a/src/plugins/data_view_management/public/components/edit_index_pattern/remove_data_view.tsx b/src/plugins/data_view_management/public/components/edit_index_pattern/remove_data_view.tsx
index 3e29f39e3334d..7a2d228dcca44 100644
--- a/src/plugins/data_view_management/public/components/edit_index_pattern/remove_data_view.tsx
+++ b/src/plugins/data_view_management/public/components/edit_index_pattern/remove_data_view.tsx
@@ -27,6 +27,8 @@ export interface RemoveDataViewProps {
   id: string;
   title: string;
   namespaces?: string[] | undefined;
+  name?: string;
+  getName: () => string;
 }
 
 interface RemoveDataViewDeps {
diff --git a/src/plugins/data_view_management/public/components/index_pattern_table/delete_modal_msg.tsx b/src/plugins/data_view_management/public/components/index_pattern_table/delete_modal_msg.tsx
index 55716c5aecdc4..e675f4be59b45 100644
--- a/src/plugins/data_view_management/public/components/index_pattern_table/delete_modal_msg.tsx
+++ b/src/plugins/data_view_management/public/components/index_pattern_table/delete_modal_msg.tsx
@@ -34,7 +34,7 @@ const tableTitle = i18n.translate('indexPatternManagement.dataViewTable.tableTit
 export const deleteModalMsg = (views: RemoveDataViewProps[], hasSpaces: boolean) => {
   const columns: Array<EuiTableFieldDataColumnType<any>> = [
     {
-      field: 'title',
+      field: 'name',
       name: dataViewColumnName,
       sortable: true,
     },
@@ -50,6 +50,7 @@ export const deleteModalMsg = (views: RemoveDataViewProps[], hasSpaces: boolean)
     });
   }
 
+  views.forEach((view) => (view.name = view.getName()));
   return (
     <div>
       <EuiCallOut
diff --git a/src/plugins/management/public/components/management_app/management_app.tsx b/src/plugins/management/public/components/management_app/management_app.tsx
index 52d5eb3da0606..2e9eb90a695b9 100644
--- a/src/plugins/management/public/components/management_app/management_app.tsx
+++ b/src/plugins/management/public/components/management_app/management_app.tsx
@@ -18,7 +18,11 @@ import {
   reactRouterNavigate,
   KibanaThemeProvider,
 } from '@kbn/kibana-react-plugin/public';
-import { ManagementSection, MANAGEMENT_BREADCRUMB } from '../../utils';
+import {
+  ManagementSection,
+  MANAGEMENT_BREADCRUMB,
+  MANAGEMENT_BREADCRUMB_NO_HREF,
+} from '../../utils';
 import { ManagementRouter } from './management_router';
 import { managementSidebarNav } from '../management_sidebar_nav/management_sidebar_nav';
 import { SectionsServiceStart } from '../../types';
@@ -53,8 +57,11 @@ export const ManagementApp = ({ dependencies, history, theme$ }: ManagementAppPr
         ...(item.href ? reactRouterNavigate(scopedHistory, item.href) : {}),
       });
 
+      const managementBreadcrumb = crumbs.length
+        ? MANAGEMENT_BREADCRUMB
+        : MANAGEMENT_BREADCRUMB_NO_HREF;
       setBreadcrumbs([
-        wrapBreadcrumb(MANAGEMENT_BREADCRUMB, history),
+        wrapBreadcrumb(managementBreadcrumb, history),
         ...crumbs.map((item) => wrapBreadcrumb(item, appHistory || history)),
       ]);
     },
diff --git a/src/plugins/management/public/utils/breadcrumbs.ts b/src/plugins/management/public/utils/breadcrumbs.ts
index 9b4c50da74477..f1f1a6e7fb0bd 100644
--- a/src/plugins/management/public/utils/breadcrumbs.ts
+++ b/src/plugins/management/public/utils/breadcrumbs.ts
@@ -8,6 +8,12 @@
 
 import { i18n } from '@kbn/i18n';
 
+export const MANAGEMENT_BREADCRUMB_NO_HREF = {
+  text: i18n.translate('management.breadcrumb', {
+    defaultMessage: 'Stack Management',
+  }),
+};
+
 export const MANAGEMENT_BREADCRUMB = {
   text: i18n.translate('management.breadcrumb', {
     defaultMessage: 'Stack Management',
diff --git a/src/plugins/management/public/utils/index.ts b/src/plugins/management/public/utils/index.ts
index 4bdf6979c28f2..e1074ec9f30af 100644
--- a/src/plugins/management/public/utils/index.ts
+++ b/src/plugins/management/public/utils/index.ts
@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-export { MANAGEMENT_BREADCRUMB } from './breadcrumbs';
+export { MANAGEMENT_BREADCRUMB, MANAGEMENT_BREADCRUMB_NO_HREF } from './breadcrumbs';
 export type { RegisterManagementAppArgs } from './management_app';
 export { ManagementApp } from './management_app';
 export type { RegisterManagementSectionArgs } from './management_section';
diff --git a/test/functional/apps/management/_index_pattern_create_delete.ts b/test/functional/apps/management/_index_pattern_create_delete.ts
index eb982e46b1a73..a23b3c8f366c7 100644
--- a/test/functional/apps/management/_index_pattern_create_delete.ts
+++ b/test/functional/apps/management/_index_pattern_create_delete.ts
@@ -119,7 +119,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
     });
 
     describe('edit index pattern', () => {
-      it('edit index pattern details on edit click', async () => {
+      it('on edit click', async () => {
         await PageObjects.settings.editIndexPattern('logstash-*', '@timestamp', 'Logstash Star');
 
         await retry.try(async () => {
@@ -128,6 +128,14 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
           );
         });
       });
+
+      it('shows edit confirm message when editing index-pattern', async () => {
+        await PageObjects.settings.editIndexPattern('index-*', '@timestamp', 'Index Star', true);
+
+        await retry.try(async () => {
+          expect(await testSubjects.getVisibleText('indexPatternTitle')).to.contain(`Index Star`);
+        });
+      });
     });
 
     describe('index pattern deletion', function indexDelete() {
diff --git a/test/functional/page_objects/settings_page.ts b/test/functional/page_objects/settings_page.ts
index 2004b256eb5f0..917b744cfb1b4 100644
--- a/test/functional/page_objects/settings_page.ts
+++ b/test/functional/page_objects/settings_page.ts
@@ -166,8 +166,8 @@ export class SettingsPageObject extends FtrService {
 
   async setNameField(dataViewName: string) {
     const field = await this.getNameField();
-    field.clearValue();
-    field.type(dataViewName);
+    await field.clearValue();
+    await field.type(dataViewName);
   }
 
   async getSaveIndexPatternButton() {
@@ -479,29 +479,37 @@ export class SettingsPageObject extends FtrService {
     indexPatternName: string,
     // null to bypass default value
     timefield: string | null = '@timestamp',
-    dataViewName?: string
+    dataViewName?: string,
+    errorCheck?: boolean
   ) {
     if (!indexPatternName) {
       throw new Error('No Data View name provided for edit');
     }
 
-    const exists = await this.hasIndexPattern(indexPatternName);
-    if (!exists) {
-      throw new Error('Data view for edit does not exist');
-    }
-
     this.clickEditIndexButton();
     await this.header.waitUntilLoadingHasFinished();
-    if (timefield) {
-      await this.selectTimeFieldOption(timefield);
-    }
+
+    await this.retry.try(async () => {
+      await this.setIndexPatternField(indexPatternName);
+    });
     if (dataViewName) {
       await this.setNameField(dataViewName);
     }
+    if (timefield) {
+      await this.selectTimeFieldOption(timefield);
+    }
     await (await this.getSaveIndexPatternButton()).click();
 
-    await this.testSubjects.find('editDataViewWarning');
-    await this.confirmSave();
+    if (errorCheck) {
+      await this.retry.try(async () => {
+        this.log.debug('getAlertText');
+        await this.testSubjects.getVisibleText('confirmModalTitleText');
+      });
+      await this.retry.try(async () => {
+        this.log.debug('acceptConfirmation');
+        await this.testSubjects.click('confirmModalConfirmButton');
+      });
+    }
 
     await this.header.waitUntilLoadingHasFinished();
     return await this.getIndexPatternIdFromUrl();

From b095590d4a7963934d85781db6c562bb59d9ae56 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Mon, 2 May 2022 19:14:31 +0200
Subject: [PATCH 24/35] change copy and fix for failing tests

---
 .../edit_data_view_changed_modal.tsx          |  5 ++--
 .../delete_modal_msg.test.tsx                 | 24 +++++++++++++++----
 .../_index_pattern_create_delete.ts           |  8 +++++--
 3 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
index cb2be16f89602..096c76b58c633 100644
--- a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
+++ b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
@@ -20,8 +20,7 @@ export const editDataViewModal = ({ dataViewName, overlays, onEdit }: EditDataVi
     overlays
       .openConfirm(
         i18n.translate('indexPatternEditor.editDataView.editConfirmationModal.modalDescription', {
-          defaultMessage:
-            'Are you sure you want to edit this data view? Anything that depends upon this might not work as expected.',
+          defaultMessage: 'Changing this data view can break other objects that depend on it.',
         }),
         {
           confirmButtonText: i18n.translate(
@@ -33,7 +32,7 @@ export const editDataViewModal = ({ dataViewName, overlays, onEdit }: EditDataVi
           title: i18n.translate(
             'indexPatternEditor.editDataView.editConfirmationModal.editHeader',
             {
-              defaultMessage: `Edit {name}`,
+              defaultMessage: `Edit '{name}'`,
               values: {
                 name: dataViewName,
               },
diff --git a/src/plugins/data_view_management/public/components/index_pattern_table/delete_modal_msg.test.tsx b/src/plugins/data_view_management/public/components/index_pattern_table/delete_modal_msg.test.tsx
index c6084cb219b0d..9bfc9234b4d81 100644
--- a/src/plugins/data_view_management/public/components/index_pattern_table/delete_modal_msg.test.tsx
+++ b/src/plugins/data_view_management/public/components/index_pattern_table/delete_modal_msg.test.tsx
@@ -9,20 +9,34 @@
 import { deleteModalMsg } from './delete_modal_msg';
 
 describe('delete modal content', () => {
-  const toDVProps = (title: string, namespaces: string[]) => {
+  const toDVProps = (title: string, name: string, namespaces: string[]) => {
     return {
       id: '1',
       title,
+      name,
       namespaces,
+      getName: () => title,
     };
   };
 
   test('render', () => {
-    expect(deleteModalMsg([toDVProps('logstash-*', ['a', 'b', 'c'])], true)).toMatchSnapshot();
-    expect(deleteModalMsg([toDVProps('logstash-*', ['a', 'b', 'c'])], false)).toMatchSnapshot();
-    expect(deleteModalMsg([toDVProps('logstash-*', ['*'])], true)).toMatchSnapshot();
     expect(
-      deleteModalMsg([toDVProps('logstash-*', ['*']), toDVProps('log*', ['a', 'b', 'c'])], true)
+      deleteModalMsg([toDVProps('logstash-*', 'Logstash Star', ['a', 'b', 'c'])], true)
+    ).toMatchSnapshot();
+    expect(
+      deleteModalMsg([toDVProps('logstash-*', 'Logstash Star', ['a', 'b', 'c'])], false)
+    ).toMatchSnapshot();
+    expect(
+      deleteModalMsg([toDVProps('logstash-*', 'Logstash Star', ['*'])], true)
+    ).toMatchSnapshot();
+    expect(
+      deleteModalMsg(
+        [
+          toDVProps('logstash-*', 'Logstash Star', ['*']),
+          toDVProps('log*', 'Log Star', ['a', 'b', 'c']),
+        ],
+        true
+      )
     ).toMatchSnapshot();
   });
 });
diff --git a/test/functional/apps/management/_index_pattern_create_delete.ts b/test/functional/apps/management/_index_pattern_create_delete.ts
index a23b3c8f366c7..fb69d220ab906 100644
--- a/test/functional/apps/management/_index_pattern_create_delete.ts
+++ b/test/functional/apps/management/_index_pattern_create_delete.ts
@@ -128,9 +128,13 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
           );
         });
       });
-
       it('shows edit confirm message when editing index-pattern', async () => {
-        await PageObjects.settings.editIndexPattern('index-*', '@timestamp', 'Index Star', true);
+        await PageObjects.settings.editIndexPattern(
+          'logstash-2*',
+          '@timestamp',
+          'Index Star',
+          true
+        );
 
         await retry.try(async () => {
           expect(await testSubjects.getVisibleText('indexPatternTitle')).to.contain(`Index Star`);

From c8575139b73571359893296511d916f49b00c9b9 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Mon, 2 May 2022 19:26:15 +0200
Subject: [PATCH 25/35] change text to have unique key

---
 src/plugins/management/public/utils/breadcrumbs.ts | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/plugins/management/public/utils/breadcrumbs.ts b/src/plugins/management/public/utils/breadcrumbs.ts
index f1f1a6e7fb0bd..3f2556db47a11 100644
--- a/src/plugins/management/public/utils/breadcrumbs.ts
+++ b/src/plugins/management/public/utils/breadcrumbs.ts
@@ -8,15 +8,15 @@
 
 import { i18n } from '@kbn/i18n';
 
+const managementBreadcrumbText = i18n.translate('management.breadcrumb', {
+  defaultMessage: 'Stack Management',
+});
+
 export const MANAGEMENT_BREADCRUMB_NO_HREF = {
-  text: i18n.translate('management.breadcrumb', {
-    defaultMessage: 'Stack Management',
-  }),
+  text: managementBreadcrumbText,
 };
 
 export const MANAGEMENT_BREADCRUMB = {
-  text: i18n.translate('management.breadcrumb', {
-    defaultMessage: 'Stack Management',
-  }),
+  text: managementBreadcrumbText,
   href: '/',
 };

From 03f1b90d512ed4fcb5174a392f3097d6467257a0 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Mon, 2 May 2022 20:08:15 +0200
Subject: [PATCH 26/35] update jest snapshots

---
 .../delete_modal_msg.test.tsx.snap             | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/plugins/data_view_management/public/components/index_pattern_table/__snapshots__/delete_modal_msg.test.tsx.snap b/src/plugins/data_view_management/public/components/index_pattern_table/__snapshots__/delete_modal_msg.test.tsx.snap
index 233c859f0a15e..8a621afeb071b 100644
--- a/src/plugins/data_view_management/public/components/index_pattern_table/__snapshots__/delete_modal_msg.test.tsx.snap
+++ b/src/plugins/data_view_management/public/components/index_pattern_table/__snapshots__/delete_modal_msg.test.tsx.snap
@@ -29,7 +29,7 @@ exports[`delete modal content render 1`] = `
     columns={
       Array [
         Object {
-          "field": "title",
+          "field": "name",
           "name": "Data view",
           "sortable": true,
         },
@@ -46,7 +46,9 @@ exports[`delete modal content render 1`] = `
     items={
       Array [
         Object {
+          "getName": [Function],
           "id": "1",
+          "name": "logstash-*",
           "namespaces": Array [
             "a",
             "b",
@@ -98,7 +100,7 @@ exports[`delete modal content render 2`] = `
     columns={
       Array [
         Object {
-          "field": "title",
+          "field": "name",
           "name": "Data view",
           "sortable": true,
         },
@@ -107,7 +109,9 @@ exports[`delete modal content render 2`] = `
     items={
       Array [
         Object {
+          "getName": [Function],
           "id": "1",
+          "name": "logstash-*",
           "namespaces": Array [
             "a",
             "b",
@@ -159,7 +163,7 @@ exports[`delete modal content render 3`] = `
     columns={
       Array [
         Object {
-          "field": "title",
+          "field": "name",
           "name": "Data view",
           "sortable": true,
         },
@@ -176,7 +180,9 @@ exports[`delete modal content render 3`] = `
     items={
       Array [
         Object {
+          "getName": [Function],
           "id": "1",
+          "name": "logstash-*",
           "namespaces": Array [
             "*",
           ],
@@ -226,7 +232,7 @@ exports[`delete modal content render 4`] = `
     columns={
       Array [
         Object {
-          "field": "title",
+          "field": "name",
           "name": "Data view",
           "sortable": true,
         },
@@ -243,14 +249,18 @@ exports[`delete modal content render 4`] = `
     items={
       Array [
         Object {
+          "getName": [Function],
           "id": "1",
+          "name": "logstash-*",
           "namespaces": Array [
             "*",
           ],
           "title": "logstash-*",
         },
         Object {
+          "getName": [Function],
           "id": "1",
+          "name": "log*",
           "namespaces": Array [
             "a",
             "b",

From 246c1a1ac636905b86575ea0c90a0ca285fcbbf2 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Wed, 1 Jun 2022 14:55:38 +0200
Subject: [PATCH 27/35] fixes for unified_search and some ui changes

---
 .../control_group/editor/control_editor.tsx   |  2 +-
 .../edit_data_view_changed_modal.tsx          | 56 +++++++++----------
 .../data_view_editor_flyout_content.tsx       |  4 ++
 .../data_view_flyout_content_container.tsx    |  4 +-
 .../field_editor_flyout_content.tsx           |  2 +-
 .../components/sidebar/discover_sidebar.tsx   |  2 +-
 .../components/top_nav/discover_topnav.tsx    |  2 +-
 .../data_view_picker.stories.tsx              |  2 +-
 .../public/dataview_picker/dataview_list.tsx  |  4 +-
 .../components/visualize_top_nav.tsx          |  2 +-
 .../lens/public/app_plugin/lens_top_nav.tsx   |  2 +-
 11 files changed, 41 insertions(+), 41 deletions(-)

diff --git a/src/plugins/controls/public/control_group/editor/control_editor.tsx b/src/plugins/controls/public/control_group/editor/control_editor.tsx
index 6349d429f0974..9d7a8931eee21 100644
--- a/src/plugins/controls/public/control_group/editor/control_editor.tsx
+++ b/src/plugins/controls/public/control_group/editor/control_editor.tsx
@@ -222,7 +222,7 @@ export const ControlEditor = ({
               }}
               trigger={{
                 label:
-                  state.selectedDataView?.title ??
+                  state.selectedDataView?.getName() ??
                   ControlGroupStrings.manageControl.getSelectDataViewMessage(),
               }}
             />
diff --git a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
index 096c76b58c633..b796ba50c0f03 100644
--- a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
+++ b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
@@ -15,35 +15,31 @@ interface EditDataViewDeps {
   onEdit: () => void;
 }
 
-export const editDataViewModal = ({ dataViewName, overlays, onEdit }: EditDataViewDeps) => {
+export const editDataViewModal = ({ dataViewName, overlays, onEdit }: EditDataViewDeps) =>
   overlays &&
-    overlays
-      .openConfirm(
-        i18n.translate('indexPatternEditor.editDataView.editConfirmationModal.modalDescription', {
-          defaultMessage: 'Changing this data view can break other objects that depend on it.',
+  overlays
+    .openConfirm(
+      i18n.translate('indexPatternEditor.editDataView.editConfirmationModal.modalDescription', {
+        defaultMessage: 'Changing this data view can break other objects that depend on it.',
+      }),
+      {
+        confirmButtonText: i18n.translate(
+          'indexPatternEditor.editDataView.editConfirmationModal.editButton',
+          {
+            defaultMessage: 'Edit',
+          }
+        ),
+        title: i18n.translate('indexPatternEditor.editDataView.editConfirmationModal.editHeader', {
+          defaultMessage: `Edit '{name}'`,
+          values: {
+            name: dataViewName,
+          },
         }),
-        {
-          confirmButtonText: i18n.translate(
-            'indexPatternEditor.editDataView.editConfirmationModal.editButton',
-            {
-              defaultMessage: 'Edit',
-            }
-          ),
-          title: i18n.translate(
-            'indexPatternEditor.editDataView.editConfirmationModal.editHeader',
-            {
-              defaultMessage: `Edit '{name}'`,
-              values: {
-                name: dataViewName,
-              },
-            }
-          ),
-          buttonColor: 'danger',
-        }
-      )
-      .then(async (isConfirmed) => {
-        if (isConfirmed) {
-          onEdit();
-        }
-      });
-};
+        buttonColor: 'danger',
+      }
+    )
+    .then(async (isConfirmed) => {
+      if (isConfirmed) {
+        onEdit();
+      }
+    });
diff --git a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
index bdc98249b9ead..69a63ae5df594 100644
--- a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
@@ -306,6 +306,8 @@ const IndexPatternEditorFlyoutContentComponent = ({
   );
 
   // If editData exists, loadSources so that MatchedIndices can be loaded for the Timestampfields
+  // We use the below eslint-disable as adding 'loadSources' and 'reloadMatchedIndices' as a dependency creates an infinite loop
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   useEffect(() => {
     if (editData) {
       loadSources();
@@ -313,6 +315,8 @@ const IndexPatternEditorFlyoutContentComponent = ({
     }
   }, [editData]);
 
+  // We use the below eslint-disable as adding editData as a dependency create an infinite loop
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   useEffect(() => {
     loadTimestampFieldOptions(editData ? editData.title : title);
     if (!editData) getFields().timestampField?.setValue('');
diff --git a/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx b/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
index 7044e035a36b6..95a8b4692d14e 100644
--- a/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
@@ -40,8 +40,8 @@ const IndexPatternFlyoutContentContainer = ({
 
       if (indexPattern && !(indexPattern instanceof Error)) {
         const message = i18n.translate('indexPatternEditor.saved', {
-          defaultMessage: "Saved '{indexPatternTitle}'",
-          values: { indexPatternTitle: indexPattern.title },
+          defaultMessage: "Saved '{indexPatternName}'",
+          values: { indexPatternName: indexPattern.getName() },
         });
         notifications.toasts.addSuccess(message);
         await onSave(indexPattern);
diff --git a/src/plugins/data_view_field_editor/public/components/field_editor_flyout_content.tsx b/src/plugins/data_view_field_editor/public/components/field_editor_flyout_content.tsx
index 5d14f3a7be4cb..765fb23502972 100644
--- a/src/plugins/data_view_field_editor/public/components/field_editor_flyout_content.tsx
+++ b/src/plugins/data_view_field_editor/public/components/field_editor_flyout_content.tsx
@@ -218,7 +218,7 @@ const FieldEditorFlyoutContentComponent = ({
                     id="indexPatternFieldEditor.editor.flyoutEditFieldSubtitle"
                     defaultMessage="Data view: {patternName}"
                     values={{
-                      patternName: <i>{dataView.title}</i>,
+                      patternName: <i>{dataView.getName()}</i>,
                     }}
                   />
                 </p>
diff --git a/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.tsx b/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.tsx
index 585fa79783ace..875e51d958552 100644
--- a/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.tsx
+++ b/src/plugins/discover/public/application/main/components/sidebar/discover_sidebar.tsx
@@ -323,7 +323,7 @@ export function DiscoverSidebarComponent({
             onAddField={editField}
             onDataViewCreated={createNewDataView}
             trigger={{
-              label: selectedIndexPattern?.title || '',
+              label: selectedIndexPattern?.getName() || '',
               'data-test-subj': 'indexPattern-switch-link',
               title: selectedIndexPattern?.title || '',
               fullWidth: true,
diff --git a/src/plugins/discover/public/application/main/components/top_nav/discover_topnav.tsx b/src/plugins/discover/public/application/main/components/top_nav/discover_topnav.tsx
index 87d2f04bd604b..e698f3756fb5f 100644
--- a/src/plugins/discover/public/application/main/components/top_nav/discover_topnav.tsx
+++ b/src/plugins/discover/public/application/main/components/top_nav/discover_topnav.tsx
@@ -174,7 +174,7 @@ export const DiscoverTopNav = ({
 
   const dataViewPickerProps = {
     trigger: {
-      label: indexPattern?.title || '',
+      label: indexPattern?.getName() || '',
       'data-test-subj': 'discover-dataView-switch-link',
       title: indexPattern?.title || '',
     },
diff --git a/src/plugins/presentation_util/public/components/data_view_picker/data_view_picker.stories.tsx b/src/plugins/presentation_util/public/components/data_view_picker/data_view_picker.stories.tsx
index 29c82fda2d213..127e60638fd41 100644
--- a/src/plugins/presentation_util/public/components/data_view_picker/data_view_picker.stories.tsx
+++ b/src/plugins/presentation_util/public/components/data_view_picker/data_view_picker.stories.tsx
@@ -46,7 +46,7 @@ export function Example({}: {} & StorybookParams) {
     });
   };
 
-  const triggerLabel = dataView?.title || 'Choose Data View';
+  const triggerLabel = dataView?.getName() || 'Choose Data View';
 
   return (
     <DataViewPicker
diff --git a/src/plugins/unified_search/public/dataview_picker/dataview_list.tsx b/src/plugins/unified_search/public/dataview_picker/dataview_list.tsx
index 58d81c06563ce..da0919bd0ce8e 100644
--- a/src/plugins/unified_search/public/dataview_picker/dataview_list.tsx
+++ b/src/plugins/unified_search/public/dataview_picker/dataview_list.tsx
@@ -38,9 +38,9 @@ export function DataViewsList({
       data-test-subj="indexPattern-switcher"
       searchable
       singleSelection="always"
-      options={dataViewsList?.map(({ title, id }) => ({
+      options={dataViewsList?.map(({ title, id, name }) => ({
         key: id,
-        label: title,
+        label: name ? name : title,
         value: id,
         checked: id === currentDataViewId ? 'on' : undefined,
       }))}
diff --git a/src/plugins/visualizations/public/visualize_app/components/visualize_top_nav.tsx b/src/plugins/visualizations/public/visualize_app/components/visualize_top_nav.tsx
index 8fe5cfca44e5d..8f19856bcdd40 100644
--- a/src/plugins/visualizations/public/visualize_app/components/visualize_top_nav.tsx
+++ b/src/plugins/visualizations/public/visualize_app/components/visualize_top_nav.tsx
@@ -324,7 +324,7 @@ const TopNav = ({
                             }),
                       },
                     })
-                  : vis.data.indexPattern.title,
+                  : vis.data.indexPattern.getName(),
               },
               isMissingCurrent: isMissingCurrentDataView,
               onChangeDataView,
diff --git a/x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx b/x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx
index 4ae1b8860c878..98b0c89cd2902 100644
--- a/x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx
+++ b/x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx
@@ -694,7 +694,7 @@ export const LensTopNavMenu = ({
 
   const dataViewPickerProps = {
     trigger: {
-      label: currentIndexPattern?.title || '',
+      label: currentIndexPattern?.getName() || '',
       'data-test-subj': 'lns-dataView-switch-link',
       title: currentIndexPattern?.title || '',
     },

From 1a3970a8fc33f66d247da574a9c385ab62149131 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Wed, 1 Jun 2022 15:15:31 +0200
Subject: [PATCH 28/35] add test fixes and disabled editing data view id when
 in edit mode

---
 .../advanced_params_content.tsx                     |  7 ++++++-
 .../components/data_view_editor_flyout_content.tsx  | 13 ++++++++-----
 .../apps/dashboard/group4/dashboard_empty.ts        |  2 +-
 test/functional/apps/discover/_no_data.ts           |  2 +-
 test/functional/apps/visualize/group1/_no_data.ts   |  2 +-
 x-pack/test/functional/apps/lens/group3/no_data.ts  |  2 +-
 6 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/src/plugins/data_view_editor/public/components/advanced_params_content/advanced_params_content.tsx b/src/plugins/data_view_editor/public/components/advanced_params_content/advanced_params_content.tsx
index 5b25b6d06286d..3e34d0729f28d 100644
--- a/src/plugins/data_view_editor/public/components/advanced_params_content/advanced_params_content.tsx
+++ b/src/plugins/data_view_editor/public/components/advanced_params_content/advanced_params_content.tsx
@@ -28,9 +28,13 @@ const customIndexPatternIdLabel = i18n.translate(
 
 interface AdvancedParamsContentProps {
   disableAllowHidden: boolean;
+  disableId: boolean;
 }
 
-export const AdvancedParamsContent = ({ disableAllowHidden }: AdvancedParamsContentProps) => (
+export const AdvancedParamsContent = ({
+  disableAllowHidden,
+  disableId,
+}: AdvancedParamsContentProps) => (
   <AdvancedParamsSection>
     <EuiFlexGroup>
       <EuiFlexItem>
@@ -57,6 +61,7 @@ export const AdvancedParamsContent = ({ disableAllowHidden }: AdvancedParamsCont
           componentProps={{
             euiFieldProps: {
               'aria-label': customIndexPatternIdLabel,
+              disabled: disableId,
             },
           }}
         />
diff --git a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
index 69a63ae5df594..f5f77159ff0d2 100644
--- a/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_editor_flyout_content.tsx
@@ -306,20 +306,20 @@ const IndexPatternEditorFlyoutContentComponent = ({
   );
 
   // If editData exists, loadSources so that MatchedIndices can be loaded for the Timestampfields
-  // We use the below eslint-disable as adding 'loadSources' and 'reloadMatchedIndices' as a dependency creates an infinite loop
-  // eslint-disable-next-line react-hooks/exhaustive-deps
   useEffect(() => {
     if (editData) {
       loadSources();
       reloadMatchedIndices(editData.title);
     }
+    // We use the below eslint-disable as adding 'loadSources' and 'reloadMatchedIndices' as a dependency creates an infinite loop
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [editData]);
 
-  // We use the below eslint-disable as adding editData as a dependency create an infinite loop
-  // eslint-disable-next-line react-hooks/exhaustive-deps
   useEffect(() => {
     loadTimestampFieldOptions(editData ? editData.title : title);
     if (!editData) getFields().timestampField?.setValue('');
+    // We use the below eslint-disable as adding editData as a dependency create an infinite loop
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [loadTimestampFieldOptions, title, getFields]);
 
   const onTypeChange = useCallback(
@@ -409,7 +409,10 @@ const IndexPatternEditorFlyoutContentComponent = ({
                 />
               </EuiFlexItem>
             </EuiFlexGroup>
-            <AdvancedParamsContent disableAllowHidden={type === INDEX_PATTERN_TYPE.ROLLUP} />
+            <AdvancedParamsContent
+              disableAllowHidden={type === INDEX_PATTERN_TYPE.ROLLUP}
+              disableId={!!editData}
+            />
           </Form>
           <Footer
             onCancel={onCancel}
diff --git a/test/functional/apps/dashboard/group4/dashboard_empty.ts b/test/functional/apps/dashboard/group4/dashboard_empty.ts
index 25da6d37e0db2..6edee2d646261 100644
--- a/test/functional/apps/dashboard/group4/dashboard_empty.ts
+++ b/test/functional/apps/dashboard/group4/dashboard_empty.ts
@@ -19,7 +19,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
   const PageObjects = getPageObjects(['common', 'dashboard', 'header', 'timePicker']);
 
   const createDataView = async (dataViewName: string) => {
-    await testSubjects.setValue('createIndexPatternNameInput', dataViewName, {
+    await testSubjects.setValue('createIndexPatternTitleInput', dataViewName, {
       clearWithKeyboard: true,
       typeCharByChar: true,
     });
diff --git a/test/functional/apps/discover/_no_data.ts b/test/functional/apps/discover/_no_data.ts
index 8e36d563e9090..2a21aa56bb366 100644
--- a/test/functional/apps/discover/_no_data.ts
+++ b/test/functional/apps/discover/_no_data.ts
@@ -17,7 +17,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
   const PageObjects = getPageObjects(['common', 'discover', 'header', 'timePicker']);
 
   const createDataView = async (dataViewName: string) => {
-    await testSubjects.setValue('createIndexPatternNameInput', dataViewName, {
+    await testSubjects.setValue('createIndexPatternTitleInput', dataViewName, {
       clearWithKeyboard: true,
       typeCharByChar: true,
     });
diff --git a/test/functional/apps/visualize/group1/_no_data.ts b/test/functional/apps/visualize/group1/_no_data.ts
index 9b86ea3aae675..785e758224e88 100644
--- a/test/functional/apps/visualize/group1/_no_data.ts
+++ b/test/functional/apps/visualize/group1/_no_data.ts
@@ -17,7 +17,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
   const kibanaServer = getService('kibanaServer');
 
   const createDataView = async (dataViewName: string) => {
-    await testSubjects.setValue('createIndexPatternNameInput', dataViewName, {
+    await testSubjects.setValue('createIndexPatternTitleInput', dataViewName, {
       clearWithKeyboard: true,
       typeCharByChar: true,
     });
diff --git a/x-pack/test/functional/apps/lens/group3/no_data.ts b/x-pack/test/functional/apps/lens/group3/no_data.ts
index edb29091e18f6..d1432127578c7 100644
--- a/x-pack/test/functional/apps/lens/group3/no_data.ts
+++ b/x-pack/test/functional/apps/lens/group3/no_data.ts
@@ -16,7 +16,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
   const PageObjects = getPageObjects(['common', 'lens', 'header', 'timePicker']);
 
   const createDataView = async (dataViewName: string) => {
-    await testSubjects.setValue('createIndexPatternNameInput', dataViewName, {
+    await testSubjects.setValue('createIndexPatternTitleInput', dataViewName, {
       clearWithKeyboard: true,
       typeCharByChar: true,
     });

From d69fa8bcab26d8ac1fb244a6e21967e28be341b6 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Wed, 1 Jun 2022 16:09:59 +0200
Subject: [PATCH 29/35] fix for translation bug

---
 x-pack/plugins/translations/translations/fr-FR.json | 2 +-
 x-pack/plugins/translations/translations/ja-JP.json | 2 +-
 x-pack/plugins/translations/translations/zh-CN.json | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/x-pack/plugins/translations/translations/fr-FR.json b/x-pack/plugins/translations/translations/fr-FR.json
index ae7eaede16fe1..dcc0c7c313673 100644
--- a/x-pack/plugins/translations/translations/fr-FR.json
+++ b/x-pack/plugins/translations/translations/fr-FR.json
@@ -4484,7 +4484,7 @@
     "indexPatternEditor.rollupDataView.warning.textParagraphTwo": "Vous pouvez mettre une vue de données de cumul en correspondance avec un index de cumul et zéro index régulier ou plus. Une vue de données de cumul dispose d'indicateurs, de champs, d'intervalles et d'agrégations limités. Un index de cumul se limite aux index disposant d'une configuration de tâche ou de plusieurs tâches avec des configurations compatibles.",
     "indexPatternEditor.rollupIndexPattern.warning.title": "Fonctionnalité bêta",
     "indexPatternEditor.rollupLabel": "Cumul",
-    "indexPatternEditor.saved": "\"{indexPatternTitle}\" enregistré",
+    "indexPatternEditor.saved": "\"{indexPatternName}\" enregistré",
     "indexPatternEditor.status.matchAnyLabel.matchAnyDetail": "Votre modèle d'indexation peut correspondre à {sourceCount, plural, one {# source} other {# sources} }.",
     "indexPatternEditor.status.noSystemIndicesLabel": "Aucun flux de données, index ni alias d'index ne correspond à votre modèle d'indexation.",
     "indexPatternEditor.status.noSystemIndicesWithPromptLabel": "Aucun flux de données, index ni alias d'index ne correspond à votre modèle d'indexation.",
diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json
index f502a392a6820..bcb05fac0187f 100644
--- a/x-pack/plugins/translations/translations/ja-JP.json
+++ b/x-pack/plugins/translations/translations/ja-JP.json
@@ -4577,7 +4577,7 @@
     "indexPatternEditor.rollupDataView.warning.textParagraphTwo": "ロールアップデータビューは、1つのロールアップインデックスとゼロ以上の標準インデックスと一致させることができます。ロールアップデータビューでは、メトリック、フィールド、間隔、アグリゲーションが制限されています。ロールアップインデックスは、1つのジョブ構成があるインデックス、または複数のジョブと互換する構成があるインデックスに制限されています。",
     "indexPatternEditor.rollupIndexPattern.warning.title": "ベータ機能",
     "indexPatternEditor.rollupLabel": "ロールアップ",
-    "indexPatternEditor.saved": "Saved '{indexPatternTitle}'",
+    "indexPatternEditor.saved": "Saved '{indexPatternName}'",
     "indexPatternEditor.status.matchAnyLabel.matchAnyDetail": "インデックスパターンは、{sourceCount, plural, other  {# 個のソース} }と一致します。",
     "indexPatternEditor.status.noSystemIndicesLabel": "データストリーム、インデックス、またはインデックスエイリアスがインデックスパターンと一致しません。",
     "indexPatternEditor.status.noSystemIndicesWithPromptLabel": "データストリーム、インデックス、またはインデックスエイリアスがインデックスパターンと一致しません。",
diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json
index 1cdfba5eda836..47158b284c6a7 100644
--- a/x-pack/plugins/translations/translations/zh-CN.json
+++ b/x-pack/plugins/translations/translations/zh-CN.json
@@ -4588,7 +4588,7 @@
     "indexPatternEditor.rollupDataView.warning.textParagraphTwo": "可以根据一个汇总/打包索引和零个或更多常规索引匹配汇总/打包数据视图。汇总/打包数据视图的指标、字段、时间间隔和聚合有限。汇总/打包索引仅限于具有一个作业配置或多个作业配置兼容的索引。",
     "indexPatternEditor.rollupIndexPattern.warning.title": "公测版功能",
     "indexPatternEditor.rollupLabel": "汇总/打包",
-    "indexPatternEditor.saved": "已保存“{indexPatternTitle}”",
+    "indexPatternEditor.saved": "已保存“{indexPatternName}”",
     "indexPatternEditor.status.matchAnyLabel.matchAnyDetail": "您的索引模式可以匹配{sourceCount, plural, other {# 个源} }。",
     "indexPatternEditor.status.noSystemIndicesLabel": "没有数据流、索引或索引别名匹配您的索引模式。",
     "indexPatternEditor.status.noSystemIndicesWithPromptLabel": "没有数据流、索引或索引别名匹配您的索引模式。",

From 832eef36261a4a8b7b65d41b38345b8ef420add8 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Thu, 2 Jun 2022 00:18:44 +0200
Subject: [PATCH 30/35] fix for failing tests

---
 .../__jest__/client_integration/helpers/setup_environment.tsx   | 2 ++
 x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx          | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/plugins/data_view_field_editor/__jest__/client_integration/helpers/setup_environment.tsx b/src/plugins/data_view_field_editor/__jest__/client_integration/helpers/setup_environment.tsx
index 438c358ae9bb5..9979e96261e7b 100644
--- a/src/plugins/data_view_field_editor/__jest__/client_integration/helpers/setup_environment.tsx
+++ b/src/plugins/data_view_field_editor/__jest__/client_integration/helpers/setup_environment.tsx
@@ -117,6 +117,8 @@ export const WithFieldEditorDependencies =
     const dependencies: Context = {
       dataView: {
         title: indexPatternNameForTest,
+        name: indexPatternNameForTest,
+        getName: () => indexPatternNameForTest,
         fields: { getAll: spyIndexPatternGetAllFields },
       } as any,
       uiSettings: uiSettingsServiceMock.createStartContract(),
diff --git a/x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx b/x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx
index 98b0c89cd2902..dbe7125760335 100644
--- a/x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx
+++ b/x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx
@@ -694,7 +694,7 @@ export const LensTopNavMenu = ({
 
   const dataViewPickerProps = {
     trigger: {
-      label: currentIndexPattern?.getName() || '',
+      label: (currentIndexPattern?.getName && currentIndexPattern?.getName()) || '',
       'data-test-subj': 'lns-dataView-switch-link',
       title: currentIndexPattern?.title || '',
     },

From 860277d109e255cc2a7cde5b0f2991e671cba897 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Tue, 7 Jun 2022 09:41:56 +0200
Subject: [PATCH 31/35] review comment changes

---
 .../confirm_modals/edit_data_view_changed_modal.tsx  |  4 ++--
 .../data_view_flyout_content_container.tsx           | 12 ++++++------
 .../data_views/common/data_views/data_view.ts        |  4 +++-
 src/plugins/data_views/common/types.ts               |  6 ++++++
 4 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
index b796ba50c0f03..69ca69fa7c23f 100644
--- a/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
+++ b/src/plugins/data_view_editor/public/components/confirm_modals/edit_data_view_changed_modal.tsx
@@ -24,9 +24,9 @@ export const editDataViewModal = ({ dataViewName, overlays, onEdit }: EditDataVi
       }),
       {
         confirmButtonText: i18n.translate(
-          'indexPatternEditor.editDataView.editConfirmationModal.editButton',
+          'indexPatternEditor.editDataView.editConfirmationModal.confirmButton',
           {
-            defaultMessage: 'Edit',
+            defaultMessage: 'Confirm',
           }
         ),
         title: i18n.translate('indexPatternEditor.editDataView.editConfirmationModal.editHeader', {
diff --git a/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx b/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
index 95a8b4692d14e..6ad8c47643e6e 100644
--- a/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
+++ b/src/plugins/data_view_editor/public/components/data_view_flyout_content_container.tsx
@@ -27,24 +27,24 @@ const IndexPatternFlyoutContentContainer = ({
 
   const onSaveClick = async (dataViewSpec: DataViewSpec) => {
     try {
-      let indexPattern;
+      let saveResponse;
       if (editData) {
         const { name = '', timeFieldName, title = '' } = dataViewSpec;
         editData.title = title;
         editData.name = name;
         editData.timeFieldName = timeFieldName;
-        indexPattern = await dataViews.updateSavedObject(editData);
+        saveResponse = await dataViews.updateSavedObject(editData);
       } else {
-        indexPattern = await dataViews.createAndSave(dataViewSpec);
+        saveResponse = await dataViews.createAndSave(dataViewSpec);
       }
 
-      if (indexPattern && !(indexPattern instanceof Error)) {
+      if (saveResponse && !(saveResponse instanceof Error)) {
         const message = i18n.translate('indexPatternEditor.saved', {
           defaultMessage: "Saved '{indexPatternName}'",
-          values: { indexPatternName: indexPattern.getName() },
+          values: { indexPatternName: saveResponse.getName() },
         });
         notifications.toasts.addSuccess(message);
-        await onSave(indexPattern);
+        await onSave(saveResponse);
       }
     } catch (e) {
       const title = i18n.translate('indexPatternEditor.dataView.unableSaveLabel', {
diff --git a/src/plugins/data_views/common/data_views/data_view.ts b/src/plugins/data_views/common/data_views/data_view.ts
index a58589f55b488..91ae12c2b3c1c 100644
--- a/src/plugins/data_views/common/data_views/data_view.ts
+++ b/src/plugins/data_views/common/data_views/data_view.ts
@@ -127,11 +127,13 @@ export class DataView implements DataViewBase {
    * Map of runtime field definitions by field name
    */
   private runtimeFieldMap: Record<string, RuntimeFieldSpec>;
-
   /**
    * Prevents errors when index pattern exists before indices
    */
   public readonly allowNoIndex: boolean = false;
+  /**
+   * Name of the data view. Human readable name used to differentiate data view.
+   */
   public name: string = '';
 
   /**
diff --git a/src/plugins/data_views/common/types.ts b/src/plugins/data_views/common/types.ts
index 668432d7dc24a..886cb07488140 100644
--- a/src/plugins/data_views/common/types.ts
+++ b/src/plugins/data_views/common/types.ts
@@ -152,6 +152,9 @@ export interface DataViewAttributes {
    * Prevents errors when index pattern exists before indices
    */
   allowNoIndex?: boolean;
+  /**
+   * Name of the data view. Human readable name used to differentiate data view.
+   */
   name?: string;
 }
 
@@ -480,6 +483,9 @@ export interface DataViewSpec {
    * Array of namespace ids
    */
   namespaces?: string[];
+  /**
+   * Name of the data view. Human readable name used to differentiate data view.
+   */
   name?: string;
 }
 

From 148b7f76d1d5c4a27286c2b110cd126ee60d92f5 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Tue, 7 Jun 2022 18:11:08 +0200
Subject: [PATCH 32/35] some nit fixes

---
 .../unified_search/public/dataview_picker/dataview_list.tsx     | 2 +-
 .../components/lib/index_pattern_select/combo_box_select.tsx    | 2 +-
 x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx          | 2 +-
 x-pack/plugins/lens/public/indexpattern_datasource/loader.ts    | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/plugins/unified_search/public/dataview_picker/dataview_list.tsx b/src/plugins/unified_search/public/dataview_picker/dataview_list.tsx
index da0919bd0ce8e..5ca173ff4dae7 100644
--- a/src/plugins/unified_search/public/dataview_picker/dataview_list.tsx
+++ b/src/plugins/unified_search/public/dataview_picker/dataview_list.tsx
@@ -40,7 +40,7 @@ export function DataViewsList({
       singleSelection="always"
       options={dataViewsList?.map(({ title, id, name }) => ({
         key: id,
-        label: name ? name : title,
+        label: name ?? title,
         value: id,
         checked: id === currentDataViewId ? 'on' : undefined,
       }))}
diff --git a/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/combo_box_select.tsx b/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/combo_box_select.tsx
index eca39f6261eea..fb3a24681e1ba 100644
--- a/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/combo_box_select.tsx
+++ b/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/combo_box_select.tsx
@@ -24,7 +24,7 @@ type IdsWithTitle = Awaited<ReturnType<DataViewsService['getIdsWithTitle']>>;
 type SelectedOptions = EuiComboBoxProps<string>['selectedOptions'];
 
 const toComboBoxOptions = (options: IdsWithTitle) =>
-  options.map(({ name, title, id }) => ({ label: name ? name : title, id }));
+  options.map(({ name, title, id }) => ({ label: name ?? title, id }));
 
 export const ComboBoxSelect = ({
   fetchedIndex,
diff --git a/x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx b/x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx
index 5984c0d11cb32..b4657c4feaf55 100644
--- a/x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx
+++ b/x-pack/plugins/lens/public/app_plugin/lens_top_nav.tsx
@@ -696,7 +696,7 @@ export const LensTopNavMenu = ({
 
   const dataViewPickerProps = {
     trigger: {
-      label: (currentIndexPattern?.getName && currentIndexPattern?.getName()) || '',
+      label: currentIndexPattern?.getName?.() || '',
       'data-test-subj': 'lns-dataView-switch-link',
       title: currentIndexPattern?.title || '',
     },
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts b/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts
index d6acf5958bd2b..b059336d2e739 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts
@@ -85,7 +85,7 @@ export function convertDataViewIntoLensIndexPattern(dataView: DataView): IndexPa
   return {
     id: dataView.id!, // id exists for sure because we got index patterns by id
     title,
-    name: name ? name : title,
+    name: name ?? title,
     timeFieldName,
     fieldFormatMap:
       fieldFormatMap &&

From 29f5779aa798459bc62315b9ca895c45c850f1d8 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Tue, 7 Jun 2022 21:03:14 +0200
Subject: [PATCH 33/35] revert the operation change check

---
 .../unified_search/public/dataview_picker/dataview_list.tsx     | 2 +-
 .../components/lib/index_pattern_select/combo_box_select.tsx    | 2 +-
 x-pack/plugins/lens/public/indexpattern_datasource/loader.ts    | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/plugins/unified_search/public/dataview_picker/dataview_list.tsx b/src/plugins/unified_search/public/dataview_picker/dataview_list.tsx
index 5ca173ff4dae7..da0919bd0ce8e 100644
--- a/src/plugins/unified_search/public/dataview_picker/dataview_list.tsx
+++ b/src/plugins/unified_search/public/dataview_picker/dataview_list.tsx
@@ -40,7 +40,7 @@ export function DataViewsList({
       singleSelection="always"
       options={dataViewsList?.map(({ title, id, name }) => ({
         key: id,
-        label: name ?? title,
+        label: name ? name : title,
         value: id,
         checked: id === currentDataViewId ? 'on' : undefined,
       }))}
diff --git a/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/combo_box_select.tsx b/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/combo_box_select.tsx
index fb3a24681e1ba..eca39f6261eea 100644
--- a/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/combo_box_select.tsx
+++ b/src/plugins/vis_types/timeseries/public/application/components/lib/index_pattern_select/combo_box_select.tsx
@@ -24,7 +24,7 @@ type IdsWithTitle = Awaited<ReturnType<DataViewsService['getIdsWithTitle']>>;
 type SelectedOptions = EuiComboBoxProps<string>['selectedOptions'];
 
 const toComboBoxOptions = (options: IdsWithTitle) =>
-  options.map(({ name, title, id }) => ({ label: name ?? title, id }));
+  options.map(({ name, title, id }) => ({ label: name ? name : title, id }));
 
 export const ComboBoxSelect = ({
   fetchedIndex,
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts b/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts
index b059336d2e739..d6acf5958bd2b 100644
--- a/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts
+++ b/x-pack/plugins/lens/public/indexpattern_datasource/loader.ts
@@ -85,7 +85,7 @@ export function convertDataViewIntoLensIndexPattern(dataView: DataView): IndexPa
   return {
     id: dataView.id!, // id exists for sure because we got index patterns by id
     title,
-    name: name ?? title,
+    name: name ? name : title,
     timeFieldName,
     fieldFormatMap:
       fieldFormatMap &&

From ef7468c01d95b1b51dc03d0e11f40513e1f54270 Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Tue, 7 Jun 2022 22:22:21 +0200
Subject: [PATCH 34/35] fixed name not showing in dashboard with visualizations
 from different dataviews

---
 .../unified_search/public/filter_bar/filter_editor/index.tsx    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/plugins/unified_search/public/filter_bar/filter_editor/index.tsx b/src/plugins/unified_search/public/filter_bar/filter_editor/index.tsx
index 6a3d7192ab905..0bdda65b32c9d 100644
--- a/src/plugins/unified_search/public/filter_bar/filter_editor/index.tsx
+++ b/src/plugins/unified_search/public/filter_bar/filter_editor/index.tsx
@@ -231,7 +231,7 @@ class FilterEditorUI extends Component<Props, State> {
             })}
             options={this.props.indexPatterns}
             selectedOptions={selectedIndexPattern ? [selectedIndexPattern] : []}
-            getLabel={(indexPattern) => indexPattern.title}
+            getLabel={(indexPattern) => indexPattern.getName()}
             onChange={this.onIndexPatternChange}
             singleSelection={{ asPlainText: true }}
             isClearable={false}

From 3b1cb6de68c3c8e06237ce5cbc3e870c07aecb7c Mon Sep 17 00:00:00 2001
From: Shivindera Singh <shivindera@gmail.com>
Date: Wed, 8 Jun 2022 15:55:33 +0200
Subject: [PATCH 35/35] added a comment for the management breadcrumb

---
 .../public/components/management_app/management_app.tsx        | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/plugins/management/public/components/management_app/management_app.tsx b/src/plugins/management/public/components/management_app/management_app.tsx
index 2e9eb90a695b9..2eaa93d6e2a58 100644
--- a/src/plugins/management/public/components/management_app/management_app.tsx
+++ b/src/plugins/management/public/components/management_app/management_app.tsx
@@ -57,6 +57,9 @@ export const ManagementApp = ({ dependencies, history, theme$ }: ManagementAppPr
         ...(item.href ? reactRouterNavigate(scopedHistory, item.href) : {}),
       });
 
+      // Clicking the Management breadcrumb to navigate back to the "root" only
+      // makes sense if there's a management app open. So when one isn't open
+      // this breadcrumb shouldn't be a clickable link.
       const managementBreadcrumb = crumbs.length
         ? MANAGEMENT_BREADCRUMB
         : MANAGEMENT_BREADCRUMB_NO_HREF;