[Cloud Posture] add tooltips to filter action buttons (#151352)

## Summary


Quick wins [Issue](https://github.com/elastic/security-team/issues/6026)

The filter Actions button now has tooltips to inform users of what the
icon button's functional purpose is.

<img width="258" alt="Screen Shot 2023-02-15 at 12 31 10 PM"
src="https://user-images.githubusercontent.com/17135495/219107714-49396c81-f8a5-467d-92d1-ec19f7562d22.png">
<img width="343" alt="Screen Shot 2023-02-15 at 12 31 03 PM"
src="https://user-images.githubusercontent.com/17135495/219107722-f6b59060-2cca-436a-b084-39192ff41834.png">
This commit is contained in:
Lola 2023-02-16 11:35:04 -05:00 committed by GitHub
parent e0379a75f2
commit 644b1157bf
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -247,24 +247,44 @@ const FilterableCell: React.FC<{
display: flex;
`}
>
<EuiButtonIcon
iconType="plusInCircleFilled"
onClick={onAddFilter}
data-test-subj={FINDINGS_TABLE_CELL_ADD_FILTER}
aria-label={i18n.translate('xpack.csp.findings.findingsTableCell.addFilterButton', {
<EuiToolTip
position="top"
content={i18n.translate('xpack.csp.findings.findingsTableCell.addFilterButtonTooltip', {
defaultMessage: 'Add {field} filter',
values: { field },
})}
/>
<EuiButtonIcon
iconType="minusInCircleFilled"
onClick={onAddNegateFilter}
data-test-subj={FINDINGS_TABLE_CELL_ADD_NEGATED_FILTER}
aria-label={i18n.translate('xpack.csp.findings.findingsTableCell.addNegateFilterButton', {
defaultMessage: 'Add {field} negated filter',
values: { field },
})}
/>
>
<EuiButtonIcon
iconType="plusInCircleFilled"
onClick={onAddFilter}
data-test-subj={FINDINGS_TABLE_CELL_ADD_FILTER}
aria-label={i18n.translate('xpack.csp.findings.findingsTableCell.addFilterButton', {
defaultMessage: 'Add {field} filter',
values: { field },
})}
/>
</EuiToolTip>
<EuiToolTip
position="top"
content={i18n.translate(
'xpack.csp.findings.findingsTableCell.addNegatedFilterButtonTooltip',
{
defaultMessage: 'Add {field} negated filter',
values: { field },
}
)}
>
<EuiButtonIcon
iconType="minusInCircleFilled"
onClick={onAddNegateFilter}
data-test-subj={FINDINGS_TABLE_CELL_ADD_NEGATED_FILTER}
aria-label={i18n.translate('xpack.csp.findings.findingsTableCell.addNegateFilterButton', {
defaultMessage: 'Add {field} negated filter',
values: { field },
})}
/>
</EuiToolTip>
</div>
</div>
);