diff --git a/x-pack/legacy/plugins/maps/public/angular/map_controller.js b/x-pack/legacy/plugins/maps/public/angular/map_controller.js
index 9522fd12ad37d..1b1fbf111fe04 100644
--- a/x-pack/legacy/plugins/maps/public/angular/map_controller.js
+++ b/x-pack/legacy/plugins/maps/public/angular/map_controller.js
@@ -39,6 +39,7 @@ import {
replaceLayerList,
setQuery,
clearTransientLayerStateAndCloseFlyout,
+ setMapSettings,
// eslint-disable-next-line @kbn/eslint/no-restricted-paths
} from '../../../../../plugins/maps/public/actions/map_actions';
import {
@@ -52,10 +53,14 @@ import {
setReadOnly,
setIsLayerTOCOpen,
setOpenTOCDetails,
+ openMapSettings,
// eslint-disable-next-line @kbn/eslint/no-restricted-paths
} from '../../../../../plugins/maps/public/actions/ui_actions';
-// eslint-disable-next-line @kbn/eslint/no-restricted-paths
-import { getIsFullScreen } from '../../../../../plugins/maps/public/selectors/ui_selectors';
+import {
+ getIsFullScreen,
+ getFlyoutDisplay,
+ // eslint-disable-next-line @kbn/eslint/no-restricted-paths
+} from '../../../../../plugins/maps/public/selectors/ui_selectors';
// eslint-disable-next-line @kbn/eslint/no-restricted-paths
import { copyPersistentState } from '../../../../../plugins/maps/public/reducers/util';
import {
@@ -395,6 +400,9 @@ app.controller(
if (mapState.filters) {
savedObjectFilters = mapState.filters;
}
+ if (mapState.settings) {
+ store.dispatch(setMapSettings(mapState.settings));
+ }
}
if (savedMap.uiStateJSON) {
@@ -453,6 +461,7 @@ app.controller(
$scope.isFullScreen = false;
$scope.isSaveDisabled = false;
+ $scope.isOpenSettingsDisabled = false;
function handleStoreChanges(store) {
const nextIsFullScreen = getIsFullScreen(store.getState());
if (nextIsFullScreen !== $scope.isFullScreen) {
@@ -474,6 +483,14 @@ app.controller(
$scope.isSaveDisabled = nextIsSaveDisabled;
});
}
+
+ const flyoutDisplay = getFlyoutDisplay(store.getState());
+ const nextIsOpenSettingsDisabled = flyoutDisplay !== FLYOUT_STATE.NONE;
+ if (nextIsOpenSettingsDisabled !== $scope.isOpenSettingsDisabled) {
+ $scope.$evalAsync(() => {
+ $scope.isOpenSettingsDisabled = nextIsOpenSettingsDisabled;
+ });
+ }
}
$scope.$on('$destroy', () => {
@@ -591,6 +608,22 @@ app.controller(
getInspector().open(inspectorAdapters, {});
},
},
+ {
+ id: 'mapSettings',
+ label: i18n.translate('xpack.maps.mapController.openSettingsButtonLabel', {
+ defaultMessage: `Map settings`,
+ }),
+ description: i18n.translate('xpack.maps.mapController.openSettingsDescription', {
+ defaultMessage: `Open map settings`,
+ }),
+ testId: 'openSettingsButton',
+ disableButton() {
+ return $scope.isOpenSettingsDisabled;
+ },
+ run() {
+ store.dispatch(openMapSettings());
+ },
+ },
...(getMapsCapabilities().save
? [
{
diff --git a/x-pack/plugins/maps/public/actions/map_actions.d.ts b/x-pack/plugins/maps/public/actions/map_actions.d.ts
index debead3ad5c45..c8db284a5c4f1 100644
--- a/x-pack/plugins/maps/public/actions/map_actions.d.ts
+++ b/x-pack/plugins/maps/public/actions/map_actions.d.ts
@@ -14,6 +14,7 @@ import {
MapCenterAndZoom,
MapRefreshConfig,
} from '../../common/descriptor_types';
+import { MapSettings } from '../reducers/map';
export type SyncContext = {
startLoading(dataId: string, requestToken: symbol, meta: DataMeta): void;
@@ -62,3 +63,14 @@ export function hideViewControl(): AnyAction;
export function setHiddenLayers(hiddenLayerIds: string[]): AnyAction;
export function addLayerWithoutDataSync(layerDescriptor: unknown): AnyAction;
+
+export function setMapSettings(settings: MapSettings): AnyAction;
+
+export function rollbackMapSettings(): AnyAction;
+
+export function trackMapSettings(): AnyAction;
+
+export function updateMapSetting(
+ settingKey: string,
+ settingValue: string | boolean | number
+): AnyAction;
diff --git a/x-pack/plugins/maps/public/actions/map_actions.js b/x-pack/plugins/maps/public/actions/map_actions.js
index 572385d628b16..da6ba6b481054 100644
--- a/x-pack/plugins/maps/public/actions/map_actions.js
+++ b/x-pack/plugins/maps/public/actions/map_actions.js
@@ -76,6 +76,10 @@ export const HIDE_TOOLBAR_OVERLAY = 'HIDE_TOOLBAR_OVERLAY';
export const HIDE_LAYER_CONTROL = 'HIDE_LAYER_CONTROL';
export const HIDE_VIEW_CONTROL = 'HIDE_VIEW_CONTROL';
export const SET_WAITING_FOR_READY_HIDDEN_LAYERS = 'SET_WAITING_FOR_READY_HIDDEN_LAYERS';
+export const SET_MAP_SETTINGS = 'SET_MAP_SETTINGS';
+export const ROLLBACK_MAP_SETTINGS = 'ROLLBACK_MAP_SETTINGS';
+export const TRACK_MAP_SETTINGS = 'TRACK_MAP_SETTINGS';
+export const UPDATE_MAP_SETTING = 'UPDATE_MAP_SETTING';
function getLayerLoadingCallbacks(dispatch, getState, layerId) {
return {
@@ -145,6 +149,29 @@ export function setMapInitError(errorMessage) {
};
}
+export function setMapSettings(settings) {
+ return {
+ type: SET_MAP_SETTINGS,
+ settings,
+ };
+}
+
+export function rollbackMapSettings() {
+ return { type: ROLLBACK_MAP_SETTINGS };
+}
+
+export function trackMapSettings() {
+ return { type: TRACK_MAP_SETTINGS };
+}
+
+export function updateMapSetting(settingKey, settingValue) {
+ return {
+ type: UPDATE_MAP_SETTING,
+ settingKey,
+ settingValue,
+ };
+}
+
export function trackCurrentLayerState(layerId) {
return {
type: TRACK_CURRENT_LAYER_STATE,
diff --git a/x-pack/plugins/maps/public/actions/ui_actions.d.ts b/x-pack/plugins/maps/public/actions/ui_actions.d.ts
index e087dc70256f0..43cdcff7d2d69 100644
--- a/x-pack/plugins/maps/public/actions/ui_actions.d.ts
+++ b/x-pack/plugins/maps/public/actions/ui_actions.d.ts
@@ -5,6 +5,7 @@
*/
import { AnyAction } from 'redux';
+import { FLYOUT_STATE } from '../reducers/ui';
export const UPDATE_FLYOUT: string;
export const CLOSE_SET_VIEW: string;
@@ -17,6 +18,8 @@ export const SHOW_TOC_DETAILS: string;
export const HIDE_TOC_DETAILS: string;
export const UPDATE_INDEXING_STAGE: string;
+export function updateFlyout(display: FLYOUT_STATE): AnyAction;
+
export function setOpenTOCDetails(layerIds?: string[]): AnyAction;
export function setIsLayerTOCOpen(open: boolean): AnyAction;
diff --git a/x-pack/plugins/maps/public/actions/ui_actions.js b/x-pack/plugins/maps/public/actions/ui_actions.js
index 77fdf6b0f12d2..e2a36e33e7db0 100644
--- a/x-pack/plugins/maps/public/actions/ui_actions.js
+++ b/x-pack/plugins/maps/public/actions/ui_actions.js
@@ -4,6 +4,10 @@
* you may not use this file except in compliance with the Elastic License.
*/
+import { getFlyoutDisplay } from '../selectors/ui_selectors';
+import { FLYOUT_STATE } from '../reducers/ui';
+import { setSelectedLayer, trackMapSettings } from './map_actions';
+
export const UPDATE_FLYOUT = 'UPDATE_FLYOUT';
export const CLOSE_SET_VIEW = 'CLOSE_SET_VIEW';
export const OPEN_SET_VIEW = 'OPEN_SET_VIEW';
@@ -28,6 +32,17 @@ export function updateFlyout(display) {
display,
};
}
+export function openMapSettings() {
+ return (dispatch, getState) => {
+ const flyoutDisplay = getFlyoutDisplay(getState());
+ if (flyoutDisplay === FLYOUT_STATE.MAP_SETTINGS_PANEL) {
+ return;
+ }
+ dispatch(setSelectedLayer(null));
+ dispatch(trackMapSettings());
+ dispatch(updateFlyout(FLYOUT_STATE.MAP_SETTINGS_PANEL));
+ };
+}
export function closeSetView() {
return {
type: CLOSE_SET_VIEW,
diff --git a/x-pack/plugins/maps/public/angular/services/saved_gis_map.js b/x-pack/plugins/maps/public/angular/services/saved_gis_map.js
index 1c47e0ab7dc2a..1a58b0cefaed9 100644
--- a/x-pack/plugins/maps/public/angular/services/saved_gis_map.js
+++ b/x-pack/plugins/maps/public/angular/services/saved_gis_map.js
@@ -15,6 +15,7 @@ import {
getRefreshConfig,
getQuery,
getFilters,
+ getMapSettings,
} from '../../selectors/map_selectors';
import { getIsLayerTOCOpen, getOpenTOCDetails } from '../../selectors/ui_selectors';
@@ -98,6 +99,7 @@ export function createSavedGisMapClass(services) {
refreshConfig: getRefreshConfig(state),
query: _.omit(getQuery(state), 'queryLastTriggeredAt'),
filters: getFilters(state),
+ settings: getMapSettings(state),
});
this.uiStateJSON = JSON.stringify({
diff --git a/x-pack/plugins/maps/public/connected_components/gis_map/index.js b/x-pack/plugins/maps/public/connected_components/gis_map/index.js
index c825fdab75ca7..f8769d0bb898a 100644
--- a/x-pack/plugins/maps/public/connected_components/gis_map/index.js
+++ b/x-pack/plugins/maps/public/connected_components/gis_map/index.js
@@ -6,8 +6,6 @@
import { connect } from 'react-redux';
import { GisMap } from './view';
-
-import { FLYOUT_STATE } from '../../reducers/ui';
import { exitFullScreen } from '../../actions/ui_actions';
import { getFlyoutDisplay, getIsFullScreen } from '../../selectors/ui_selectors';
import { triggerRefreshTimer, cancelAllInFlightRequests } from '../../actions/map_actions';
@@ -22,12 +20,9 @@ import {
import { getCoreChrome } from '../../kibana_services';
function mapStateToProps(state = {}) {
- const flyoutDisplay = getFlyoutDisplay(state);
return {
areLayersLoaded: areLayersLoaded(state),
- layerDetailsVisible: flyoutDisplay === FLYOUT_STATE.LAYER_PANEL,
- addLayerVisible: flyoutDisplay === FLYOUT_STATE.ADD_LAYER_WIZARD,
- noFlyoutVisible: flyoutDisplay === FLYOUT_STATE.NONE,
+ flyoutDisplay: getFlyoutDisplay(state),
isFullScreen: getIsFullScreen(state),
refreshConfig: getRefreshConfig(state),
mapInitError: getMapInitError(state),
diff --git a/x-pack/plugins/maps/public/connected_components/gis_map/view.js b/x-pack/plugins/maps/public/connected_components/gis_map/view.js
index 28ad12133d611..6eb173a001d01 100644
--- a/x-pack/plugins/maps/public/connected_components/gis_map/view.js
+++ b/x-pack/plugins/maps/public/connected_components/gis_map/view.js
@@ -6,6 +6,7 @@
import _ from 'lodash';
import React, { Component } from 'react';
+import classNames from 'classnames';
import { MBMapContainer } from '../map/mb';
import { WidgetOverlay } from '../widget_overlay';
import { ToolbarOverlay } from '../toolbar_overlay';
@@ -19,6 +20,8 @@ import { ES_GEO_FIELD_TYPE } from '../../../common/constants';
import { indexPatterns as indexPatternsUtils } from '../../../../../../src/plugins/data/public';
import { i18n } from '@kbn/i18n';
import uuid from 'uuid/v4';
+import { FLYOUT_STATE } from '../../reducers/ui';
+import { MapSettingsPanel } from '../map_settings_panel';
const RENDER_COMPLETE_EVENT = 'renderComplete';
@@ -147,9 +150,7 @@ export class GisMap extends Component {
render() {
const {
addFilters,
- layerDetailsVisible,
- addLayerVisible,
- noFlyoutVisible,
+ flyoutDisplay,
isFullScreen,
exitFullScreen,
mapInitError,
@@ -174,16 +175,13 @@ export class GisMap extends Component {
);
}
- let currentPanel;
- let currentPanelClassName;
- if (noFlyoutVisible) {
- currentPanel = null;
- } else if (addLayerVisible) {
- currentPanelClassName = 'mapMapLayerPanel-isVisible';
- currentPanel = ;
- } else if (layerDetailsVisible) {
- currentPanelClassName = 'mapMapLayerPanel-isVisible';
- currentPanel = ;
+ let flyoutPanel = null;
+ if (flyoutDisplay === FLYOUT_STATE.ADD_LAYER_WIZARD) {
+ flyoutPanel = ;
+ } else if (flyoutDisplay === FLYOUT_STATE.LAYER_PANEL) {
+ flyoutPanel = ;
+ } else if (flyoutDisplay === FLYOUT_STATE.MAP_SETTINGS_PANEL) {
+ flyoutPanel = ;
}
let exitFullScreenButton;
@@ -210,8 +208,13 @@ export class GisMap extends Component {
-
- {currentPanel}
+
+ {flyoutPanel}
{exitFullScreenButton}
diff --git a/x-pack/plugins/maps/public/connected_components/map/mb/index.js b/x-pack/plugins/maps/public/connected_components/map/mb/index.js
index d864b60eb433b..459b38d422694 100644
--- a/x-pack/plugins/maps/public/connected_components/map/mb/index.js
+++ b/x-pack/plugins/maps/public/connected_components/map/mb/index.js
@@ -23,6 +23,7 @@ import {
isInteractiveDisabled,
isTooltipControlDisabled,
isViewControlHidden,
+ getMapSettings,
} from '../../../selectors/map_selectors';
import { getInspectorAdapters } from '../../../reducers/non_serializable_instances';
@@ -30,6 +31,7 @@ import { getInspectorAdapters } from '../../../reducers/non_serializable_instanc
function mapStateToProps(state = {}) {
return {
isMapReady: getMapReady(state),
+ settings: getMapSettings(state),
layerList: getLayerList(state),
goto: getGoto(state),
inspectorAdapters: getInspectorAdapters(state),
diff --git a/x-pack/plugins/maps/public/connected_components/map/mb/view.js b/x-pack/plugins/maps/public/connected_components/map/mb/view.js
index 2d95de184f0f4..71c1af44e493b 100644
--- a/x-pack/plugins/maps/public/connected_components/map/mb/view.js
+++ b/x-pack/plugins/maps/public/connected_components/map/mb/view.js
@@ -12,14 +12,8 @@ import {
removeOrphanedSourcesAndLayers,
addSpritesheetToMap,
} from './utils';
-
import { getGlyphUrl, isRetina } from '../../../meta';
-import {
- DECIMAL_DEGREES_PRECISION,
- MAX_ZOOM,
- MIN_ZOOM,
- ZOOM_PRECISION,
-} from '../../../../common/constants';
+import { DECIMAL_DEGREES_PRECISION, ZOOM_PRECISION } from '../../../../common/constants';
import mapboxgl from 'mapbox-gl/dist/mapbox-gl-csp';
import mbWorkerUrl from '!!file-loader!mapbox-gl/dist/mapbox-gl-csp-worker';
import mbRtlPlugin from '!!file-loader!@mapbox/mapbox-gl-rtl-text/mapbox-gl-rtl-text.min.js';
@@ -80,7 +74,7 @@ export class MBMapContainer extends React.Component {
}
_debouncedSync = _.debounce(() => {
- if (this._isMounted) {
+ if (this._isMounted || !this.props.isMapReady) {
if (!this.state.hasSyncedLayerList) {
this.setState(
{
@@ -92,6 +86,7 @@ export class MBMapContainer extends React.Component {
}
);
}
+ this._syncSettings();
}
}, 256);
@@ -133,8 +128,8 @@ export class MBMapContainer extends React.Component {
scrollZoom: this.props.scrollZoom,
preserveDrawingBuffer: getInjectedVarFunc()('preserveDrawingBuffer', false),
interactive: !this.props.disableInteractive,
- minZoom: MIN_ZOOM,
- maxZoom: MAX_ZOOM,
+ maxZoom: this.props.settings.maxZoom,
+ minZoom: this.props.settings.minZoom,
};
const initialView = _.get(this.props.goto, 'center');
if (initialView) {
@@ -265,17 +260,13 @@ export class MBMapContainer extends React.Component {
};
_syncMbMapWithLayerList = () => {
- if (!this.props.isMapReady) {
- return;
- }
-
removeOrphanedSourcesAndLayers(this.state.mbMap, this.props.layerList);
this.props.layerList.forEach(layer => layer.syncLayerWithMB(this.state.mbMap));
syncLayerOrderForSingleLayer(this.state.mbMap, this.props.layerList);
};
_syncMbMapWithInspector = () => {
- if (!this.props.isMapReady || !this.props.inspectorAdapters.map) {
+ if (!this.props.inspectorAdapters.map) {
return;
}
@@ -289,6 +280,27 @@ export class MBMapContainer extends React.Component {
});
};
+ _syncSettings() {
+ let zoomRangeChanged = false;
+ if (this.props.settings.minZoom !== this.state.mbMap.getMinZoom()) {
+ this.state.mbMap.setMinZoom(this.props.settings.minZoom);
+ zoomRangeChanged = true;
+ }
+ if (this.props.settings.maxZoom !== this.state.mbMap.getMaxZoom()) {
+ this.state.mbMap.setMaxZoom(this.props.settings.maxZoom);
+ zoomRangeChanged = true;
+ }
+
+ // 'moveend' event not fired when map moves from setMinZoom or setMaxZoom
+ // https://github.com/mapbox/mapbox-gl-js/issues/9610
+ // hack to update extent after zoom update finishes moving map.
+ if (zoomRangeChanged) {
+ setTimeout(() => {
+ this.props.extentChanged(this._getMapState());
+ }, 300);
+ }
+ }
+
render() {
let drawControl;
let tooltipControl;
diff --git a/x-pack/plugins/maps/public/connected_components/map_settings_panel/index.ts b/x-pack/plugins/maps/public/connected_components/map_settings_panel/index.ts
new file mode 100644
index 0000000000000..329fac28d7d2e
--- /dev/null
+++ b/x-pack/plugins/maps/public/connected_components/map_settings_panel/index.ts
@@ -0,0 +1,39 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { AnyAction, Dispatch } from 'redux';
+import { connect } from 'react-redux';
+import { FLYOUT_STATE } from '../../reducers/ui';
+import { MapStoreState } from '../../reducers/store';
+import { MapSettingsPanel } from './map_settings_panel';
+import { rollbackMapSettings, updateMapSetting } from '../../actions/map_actions';
+import { getMapSettings, hasMapSettingsChanges } from '../../selectors/map_selectors';
+import { updateFlyout } from '../../actions/ui_actions';
+
+function mapStateToProps(state: MapStoreState) {
+ return {
+ settings: getMapSettings(state),
+ hasMapSettingsChanges: hasMapSettingsChanges(state),
+ };
+}
+
+function mapDispatchToProps(dispatch: Dispatch) {
+ return {
+ cancelChanges: () => {
+ dispatch(rollbackMapSettings());
+ dispatch(updateFlyout(FLYOUT_STATE.NONE));
+ },
+ keepChanges: () => {
+ dispatch(updateFlyout(FLYOUT_STATE.NONE));
+ },
+ updateMapSetting: (settingKey: string, settingValue: string | number | boolean) => {
+ dispatch(updateMapSetting(settingKey, settingValue));
+ },
+ };
+}
+
+const connectedMapSettingsPanel = connect(mapStateToProps, mapDispatchToProps)(MapSettingsPanel);
+export { connectedMapSettingsPanel as MapSettingsPanel };
diff --git a/x-pack/plugins/maps/public/connected_components/map_settings_panel/map_settings_panel.tsx b/x-pack/plugins/maps/public/connected_components/map_settings_panel/map_settings_panel.tsx
new file mode 100644
index 0000000000000..36ed29e92cf69
--- /dev/null
+++ b/x-pack/plugins/maps/public/connected_components/map_settings_panel/map_settings_panel.tsx
@@ -0,0 +1,97 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React from 'react';
+import {
+ EuiButton,
+ EuiButtonEmpty,
+ EuiFlexGroup,
+ EuiFlexItem,
+ EuiFlyoutFooter,
+ EuiFlyoutHeader,
+ EuiSpacer,
+ EuiTitle,
+} from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import { FormattedMessage } from '@kbn/i18n/react';
+import { MapSettings } from '../../reducers/map';
+import { NavigationPanel } from './navigation_panel';
+
+interface Props {
+ cancelChanges: () => void;
+ hasMapSettingsChanges: boolean;
+ keepChanges: () => void;
+ settings: MapSettings;
+ updateMapSetting: (settingKey: string, settingValue: string | number | boolean) => void;
+}
+
+export function MapSettingsPanel({
+ cancelChanges,
+ hasMapSettingsChanges,
+ keepChanges,
+ settings,
+ updateMapSetting,
+}: Props) {
+ // TODO move common text like Cancel and Close to common i18n translation
+ const closeBtnLabel = hasMapSettingsChanges
+ ? i18n.translate('xpack.maps.mapSettingsPanel.cancelLabel', {
+ defaultMessage: 'Cancel',
+ })
+ : i18n.translate('xpack.maps.mapSettingsPanel.closeLabel', {
+ defaultMessage: 'Close',
+ });
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {closeBtnLabel}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/x-pack/plugins/maps/public/connected_components/map_settings_panel/navigation_panel.tsx b/x-pack/plugins/maps/public/connected_components/map_settings_panel/navigation_panel.tsx
new file mode 100644
index 0000000000000..ed83e838f44f6
--- /dev/null
+++ b/x-pack/plugins/maps/public/connected_components/map_settings_panel/navigation_panel.tsx
@@ -0,0 +1,55 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React from 'react';
+import { EuiPanel, EuiSpacer, EuiTitle } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import { FormattedMessage } from '@kbn/i18n/react';
+import { MapSettings } from '../../reducers/map';
+import { ValidatedDualRange, Value } from '../../../../../../src/plugins/kibana_react/public';
+import { MAX_ZOOM, MIN_ZOOM } from '../../../common/constants';
+
+interface Props {
+ settings: MapSettings;
+ updateMapSetting: (settingKey: string, settingValue: string | number | boolean) => void;
+}
+
+export function NavigationPanel({ settings, updateMapSetting }: Props) {
+ const onZoomChange = (value: Value) => {
+ updateMapSetting('minZoom', Math.max(MIN_ZOOM, parseInt(value[0] as string, 10)));
+ updateMapSetting('maxZoom', Math.min(MAX_ZOOM, parseInt(value[1] as string, 10)));
+ };
+
+ return (
+
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/x-pack/plugins/maps/public/connected_components/toolbar_overlay/set_view_control/index.js b/x-pack/plugins/maps/public/connected_components/toolbar_overlay/set_view_control/index.js
index 2b6fae26098be..c3cc4090ab952 100644
--- a/x-pack/plugins/maps/public/connected_components/toolbar_overlay/set_view_control/index.js
+++ b/x-pack/plugins/maps/public/connected_components/toolbar_overlay/set_view_control/index.js
@@ -7,12 +7,13 @@
import { connect } from 'react-redux';
import { SetViewControl } from './set_view_control';
import { setGotoWithCenter } from '../../../actions/map_actions';
-import { getMapZoom, getMapCenter } from '../../../selectors/map_selectors';
+import { getMapZoom, getMapCenter, getMapSettings } from '../../../selectors/map_selectors';
import { closeSetView, openSetView } from '../../../actions/ui_actions';
import { getIsSetViewOpen } from '../../../selectors/ui_selectors';
function mapStateToProps(state = {}) {
return {
+ settings: getMapSettings(state),
isSetViewOpen: getIsSetViewOpen(state),
zoom: getMapZoom(state),
center: getMapCenter(state),
diff --git a/x-pack/plugins/maps/public/connected_components/toolbar_overlay/set_view_control/set_view_control.js b/x-pack/plugins/maps/public/connected_components/toolbar_overlay/set_view_control/set_view_control.js
index 9c983447bfbf6..2c10728f78e5c 100644
--- a/x-pack/plugins/maps/public/connected_components/toolbar_overlay/set_view_control/set_view_control.js
+++ b/x-pack/plugins/maps/public/connected_components/toolbar_overlay/set_view_control/set_view_control.js
@@ -18,7 +18,6 @@ import {
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n/react';
-import { MAX_ZOOM, MIN_ZOOM } from '../../../../common/constants';
function getViewString(lat, lon, zoom) {
return `${lat},${lon},${zoom}`;
@@ -118,8 +117,8 @@ export class SetViewControl extends Component {
const { isInvalid: isZoomInvalid, component: zoomFormRow } = this._renderNumberFormRow({
value: this.state.zoom,
- min: MIN_ZOOM,
- max: MAX_ZOOM,
+ min: this.props.settings.minZoom,
+ max: this.props.settings.maxZoom,
onChange: this._onZoomChange,
label: i18n.translate('xpack.maps.setViewControl.zoomLabel', {
defaultMessage: 'Zoom',
diff --git a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/__snapshots__/view.test.js.snap b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/__snapshots__/view.test.js.snap
index 560ebad89c50e..0af4eb0793f03 100644
--- a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/__snapshots__/view.test.js.snap
+++ b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/__snapshots__/view.test.js.snap
@@ -65,7 +65,7 @@ exports[`LayerControl is rendered 1`] = `
data-test-subj="addLayerButton"
fill={true}
fullWidth={true}
- isDisabled={true}
+ isDisabled={false}
onClick={[Function]}
>
`;
+
+exports[`LayerControl should disable buttons when flyout is open 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
diff --git a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/index.js b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/index.js
index 8780bac59e4b7..915f808b8e358 100644
--- a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/index.js
+++ b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/index.js
@@ -22,7 +22,7 @@ function mapStateToProps(state = {}) {
isReadOnly: getIsReadOnly(state),
isLayerTOCOpen: getIsLayerTOCOpen(state),
layerList: getLayerList(state),
- isAddButtonActive: getFlyoutDisplay(state) === FLYOUT_STATE.NONE,
+ isFlyoutOpen: getFlyoutDisplay(state) !== FLYOUT_STATE.NONE,
};
}
diff --git a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/view.js b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/view.js
index 537a676287042..180dc2e3933c3 100644
--- a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/view.js
+++ b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/view.js
@@ -57,7 +57,7 @@ export function LayerControl({
closeLayerTOC,
openLayerTOC,
layerList,
- isAddButtonActive,
+ isFlyoutOpen,
}) {
if (!isLayerTOCOpen) {
const hasErrors = layerList.some(layer => {
@@ -86,7 +86,7 @@ export function LayerControl({
{},
isLayerTOCOpen: true,
layerList: [],
+ isFlyoutOpen: false,
};
describe('LayerControl', () => {
@@ -30,6 +31,12 @@ describe('LayerControl', () => {
expect(component).toMatchSnapshot();
});
+ test('should disable buttons when flyout is open', () => {
+ const component = shallow();
+
+ expect(component).toMatchSnapshot();
+ });
+
test('isReadOnly', () => {
const component = shallow();
diff --git a/x-pack/plugins/maps/public/embeddable/map_embeddable.tsx b/x-pack/plugins/maps/public/embeddable/map_embeddable.tsx
index dbd48d614e99b..467cf4727edb7 100644
--- a/x-pack/plugins/maps/public/embeddable/map_embeddable.tsx
+++ b/x-pack/plugins/maps/public/embeddable/map_embeddable.tsx
@@ -28,6 +28,7 @@ import {
} from '../../../../../src/plugins/data/public';
import { GisMap } from '../connected_components/gis_map';
import { createMapStore, MapStore } from '../reducers/store';
+import { MapSettings } from '../reducers/map';
import {
setGotoWithCenter,
replaceLayerList,
@@ -40,6 +41,7 @@ import {
hideLayerControl,
hideViewControl,
setHiddenLayers,
+ setMapSettings,
} from '../actions/map_actions';
import { MapCenterAndZoom } from '../../common/descriptor_types';
import { setReadOnly, setIsLayerTOCOpen, setOpenTOCDetails } from '../actions/ui_actions';
@@ -60,6 +62,7 @@ interface MapEmbeddableConfig {
editable: boolean;
title?: string;
layerList: unknown[];
+ settings?: MapSettings;
}
export interface MapEmbeddableInput extends EmbeddableInput {
@@ -97,6 +100,7 @@ export class MapEmbeddable extends Embeddable this.onContainerStateChanged(input));
@@ -194,6 +199,10 @@ export class MapEmbeddable extends Embeddable map.settings;
+
+const getRollbackMapSettings = ({ map }) => map.__rollbackSettings;
+
+export const hasMapSettingsChanges = createSelector(
+ getMapSettings,
+ getRollbackMapSettings,
+ (settings, rollbackSettings) => {
+ return rollbackSettings ? !_.isEqual(settings, rollbackSettings) : false;
+ }
+);
+
export const getOpenTooltips = ({ map }) => {
return map && map.openTooltips ? map.openTooltips : [];
};