Add advanced setting to control quick ranges (#15975)

* Add advanced setting to control quick ranges

* Fix test

* Add docs for quick ranges

* Remove comment
This commit is contained in:
Lukas Olson 2018-01-12 14:11:42 -07:00 committed by GitHub
parent 6511fc264f
commit e6b65fc4c6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 48 additions and 53 deletions

View file

@ -73,6 +73,7 @@ mentioned use "_default_".
`savedObjects:perPage`:: The number of objects shown on each page of the list of saved objects. The default value is 5.
`timepicker:timeDefaults`:: The default time filter selection.
`timepicker:refreshIntervalDefaults`:: The time filter's default refresh interval.
`timepicker:quickRanges`:: The list of ranges to show in the Quick section of the time picker. This should be an array of objects, with each object containing `from`, `to` (see {ref}/common-options.html#date-math[accepted formats]), `display` (the title to be displayed), and `section` (which column to put the option in).
`dashboard:defaultDarkTheme`:: Set this property to `true` to make new dashboards use the dark theme by default.
`filters:pinnedByDefault`:: Set this property to `true` to make filters have a global state by default.
`filterEditor:suggestValues`:: Set this property to `false` to prevent the filter editor from suggesting values for fields.

View file

@ -9,8 +9,8 @@ describe('DashboardState', function () {
let savedDashboard;
let SavedDashboard;
let timefilter;
let quickTimeRanges;
let dashboardConfig;
const mockQuickTimeRanges = [{ from: 'now/w', to: 'now/w', display: 'This week', section: 0 }];
const mockIndexPattern = { id: 'index1' };
function initDashboardState() {
@ -20,7 +20,6 @@ describe('DashboardState', function () {
beforeEach(ngMock.module('kibana'));
beforeEach(ngMock.inject(function ($injector) {
timefilter = $injector.get('timefilter');
quickTimeRanges = $injector.get('quickRanges');
AppState = $injector.get('AppState');
SavedDashboard = $injector.get('SavedDashboard');
dashboardConfig = $injector.get('dashboardConfig');
@ -38,7 +37,7 @@ describe('DashboardState', function () {
timefilter.time.mode = 'absolute';
initDashboardState();
dashboardState.syncTimefilterWithDashboard(timefilter, quickTimeRanges);
dashboardState.syncTimefilterWithDashboard(timefilter, mockQuickTimeRanges);
expect(timefilter.time.mode).to.equal('quick');
expect(timefilter.time.to).to.equal('now/w');
@ -55,7 +54,7 @@ describe('DashboardState', function () {
timefilter.time.mode = 'absolute';
initDashboardState();
dashboardState.syncTimefilterWithDashboard(timefilter, quickTimeRanges);
dashboardState.syncTimefilterWithDashboard(timefilter, mockQuickTimeRanges);
expect(timefilter.time.mode).to.equal('relative');
expect(timefilter.time.to).to.equal('now');
@ -72,7 +71,7 @@ describe('DashboardState', function () {
timefilter.time.mode = 'quick';
initDashboardState();
dashboardState.syncTimefilterWithDashboard(timefilter, quickTimeRanges);
dashboardState.syncTimefilterWithDashboard(timefilter, mockQuickTimeRanges);
expect(timefilter.time.mode).to.equal('absolute');
expect(timefilter.time.to).to.equal(savedDashboard.timeTo);

View file

@ -45,7 +45,6 @@ app.directive('dashboardApp', function ($injector) {
const courier = $injector.get('courier');
const AppState = $injector.get('AppState');
const timefilter = $injector.get('timefilter');
const quickRanges = $injector.get('quickRanges');
const kbnUrl = $injector.get('kbnUrl');
const confirmModal = $injector.get('confirmModal');
const config = $injector.get('config');
@ -83,7 +82,7 @@ app.directive('dashboardApp', function ($injector) {
// The 'previouslyStored' check is so we only update the time filter on dashboard open, not during
// normal cross app navigation.
if (dashboardStateManager.getIsTimeSavedWithDashboard() && !getAppState.previouslyStored()) {
dashboardStateManager.syncTimefilterWithDashboard(timefilter, quickRanges);
dashboardStateManager.syncTimefilterWithDashboard(timefilter, config.get('timepicker:quickRanges'));
}
const updateState = () => {
@ -247,7 +246,7 @@ app.directive('dashboardApp', function ($injector) {
// it does on 'open' because it's been saved to the url and the getAppState.previouslyStored() check on
// reload will cause it not to sync.
if (dashboardStateManager.getIsTimeSavedWithDashboard()) {
dashboardStateManager.syncTimefilterWithDashboard(timefilter, quickRanges);
dashboardStateManager.syncTimefilterWithDashboard(timefilter, config.get('timepicker:quickRanges'));
}
}

View file

@ -277,6 +277,40 @@ export function getUiSettingDefaults() {
}`,
description: 'The timefilter\'s default refresh interval'
},
'timepicker:quickRanges': {
type: 'json',
value: JSON.stringify([
{ from: 'now/d', to: 'now/d', display: 'Today', section: 0 },
{ from: 'now/w', to: 'now/w', display: 'This week', section: 0 },
{ from: 'now/M', to: 'now/M', display: 'This month', section: 0 },
{ from: 'now/y', to: 'now/y', display: 'This year', section: 0 },
{ from: 'now/d', to: 'now', display: 'Today so far', section: 0 },
{ from: 'now/w', to: 'now', display: 'Week to date', section: 0 },
{ from: 'now/M', to: 'now', display: 'Month to date', section: 0 },
{ from: 'now/y', to: 'now', display: 'Year to date', section: 0 },
{ from: 'now-15m', to: 'now', display: 'Last 15 minutes', section: 1 },
{ from: 'now-30m', to: 'now', display: 'Last 30 minutes', section: 1 },
{ from: 'now-1h', to: 'now', display: 'Last 1 hour', section: 1 },
{ from: 'now-4h', to: 'now', display: 'Last 4 hours', section: 1 },
{ from: 'now-12h', to: 'now', display: 'Last 12 hours', section: 1 },
{ from: 'now-24h', to: 'now', display: 'Last 24 hours', section: 1 },
{ from: 'now-7d', to: 'now', display: 'Last 7 days', section: 1 },
{ from: 'now-30d', to: 'now', display: 'Last 30 days', section: 2 },
{ from: 'now-60d', to: 'now', display: 'Last 60 days', section: 2 },
{ from: 'now-90d', to: 'now', display: 'Last 90 days', section: 2 },
{ from: 'now-6M', to: 'now', display: 'Last 6 months', section: 2 },
{ from: 'now-1y', to: 'now', display: 'Last 1 year', section: 2 },
{ from: 'now-2y', to: 'now', display: 'Last 2 years', section: 2 },
{ from: 'now-5y', to: 'now', display: 'Last 5 years', section: 2 },
], null, 2),
description: 'The list of ranges to show in the Quick section of the time picker. ' +
'This should be an array of objects, with each object containing "from", "to" (see ' +
'<a href="https://www.elastic.co/guide/en/elasticsearch/reference/current/common-options.html#date-math" target="_blank" rel="noopener noreferrer">accepted formats</a>' +
'), "display" (the title to be displayed), and "section" (which column to put the option in).'
},
'dashboard:defaultDarkTheme': {
value: false,
description: 'New dashboards use dark theme by default'
@ -287,7 +321,7 @@ export function getUiSettingDefaults() {
},
'filterEditor:suggestValues': {
value: true,
description: 'Set this property to `false` to prevent the filter editor from suggesting values for fields.'
description: 'Set this property to false to prevent the filter editor from suggesting values for fields.'
},
'notifications:banner': {
type: 'markdown',

View file

@ -151,8 +151,8 @@ describe('timepicker directive', function () {
$scope.$digest();
});
it('should contain 4 lists of options', function () {
expect($elem.find('.kbn-timepicker-section .list-unstyled').length).to.be(4);
it('should contain 3 lists of options', function () {
expect($elem.find('.kbn-timepicker-section .list-unstyled').length).to.be(3);
});
it('should have a $scope.setQuick() that calls handler', function () {

View file

@ -1,13 +1,12 @@
import _ from 'lodash';
import dateMath from '@elastic/datemath';
import moment from 'moment';
import 'ui/timepicker/quick_ranges';
import 'ui/timepicker/time_units';
import { uiModules } from 'ui/modules';
const module = uiModules.get('kibana');
module.directive('prettyDuration', function (config, quickRanges, timeUnits) {
module.directive('prettyDuration', function (config, timeUnits) {
return {
restrict: 'E',
scope: {
@ -15,6 +14,7 @@ module.directive('prettyDuration', function (config, quickRanges, timeUnits) {
to: '='
},
link: function ($scope, $elem) {
const quickRanges = config.get('timepicker:quickRanges');
const dateFormat = config.get('dateFormat');
const lookupByRange = {};

View file

@ -4,7 +4,7 @@ import { uiModules } from 'ui/modules';
const module = uiModules.get('ui/timepicker');
module.directive('kbnTimepickerQuickPanel', function (quickRanges) {
module.directive('kbnTimepickerQuickPanel', function (config) {
return {
restrict: 'E',
replace: true,
@ -13,6 +13,7 @@ module.directive('kbnTimepickerQuickPanel', function (quickRanges) {
},
template,
controller: function ($scope) {
const quickRanges = config.get('timepicker:quickRanges');
$scope.quickLists = _(quickRanges).groupBy('section').values().value();
}
};

View file

@ -1,38 +0,0 @@
import { uiModules } from 'ui/modules';
const module = uiModules.get('kibana');
module.constant('quickRanges', [
{ from: 'now/d', to: 'now/d', display: 'Today', section: 0 },
{ from: 'now/w', to: 'now/w', display: 'This week', section: 0 },
{ from: 'now/M', to: 'now/M', display: 'This month', section: 0 },
{ from: 'now/y', to: 'now/y', display: 'This year', section: 0 },
{ from: 'now/d', to: 'now', display: 'The day so far', section: 0 },
{ from: 'now/w', to: 'now', display: 'Week to date', section: 0 },
{ from: 'now/M', to: 'now', display: 'Month to date', section: 0 },
{ from: 'now/y', to: 'now', display: 'Year to date', section: 0 },
{ from: 'now-1d/d', to: 'now-1d/d', display: 'Yesterday', section: 1 },
{ from: 'now-2d/d', to: 'now-2d/d', display: 'Day before yesterday', section: 1 },
{ from: 'now-7d/d', to: 'now-7d/d', display: 'This day last week', section: 1 },
{ from: 'now-1w/w', to: 'now-1w/w', display: 'Previous week', section: 1 },
{ from: 'now-1M/M', to: 'now-1M/M', display: 'Previous month', section: 1 },
{ from: 'now-1y/y', to: 'now-1y/y', display: 'Previous year', section: 1 },
{ from: 'now-15m', to: 'now', display: 'Last 15 minutes', section: 2 },
{ from: 'now-30m', to: 'now', display: 'Last 30 minutes', section: 2 },
{ from: 'now-1h', to: 'now', display: 'Last 1 hour', section: 2 },
{ from: 'now-4h', to: 'now', display: 'Last 4 hours', section: 2 },
{ from: 'now-12h', to: 'now', display: 'Last 12 hours', section: 2 },
{ from: 'now-24h', to: 'now', display: 'Last 24 hours', section: 2 },
{ from: 'now-7d', to: 'now', display: 'Last 7 days', section: 2 },
{ from: 'now-30d', to: 'now', display: 'Last 30 days', section: 3 },
{ from: 'now-60d', to: 'now', display: 'Last 60 days', section: 3 },
{ from: 'now-90d', to: 'now', display: 'Last 90 days', section: 3 },
{ from: 'now-6M', to: 'now', display: 'Last 6 months', section: 3 },
{ from: 'now-1y', to: 'now', display: 'Last 1 year', section: 3 },
{ from: 'now-2y', to: 'now', display: 'Last 2 years', section: 3 },
{ from: 'now-5y', to: 'now', display: 'Last 5 years', section: 3 },
]);

View file

@ -11,7 +11,6 @@ import { Notifier } from 'ui/notify/notifier';
import 'ui/timepicker/timepicker.less';
import 'ui/directives/input_datetime';
import 'ui/directives/inequality';
import 'ui/timepicker/quick_ranges';
import 'ui/timepicker/refresh_intervals';
import 'ui/timepicker/time_units';
import 'ui/timepicker/kbn_global_timepicker';