[Visualize] Horizontal Bar Graph Visualizations have Vertical Bar Graph Type (#78536)

* Fixed useEffect in metric_axes. Update type in params instead of type of vis

* Fixed tests

* Fixed tests

* Update current chart type definition

Co-authored-by: sulemanof <daniil_suleiman@epam.com>
Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Uladzislau Lasitsa 2020-10-05 19:46:02 +03:00 committed by GitHub
parent 951034cf0c
commit 90b6442ca6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 9 additions and 40 deletions

View file

@ -134,34 +134,6 @@ describe('MetricsAxisOptions component', () => {
const updatedSeries = [{ ...chart, data: { id: agg.id, label: agg.makeLabel() } }];
expect(setValue).toHaveBeenCalledWith(SERIES_PARAMS, updatedSeries);
});
it('should update visType when one seriesParam', () => {
const comp = mount(<MetricsAxisOptions {...defaultProps} />);
expect(defaultProps.vis.type.type).toBe(ChartTypes.AREA);
comp.setProps({
stateParams: {
...defaultProps.stateParams,
seriesParams: [{ ...chart, type: ChartTypes.LINE }],
},
});
expect(defaultProps.vis.setState).toHaveBeenLastCalledWith({ type: ChartTypes.LINE });
});
it('should set histogram visType when multiple seriesParam', () => {
const comp = mount(<MetricsAxisOptions {...defaultProps} />);
expect(defaultProps.vis.type.type).toBe(ChartTypes.AREA);
comp.setProps({
stateParams: {
...defaultProps.stateParams,
seriesParams: [chart, { ...chart, type: ChartTypes.LINE }],
},
});
expect(defaultProps.vis.setState).toHaveBeenLastCalledWith({ type: ChartTypes.HISTOGRAM });
});
});
describe('updateAxisTitle', () => {

View file

@ -18,7 +18,7 @@
*/
import React, { useState, useEffect, useCallback, useMemo } from 'react';
import { cloneDeep, uniq, get } from 'lodash';
import { cloneDeep, get } from 'lodash';
import { EuiSpacer } from '@elastic/eui';
import { IAggConfig } from 'src/plugins/data/public';
@ -293,15 +293,6 @@ function MetricsAxisOptions(props: ValidationVisOptionsProps<BasicVislibParams>)
updateAxisTitle(updatedSeries);
}, [metrics, firstValueAxesId, setValue, stateParams.seriesParams, updateAxisTitle]);
const visType = useMemo(() => {
const types = uniq(stateParams.seriesParams.map(({ type }) => type));
return types.length === 1 ? types[0] : 'histogram';
}, [stateParams.seriesParams]);
useEffect(() => {
vis.setState({ ...vis.serialize(), type: visType });
}, [vis, visType]);
return isTabSelected ? (
<>
<SeriesPanel

View file

@ -16,10 +16,11 @@
* specific language governing permissions and limitations
* under the License.
*/
import React from 'react';
import React, { useMemo } from 'react';
import { EuiPanel, EuiTitle, EuiSpacer } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n/react';
import { uniq } from 'lodash';
import { ValidationVisOptionsProps } from '../../common';
import { BasicOptions, SwitchOption } from '../../../../../charts/public';
@ -31,6 +32,10 @@ import { ChartTypes } from '../../../utils/collections';
function PointSeriesOptions(props: ValidationVisOptionsProps<BasicVislibParams>) {
const { stateParams, setValue, vis } = props;
const currentChartTypes = useMemo(() => uniq(stateParams.seriesParams.map(({ type }) => type)), [
stateParams.seriesParams,
]);
return (
<>
<EuiPanel paddingSize="s">
@ -68,7 +73,7 @@ function PointSeriesOptions(props: ValidationVisOptionsProps<BasicVislibParams>)
/>
)}
{vis.type.name === ChartTypes.HISTOGRAM && (
{currentChartTypes.includes(ChartTypes.HISTOGRAM) && (
<SwitchOption
data-test-subj="showValuesOnChart"
label={i18n.translate('visTypeVislib.editors.pointSeries.showLabels', {

View file

@ -93,4 +93,5 @@ export interface BasicVislibParams extends CommonVislibParams {
};
seriesParams: SeriesParam[];
times: TimeMarker[];
type: string;
}