Skip to content

Commit

Permalink
simplified tabify (#19061)
Browse files Browse the repository at this point in the history
  • Loading branch information
@ppisljar
ppisljar authored Aug 30, 2018
1 parent f6a3f90 commit e5a94e7
Show file tree
Hide file tree
Showing 66 changed files with 684 additions and 1,377 deletions.
3 changes: 2 additions & 1 deletion src/core_plugins/kbn_vislib_vis_types/public/gauge.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,7 @@ export default function GaugeVisType(Private) {
aggFilter: ['!geohash_grid', '!filter']
}
])
}
},
useCustomNoDataScreen: true
});
}
3 changes: 2 additions & 1 deletion src/core_plugins/kbn_vislib_vis_types/public/goal.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -105,6 +105,7 @@ export default function GoalVisType(Private) {
aggFilter: ['!geohash_grid', '!filter']
}
])
}
},
useCustomNoDataScreen: true
});
}
4 changes: 2 additions & 2 deletions src/core_plugins/kibana/public/discover/controllers/discover.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ import 'ui/query_bar';
import { hasSearchStategyForIndexPattern, isDefaultTypeIndexPattern } from 'ui/courier';
import { toastNotifications } from 'ui/notify';
import { VisProvider } from 'ui/vis';
import { BasicResponseHandlerProvider } from 'ui/vis/response_handlers/basic';
import { VislibResponseHandlerProvider } from 'ui/vis/response_handlers/vislib';
import { DocTitleProvider } from 'ui/doc_title';
import PluginsKibanaDiscoverHitSortFnProvider from '../_hit_sort_fn';
import { FilterBarQueryFilterProvider } from 'ui/filter_bar/query_filter';
Expand Down Expand Up @@ -156,7 +156,7 @@ function discoverController(
const docTitle = Private(DocTitleProvider);
const HitSortFn = Private(PluginsKibanaDiscoverHitSortFnProvider);
const queryFilter = Private(FilterBarQueryFilterProvider);
const responseHandler = Private(BasicResponseHandlerProvider).handler;
const responseHandler = Private(VislibResponseHandlerProvider).handler;
const filterManager = Private(FilterManagerProvider);
const notify = new Notifier({
location: 'Discover'
Expand Down
8 changes: 3 additions & 5 deletions src/core_plugins/metric_vis/public/__tests__/metric_vis.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ import { VisProvider } from 'ui/vis';
import LogstashIndexPatternStubProvider from 'fixtures/stubbed_logstash_index_pattern';
import MetricVisProvider from '../metric_vis';

describe('metric_vis', () => {
describe('metric vis', () => {
let setup = null;
let vis;

Expand Down Expand Up @@ -62,10 +62,8 @@ describe('metric_vis', () => {

const ip = '235.195.237.208';
render({
tables: [{
columns: [{ title: 'ip', aggConfig: vis.aggs[0] }],
rows: [[ ip ]]
}]
columns: [{ id: 'col-0', title: 'ip', aggConfig: vis.aggs[0] }],
rows: [{ 'col-0': ip }]
});

const $link = $(el)
Expand Down
20 changes: 8 additions & 12 deletions src/core_plugins/metric_vis/public/__tests__/metric_vis_controller.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
import expect from 'expect.js';
import { MetricVisComponent } from '../metric_vis_controller';

describe('metric vis', function () {
describe('metric vis controller', function () {

const vis = {
params: {
Expand Down Expand Up @@ -53,10 +53,8 @@ describe('metric vis', function () {

it('should set the metric label and value', function () {
const metrics = metricController._processTableGroups({
tables: [{
columns: [{ title: 'Count', aggConfig: { ...aggConfig, makeLabel: () => 'Count' } }],
rows: [[ 4301021 ]]
}]
columns: [{ id: 'col-0', title: 'Count', aggConfig: { ...aggConfig, makeLabel: () => 'Count' } }],
rows: [{ 'col-0': 4301021 }]
});

expect(metrics.length).to.be(1);
Expand All @@ -66,13 +64,11 @@ describe('metric vis', function () {

it('should support multi-value metrics', function () {
const metrics = metricController._processTableGroups({
tables: [{
columns: [
{ aggConfig: { ...aggConfig, makeLabel: () => '1st percentile of bytes' } },
{ aggConfig: { ...aggConfig, makeLabel: () => '99th percentile of bytes' } }
],
rows: [[ 182, 445842.4634666484 ]]
}]
columns: [
{ id: 'col-0', aggConfig: { ...aggConfig, makeLabel: () => '1st percentile of bytes' } },
{ id: 'col-1', aggConfig: { ...aggConfig, makeLabel: () => '99th percentile of bytes' } }
],
rows: [{ 'col-0': 182, 'col-1': 445842.4634666484 }]
});

expect(metrics.length).to.be(2);
Expand Down
1 change: 1 addition & 0 deletions src/core_plugins/metric_vis/public/metric_vis.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,6 +100,7 @@ function MetricVisProvider(Private) {
}
])
},
responseHandler: 'tabify',
});
}

Expand Down
87 changes: 43 additions & 44 deletions src/core_plugins/metric_vis/public/metric_vis_controller.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,7 @@ export class MetricVisComponent extends Component {
return fieldFormatter(value);
}

_processTableGroups(tableGroups) {
_processTableGroups(table) {
const config = this.props.vis.params.metric;
const isPercentageMode = config.percentageMode;
const min = config.colorsRange[0].from;
Expand All @@ -98,56 +98,55 @@ export class MetricVisComponent extends Component {
const labels = this._getLabels();
const metrics = [];

tableGroups.tables.forEach((table, tableIndex) => {
let bucketAgg;
let rowHeaderIndex;
let bucketAgg;
let bucketColumnId;
let rowHeaderIndex;

table.columns.forEach((column, columnIndex) => {
const aggConfig = column.aggConfig;
table.columns.forEach((column, columnIndex) => {
const aggConfig = column.aggConfig;

if (aggConfig && aggConfig.type.type === 'buckets') {
bucketAgg = aggConfig;
// Store the current index, so we later know in which position in the
// row array, the bucket agg key will be, so we can create filters on it.
rowHeaderIndex = columnIndex;
return;
}
if (aggConfig && aggConfig.type.type === 'buckets') {
bucketAgg = aggConfig;
// Store the current index, so we later know in which position in the
// row array, the bucket agg key will be, so we can create filters on it.
rowHeaderIndex = columnIndex;
bucketColumnId = column.id;
return;
}

table.rows.forEach((row, rowIndex) => {
table.rows.forEach((row, rowIndex) => {

let title = column.title;
let value = row[columnIndex];
const color = this._getColor(value, labels, colors);
let title = column.name;
let value = row[column.id];
const color = this._getColor(value, labels, colors);

if (isPercentageMode) {
const percentage = Math.round(100 * (value - min) / (max - min));
value = `${percentage}%`;
}
if (isPercentageMode) {
const percentage = Math.round(100 * (value - min) / (max - min));
value = `${percentage}%`;
}

if (aggConfig) {
if (!isPercentageMode) value = this._getFormattedValue(aggConfig.fieldFormatter('html'), value);
if (bucketAgg) {
const bucketValue = bucketAgg.fieldFormatter('text')(row[0]);
title = `${bucketValue} - ${aggConfig.makeLabel()}`;
} else {
title = aggConfig.makeLabel();
}
if (aggConfig) {
if (!isPercentageMode) value = this._getFormattedValue(aggConfig.fieldFormatter('html'), value);
if (bucketAgg) {
const bucketValue = bucketAgg.fieldFormatter('text')(row[bucketColumnId]);
title = `${bucketValue} - ${aggConfig.makeLabel()}`;
} else {
title = aggConfig.makeLabel();
}
}

const shouldColor = config.colorsRange.length > 1;

metrics.push({
label: title,
value: value,
color: shouldColor && config.style.labelColor ? color : null,
bgColor: shouldColor && config.style.bgColor ? color : null,
lightText: shouldColor && config.style.bgColor && this._needsLightText(color),
filterKey: rowHeaderIndex !== undefined ? row[rowHeaderIndex] : null,
tableIndex: tableIndex,
rowIndex: rowIndex,
columnIndex: rowHeaderIndex,
bucketAgg: bucketAgg,
});
const shouldColor = config.colorsRange.length > 1;

metrics.push({
label: title,
value: value,
color: shouldColor && config.style.labelColor ? color : null,
bgColor: shouldColor && config.style.bgColor ? color : null,
lightText: shouldColor && config.style.bgColor && this._needsLightText(color),
filterKey: bucketColumnId !== undefined ? row[bucketColumnId] : null,
rowIndex: rowIndex,
columnIndex: rowHeaderIndex,
bucketAgg: bucketAgg,
});
});
});
Expand All @@ -159,7 +158,7 @@ export class MetricVisComponent extends Component {
if (!metric.filterKey || !metric.bucketAgg) {
return;
}
const table = this.props.visData.tables[metric.tableIndex];
const table = this.props.visData;
this.props.vis.API.events.addFilter(table, metric.columnIndex, metric.rowIndex);
};

Expand Down
42 changes: 23 additions & 19 deletions src/core_plugins/region_map/public/__tests__/region_map_visualization.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -108,22 +108,26 @@ describe('RegionMapsVisualizationTests', function () {
const _makeJsonAjaxCallOld = ChoroplethLayer.prototype._makeJsonAjaxCall;

const dummyTableGroup = {
tables: [
{
columns: [{
'aggConfig': {
'id': '2',
'enabled': true,
'type': 'terms',
'schema': 'segment',
'params': { 'field': 'geo.dest', 'size': 5, 'order': 'desc', 'orderBy': '1' }
}, 'title': 'geo.dest: Descending'
}, {
'aggConfig': { 'id': '1', 'enabled': true, 'type': 'count', 'schema': 'metric', 'params': {} },
'title': 'Count'
}],
rows: [['CN', 26], ['IN', 17], ['US', 6], ['DE', 4], ['BR', 3]]
}
columns: [{
'id': 'col-0',
'aggConfig': {
'id': '2',
'enabled': true,
'type': 'terms',
'schema': 'segment',
'params': { 'field': 'geo.dest', 'size': 5, 'order': 'desc', 'orderBy': '1' }
}, 'title': 'geo.dest: Descending'
}, {
'id': 'col-1',
'aggConfig': { 'id': '1', 'enabled': true, 'type': 'count', 'schema': 'metric', 'params': {} },
'title': 'Count'
}],
rows: [
{ 'col-0': 'CN', 'col-1': 26 },
{ 'col-0': 'IN', 'col-1': 17 },
{ 'col-0': 'US', 'col-1': 6 },
{ 'col-0': 'DE', 'col-1': 4 },
{ 'col-0': 'BR', 'col-1': 3 }
]
};

Expand Down Expand Up @@ -293,7 +297,7 @@ describe('RegionMapsVisualizationTests', function () {
});

const newTableGroup = _.cloneDeep(dummyTableGroup);
newTableGroup.tables[0].rows.pop();//remove one shape
newTableGroup.rows.pop();//remove one shape

await regionMapsVisualization.render(newTableGroup, {
resize: false,
Expand All @@ -306,7 +310,7 @@ describe('RegionMapsVisualizationTests', function () {


const anotherTableGroup = _.cloneDeep(newTableGroup);
anotherTableGroup.tables[0].rows.pop();//remove one shape
anotherTableGroup.rows.pop();//remove one shape
domNode.style.width = '412px';
domNode.style.height = '112px';
await regionMapsVisualization.render(anotherTableGroup, {
Expand Down Expand Up @@ -336,7 +340,7 @@ describe('RegionMapsVisualizationTests', function () {
});

const newTableGroup = _.cloneDeep(dummyTableGroup);
newTableGroup.tables[0].rows.pop();//remove one shape
newTableGroup.rows.pop();//remove one shape
vis.params.colorSchema = 'Blues';
await regionMapsVisualization.render(newTableGroup, {
resize: false,
Expand Down
17 changes: 10 additions & 7 deletions src/core_plugins/region_map/public/region_map_visualization.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,14 +46,17 @@ export function RegionMapsVisualizationProvider(Private, config) {
}
}

async _updateData(tableGroup) {
this._chartData = tableGroup;
async _updateData(table) {
this._chartData = table;
let results;
if (!tableGroup || !tableGroup.tables || !tableGroup.tables.length || tableGroup.tables[0].columns.length !== 2) {
if (!table || !table.rows.length || table.columns.length !== 2) {
results = [];
} else {
const buckets = tableGroup.tables[0].rows;
results = buckets.map(([term, value]) => {
const termColumn = table.columns[0].id;
const valueColumn = table.columns[1].id;
results = table.rows.map(row => {
const term = row[termColumn];
const value = row[valueColumn];
return { term: term, value: value };
});
}
Expand Down Expand Up @@ -150,8 +153,8 @@ export function RegionMapsVisualizationProvider(Private, config) {
return;
}

const rowIndex = this._chartData.tables[0].rows.findIndex(row => row[0] === event);
this._vis.API.events.addFilter(this._chartData.tables[0], 0, rowIndex, event);
const rowIndex = this._chartData.rows.findIndex(row => row[0] === event);
this._vis.API.events.addFilter(this._chartData, 0, rowIndex, event);
});

this._choroplethLayer.on('styleChanged', (event) => {
Expand Down
Loading

0 comments on commit e5a94e7

Please sign in to comment.