diff --git a/src/legacy/core_plugins/data/public/filter/filter_bar/filter_bar.tsx b/src/legacy/core_plugins/data/public/filter/filter_bar/filter_bar.tsx
index 0d00b7eca40e1..066adb1e3275e 100644
--- a/src/legacy/core_plugins/data/public/filter/filter_bar/filter_bar.tsx
+++ b/src/legacy/core_plugins/data/public/filter/filter_bar/filter_bar.tsx
@@ -31,12 +31,13 @@ import {
import { FormattedMessage, InjectedIntl, injectI18n } from '@kbn/i18n/react';
import classNames from 'classnames';
import React, { useState } from 'react';
-import { UiSettingsClientContract } from 'src/core/public';
+import { CoreStart } from 'src/core/public';
+import { DataPublicPluginStart } from 'src/plugins/data/public';
import { IndexPattern } from '../../index_patterns';
import { FilterEditor } from './filter_editor';
import { FilterItem } from './filter_item';
import { FilterOptions } from './filter_options';
-import { useKibana } from '../../../../../../plugins/kibana_react/public';
+import { useKibana, KibanaContextProvider } from '../../../../../../plugins/kibana_react/public';
interface Props {
filters: Filter[];
@@ -45,18 +46,45 @@ interface Props {
indexPatterns: IndexPattern[];
intl: InjectedIntl;
- // Only for directives!
- uiSettings?: UiSettingsClientContract;
+ // TODO: Only for filter-bar directive!
+ uiSettings?: CoreStart['uiSettings'];
+ docLinks?: CoreStart['docLinks'];
+ pluginDataStart?: DataPublicPluginStart;
}
function FilterBarUI(props: Props) {
const [isAddFilterPopoverOpen, setIsAddFilterPopoverOpen] = useState(false);
const kibana = useKibana();
- let { uiSettings } = kibana.services;
- if (!uiSettings) {
- // Only for directives!
- uiSettings = props.uiSettings;
+ const uiSettings = kibana.services.uiSettings || props.uiSettings;
+ if (!uiSettings) return null;
+
+ function hasContext() {
+ return Boolean(kibana.services.uiSettings);
+ }
+
+ function wrapInContextIfMissing(content: JSX.Element) {
+ // TODO: Relevant only as long as directives are used!
+ if (!hasContext()) {
+ if (props.docLinks && props.uiSettings && props.pluginDataStart) {
+ return (
+
+ {content}
+
+ );
+ } else {
+ throw new Error(
+ 'Rending filter bar requires providing sufficient context: uiSettings, docLinks and NP data plugin'
+ );
+ }
+ }
+ return content;
}
function onFiltersUpdated(filters: Filter[]) {
@@ -100,7 +128,7 @@ function FilterBarUI(props: Props) {
);
- return (
+ return wrapInContextIfMissing(
{
}
child.setAttribute('ui-settings', 'uiSettings');
- child.setAttribute('http', 'http');
+ child.setAttribute('doc-links', 'docLinks');
+ child.setAttribute('plugin-data-start', 'pluginDataStart');
// Append helper directive
elem.append(child);
const linkFn = ($scope: any) => {
- $scope.uiSettings = npSetup.core.uiSettings;
- $scope.http = npSetup.core.http;
+ $scope.uiSettings = npStart.core.uiSettings;
+ $scope.docLinks = npStart.core.docLinks;
+ $scope.pluginDataStart = npStart.plugins.data;
};
return linkFn;
@@ -66,11 +68,12 @@ export const initLegacyModule = once((): void => {
.directive('filterBarHelper', (reactDirective: any) => {
return reactDirective(wrapInI18nContext(FilterBar), [
['uiSettings', { watchDepth: 'reference' }],
- ['http', { watchDepth: 'reference' }],
+ ['docLinks', { watchDepth: 'reference' }],
['onFiltersUpdated', { watchDepth: 'reference' }],
['indexPatterns', { watchDepth: 'collection' }],
['filters', { watchDepth: 'collection' }],
['className', { watchDepth: 'reference' }],
+ ['pluginDataStart', { watchDepth: 'reference' }],
]);
})
.directive('applyFiltersPopoverComponent', (reactDirective: any) =>