-
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
[ML] Add control to show or hide empty fields in dropdown in Transform #195485
Changes from 39 commits
3ec0455
4b7dd54
fcb84ba
0f6224a
cc0de0e
57377aa
e321f9d
29658f7
585b2e3
70399ee
f9fd80f
0915532
711409f
a2efa16
72bb627
1e16d85
5a8269d
0636979
eecd220
2534c00
2f75637
ddd93dd
8d260a4
b32e595
0d5c2be
27852b0
7903d66
4013ba5
dd4e9c8
395cdf5
e20c3ea
6286cd6
a406fa9
3d1960b
927df17
4ab7645
5f0d5c4
59e0998
c96f14c
de0c081
505b070
e2b75d2
c524247
9a6f4c0
0884c28
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 |
---|---|---|
|
@@ -11,11 +11,14 @@ import type { EuiComboBoxOptionOption } from '@elastic/eui'; | |
import { EuiSpacer, EuiToolTip } from '@elastic/eui'; | ||
import { i18n } from '@kbn/i18n'; | ||
import { FormattedMessage } from '@kbn/i18n-react'; | ||
import { FieldStatsInfoButton, useFieldStatsTrigger } from '@kbn/ml-field-stats-flyout'; | ||
import { AggListForm } from './list_form'; | ||
import { DropDown } from '../aggregation_dropdown'; | ||
import type { PivotAggsConfig } from '../../../../common'; | ||
import { PivotConfigurationContext } from '../pivot_configuration/pivot_configuration'; | ||
import { MAX_NESTING_SUB_AGGS } from '../../../../common/pivot_aggs'; | ||
import type { DropDownOptionWithField } from '../step_define/common/get_pivot_dropdown_options'; | ||
import type { DropDownOption } from '../../../../common/dropdown'; | ||
|
||
/** | ||
* Component for managing sub-aggregation of the provided | ||
|
@@ -54,11 +57,49 @@ export const SubAggsSection: FC<{ item: PivotAggsConfig }> = ({ item }) => { | |
} | ||
return nestingLevel <= MAX_NESTING_SUB_AGGS; | ||
}, [item]); | ||
const { handleFieldStatsButtonClick, populatedFields } = useFieldStatsTrigger(); | ||
|
||
const options = useMemo(() => { | ||
const opts: EuiComboBoxOptionOption[] = []; | ||
state.aggOptions.forEach(({ label, field, options: aggOptions }: DropDownOptionWithField) => { | ||
const isEmpty = populatedFields && field.id ? !populatedFields.has(field.id) : false; | ||
|
||
const aggOption: DropDownOption = { | ||
isGroupLabel: true, | ||
key: field.id, | ||
searchableLabel: label, | ||
// @ts-ignore Purposefully passing label as element instead of string | ||
// for more robust rendering | ||
label: ( | ||
<FieldStatsInfoButton | ||
isEmpty={populatedFields && !populatedFields.has(field.id)} | ||
field={field} | ||
label={label} | ||
onButtonClick={handleFieldStatsButtonClick} | ||
/> | ||
), | ||
}; | ||
|
||
if (aggOptions.length) { | ||
opts.push(aggOption); | ||
opts.push( | ||
...aggOptions.map((o) => ({ | ||
...o, | ||
isEmpty, | ||
label: o.label, | ||
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.
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. Updated here |
||
isGroupLabel: false, | ||
searchableLabel: o.label, | ||
})) | ||
); | ||
} | ||
}); | ||
return opts; | ||
}, [handleFieldStatsButtonClick, populatedFields, state.aggOptions]); | ||
// @TODO: remove | ||
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. is this TODO needed still, if so, could it have a bit more explanation? 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. Removed here |
||
const dropdown = ( | ||
<DropDown | ||
changeHandler={addSubAggHandler} | ||
options={state.aggOptions} | ||
options={options} | ||
placeholder={i18n.translate('xpack.transform.stepDefineForm.addSubAggregationPlaceholder', { | ||
defaultMessage: 'Add a sub-aggregation ...', | ||
})} | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -12,7 +12,6 @@ import { EuiFormRow, type EuiComboBoxOptionOption } from '@elastic/eui'; | |
|
||
import { i18n } from '@kbn/i18n'; | ||
import { useFieldStatsTrigger, FieldStatsInfoButton } from '@kbn/ml-field-stats-flyout'; | ||
|
||
import { type DropDownOptionWithField } from '../step_define/common/get_pivot_dropdown_options'; | ||
import type { DropDownOption } from '../../../../common'; | ||
import { AggListForm } from '../aggregation_list'; | ||
|
@@ -41,28 +40,43 @@ export const PivotConfiguration: FC<StepDefineFormHook['pivotConfig']> = memo( | |
const { aggList, aggOptions, aggOptionsData, groupByList, groupByOptions, groupByOptionsData } = | ||
state; | ||
|
||
const aggOptionsWithFieldStats: EuiComboBoxOptionOption[] = useMemo( | ||
() => | ||
aggOptions.map(({ label, field, options }: DropDownOptionWithField) => { | ||
const aggOption: DropDownOption = { | ||
isGroupLabelOption: true, | ||
key: field.id, | ||
// @ts-ignore Purposefully passing label as element instead of string | ||
// for more robust rendering | ||
label: ( | ||
<FieldStatsInfoButton | ||
isEmpty={populatedFields && !populatedFields.has(field.id)} | ||
field={field} | ||
label={label} | ||
onButtonClick={handleFieldStatsButtonClick} | ||
/> | ||
), | ||
options: options ?? [], | ||
}; | ||
return aggOption; | ||
}), | ||
[aggOptions, handleFieldStatsButtonClick, populatedFields] | ||
); | ||
const aggOptionsWithFieldStats: EuiComboBoxOptionOption[] = useMemo(() => { | ||
const opts: EuiComboBoxOptionOption[] = []; | ||
aggOptions.forEach(({ label, field, options }: DropDownOptionWithField) => { | ||
const isEmpty = populatedFields && field.id ? !populatedFields.has(field.id) : false; | ||
|
||
const aggOption: DropDownOption = { | ||
isGroupLabel: true, | ||
key: field.id, | ||
searchableLabel: label, | ||
// @ts-ignore Purposefully passing label as element instead of string | ||
// for more robust rendering | ||
label: ( | ||
<FieldStatsInfoButton | ||
isEmpty={populatedFields && !populatedFields.has(field.id)} | ||
field={field} | ||
label={label} | ||
onButtonClick={handleFieldStatsButtonClick} | ||
/> | ||
), | ||
}; | ||
|
||
if (options.length) { | ||
opts.push(aggOption); | ||
opts.push( | ||
...options.map((o) => ({ | ||
...o, | ||
isEmpty, | ||
label: o.label, | ||
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. same comment as above about 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. Updated here |
||
isGroupLabel: false, | ||
searchableLabel: o.label, | ||
})) | ||
); | ||
} | ||
}); | ||
return opts; | ||
}, [aggOptions, handleFieldStatsButtonClick, populatedFields]); | ||
|
||
return ( | ||
<PivotConfigurationContext.Provider value={{ actions, state }}> | ||
<EuiFormRow | ||
|
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.
as
o
is spread below, I don't believekey: o.key
is neededThere 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.
Updated here
9b9ee5b
(#195485)