[User Experience] add title to UX data view (#117859) (#118015)

* add title to UX data view * update useDataView Co-authored-by: Dominique Clarke <[email protected]>
elastic · Nov 9, 2021 · 9e4734c · 9e4734c
1 parent 6efb2e3
commit 9e4734c
Show file tree

Hide file tree

Showing 2 changed files with 47 additions and 6 deletions.
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/use_data_view.test.js b/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/use_data_view.test.js
@@ -0,0 +1,44 @@
+/*
+ * 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; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+import React from 'react';
+import { renderHook } from '@testing-library/react-hooks';
+import * as dynamicDataView from '../../../../hooks/use_dynamic_data_view';
+import { useDataView } from './use_data_view';
+import { MockApmPluginContextWrapper } from '../../../../context/apm_plugin/mock_apm_plugin_context';
+import { KibanaContextProvider } from '../../../../../../../../src/plugins/kibana_react/public';
+
+describe('useDataView', () => {
+  const create = jest.fn();
+  const mockDataService = {
+    data: {
+      dataViews: {
+        create,
+      },
+    },
+  };
+
+  const title = 'apm-*';
+  jest
+    .spyOn(dynamicDataView, 'useDynamicDataViewFetcher')
+    .mockReturnValue({ dataView: { title } });
+
+  it('returns result as expected', async () => {
+    const { waitForNextUpdate } = renderHook(() => useDataView(), {
+      wrapper: ({ children }) => (
+        <MockApmPluginContextWrapper>
+          <KibanaContextProvider services={mockDataService}>
+            {children}
+          </KibanaContextProvider>
+        </MockApmPluginContextWrapper>
+      ),
+    });
+
+    await waitForNextUpdate();
+
+    expect(create).toBeCalledWith({ title });
+  });
+});
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/use_data_view.ts b/x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/use_data_view.ts
@@ -6,10 +6,7 @@
  */
 
 import { useDynamicDataViewFetcher } from '../../../../hooks/use_dynamic_data_view';
-import {
-  DataView,
-  DataViewSpec,
-} from '../../../../../../../../src/plugins/data/common';
+import { DataView } from '../../../../../../../../src/plugins/data/common';
 import { useKibana } from '../../../../../../../../src/plugins/kibana_react/public';
 import { useFetcher } from '../../../../hooks/use_fetcher';
 import { DataPublicPluginStart } from '../../../../../../../../src/plugins/data/public';
@@ -26,8 +23,8 @@ export function useDataView() {
   const { data } = useFetcher<Promise<DataView | undefined>>(async () => {
     if (dataView?.title) {
       return dataViews.create({
-        pattern: dataView?.title,
-      } as DataViewSpec);
+        title: dataView?.title,
+      });
     }
   }, [dataView?.title, dataViews]);