maxmustermann/kibana
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

[TSVB] Shows wrong labels when we get only one series after splitting (#111736)

Browse source 
* use correct styles when after split we have only one series

* Fix lint

* Fix comments

* remove unused styles

* Update _vis_with_splits.scss

* Fix lint

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Uladzislau Lasitsa 2021-09-13 13:30:08 +03:00 committed by GitHub
parent 200efcaaa3
commit bfe1c556d0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 20 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
src/plugins/vis_type_timeseries/public/application/components/_vis_with_splits.scss
View file

@ -23,3 +23,16 @@
min-height: $tvbSplitBlockVisMinSize / 1.25;
}
}
// When there is only one visualization, expand the full height and remove all minimum sizes
.tvbSplitVis--one {
flex: 1;
.tvbSplitVis__split {
min-width: 0;
> .tvbVis {
min-height: 0;
}
}
}

10
src/plugins/vis_type_timeseries/public/application/components/vis_with_splits.js
View file

@ -7,6 +7,7 @@
*/
import React, { useCallback } from 'react';
import classNames from 'classnames';
import { getDisplayName } from './lib/get_display_name';
import { labelDateFormatter } from './lib/label_date_formatter';
import { findIndex, first } from 'lodash';
@ -41,8 +42,7 @@ export function visWithSplits(WrappedComponent) {
[fieldFormatMap, model.id, model.series, palettesService, syncColors, visData]
);
if (!model || !visData || !visData[model.id] || visData[model.id].series.length === 1)
return <WrappedComponent {...props} />;
if (!model || !visData || !visData[model.id]) return <WrappedComponent {...props} />;
if (visData[model.id].series.every((s) => s.id.split(':').length === 1)) {
return <WrappedComponent {...props} />;
}
@ -121,7 +121,11 @@ export function visWithSplits(WrappedComponent) {
);
});
return <div className="tvbSplitVis">{rows}</div>;
const hasOneVis = visData[model.id].series.length === 1;
return (
<div className={classNames('tvbSplitVis', { 'tvbSplitVis--one': hasOneVis })}>{rows}</div>
);
}
SplitVisComponent.displayName = `SplitVisComponent(${getDisplayName(WrappedComponent)})`;