Move QueryStringInput ⇒ NP (#51873) (#52063)

* Move query string input and query bar top row to NP

* Fix query string input imports

* import

* Remove duplicate implementation of getFromSavedObject

* import getFromSavedObject

* Fixed import

* code review

* Remove css color

src/legacy/core_plugins/data/public/index.scss

@@ -1,5 +1,3 @@
 @import 'src/legacy/ui/public/styles/styling_constants';
 
-@import './query/query_bar/index';
-
-@import '../../../../plugins/data/public/ui/index'
+@import '../../../../plugins/data/public/index'

src/legacy/core_plugins/data/public/index.ts

@@ -36,7 +36,6 @@ export {
   IndexPattern,
   IndexPatterns,
 } from './index_patterns';
-export { QueryStringInput } from './query';
 export { SearchBar, SearchBarProps } from './search';
 export {
   SavedQueryAttributes,

src/legacy/core_plugins/data/public/search/search_bar/components/search_bar.test.tsx

@@ -38,17 +38,6 @@ const mockTimeHistory = {
 jest.mock('../../../../../../../plugins/data/public', () => {
   return {
     FilterBar: () => <div className="filterBar" />,
-  };
-});
-
-jest.mock('../../../../../data/public', () => {
-  return {
-    QueryStringInput: () => <div className="queryBar" />,
-  };
-});
-
-jest.mock('../../../query/query_bar', () => {
-  return {
     QueryBarTopRow: () => <div className="queryBar" />,
   };
 });

src/legacy/core_plugins/data/public/search/search_bar/components/search_bar.tsx

@@ -24,9 +24,6 @@ import React, { Component } from 'react';
 import ResizeObserver from 'resize-observer-polyfill';
 import { get, isEqual } from 'lodash';
 
-import { IndexPattern } from '../../../../../data/public';
-import { QueryBarTopRow } from '../../../query';
-
 import {
   withKibana,
   KibanaReactContextValue,
@@ -36,13 +33,15 @@ import {
   TimeRange,
   Query,
   esFilters,
+  IIndexPattern,
   TimeHistoryContract,
   FilterBar,
   SavedQuery,
   SavedQueryAttributes,
   SavedQueryMeta,
   SaveQueryForm,
   SavedQueryManagementComponent,
+  QueryBarTopRow,
 } from '../../../../../../../plugins/data/public';
 
 interface SearchBarInjectedDeps {
@@ -62,7 +61,7 @@ interface SearchBarInjectedDeps {
 }
 
 export interface SearchBarOwnProps {
-  indexPatterns?: IndexPattern[];
+  indexPatterns?: IIndexPattern[];
   isLoading?: boolean;
   customSubmitButton?: React.ReactNode;
   screenTitle?: string;

src/legacy/core_plugins/vis_type_timeseries/public/components/query_bar_wrapper.js

@@ -19,7 +19,7 @@
 
 import React, { useContext } from 'react';
 import { CoreStartContext } from '../contexts/query_input_bar_context';
-import { QueryStringInput } from 'plugins/data';
+import { QueryStringInput } from '../../../../../plugins/data/public';
 
 export function QueryBarWrapper(props) {
   const coreStartContext = useContext(CoreStartContext);

src/legacy/ui/public/vis/editors/default/controls/filter.tsx

@@ -20,10 +20,9 @@
 import React, { useState } from 'react';
 import { EuiForm, EuiButtonIcon, EuiFieldText, EuiFormRow, EuiSpacer } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
-import { QueryStringInput } from 'plugins/data';
-import { Query } from 'src/plugins/data/public';
 import { AggConfig } from '../../..';
 import { npStart } from '../../../../new_platform';
+import { Query, QueryStringInput } from '../../../../../../../plugins/data/public';
 import { Storage } from '../../../../../../../plugins/kibana_utils/public';
 import { KibanaContextProvider } from '../../../../../../../plugins/kibana_react/public';
 const localStorage = new Storage(window.localStorage);

src/plugins/data/public/_index.scss

@@ -0,0 +1 @@
+@import './ui/index';

src/plugins/data/public/index_patterns/index.ts

@@ -24,8 +24,9 @@ import {
   ILLEGAL_CHARACTERS,
   IndexPatternMissingIndices,
   validateIndexPattern,
+  getFromSavedObject,
 } from './lib';
-import { getRoutes, getFromSavedObject } from './utils';
+import { getRoutes } from './utils';
 import { flattenHitWrapper, formatHitProvider } from './index_patterns';
 
 export const indexPatterns = {

src/legacy/core_plugins/data/public/query/query_bar/index.ts → src/plugins/data/public/index_patterns/lib/get_from_saved_object.ts

@@ -17,5 +17,16 @@
  * under the License.
  */
 
-export { QueryBarTopRow } from './components/query_bar_top_row';
-export { QueryStringInput } from './components/query_string_input';
+import { get } from 'lodash';
+
+export function getFromSavedObject(savedObject: any) {
+  if (get(savedObject, 'attributes.fields') === undefined) {
+    return;
+  }
+
+  return {
+    id: savedObject.id,
+    fields: JSON.parse(savedObject.attributes.fields),
+    title: savedObject.attributes.title,
+  };
+}

src/plugins/data/public/index_patterns/lib/index.ts

@@ -21,3 +21,4 @@ export { getTitle } from './get_title';
 export * from './types';
 export { validateIndexPattern } from './validate_index_pattern';
 export { IndexPatternMissingIndices } from './errors';
+export { getFromSavedObject } from './get_from_saved_object';

src/plugins/data/public/index_patterns/utils.ts

@@ -17,7 +17,7 @@
  * under the License.
  */
 
-import { find, get } from 'lodash';
+import { find } from 'lodash';
 import { SavedObjectsClientContract, SimpleSavedObject } from 'src/core/public';
 
 /**
@@ -49,18 +49,6 @@ export async function findByTitle(
   );
 }
 
-export function getFromSavedObject(savedObject: any) {
-  if (get(savedObject, 'attributes.fields') === undefined) {
-    return;
-  }
-
-  return {
-    id: savedObject.id,
-    fields: JSON.parse(savedObject.attributes.fields),
-    title: savedObject.attributes.title,
-  };
-}
-
 export function getRoutes() {
   return {
     edit: '/management/kibana/index_patterns/{{id}}',

src/plugins/data/public/ui/_index.scss

@@ -4,3 +4,5 @@
 @import './typeahead/index';
 
 @import './saved_query_management/index';
+
+@import './query_string_input/index';

src/plugins/data/public/ui/index.ts

@@ -21,7 +21,9 @@ export { SuggestionsComponent } from './typeahead/suggestions_component';
 export { IndexPatternSelect } from './index_pattern_select';
 export { FilterBar } from './filter_bar';
 export { applyFiltersPopover } from './apply_filters';
+export { QueryStringInput } from './query_string_input/query_string_input';
+
 // temp export - will be removed as final components are migrated to NP
-export { QueryLanguageSwitcher } from './query_string_input/language_switcher';
+export { QueryBarTopRow } from './query_string_input/query_bar_top_row';
 export { SavedQueryManagementComponent } from './saved_query_management';
 export { SaveQueryForm, SavedQueryMeta } from './saved_query_form';

src/legacy/core_plugins/data/public/query/query_bar/components/fetch_index_patterns.ts → src/plugins/data/public/ui/query_string_input/fetch_index_patterns.ts

@@ -18,7 +18,7 @@
  */
 import { isEmpty } from 'lodash';
 import { IUiSettingsClient, SavedObjectsClientContract } from 'src/core/public';
-import { getFromSavedObject } from '../../../';
+import { indexPatterns } from '../..';
 
 export async function fetchIndexPatterns(
   savedObjectsClient: SavedObjectsClientContract,
@@ -48,5 +48,5 @@ export async function fetchIndexPatterns(
       ? exactMatches
       : [...exactMatches, await savedObjectsClient.get('index-pattern', defaultIndex)];
 
-  return allMatches.map(getFromSavedObject);
+  return allMatches.map(indexPatterns.getFromSavedObject);
 }

src/legacy/core_plugins/data/public/query/query_bar/components/query_bar_top_row.test.tsx → src/plugins/data/public/ui/query_string_input/query_bar_top_row.test.tsx

@@ -23,14 +23,10 @@ import React from 'react';
 import { mount } from 'enzyme';
 import { QueryBarTopRow } from './query_bar_top_row';
 
-/* eslint-disable @kbn/eslint/no-restricted-paths */
-
-import { stubIndexPatternWithFields } from '../../../../../../../plugins/data/public/stubs';
-/* eslint-enable @kbn/eslint/no-restricted-paths */
-
-import { coreMock } from '../../../../../../../core/public/mocks';
+import { coreMock } from '../../../../../core/public/mocks';
 import { KibanaContextProvider } from 'src/plugins/kibana_react/public';
 import { I18nProvider } from '@kbn/i18n/react';
+import { stubIndexPatternWithFields } from '../../stubs';
 const startMock = coreMock.createStart();
 
 const mockTimeHistory = {

src/legacy/core_plugins/data/public/query/query_bar/components/query_bar_top_row.tsx → src/plugins/data/public/ui/query_string_input/query_bar_top_row.tsx

@@ -41,8 +41,8 @@ import {
   PersistedLog,
   getQueryLog,
   esKuery,
-} from '../../../../../../../plugins/data/public';
-import { useKibana, toMountPoint } from '../../../../../../../plugins/kibana_react/public';
+} from '../..';
+import { useKibana, toMountPoint } from '../../../../kibana_react/public';
 import { QueryStringInput } from './query_string_input';
 
 interface Props {

src/legacy/core_plugins/data/public/query/query_bar/components/query_string_input.test.mocks.ts → src/plugins/data/public/ui/query_string_input/query_string_input.test.mocks.ts

@@ -16,11 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-
-/* eslint-disable @kbn/eslint/no-restricted-paths */
-
-import { stubIndexPatternWithFields } from '../../../../../../../plugins/data/public/stubs';
-/* eslint-enable @kbn/eslint/no-restricted-paths */
+import { stubIndexPatternWithFields } from '../../stubs';
 
 export const mockPersistedLog = {
   add: jest.fn(),
@@ -35,7 +31,7 @@ export const mockFetchIndexPatterns = jest
   .fn()
   .mockReturnValue(Promise.resolve([stubIndexPatternWithFields]));
 
-jest.mock('../../../../../../../plugins/data/public/query/persisted_log', () => ({
+jest.mock('../../query/persisted_log', () => ({
   PersistedLog: mockPersistedLogFactory,
 }));
 

src/legacy/core_plugins/data/public/query/query_bar/components/query_string_input.test.tsx → src/plugins/data/public/ui/query_string_input/query_string_input.test.tsx

@@ -25,14 +25,11 @@ import {
 
 import { EuiFieldText } from '@elastic/eui';
 import React from 'react';
-import { QueryLanguageSwitcher } from '../../../../../../../plugins/data/public';
+import { QueryLanguageSwitcher } from './language_switcher';
 import { QueryStringInput, QueryStringInputUI } from './query_string_input';
-import { coreMock } from '../../../../../../../core/public/mocks';
+import { coreMock } from '../../../../../core/public/mocks';
 const startMock = coreMock.createStart();
-/* eslint-disable @kbn/eslint/no-restricted-paths */
-
-import { stubIndexPatternWithFields } from '../../../../../../../plugins/data/public/stubs';
-/* eslint-enable @kbn/eslint/no-restricted-paths */
+import { stubIndexPatternWithFields } from '../../stubs';
 
 import { KibanaContextProvider } from 'src/plugins/kibana_react/public';
 import { I18nProvider } from '@kbn/i18n/react';

src/legacy/core_plugins/data/public/query/query_bar/components/query_string_input.tsx → src/plugins/data/public/ui/query_string_input/query_string_input.tsx

@@ -46,14 +46,10 @@ import {
   matchPairs,
   getQueryLog,
   Query,
-  QueryLanguageSwitcher,
-} from '../../../../../../../plugins/data/public';
-import {
-  withKibana,
-  KibanaReactContextValue,
-  toMountPoint,
-} from '../../../../../../../plugins/kibana_react/public';
+} from '../..';
+import { withKibana, KibanaReactContextValue, toMountPoint } from '../../../../kibana_react/public';
 import { fetchIndexPatterns } from './fetch_index_patterns';
+import { QueryLanguageSwitcher } from './language_switcher';
 
 interface Props {
   kibana: KibanaReactContextValue<IDataPluginServices>;

src/plugins/data/public/ui/typeahead/_index.scss

@@ -1 +1 @@
-@import 'suggestion';
+@import 'suggestion';

src/plugins/data/public/ui/typeahead/_suggestion.scss

@@ -3,7 +3,7 @@ $kbnTypeaheadTypes: (
   field: $euiColorWarning,
   value: $euiColorSecondary,
   operator: $euiColorPrimary,
-  conjunction: $typeaheadConjunctionColor,
+  conjunction: $euiColorVis3,
 );
 
 .kbnTypeahead {

x-pack/legacy/plugins/graph/public/components/search_bar.test.tsx

@@ -9,13 +9,12 @@ import { SearchBar, OuterSearchBarProps } from './search_bar';
 import React, { ReactElement } from 'react';
 import { CoreStart } from 'src/core/public';
 import { act } from 'react-dom/test-utils';
-import { QueryStringInput, IndexPattern } from 'src/legacy/core_plugins/data/public';
+import { IndexPattern } from 'src/legacy/core_plugins/data/public';
+import { QueryStringInput } from '../../../../../../src/plugins/data/public';
 
 import { KibanaContextProvider } from '../../../../../../src/plugins/kibana_react/public';
 import { I18nProvider } from '@kbn/i18n/react';
 
-jest.mock('ui/new_platform');
-
 import { openSourceModal } from '../services/source_modal';
 
 import { GraphStore, setDatasource } from '../state_management';
@@ -24,9 +23,6 @@ import { createMockGraphStore } from '../state_management/mocks';
 import { Provider } from 'react-redux';
 
 jest.mock('../services/source_modal', () => ({ openSourceModal: jest.fn() }));
-jest.mock('../../../../../../src/legacy/core_plugins/data/public', () => ({
-  QueryStringInput: () => null,
-}));
 
 const waitForIndexPatternFetch = () => new Promise(r => setTimeout(r));
 
@@ -51,6 +47,11 @@ function wrapSearchBarInContext(testProps: OuterSearchBarProps) {
     storage: {
       get: () => {},
     },
+    data: {
+      query: {
+        savedQueries: {},
+      },
+    },
   };
 
   return (

x-pack/legacy/plugins/graph/public/components/search_bar.tsx

@@ -10,10 +10,7 @@ import React, { useState, useEffect } from 'react';
 import { i18n } from '@kbn/i18n';
 import { connect } from 'react-redux';
 import { IndexPatternSavedObject, IndexPatternProvider } from '../types';
-import {
-  QueryStringInput,
-  IndexPattern,
-} from '../../../../../../src/legacy/core_plugins/data/public';
+import { IndexPattern } from '../../../../../../src/legacy/core_plugins/data/public';
 import { openSourceModal } from '../services/source_modal';
 import {
   GraphState,
@@ -23,7 +20,12 @@ import {
 } from '../state_management';
 
 import { useKibana } from '../../../../../../src/plugins/kibana_react/public';
-import { IDataPluginServices, Query, esKuery } from '../../../../../../src/plugins/data/public';
+import {
+  QueryStringInput,
+  IDataPluginServices,
+  Query,
+  esKuery,
+} from '../../../../../../src/plugins/data/public';
 
 export interface OuterSearchBarProps {
   isLoading: boolean;