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

[Lens] Format filter ratio as percentage #44625

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 @@ -16,7 +16,15 @@ describe('calculate_filter_ratio', () => {
};

expect(calculateFilterRatio.fn(input, { id: 'bucket' }, {})).toEqual({
columns: [{ id: 'bucket', name: 'A' }],
columns: [
{
id: 'bucket',
name: 'A',
formatHint: {
id: 'percent',
},
},
],
rows: [{ bucket: 0.5 }],
type: 'kibana_datatable',
});
Expand All @@ -30,7 +38,15 @@ describe('calculate_filter_ratio', () => {
};

expect(calculateFilterRatio.fn(input, { id: 'bucket' }, {})).toEqual({
columns: [{ id: 'bucket', name: 'A' }],
columns: [
{
id: 'bucket',
name: 'A',
formatHint: {
id: 'percent',
},
},
],
rows: [{ bucket: 0 }],
type: 'kibana_datatable',
});
Expand All @@ -44,7 +60,15 @@ describe('calculate_filter_ratio', () => {
};

expect(calculateFilterRatio.fn(input, { id: 'bucket' }, {})).toEqual({
columns: [{ id: 'bucket', name: 'A' }],
columns: [
{
id: 'bucket',
name: 'A',
formatHint: {
id: 'percent',
},
},
],
rows: [{ bucket: 0 }],
type: 'kibana_datatable',
});
Expand All @@ -65,9 +89,39 @@ describe('calculate_filter_ratio', () => {
};

expect(calculateFilterRatio.fn(input, { id: 'bucket' }, {})).toEqual({
columns: [{ id: 'bucket', name: 'A' }, { id: 'extra', name: 'C' }],
rows: [{ bucket: 0.5, extra: 'first' }],
columns: [
{
id: 'bucket',
name: 'A',
formatHint: {
id: 'percent',
},
},
{ id: 'extra', name: 'C' },
],
rows: [
{
bucket: 0.5,
extra: 'first',
},
],
type: 'kibana_datatable',
});
});

it('should attach a percentage format hint to the ratio column', () => {
const input: KibanaDatatable = {
type: 'kibana_datatable',
columns: [{ id: 'bucket', name: 'A' }, { id: 'filter-ratio', name: 'B' }],
rows: [{ bucket: 'a', 'filter-ratio': 5 }, { bucket: 'b', 'filter-ratio': 10 }],
};

expect(calculateFilterRatio.fn(input, { id: 'bucket' }, {}).columns[0]).toEqual({
id: 'bucket',
name: 'A',
formatHint: {
id: 'percent',
},
});
});
});
Original file line number Diff line number Diff line change
Expand Up @@ -64,10 +64,23 @@ export const calculateFilterRatio: ExpressionFunction<
newRows.push(result);
}

const newColumns = data.columns
.filter(col => !col.id.includes('filter-ratio'))
Copy link
Contributor

Choose a reason for hiding this comment

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

I found this to be a magic string, and was confused. We're basically embedding metadata in our id and using that to categorize the column here. I think we should at least pull this out into a const so that if we change this in to_expression, it gets changed here, too.

Incidentally, this code looks wrong to me, but it's actually right. It looks like we're eliminating the filter-ratio column, then later trying to format that column. What we're actually doing is eliminating the extraneous column created by the filter ratio. Id is the count / whatever created by it. Not sure how we could clear this up, but wanted to point out the confusion.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I see what you mean, but I think it's out of scope for this change. I added it to the "technical debt" list and will tackle it in a separate PR

.map(col =>
col.id === id
? {
...col,
formatHint: {
id: 'percent',
},
}
: col
);

return {
type: 'kibana_datatable',
rows: newRows,
columns: data.columns.filter(col => !col.id.includes('filter-ratio')),
columns: newColumns,
};
},
};