Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Discover] Inline angular directives only used in this plugin #56119

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
import angular from 'angular';
import expect from '@kbn/expect';
import ngMock from 'ng_mock';
import 'plugins/kibana/discover/legacy';
import { pluginInstance } from 'plugins/kibana/discover/legacy';

let $parentScope;

Expand All @@ -30,7 +30,9 @@ let $elem;

const init = function(expandable) {
// Load the application
ngMock.module('kibana');
pluginInstance.initializeServices();
pluginInstance.initializeInnerAngular();
ngMock.module('app/discover');

// Create the scope
ngMock.inject(function($rootScope, $compile) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,8 @@
*/

import expect from '@kbn/expect';
import { pluginInstance } from 'plugins/kibana/discover/legacy';
import ngMock from 'ng_mock';
import '../../fixed_scroll';
import $ from 'jquery';
import sinon from 'sinon';

Expand All @@ -29,8 +29,9 @@ describe('FixedScroll directive', function() {
let compile;
let flushPendingTasks;
const trash = [];

beforeEach(ngMock.module('kibana'));
beforeEach(() => pluginInstance.initializeServices());
beforeEach(() => pluginInstance.initializeInnerAngular());
beforeEach(ngMock.module('app/discover'));
beforeEach(
ngMock.inject(function($compile, $rootScope, $timeout) {
flushPendingTasks = function flushPendingTasks() {
Expand Down
24 changes: 10 additions & 14 deletions src/legacy/core_plugins/kibana/public/discover/get_inner_angular.ts
Original file line number Diff line number Diff line change
Expand Up @@ -42,22 +42,10 @@ import { registerListenEventListener } from 'ui/directives/listen/listen';
// @ts-ignore
import { KbnAccessibleClickProvider } from 'ui/accessibility/kbn_accessible_click';
// @ts-ignore
import { FieldNameDirectiveProvider } from 'ui/directives/field_name';
// @ts-ignore
import { CollapsibleSidebarProvider } from 'ui/collapsible_sidebar/collapsible_sidebar';
// @ts-ignore
import { CssTruncateProvide } from 'ui/directives/css_truncate';
// @ts-ignore
import { FixedScrollProvider } from 'ui/fixed_scroll';
// @ts-ignore
import { DebounceProviderTimeout } from 'ui/directives/debounce/debounce';
// @ts-ignore
import { AppStateProvider } from 'ui/state_management/app_state';
// @ts-ignore
import { GlobalStateProvider } from 'ui/state_management/global_state';
// @ts-ignore
import { createRenderCompleteDirective } from 'ui/render_complete/directive';
// @ts-ignore
import { StateManagementConfigProvider } from 'ui/state_management/config_provider';
// @ts-ignore
import { KbnUrlProvider, RedirectWhenMissingProvider } from 'ui/url';
Expand All @@ -81,11 +69,19 @@ import { createFieldSearchDirective } from './np_ready/components/field_chooser/
import { createIndexPatternSelectDirective } from './np_ready/components/field_chooser/discover_index_pattern_directive';
import { createStringFieldProgressBarDirective } from './np_ready/components/field_chooser/string_progress_bar';
// @ts-ignore
import { FieldNameDirectiveProvider } from './np_ready/angular/directives/field_name';
// @ts-ignore
import { createFieldChooserDirective } from './np_ready/components/field_chooser/field_chooser';

// @ts-ignore
import { createDiscoverFieldDirective } from './np_ready/components/field_chooser/discover_field';
import { CollapsibleSidebarProvider } from './np_ready/angular/directives/collapsible_sidebar/collapsible_sidebar';
import { DiscoverStartPlugins } from './plugin';
import { createCssTruncateDirective } from './np_ready/angular/directives/css_truncate';
// @ts-ignore
import { FixedScrollProvider } from './np_ready/angular/directives/fixed_scroll';
// @ts-ignore
import { DebounceProviderTimeout } from './np_ready/angular/directives/debounce/debounce';
import { createRenderCompleteDirective } from './np_ready/angular/directives/render_complete';

/**
* returns the main inner angular module, it contains all the parts of Angular Discover
Expand Down Expand Up @@ -181,7 +177,7 @@ export function initializeInnerAngularModule(
.directive('kbnAccessibleClick', KbnAccessibleClickProvider)
.directive('fieldName', FieldNameDirectiveProvider)
.directive('collapsibleSidebar', CollapsibleSidebarProvider)
.directive('cssTruncate', CssTruncateProvide)
.directive('cssTruncate', createCssTruncateDirective)
.directive('fixedScroll', FixedScrollProvider)
.directive('renderComplete', createRenderCompleteDirective)
.directive('discoverFieldSearch', createFieldSearchDirective)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -47,10 +47,6 @@ export function setServices(newServices: any) {
services = newServices;
}

// import directives that
import 'ui/directives/css_truncate';
import 'ui/directives/field_name';

// EXPORT legacy static dependencies, should be migrated when available in a new version;
export { angular };
export { wrapInI18nContext } from 'ui/i18n';
Expand Down Expand Up @@ -90,7 +86,6 @@ export {
} from '../../../../../plugins/data/public';
export { ElasticSearchHit } from './np_ready/doc_views/doc_views_types';
export { registerTimefilterWithGlobalStateFactory } from 'ui/timefilter/setup_router';
export { FieldName } from 'ui/directives/field_name/field_name';
export { getFormat } from 'ui/visualize/loader/pipeline_helpers/utilities';
// @ts-ignore
export { buildPointSeriesData } from 'ui/agg_response/point_series/point_series';
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
@import 'no_results';
@import 'histogram';
@import 'histogram';
@import './collapsible_sidebar/index';
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

dear @elastic/kibana-design, no new SCSS inside, just change of path and imports

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just reviewed the SCSS files that were moved to a new directory and LGTM!

Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
@import 'depth';
@import 'collapsible_sidebar';
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,11 @@

import _ from 'lodash';
import $ from 'jquery';
import { uiModules } from '../modules';
import { IScope } from 'angular';

interface LazyScope extends IScope {
[key: string]: any;
}

export function CollapsibleSidebarProvider() {
// simply a list of all of all of angulars .col-md-* classes except 12
Expand All @@ -29,7 +33,7 @@ export function CollapsibleSidebarProvider() {

return {
restrict: 'C',
link: function($scope, $elem) {
link: ($scope: LazyScope, $elem: any) => {
let isCollapsed = false;
const $collapser = $(
`<button
Expand All @@ -48,10 +52,10 @@ export function CollapsibleSidebarProvider() {
$collapser.append($icon);
const $siblings = $elem.siblings();

const siblingsClass = listOfWidthClasses.reduce(function(prev, className) {
const siblingsClass = listOfWidthClasses.reduce((prev: string, className: string) => {
if (prev) return prev;
return $siblings.hasClass(className) && className;
}, false);
}, '');

// If there is are only two elements we can assume the other one will take 100% of the width.
const hasSingleSibling = $siblings.length === 1 && siblingsClass;
Expand Down Expand Up @@ -82,5 +86,3 @@ export function CollapsibleSidebarProvider() {
},
};
}

uiModules.get('kibana').directive('collapsibleSidebar', CollapsibleSidebarProvider);
Original file line number Diff line number Diff line change
Expand Up @@ -16,15 +16,11 @@
* specific language governing permissions and limitations
* under the License.
*/

import { uiModules } from '../modules';
const module = uiModules.get('kibana');

export function CssTruncateProvide() {
export function createCssTruncateDirective() {
return {
restrict: 'A',
scope: {},
link: function($scope, $elem, attrs) {
link: ($scope: any, $elem: any, attrs: any) => {
$elem.css({
overflow: 'hidden',
'white-space': 'nowrap',
Expand Down Expand Up @@ -63,5 +59,3 @@ export function CssTruncateProvide() {
},
};
}

module.directive('cssTruncate', CssTruncateProvide);
Original file line number Diff line number Diff line change
Expand Up @@ -20,14 +20,17 @@
import sinon from 'sinon';
import expect from '@kbn/expect';
import ngMock from 'ng_mock';
import { DebounceProvider } from '..';
import { DebounceProvider } from '../index';
import { pluginInstance } from 'plugins/kibana/discover/legacy';

let debounce;
let debounceFromProvider;
let $timeout;

function init() {
ngMock.module('kibana');
pluginInstance.initializeServices();
pluginInstance.initializeInnerAngular();
ngMock.module('app/discover');

ngMock.inject(function($injector, _$timeout_, Private) {
$timeout = _$timeout_;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,9 @@
*/

import _ from 'lodash';
import { uiModules } from '../../modules';
// Debounce service, angularized version of lodash debounce
// borrowed heavily from https://github.com/shahata/angular-debounce

const module = uiModules.get('kibana');

export function DebounceProviderTimeout($timeout) {
return function(func, wait, options) {
let timeout;
Expand Down Expand Up @@ -70,8 +67,6 @@ export function DebounceProviderTimeout($timeout) {
};
}

module.service('debounce', ['$timeout', DebounceProviderTimeout]);

export function DebounceProvider(debounce) {
return debounce;
}
Original file line number Diff line number Diff line change
Expand Up @@ -17,9 +17,7 @@
* under the License.
*/
import { FieldName } from './field_name/field_name';
import { uiModules } from '../modules';
import { wrapInI18nContext } from 'ui/i18n';
const module = uiModules.get('kibana');
import { wrapInI18nContext } from '../../../kibana_services';

export function FieldNameDirectiveProvider(config, reactDirective) {
return reactDirective(
Expand All @@ -35,5 +33,3 @@ export function FieldNameDirectiveProvider(config, reactDirective) {
}
);
}

module.directive('fieldName', FieldNameDirectiveProvider);
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,8 @@
*/
import React from 'react';
import classNames from 'classnames';
// @ts-ignore
import { shortenDottedString } from '../../../../core_plugins/kibana/common/utils/shorten_dotted_string';
import { FieldIcon } from '../../../../../../src/plugins/kibana_react/public';
import { FieldIcon } from '../../../../../../../../../plugins/kibana_react/public';
import { shortenDottedString } from '../../../../../../../../../plugins/data/common/utils';
import { getFieldTypeName } from './field_type_name';

// property field is provided at discover's field chooser
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -21,52 +21,52 @@ import { i18n } from '@kbn/i18n';
export function getFieldTypeName(type: string) {
switch (type) {
case 'boolean':
return i18n.translate('common.ui.directives.fieldNameIcons.booleanAriaLabel', {
return i18n.translate('kbn.discover.fieldNameIcons.booleanAriaLabel', {
defaultMessage: 'Boolean field',
});
case 'conflict':
return i18n.translate('common.ui.directives.fieldNameIcons.conflictFieldAriaLabel', {
return i18n.translate('kbn.discover.fieldNameIcons.conflictFieldAriaLabel', {
defaultMessage: 'Conflicting field',
});
case 'date':
return i18n.translate('common.ui.directives.fieldNameIcons.dateFieldAriaLabel', {
return i18n.translate('kbn.discover.fieldNameIcons.dateFieldAriaLabel', {
defaultMessage: 'Date field',
});
case 'geo_point':
return i18n.translate('common.ui.directives.fieldNameIcons.geoPointFieldAriaLabel', {
return i18n.translate('kbn.discover.fieldNameIcons.geoPointFieldAriaLabel', {
defaultMessage: 'Geo point field',
});
case 'geo_shape':
return i18n.translate('common.ui.directives.fieldNameIcons.geoShapeFieldAriaLabel', {
return i18n.translate('kbn.discover.fieldNameIcons.geoShapeFieldAriaLabel', {
defaultMessage: 'Geo shape field',
});
case 'ip':
return i18n.translate('common.ui.directives.fieldNameIcons.ipAddressFieldAriaLabel', {
return i18n.translate('kbn.discover.fieldNameIcons.ipAddressFieldAriaLabel', {
defaultMessage: 'IP address field',
});
case 'murmur3':
return i18n.translate('common.ui.directives.fieldNameIcons.murmur3FieldAriaLabel', {
return i18n.translate('kbn.discover.fieldNameIcons.murmur3FieldAriaLabel', {
defaultMessage: 'Murmur3 field',
});
case 'number':
return i18n.translate('common.ui.directives.fieldNameIcons.numberFieldAriaLabel', {
return i18n.translate('kbn.discover.fieldNameIcons.numberFieldAriaLabel', {
defaultMessage: 'Number field',
});
case 'source':
// Note that this type is currently not provided, type for _source is undefined
return i18n.translate('common.ui.directives.fieldNameIcons.sourceFieldAriaLabel', {
return i18n.translate('kbn.discover.fieldNameIcons.sourceFieldAriaLabel', {
defaultMessage: 'Source field',
});
case 'string':
return i18n.translate('common.ui.directives.fieldNameIcons.stringFieldAriaLabel', {
return i18n.translate('kbn.discover.fieldNameIcons.stringFieldAriaLabel', {
defaultMessage: 'String field',
});
case 'nested':
return i18n.translate('common.ui.directives.fieldNameIcons.nestedFieldAriaLabel', {
return i18n.translate('kbn.discover.fieldNameIcons.nestedFieldAriaLabel', {
defaultMessage: 'Nested field',
});
default:
return i18n.translate('common.ui.directives.fieldNameIcons.unknownFieldAriaLabel', {
return i18n.translate('kbn.discover.fieldNameIcons.unknownFieldAriaLabel', {
defaultMessage: 'Unknown field',
});
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -19,11 +19,15 @@

import $ from 'jquery';
import _ from 'lodash';
import { uiModules } from './modules';
import { DebounceProvider } from 'ui/directives/debounce';
import { DebounceProvider } from './debounce';

const SCROLLER_HEIGHT = 20;

/**
* This directive adds a fixed horizontal scrollbar to the bottom of the window that proxies its scroll events
* to the target element's real scrollbar. This is useful when the target element's horizontal scrollbar
* might be waaaay down the page, like the doc table on Discover.
*/
export function FixedScrollProvider(Private) {
const debounce = Private(DebounceProvider);

Expand Down Expand Up @@ -145,10 +149,3 @@ export function FixedScrollProvider(Private) {
},
};
}

/**
* This directive adds a fixed horizontal scrollbar to the bottom of the window that proxies its scroll events
* to the target element's real scrollbar. This is useful when the target element's horizontal scrollbar
* might be waaaay down the page, like the doc table on Discover.
*/
uiModules.get('kibana').directive('fixedScroll', FixedScrollProvider);
Original file line number Diff line number Diff line change
Expand Up @@ -16,18 +16,15 @@
* specific language governing permissions and limitations
* under the License.
*/

import { uiModules } from '../modules';
import { RenderCompleteHelper } from '../../../../plugins/kibana_utils/public';
import { IScope } from 'angular';
import { RenderCompleteHelper } from '../../../../../../../../plugins/kibana_utils/public';

export function createRenderCompleteDirective() {
return {
controller($scope, $element) {
controller($scope: IScope, $element: JQLite) {
const el = $element[0];
const renderCompleteHelper = new RenderCompleteHelper(el);
$scope.$on('$destroy', renderCompleteHelper.destroy);
},
};
}

uiModules.get('kibana').directive('renderComplete', createRenderCompleteDirective);
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,7 @@
* under the License.
*/
import { IndexPattern } from '../../../../../kibana_services';
// @ts-ignore
import { shortenDottedString } from '../../../../../../../common/utils/shorten_dotted_string';
import { shortenDottedString } from '../../../../../../../../../../plugins/data/common/utils';

export type SortOrder = [string, string];
export interface ColumnProps {
Expand Down
Loading