-
Notifications
You must be signed in to change notification settings - Fork 8.3k
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
[Vis: Default Editor] Euificate table options tab #46013
Changes from 13 commits
5698504
f51bbb9
d27bdff
0038919
b3d79ec
f75923e
fe667d2
e42d06e
4232fb0
3ddb9cf
d62fc88
b1becd2
f4e50d9
4f89b09
3cbd2a7
3904aea
1b9ee6f
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,154 @@ | ||
/* | ||
* Licensed to Elasticsearch B.V. under one or more contributor | ||
* license agreements. See the NOTICE file distributed with | ||
* this work for additional information regarding copyright | ||
* ownership. Elasticsearch B.V. licenses this file to you under | ||
* the Apache License, Version 2.0 (the "License"); you may | ||
* not use this file except in compliance with the License. | ||
* You may obtain a copy of the License at | ||
* | ||
* http://www.apache.org/licenses/LICENSE-2.0 | ||
* | ||
* Unless required by applicable law or agreed to in writing, | ||
* software distributed under the License is distributed on an | ||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY | ||
* KIND, either express or implied. See the License for the | ||
* specific language governing permissions and limitations | ||
* under the License. | ||
*/ | ||
|
||
import React, { useEffect, useMemo } from 'react'; | ||
import { get } from 'lodash'; | ||
import { EuiPanel, EuiTitle, EuiSpacer } from '@elastic/eui'; | ||
import { i18n } from '@kbn/i18n'; | ||
import { FormattedMessage } from '@kbn/i18n/react'; | ||
|
||
import { tabifyGetColumns } from 'ui/agg_response/tabify/_get_columns'; | ||
import { VisOptionsProps } from 'ui/vis/editors/default'; | ||
import { | ||
NumberInputOption, | ||
SwitchOption, | ||
SelectOption, | ||
} from '../../../kbn_vislib_vis_types/public/components/common'; | ||
import { TableVisParams } from '../types'; | ||
import { totalAggregations, isAggConfigNumeric } from './utils'; | ||
|
||
function TableOptions({ | ||
aggs, | ||
aggsLabels, | ||
stateParams, | ||
setValidity, | ||
setValue, | ||
}: VisOptionsProps<TableVisParams>) { | ||
const percentageColumns = useMemo( | ||
() => [ | ||
{ | ||
value: '', | ||
text: i18n.translate('visTypeTable.params.defaultPercentageCol', { | ||
defaultMessage: 'Don’t show', | ||
}), | ||
}, | ||
...tabifyGetColumns(aggs.getResponseAggs(), true) | ||
.filter(col => isAggConfigNumeric(get(col, 'aggConfig.type.name'), stateParams.dimensions)) | ||
.map(({ name }) => ({ value: name, text: name })), | ||
], | ||
[aggs, aggsLabels, stateParams.percentageCol, stateParams.dimensions] | ||
); | ||
|
||
const isPerPageValid = stateParams.perPage === '' || stateParams.perPage > 0; | ||
|
||
useEffect(() => { | ||
setValidity(isPerPageValid); | ||
}, [isPerPageValid]); | ||
|
||
useEffect(() => { | ||
if ( | ||
!percentageColumns.find(({ value }) => value === stateParams.percentageCol) && | ||
percentageColumns[0] && | ||
percentageColumns[0].value !== stateParams.percentageCol | ||
) { | ||
setValue('percentageCol', percentageColumns[0].value); | ||
} | ||
}, [percentageColumns, stateParams.percentageCol]); | ||
|
||
return ( | ||
<EuiPanel paddingSize="s"> | ||
<EuiTitle size="xs"> | ||
<h3> | ||
<FormattedMessage | ||
id="visTypeTable.params.showMetricsLabel.optionsTitle" | ||
defaultMessage="Options" | ||
/> | ||
</h3> | ||
</EuiTitle> | ||
<EuiSpacer size="s" /> | ||
<NumberInputOption | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. We could put a tooltip here to explain that leaving this empty means it will use the amount of buckets in the response. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Done. |
||
label={i18n.translate('visTypeTable.params.perPageLabel', { | ||
defaultMessage: 'Rows per page', | ||
})} | ||
isInvalid={!isPerPageValid} | ||
min={1} | ||
paramName="perPage" | ||
value={stateParams.perPage} | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I suppose this value could have a |
||
setValue={setValue} | ||
/> | ||
|
||
<SwitchOption | ||
label={i18n.translate('visTypeTable.params.showMetricsLabel', { | ||
defaultMessage: 'Show metrics for every bucket/level', | ||
})} | ||
paramName="showMetricsAtAllLevels" | ||
value={stateParams.showMetricsAtAllLevels} | ||
setValue={setValue} | ||
data-test-subj="showMetricsAtAllLevels" | ||
/> | ||
|
||
<SwitchOption | ||
label={i18n.translate('visTypeTable.params.showPartialRowsLabel', { | ||
defaultMessage: 'Show partial rows', | ||
})} | ||
tooltip={i18n.translate('visTypeTable.params.showPartialRowsTip', { | ||
defaultMessage: | ||
'Show rows that have partial data. This will still calculate metrics for every bucket/level, even if they are not displayed.', | ||
})} | ||
paramName="showPartialRows" | ||
value={stateParams.showPartialRows} | ||
setValue={setValue} | ||
data-test-subj="showPartialRows" | ||
/> | ||
|
||
<SwitchOption | ||
label={i18n.translate('visTypeTable.params.showTotalLabel', { | ||
defaultMessage: 'Show total', | ||
})} | ||
paramName="showTotal" | ||
value={stateParams.showTotal} | ||
setValue={setValue} | ||
/> | ||
|
||
<SelectOption | ||
label={i18n.translate('visTypeTable.params.totalFunctionLabel', { | ||
defaultMessage: 'Total function', | ||
})} | ||
disabled={!stateParams.showTotal} | ||
options={totalAggregations} | ||
paramName="totalFunc" | ||
value={stateParams.totalFunc} | ||
setValue={setValue} | ||
/> | ||
|
||
<SelectOption | ||
label={i18n.translate('visTypeTable.params.PercentageColLabel', { | ||
defaultMessage: 'Percentage column', | ||
})} | ||
options={percentageColumns} | ||
paramName="percentageCol" | ||
value={stateParams.percentageCol} | ||
setValue={setValue} | ||
id="datatableVisualizationPercentageCol" | ||
/> | ||
</EuiPanel> | ||
); | ||
} | ||
|
||
export { TableOptions }; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,68 @@ | ||
/* | ||
* Licensed to Elasticsearch B.V. under one or more contributor | ||
* license agreements. See the NOTICE file distributed with | ||
* this work for additional information regarding copyright | ||
* ownership. Elasticsearch B.V. licenses this file to you under | ||
* the Apache License, Version 2.0 (the "License"); you may | ||
* not use this file except in compliance with the License. | ||
* You may obtain a copy of the License at | ||
* | ||
* http://www.apache.org/licenses/LICENSE-2.0 | ||
* | ||
* Unless required by applicable law or agreed to in writing, | ||
* software distributed under the License is distributed on an | ||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY | ||
* KIND, either express or implied. See the License for the | ||
* specific language governing permissions and limitations | ||
* under the License. | ||
*/ | ||
|
||
import { get } from 'lodash'; | ||
import { i18n } from '@kbn/i18n'; | ||
import { AggTypes, Dimensions } from '../types'; | ||
|
||
function isAggConfigNumeric( | ||
type: AggTypes, | ||
{ buckets, metrics }: Dimensions = { buckets: [], metrics: [] } | ||
) { | ||
const dimension = | ||
buckets.find(({ aggType }) => aggType === type) || | ||
metrics.find(({ aggType }) => aggType === type); | ||
const formatType = get(dimension, 'format.id') || get(dimension, 'format.params.id'); | ||
return formatType === 'number'; | ||
} | ||
|
||
const totalAggregations = [ | ||
{ | ||
value: AggTypes.SUM, | ||
text: i18n.translate('visTypeTable.totalAggregations.sumText', { | ||
defaultMessage: 'Sum', | ||
}), | ||
}, | ||
{ | ||
value: AggTypes.AVG, | ||
text: i18n.translate('visTypeTable.totalAggregations.averageText', { | ||
defaultMessage: 'Average', | ||
}), | ||
}, | ||
{ | ||
value: AggTypes.MIN, | ||
text: i18n.translate('visTypeTable.totalAggregations.minText', { | ||
defaultMessage: 'Min', | ||
}), | ||
}, | ||
{ | ||
value: AggTypes.MAX, | ||
text: i18n.translate('visTypeTable.totalAggregations.maxText', { | ||
defaultMessage: 'Max', | ||
}), | ||
}, | ||
{ | ||
value: AggTypes.COUNT, | ||
text: i18n.translate('visTypeTable.totalAggregations.countText', { | ||
defaultMessage: 'Count', | ||
}), | ||
}, | ||
]; | ||
|
||
export { isAggConfigNumeric, totalAggregations }; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
In Markdown the only panel is called "Settings" - not sure which one is better, do we even need one if there is just a single panel
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Let's better remove it for consistency, like such titles are skipped in
Controls
,Coordinate map
andTag cloud
. Such titles are actually duplicates the tab name -Options