Skip to content

Commit

Permalink
[ML] Data Frame Analytics: Adds missing info icon tooltips to scatter…
Browse files Browse the repository at this point in the history
…plot matrix option labels. (elastic#92626) (elastic#92769)

Adds missing info icon tooltips to scatterplot matrix option labels.
  • Loading branch information
walterra authored Feb 25, 2021
1 parent 716a228 commit dbbe522
Showing 1 changed file with 60 additions and 12 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import {
EuiFlexGroup,
EuiFlexItem,
EuiFormRow,
EuiIconTip,
EuiSelect,
EuiSpacer,
EuiSwitch,
Expand Down Expand Up @@ -57,6 +58,24 @@ const TOGGLE_OFF = i18n.translate('xpack.ml.splom.toggleOff', {

const sampleSizeOptions = [100, 1000, 10000].map((d) => ({ value: d, text: '' + d }));

interface OptionLabelWithIconTipProps {
label: string;
tooltip: string;
}

const OptionLabelWithIconTip: FC<OptionLabelWithIconTipProps> = ({ label, tooltip }) => (
<>
{label}
<EuiIconTip
content={tooltip}
iconProps={{
className: 'eui-alignTop',
}}
size="s"
/>
</>
);

export interface ScatterplotMatrixProps {
fields: string[];
index: string;
Expand Down Expand Up @@ -252,9 +271,16 @@ export const ScatterplotMatrix: FC<ScatterplotMatrixProps> = ({
<EuiFlexGroup>
<EuiFlexItem>
<EuiFormRow
label={i18n.translate('xpack.ml.splom.fieldSelectionLabel', {
defaultMessage: 'Fields',
})}
label={
<OptionLabelWithIconTip
label={i18n.translate('xpack.ml.splom.fieldSelectionLabel', {
defaultMessage: 'Fields',
})}
tooltip={i18n.translate('xpack.ml.splom.fieldSelectionInfoTooltip', {
defaultMessage: 'Pick fields to explore their relationships.',
})}
/>
}
display="rowCompressed"
fullWidth
>
Expand All @@ -276,9 +302,16 @@ export const ScatterplotMatrix: FC<ScatterplotMatrixProps> = ({
</EuiFlexItem>
<EuiFlexItem style={{ width: '200px' }} grow={false}>
<EuiFormRow
label={i18n.translate('xpack.ml.splom.sampleSizeLabel', {
defaultMessage: 'Sample size',
})}
label={
<OptionLabelWithIconTip
label={i18n.translate('xpack.ml.splom.sampleSizeLabel', {
defaultMessage: 'Sample size',
})}
tooltip={i18n.translate('xpack.ml.splom.sampleSizeInfoTooltip', {
defaultMessage: 'Amount of documents to display in the scatterplot matrix.',
})}
/>
}
display="rowCompressed"
fullWidth
>
Expand All @@ -292,9 +325,17 @@ export const ScatterplotMatrix: FC<ScatterplotMatrixProps> = ({
</EuiFlexItem>
<EuiFlexItem style={{ width: '120px' }} grow={false}>
<EuiFormRow
label={i18n.translate('xpack.ml.splom.randomScoringLabel', {
defaultMessage: 'Random scoring',
})}
label={
<OptionLabelWithIconTip
label={i18n.translate('xpack.ml.splom.randomScoringLabel', {
defaultMessage: 'Random scoring',
})}
tooltip={i18n.translate('xpack.ml.splom.randomScoringInfoTooltip', {
defaultMessage:
'Uses a function score query to get randomly selected documents as the sample.',
})}
/>
}
display="rowCompressed"
fullWidth
>
Expand All @@ -310,9 +351,16 @@ export const ScatterplotMatrix: FC<ScatterplotMatrixProps> = ({
{resultsField !== undefined && legendType === undefined && (
<EuiFlexItem style={{ width: '120px' }} grow={false}>
<EuiFormRow
label={i18n.translate('xpack.ml.splom.dynamicSizeLabel', {
defaultMessage: 'Dynamic size',
})}
label={
<OptionLabelWithIconTip
label={i18n.translate('xpack.ml.splom.dynamicSizeLabel', {
defaultMessage: 'Dynamic size',
})}
tooltip={i18n.translate('xpack.ml.splom.dynamicSizeInfoTooltip', {
defaultMessage: 'Scales the size of each point by its outlier score.',
})}
/>
}
display="rowCompressed"
fullWidth
>
Expand Down

0 comments on commit dbbe522

Please sign in to comment.