[Lens] Do not show legend actions popup when in non-interactive mode (#115804)

* 🐛 Fix non-interactive legend issue

*  Add tests

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Marco Liberati 2021-10-21 17:51:51 +02:00 committed by GitHub
parent ee5b847533
commit 1b3f2cdedf
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 24 additions and 9 deletions

View file

@ -302,12 +302,13 @@ describe('PieVisualization component', () => {
`);
});
test('does not set click listener on non-interactive mode', () => {
test('does not set click listener and legend actions on non-interactive mode', () => {
const defaultArgs = getDefaultArgs();
const component = shallow(
<PieComponent args={{ ...args }} {...defaultArgs} interactive={false} />
);
expect(component.find(Settings).first().prop('onElementClick')).toBeUndefined();
expect(component.find(Settings).first().prop('legendAction')).toBeUndefined();
});
test('it renders the empty placeholder when metric contains only falsy data', () => {

View file

@ -290,7 +290,7 @@ export function PieComponent(
legendPosition={legendPosition || Position.Right}
legendMaxDepth={nestedLegend ? undefined : 1 /* Color is based only on first layer */}
onElementClick={props.interactive ?? true ? onElementClickHandler : undefined}
legendAction={getLegendAction(firstTable, onClickValue)}
legendAction={props.interactive ? getLegendAction(firstTable, onClickValue) : undefined}
theme={{
...chartTheme,
background: {

View file

@ -1485,6 +1485,16 @@ describe('xy_expression', () => {
expect(wrapper.find(Settings).first().prop('onElementClick')).toBeUndefined();
});
test('legendAction is not triggering event on non-interactive mode', () => {
const { args, data } = sampleArgs();
const wrapper = mountWithIntl(
<XYChart {...defaultProps} data={data} args={args} interactive={false} />
);
expect(wrapper.find(Settings).first().prop('legendAction')).toBeUndefined();
});
test('it renders stacked bar', () => {
const { data, args } = sampleArgs();
const component = shallow(

View file

@ -599,13 +599,17 @@ export function XYChart({
xDomain={xDomain}
onBrushEnd={interactive ? (brushHandler as BrushEndListener) : undefined}
onElementClick={interactive ? clickHandler : undefined}
legendAction={getLegendAction(
filteredLayers,
data.tables,
onClickValue,
formatFactory,
layersAlreadyFormatted
)}
legendAction={
interactive
? getLegendAction(
filteredLayers,
data.tables,
onClickValue,
formatFactory,
layersAlreadyFormatted
)
: undefined
}
showLegendExtra={isHistogramViz && valuesInLegend}
/>