Move search bar into data plugin (#35389)

* Moved filter bar to data plugin (still not working)

* Moved filter options from search bar into filter bar
This commit is contained in:
Liza Katz 2019-05-02 11:52:36 +03:00 committed by GitHub
parent c870f67d4a
commit 924b230ca4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 131 additions and 75 deletions

View file

@ -17,27 +17,32 @@
* under the License.
*/
import { SearchBarService } from './search_bar';
import { QueryBarService } from './query_bar';
import { IndexPatternsService, IndexPatternsSetup } from './index_patterns';
class DataPlugin {
private readonly indexPatterns: IndexPatternsService;
private readonly searchBar: SearchBarService;
private readonly queryBar: QueryBarService;
constructor() {
this.indexPatterns = new IndexPatternsService();
this.queryBar = new QueryBarService();
this.searchBar = new SearchBarService();
}
public setup() {
return {
indexPatterns: this.indexPatterns.setup(),
search: this.searchBar.setup(),
query: this.queryBar.setup(),
};
}
public stop() {
this.indexPatterns.stop();
this.searchBar.stop();
this.queryBar.stop();
}
}

View file

@ -51,7 +51,6 @@ import setupRouteWithDefaultPattern from 'ui/index_patterns/route_setup/load_def
import { getFromSavedObject, isFilterable } from 'ui/index_patterns/static_utils';
// IndexPattern, StaticIndexPattern, StaticIndexPatternField, Field
import * as types from 'ui/index_patterns';
/**

View file

@ -17,6 +17,7 @@
* under the License.
*/
import { once } from 'lodash';
import { QueryBar } from './components/query_bar';
import { fromUser } from './lib/from_user';
import { toUser } from './lib/to_user';
@ -32,7 +33,7 @@ import { setupDirective } from './directive';
export class QueryBarService {
public setup() {
return {
loadLegacyDirectives: _.once(setupDirective),
loadLegacyDirectives: once(setupDirective),
helpers: {
fromUser,
toUser,

View file

@ -28,8 +28,7 @@ import { FilterBar } from 'ui/filter_bar';
import { IndexPattern } from 'ui/index_patterns';
import { Storage } from 'ui/storage';
import { data } from 'plugins/data';
const { QueryBar } = data.query.ui;
import { QueryBar } from '../../query_bar';
interface Query {
query: string;
@ -124,16 +123,16 @@ class SearchBarUI extends Component<Props, State> {
public render() {
const filtersAppliedText = this.props.intl.formatMessage({
id: 'common.ui.searchBar.filtersButtonFiltersAppliedTitle',
id: 'data.search.searchBar.filtersButtonFiltersAppliedTitle',
defaultMessage: 'filters applied.',
});
const clickToShowOrHideText = this.state.isFiltersVisible
? this.props.intl.formatMessage({
id: 'common.ui.searchBar.filtersButtonClickToShowTitle',
id: 'data.search.searchBar.filtersButtonClickToShowTitle',
defaultMessage: 'Select to hide',
})
: this.props.intl.formatMessage({
id: 'common.ui.searchBar.filtersButtonClickToHideTitle',
id: 'data.search.searchBar.filtersButtonClickToHideTitle',
defaultMessage: 'Select to show',
});

View file

@ -0,0 +1,61 @@
/*
* Licensed to Elasticsearch B.V. under one or more contributor
* license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright
* ownership. Elasticsearch B.V. licenses this file to you under
* the Apache License, Version 2.0 (the "License"); you may
* not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
import 'ngreact';
import { wrapInI18nContext } from 'ui/i18n';
import { uiModules } from 'ui/modules';
import { SearchBar } from '../components';
const app = uiModules.get('app/data', ['react']);
export function setupDirective() {
app.directive('searchBar', (reactDirective, localStorage) => {
return reactDirective(
wrapInI18nContext(SearchBar),
[
['query', { watchDepth: 'reference' }],
['store', { watchDepth: 'reference' }],
['intl', { watchDepth: 'reference' }],
['onQuerySubmit', { watchDepth: 'reference' }],
['onFiltersUpdated', { watchDepth: 'reference' }],
['onRefreshChange', { watchDepth: 'reference' }],
['indexPatterns', { watchDepth: 'collection' }],
['filters', { watchDepth: 'collection' }],
'appName',
'screenTitle',
'showFilterBar',
'showQueryBar',
'showDatePicker',
'dateRangeFrom',
'dateRangeTo',
'isRefreshPaused',
'refreshInterval',
'disableAutoFocus',
'showAutoRefreshOnly',
],
{},
{
store: localStorage,
},
);
});
}

View file

@ -17,6 +17,4 @@
* under the License.
*/
import './directive';
export { SearchBar } from './components';
export { SearchBarService } from './search_bar_service';

View file

@ -0,0 +1,46 @@
/*
* Licensed to Elasticsearch B.V. under one or more contributor
* license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright
* ownership. Elasticsearch B.V. licenses this file to you under
* the Apache License, Version 2.0 (the "License"); you may
* not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
import { once } from 'lodash';
import { SearchBar } from './components/search_bar';
// @ts-ignore
import { setupDirective } from './directive';
/**
* Search Bar Service
* @internal
*/
export class SearchBarService {
public setup() {
return {
ui: {
SearchBar,
},
loadLegacyDirectives: once(setupDirective),
};
}
public stop() {
// nothing to do here yet
}
}
/** @public */
export type SearchBarSetup = ReturnType<SearchBarService['setup']>;

View file

@ -26,7 +26,6 @@ import { wrapInI18nContext } from 'ui/i18n';
import { toastNotifications } from 'ui/notify';
import 'ui/listen';
import 'ui/search_bar';
import 'ui/apply_filters';
import { panelActionsStore } from './store/panel_actions_store';
@ -59,6 +58,9 @@ import { getUnhashableStatesProvider } from 'ui/state_management/state_hashing';
import { DashboardViewportProvider } from './viewport/dashboard_viewport_provider';
import { data } from 'plugins/data';
data.search.loadLegacyDirectives();
const app = uiModules.get('app/dashboard', [
'elasticsearch',
'ngRoute',

View file

@ -36,7 +36,6 @@ import 'ui/fixed_scroll';
import 'ui/index_patterns';
import 'ui/state_management/app_state';
import { timefilter } from 'ui/timefilter';
import 'ui/search_bar';
import { hasSearchStategyForIndexPattern, isDefaultTypeIndexPattern } from 'ui/courier';
import { toastNotifications } from 'ui/notify';
import { VisProvider } from 'ui/vis';
@ -70,6 +69,9 @@ import { getRootBreadcrumbs, getSavedSearchBreadcrumbs } from '../breadcrumbs';
import { buildVislibDimensions } from 'ui/visualize/loader/pipeline_helpers/build_pipeline';
import 'ui/capabilities/route_setup';
import { data } from 'plugins/data';
data.search.loadLegacyDirectives();
const fetchStatuses = {
UNINITIALIZED: 'uninitialized',
LOADING: 'loading',

View file

@ -25,7 +25,6 @@ import 'ui/visualize';
import 'ui/collapsible_sidebar';
import { capabilities } from 'ui/capabilities';
import 'ui/search_bar';
import 'ui/apply_filters';
import 'ui/listen';
import chrome from 'ui/chrome';
@ -55,6 +54,9 @@ import { showSaveModal } from 'ui/saved_objects/show_saved_object_save_modal';
import { SavedObjectSaveModal } from 'ui/saved_objects/components/saved_object_save_modal';
import { getEditBreadcrumbs, getCreateBreadcrumbs } from '../breadcrumbs';
import { data } from 'plugins/data';
data.search.loadLegacyDirectives();
uiRoutes
.when(VisualizeConstants.CREATE_PATH, {
template: editorTemplate,

View file

@ -33,9 +33,9 @@ import classNames from 'classnames';
import React, { Component } from 'react';
import chrome from 'ui/chrome';
import { IndexPattern } from 'ui/index_patterns';
import { FilterOptions } from 'ui/search_bar/components/filter_options';
import { FilterEditor } from './filter_editor';
import { FilterItem } from './filter_item';
import { FilterOptions } from './filter_options';
const config = chrome.getUiSettingsClient();

View file

@ -1,59 +0,0 @@
/*
* Licensed to Elasticsearch B.V. under one or more contributor
* license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright
* ownership. Elasticsearch B.V. licenses this file to you under
* the Apache License, Version 2.0 (the "License"); you may
* not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
import 'ngreact';
import { wrapInI18nContext } from 'ui/i18n';
import { uiModules } from '../../modules';
import { SearchBar } from '../components';
const app = uiModules.get('app/kibana', ['react']);
app.directive('searchBar', (reactDirective, localStorage) => {
return reactDirective(
wrapInI18nContext(SearchBar),
[
['query', { watchDepth: 'reference' }],
['store', { watchDepth: 'reference' }],
['intl', { watchDepth: 'reference' }],
['onQuerySubmit', { watchDepth: 'reference' }],
['onFiltersUpdated', { watchDepth: 'reference' }],
['onRefreshChange', { watchDepth: 'reference' }],
['indexPatterns', { watchDepth: 'collection' }],
['filters', { watchDepth: 'collection' }],
'appName',
'screenTitle',
'showFilterBar',
'showQueryBar',
'showDatePicker',
'dateRangeFrom',
'dateRangeTo',
'isRefreshPaused',
'refreshInterval',
'disableAutoFocus',
'showAutoRefreshOnly',
],
{},
{
store: localStorage,
},
);
});

View file

@ -12,7 +12,7 @@
],
"test_utils/*": [
"src/test_utils/public/*"
]
],
},
// Support .tsx files and transform JSX into calls to React.createElement
"jsx": "react",

View file

@ -8000,4 +8000,4 @@
"xpack.watcher.watchActionsTitle": "满足后将执行 {watchActionsCount, plural, one{# 个操作} other {# 个操作}}",
"xpack.watcher.watcherDescription": "通过创建、管理和监测警报来检测数据中的更改。"
}
}
}