[Maps] Fix cannot select Solid fill-color when removing fields (#70621)
Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
parent
f5b280007f
commit
23ea7acb15
4 changed files with 66 additions and 74 deletions
|
@ -13,6 +13,7 @@ import {
|
||||||
getLayerListRaw,
|
getLayerListRaw,
|
||||||
getSelectedLayerId,
|
getSelectedLayerId,
|
||||||
getMapReady,
|
getMapReady,
|
||||||
|
getMapColors,
|
||||||
} from '../selectors/map_selectors';
|
} from '../selectors/map_selectors';
|
||||||
import { FLYOUT_STATE } from '../reducers/ui';
|
import { FLYOUT_STATE } from '../reducers/ui';
|
||||||
import { cancelRequest } from '../reducers/non_serializable_instances';
|
import { cancelRequest } from '../reducers/non_serializable_instances';
|
||||||
|
@ -384,7 +385,8 @@ export function clearMissingStyleProperties(layerId: string) {
|
||||||
|
|
||||||
const nextFields = await (targetLayer as IVectorLayer).getFields(); // take into account all fields, since labels can be driven by any field (source or join)
|
const nextFields = await (targetLayer as IVectorLayer).getFields(); // take into account all fields, since labels can be driven by any field (source or join)
|
||||||
const { hasChanges, nextStyleDescriptor } = style.getDescriptorWithMissingStylePropsRemoved(
|
const { hasChanges, nextStyleDescriptor } = style.getDescriptorWithMissingStylePropsRemoved(
|
||||||
nextFields
|
nextFields,
|
||||||
|
getMapColors(getState())
|
||||||
);
|
);
|
||||||
if (hasChanges && nextStyleDescriptor) {
|
if (hasChanges && nextStyleDescriptor) {
|
||||||
dispatch<any>(updateLayerStyle(layerId, nextStyleDescriptor));
|
dispatch<any>(updateLayerStyle(layerId, nextStyleDescriptor));
|
||||||
|
|
|
@ -13,7 +13,8 @@ import { DataRequest } from '../util/data_request';
|
||||||
export interface IStyle {
|
export interface IStyle {
|
||||||
getDescriptor(): StyleDescriptor | null;
|
getDescriptor(): StyleDescriptor | null;
|
||||||
getDescriptorWithMissingStylePropsRemoved(
|
getDescriptorWithMissingStylePropsRemoved(
|
||||||
nextFields: IField[]
|
nextFields: IField[],
|
||||||
|
mapColors: string[]
|
||||||
): { hasChanges: boolean; nextStyleDescriptor?: StyleDescriptor };
|
): { hasChanges: boolean; nextStyleDescriptor?: StyleDescriptor };
|
||||||
pluckStyleMetaFromSourceDataRequest(sourceDataRequest: DataRequest): StyleMetaDescriptor;
|
pluckStyleMetaFromSourceDataRequest(sourceDataRequest: DataRequest): StyleMetaDescriptor;
|
||||||
renderEditor({
|
renderEditor({
|
||||||
|
@ -34,7 +35,8 @@ export class AbstractStyle implements IStyle {
|
||||||
}
|
}
|
||||||
|
|
||||||
getDescriptorWithMissingStylePropsRemoved(
|
getDescriptorWithMissingStylePropsRemoved(
|
||||||
nextFields: IField[]
|
nextFields: IField[],
|
||||||
|
mapColors: string[]
|
||||||
): { hasChanges: boolean; nextStyleDescriptor?: StyleDescriptor } {
|
): { hasChanges: boolean; nextStyleDescriptor?: StyleDescriptor } {
|
||||||
return {
|
return {
|
||||||
hasChanges: false,
|
hasChanges: false,
|
||||||
|
|
|
@ -7,7 +7,12 @@
|
||||||
import _ from 'lodash';
|
import _ from 'lodash';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { VectorStyleEditor } from './components/vector_style_editor';
|
import { VectorStyleEditor } from './components/vector_style_editor';
|
||||||
import { getDefaultProperties, LINE_STYLES, POLYGON_STYLES } from './vector_style_defaults';
|
import {
|
||||||
|
getDefaultProperties,
|
||||||
|
getDefaultStaticProperties,
|
||||||
|
LINE_STYLES,
|
||||||
|
POLYGON_STYLES,
|
||||||
|
} from './vector_style_defaults';
|
||||||
import { AbstractStyle } from '../style';
|
import { AbstractStyle } from '../style';
|
||||||
import {
|
import {
|
||||||
GEO_JSON_TYPE,
|
GEO_JSON_TYPE,
|
||||||
|
@ -191,7 +196,7 @@ export class VectorStyle extends AbstractStyle {
|
||||||
* This method does not update its descriptor. It just returns a new descriptor that the caller
|
* This method does not update its descriptor. It just returns a new descriptor that the caller
|
||||||
* can then use to update store state via dispatch.
|
* can then use to update store state via dispatch.
|
||||||
*/
|
*/
|
||||||
getDescriptorWithMissingStylePropsRemoved(nextFields) {
|
getDescriptorWithMissingStylePropsRemoved(nextFields, mapColors) {
|
||||||
const originalProperties = this.getRawProperties();
|
const originalProperties = this.getRawProperties();
|
||||||
const updatedProperties = {};
|
const updatedProperties = {};
|
||||||
|
|
||||||
|
@ -201,6 +206,13 @@ export class VectorStyle extends AbstractStyle {
|
||||||
});
|
});
|
||||||
|
|
||||||
dynamicProperties.forEach((key) => {
|
dynamicProperties.forEach((key) => {
|
||||||
|
// Convert dynamic styling to static stying when there are no nextFields
|
||||||
|
if (nextFields.length === 0) {
|
||||||
|
const staticProperties = getDefaultStaticProperties(mapColors);
|
||||||
|
updatedProperties[key] = staticProperties[key];
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
const dynamicProperty = originalProperties[key];
|
const dynamicProperty = originalProperties[key];
|
||||||
const fieldName =
|
const fieldName =
|
||||||
dynamicProperty && dynamicProperty.options.field && dynamicProperty.options.field.name;
|
dynamicProperty && dynamicProperty.options.field && dynamicProperty.options.field.name;
|
||||||
|
|
|
@ -6,7 +6,12 @@
|
||||||
|
|
||||||
import { VectorStyle } from './vector_style';
|
import { VectorStyle } from './vector_style';
|
||||||
import { DataRequest } from '../../util/data_request';
|
import { DataRequest } from '../../util/data_request';
|
||||||
import { FIELD_ORIGIN, STYLE_TYPE, VECTOR_SHAPE_TYPE } from '../../../../common/constants';
|
import {
|
||||||
|
FIELD_ORIGIN,
|
||||||
|
STYLE_TYPE,
|
||||||
|
VECTOR_SHAPE_TYPE,
|
||||||
|
VECTOR_STYLES,
|
||||||
|
} from '../../../../common/constants';
|
||||||
|
|
||||||
jest.mock('../../../kibana_services');
|
jest.mock('../../../kibana_services');
|
||||||
jest.mock('ui/new_platform');
|
jest.mock('ui/new_platform');
|
||||||
|
@ -42,6 +47,7 @@ class MockSource {
|
||||||
|
|
||||||
describe('getDescriptorWithMissingStylePropsRemoved', () => {
|
describe('getDescriptorWithMissingStylePropsRemoved', () => {
|
||||||
const fieldName = 'doIStillExist';
|
const fieldName = 'doIStillExist';
|
||||||
|
const mapColors = [];
|
||||||
const properties = {
|
const properties = {
|
||||||
fillColor: {
|
fillColor: {
|
||||||
type: STYLE_TYPE.STATIC,
|
type: STYLE_TYPE.STATIC,
|
||||||
|
@ -59,7 +65,8 @@ describe('getDescriptorWithMissingStylePropsRemoved', () => {
|
||||||
iconSize: {
|
iconSize: {
|
||||||
type: STYLE_TYPE.DYNAMIC,
|
type: STYLE_TYPE.DYNAMIC,
|
||||||
options: {
|
options: {
|
||||||
color: 'a color',
|
minSize: 1,
|
||||||
|
maxSize: 10,
|
||||||
field: { name: fieldName, origin: FIELD_ORIGIN.SOURCE },
|
field: { name: fieldName, origin: FIELD_ORIGIN.SOURCE },
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
@ -75,86 +82,55 @@ describe('getDescriptorWithMissingStylePropsRemoved', () => {
|
||||||
const vectorStyle = new VectorStyle({ properties }, new MockSource());
|
const vectorStyle = new VectorStyle({ properties }, new MockSource());
|
||||||
|
|
||||||
const nextFields = [new MockField({ fieldName })];
|
const nextFields = [new MockField({ fieldName })];
|
||||||
const { hasChanges } = vectorStyle.getDescriptorWithMissingStylePropsRemoved(nextFields);
|
const { hasChanges } = vectorStyle.getDescriptorWithMissingStylePropsRemoved(
|
||||||
|
nextFields,
|
||||||
|
mapColors
|
||||||
|
);
|
||||||
expect(hasChanges).toBe(false);
|
expect(hasChanges).toBe(false);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('Should clear missing fields when next ordinal fields do not contain existing style property fields', () => {
|
it('Should clear missing fields when next ordinal fields do not contain existing style property fields', () => {
|
||||||
const vectorStyle = new VectorStyle({ properties }, new MockSource());
|
const vectorStyle = new VectorStyle({ properties }, new MockSource());
|
||||||
|
|
||||||
|
const nextFields = [new MockField({ fieldName: 'someOtherField' })];
|
||||||
|
const {
|
||||||
|
hasChanges,
|
||||||
|
nextStyleDescriptor,
|
||||||
|
} = vectorStyle.getDescriptorWithMissingStylePropsRemoved(nextFields, mapColors);
|
||||||
|
expect(hasChanges).toBe(true);
|
||||||
|
expect(nextStyleDescriptor.properties[VECTOR_STYLES.LINE_COLOR]).toEqual({
|
||||||
|
options: {},
|
||||||
|
type: 'DYNAMIC',
|
||||||
|
});
|
||||||
|
expect(nextStyleDescriptor.properties[VECTOR_STYLES.ICON_SIZE]).toEqual({
|
||||||
|
options: {
|
||||||
|
minSize: 1,
|
||||||
|
maxSize: 10,
|
||||||
|
},
|
||||||
|
type: 'DYNAMIC',
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('Should convert dynamic styles to static styles when there are no next fields', () => {
|
||||||
|
const vectorStyle = new VectorStyle({ properties }, new MockSource());
|
||||||
|
|
||||||
const nextFields = [];
|
const nextFields = [];
|
||||||
const {
|
const {
|
||||||
hasChanges,
|
hasChanges,
|
||||||
nextStyleDescriptor,
|
nextStyleDescriptor,
|
||||||
} = vectorStyle.getDescriptorWithMissingStylePropsRemoved(nextFields);
|
} = vectorStyle.getDescriptorWithMissingStylePropsRemoved(nextFields, mapColors);
|
||||||
expect(hasChanges).toBe(true);
|
expect(hasChanges).toBe(true);
|
||||||
expect(nextStyleDescriptor.properties).toEqual({
|
expect(nextStyleDescriptor.properties[VECTOR_STYLES.LINE_COLOR]).toEqual({
|
||||||
fillColor: {
|
options: {
|
||||||
options: {},
|
color: '#41937c',
|
||||||
type: 'STATIC',
|
|
||||||
},
|
},
|
||||||
icon: {
|
type: 'STATIC',
|
||||||
options: {
|
});
|
||||||
value: 'marker',
|
expect(nextStyleDescriptor.properties[VECTOR_STYLES.ICON_SIZE]).toEqual({
|
||||||
},
|
options: {
|
||||||
type: 'STATIC',
|
size: 6,
|
||||||
},
|
|
||||||
iconOrientation: {
|
|
||||||
options: {
|
|
||||||
orientation: 0,
|
|
||||||
},
|
|
||||||
type: 'STATIC',
|
|
||||||
},
|
|
||||||
iconSize: {
|
|
||||||
options: {
|
|
||||||
color: 'a color',
|
|
||||||
},
|
|
||||||
type: 'DYNAMIC',
|
|
||||||
},
|
|
||||||
labelText: {
|
|
||||||
options: {
|
|
||||||
value: '',
|
|
||||||
},
|
|
||||||
type: 'STATIC',
|
|
||||||
},
|
|
||||||
labelBorderColor: {
|
|
||||||
options: {
|
|
||||||
color: '#FFFFFF',
|
|
||||||
},
|
|
||||||
type: 'STATIC',
|
|
||||||
},
|
|
||||||
labelBorderSize: {
|
|
||||||
options: {
|
|
||||||
size: 'SMALL',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
labelColor: {
|
|
||||||
options: {
|
|
||||||
color: '#000000',
|
|
||||||
},
|
|
||||||
type: 'STATIC',
|
|
||||||
},
|
|
||||||
labelSize: {
|
|
||||||
options: {
|
|
||||||
size: 14,
|
|
||||||
},
|
|
||||||
type: 'STATIC',
|
|
||||||
},
|
|
||||||
lineColor: {
|
|
||||||
options: {},
|
|
||||||
type: 'DYNAMIC',
|
|
||||||
},
|
|
||||||
lineWidth: {
|
|
||||||
options: {
|
|
||||||
size: 1,
|
|
||||||
},
|
|
||||||
type: 'STATIC',
|
|
||||||
},
|
|
||||||
symbolizeAs: {
|
|
||||||
options: {
|
|
||||||
value: 'circle',
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
|
type: 'STATIC',
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue