Skip to content

Commit

Permalink
[Datatable] missing percentage column and wrong headers on export for…
Browse files Browse the repository at this point in the history 
…matted csv (#66883)

* Fixes the bug with percentage column missing in formatted csv

* fix tests

* Fix: Wrong formatted CSV when splitting tables

* On split table the split row should be added as a column only on the exported csv

* eslint

* fix test

* Improve the loop on the columns and rows

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
  • Loading branch information
@stratoula @elasticmachine
stratoula and elasticmachine committed May 27, 2020
1 parent ad25b23 commit 13f3d9a
Show file tree
Hide file tree
Showing 2 changed files with 56 additions and 40 deletions.
48 changes: 24 additions & 24 deletions src/legacy/core_plugins/kibana/public/__tests__/vis_type_table/agg_table.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -277,29 +277,29 @@ describe('Table Vis - AggTable Directive', function () {
expect(raw).to.be(
'"extension: Descending","Average bytes","geo.src: Descending","Average bytes","machine.os: Descending","Average bytes"' +
'\r\n' +
'png,IT,win,412032,9299,0' +
'png,412032,IT,9299,win,0' +
'\r\n' +
'png,IT,mac,412032,9299,9299' +
'png,412032,IT,9299,mac,9299' +
'\r\n' +
'png,US,linux,412032,8293,3992' +
'png,412032,US,8293,linux,3992' +
'\r\n' +
'png,US,mac,412032,8293,3029' +
'png,412032,US,8293,mac,3029' +
'\r\n' +
'css,MX,win,412032,9299,4992' +
'css,412032,MX,9299,win,4992' +
'\r\n' +
'css,MX,mac,412032,9299,5892' +
'css,412032,MX,9299,mac,5892' +
'\r\n' +
'css,US,linux,412032,8293,3992' +
'css,412032,US,8293,linux,3992' +
'\r\n' +
'css,US,mac,412032,8293,3029' +
'css,412032,US,8293,mac,3029' +
'\r\n' +
'html,CN,win,412032,9299,4992' +
'html,412032,CN,9299,win,4992' +
'\r\n' +
'html,CN,mac,412032,9299,5892' +
'html,412032,CN,9299,mac,5892' +
'\r\n' +
'html,FR,win,412032,8293,3992' +
'html,412032,FR,8293,win,3992' +
'\r\n' +
'html,FR,mac,412032,8293,3029' +
'html,412032,FR,8293,mac,3029' +
'\r\n'
);
});
Expand Down Expand Up @@ -335,29 +335,29 @@ describe('Table Vis - AggTable Directive', function () {
expect(formatted).to.be(
'"extension: Descending","Average bytes","geo.src: Descending","Average bytes","machine.os: Descending","Average bytes"' +
'\r\n' +
'"png_formatted",IT,win,412032,9299,0' +
'"png_formatted",412032,IT,9299,win,0' +
'\r\n' +
'"png_formatted",IT,mac,412032,9299,9299' +
'"png_formatted",412032,IT,9299,mac,9299' +
'\r\n' +
'"png_formatted",US,linux,412032,8293,3992' +
'"png_formatted",412032,US,8293,linux,3992' +
'\r\n' +
'"png_formatted",US,mac,412032,8293,3029' +
'"png_formatted",412032,US,8293,mac,3029' +
'\r\n' +
'"css_formatted",MX,win,412032,9299,4992' +
'"css_formatted",412032,MX,9299,win,4992' +
'\r\n' +
'"css_formatted",MX,mac,412032,9299,5892' +
'"css_formatted",412032,MX,9299,mac,5892' +
'\r\n' +
'"css_formatted",US,linux,412032,8293,3992' +
'"css_formatted",412032,US,8293,linux,3992' +
'\r\n' +
'"css_formatted",US,mac,412032,8293,3029' +
'"css_formatted",412032,US,8293,mac,3029' +
'\r\n' +
'"html_formatted",CN,win,412032,9299,4992' +
'"html_formatted",412032,CN,9299,win,4992' +
'\r\n' +
'"html_formatted",CN,mac,412032,9299,5892' +
'"html_formatted",412032,CN,9299,mac,5892' +
'\r\n' +
'"html_formatted",FR,win,412032,8293,3992' +
'"html_formatted",412032,FR,8293,win,3992' +
'\r\n' +
'"html_formatted",FR,mac,412032,8293,3029' +
'"html_formatted",412032,FR,8293,mac,3029' +
'\r\n'
);
});
Expand Down
48 changes: 32 additions & 16 deletions src/plugins/vis_type_table/public/agg_table/agg_table.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,8 +57,13 @@ export function KbnAggTable(config, RecursionHelper) {
};

self.toCsv = function (formatted) {
const rows = $scope.table.rows;
const columns = formatted ? $scope.formattedColumns : $scope.table.columns;
const rows = formatted ? $scope.rows : $scope.table.rows;
const columns = formatted ? [...$scope.formattedColumns] : [...$scope.table.columns];

if ($scope.splitRow && formatted) {
columns.unshift($scope.splitRow);
}

const nonAlphaNumRE = /[^a-zA-Z0-9]/;
const allDoubleQuoteRE = /"/g;

Expand All @@ -71,16 +76,17 @@ export function KbnAggTable(config, RecursionHelper) {
return val;
}

// escape each cell in each row
const csvRows = rows.map(function (row) {
return Object.entries(row).map(([k, v]) => {
const column = columns.find((c) => c.id === k);
if (formatted && column) {
return escape(column.formatter.convert(v));
}
return escape(v);
});
});
let csvRows = [];
for (const row of rows) {
const rowArray = [];
for (const col of columns) {
const value = row[col.id];
const formattedValue =
formatted && col.formatter ? escape(col.formatter.convert(value)) : escape(value);
rowArray.push(formattedValue);
}
csvRows = [...csvRows, rowArray];
}

// add the columns to the rows
csvRows.unshift(
Expand All @@ -105,6 +111,7 @@ export function KbnAggTable(config, RecursionHelper) {
if (!table) {
$scope.rows = null;
$scope.formattedColumns = null;
$scope.splitRow = null;
return;
}

Expand All @@ -114,20 +121,23 @@ export function KbnAggTable(config, RecursionHelper) {

if (typeof $scope.dimensions === 'undefined') return;

const { buckets, metrics, splitColumn } = $scope.dimensions;
const { buckets, metrics, splitColumn, splitRow } = $scope.dimensions;

$scope.formattedColumns = table.columns
.map(function (col, i) {
const isBucket = buckets.find((bucket) => bucket.accessor === i);
const isSplitColumn = splitColumn
? splitColumn.find((splitColumn) => splitColumn.accessor === i)
: undefined;
const isSplitRow = splitRow
? splitRow.find((splitRow) => splitRow.accessor === i)
: undefined;
const dimension =
isBucket || isSplitColumn || metrics.find((metric) => metric.accessor === i);

if (!dimension) return;

const formatter = getFormatService().deserialize(dimension.format);
const formatter = dimension
? getFormatService().deserialize(dimension.format)
: undefined;

const formattedColumn = {
id: col.id,
Expand All @@ -136,6 +146,12 @@ export function KbnAggTable(config, RecursionHelper) {
filterable: !!isBucket,
};

if (isSplitRow) {
$scope.splitRow = formattedColumn;
}

if (!dimension) return;

const last = i === table.columns.length - 1;

if (last || !isBucket) {
Expand Down

0 comments on commit 13f3d9a

Please sign in to comment.