[Maps] fix duplicate EuiPopover id's

x-pack/plugins/maps/public/actions/map_actions.ts

@@ -271,7 +271,7 @@ export function triggerRefreshTimer() {
   };
 }
 
-export function updateDrawState(drawState: DrawState) {
+export function updateDrawState(drawState: DrawState | null) {
   return (dispatch: Dispatch) => {
     if (drawState !== null) {
       dispatch({ type: SET_OPEN_TOOLTIPS, openTooltips: [] }); // tooltips just get in the way

x-pack/plugins/maps/public/connected_components/toolbar_overlay/tools_control/index.js → x-pack/plugins/maps/public/connected_components/toolbar_overlay/tools_control/index.ts

@@ -4,24 +4,27 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { AnyAction, Dispatch } from 'redux';
 import { connect } from 'react-redux';
 import { ToolsControl } from './tools_control';
 import { isDrawingFilter } from '../../../selectors/map_selectors';
 import { updateDrawState } from '../../../actions';
+import { MapStoreState } from '../../../reducers/store';
+import { DrawState } from '../../../../common/descriptor_types';
 
-function mapStateToProps(state = {}) {
+function mapStateToProps(state: MapStoreState) {
   return {
     isDrawingFilter: isDrawingFilter(state),
   };
 }
 
-function mapDispatchToProps(dispatch) {
+function mapDispatchToProps(dispatch: Dispatch<AnyAction>) {
   return {
-    initiateDraw: (options) => {
-      dispatch(updateDrawState(options));
+    initiateDraw: (drawState: DrawState) => {
+      dispatch<any>(updateDrawState(drawState));
     },
     cancelDraw: () => {
-      dispatch(updateDrawState(null));
+      dispatch<any>(updateDrawState(null));
     },
   };
 }

x-pack/plugins/maps/public/connected_components/toolbar_overlay/tools_control/tools_control.test.js → x-pack/plugins/maps/public/connected_components/toolbar_overlay/tools_control/tools_control.test.tsx

@@ -19,6 +19,7 @@ const defaultProps = {
       indexPatternId: '1',
     },
   ],
+  isDrawingFilter: false,
 };
 
 test('renders', async () => {

x-pack/plugins/maps/public/connected_components/toolbar_overlay/tools_control/tools_control.js → x-pack/plugins/maps/public/connected_components/toolbar_overlay/tools_control/tools_control.tsx

@@ -14,10 +14,14 @@ import {
   EuiButton,
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
-import { DRAW_TYPE, ES_GEO_FIELD_TYPE } from '../../../../common/constants';
 import { FormattedMessage } from '@kbn/i18n/react';
+import { ActionExecutionContext, Action } from 'src/plugins/ui_actions/public';
+import { DRAW_TYPE, ES_GEO_FIELD_TYPE, ES_SPATIAL_RELATIONS } from '../../../../common/constants';
+// @ts-expect-error
 import { GeometryFilterForm } from '../../../components/geometry_filter_form';
 import { DistanceFilterForm } from '../../../components/distance_filter_form';
+import { GeoFieldWithIndex } from '../../../components/geo_field_with_index';
+import { DrawState } from '../../../../common/descriptor_types';
 
 const DRAW_SHAPE_LABEL = i18n.translate('xpack.maps.toolbarOverlay.drawShapeLabel', {
   defaultMessage: 'Draw shape to filter data',
@@ -46,8 +50,21 @@ const DRAW_DISTANCE_LABEL_SHORT = i18n.translate(
   }
 );
 
-export class ToolsControl extends Component {
-  state = {
+interface Props {
+  cancelDraw: () => void;
+  geoFields: GeoFieldWithIndex[];
+  initiateDraw: (drawState: DrawState) => void;
+  isDrawingFilter: boolean;
+  getFilterActions?: () => Promise<Action[]>;
+  getActionContext?: () => ActionExecutionContext;
+}
+
+interface State {
+  isPopoverOpen: boolean;
+}
+
+export class ToolsControl extends Component<Props, State> {
+  state: State = {
     isPopoverOpen: false,
   };
 
@@ -61,23 +78,39 @@ export class ToolsControl extends Component {
     this.setState({ isPopoverOpen: false });
   };
 
-  _initiateShapeDraw = (options) => {
+  _initiateShapeDraw = (options: {
+    geometryLabel: string;
+    indexPatternId: string;
+    geoFieldName: string;
+    geoFieldType: ES_GEO_FIELD_TYPE;
+    relation: ES_SPATIAL_RELATIONS;
+  }) => {
     this.props.initiateDraw({
       drawType: DRAW_TYPE.POLYGON,
       ...options,
     });
     this._closePopover();
   };
 
-  _initiateBoundsDraw = (options) => {
+  _initiateBoundsDraw = (options: {
+    geometryLabel: string;
+    indexPatternId: string;
+    geoFieldName: string;
+    geoFieldType: ES_GEO_FIELD_TYPE;
+    relation: ES_SPATIAL_RELATIONS;
+  }) => {
     this.props.initiateDraw({
       drawType: DRAW_TYPE.BOUNDS,
       ...options,
     });
     this._closePopover();
   };
 
-  _initiateDistanceDraw = (options) => {
+  _initiateDistanceDraw = (options: {
+    filterLabel: string;
+    indexPatternId: string;
+    geoFieldName: string;
+  }) => {
     this.props.initiateDraw({
       drawType: DRAW_TYPE.DISTANCE,
       ...options,
@@ -194,7 +227,7 @@ export class ToolsControl extends Component {
   render() {
     const toolsPopoverButton = (
       <EuiPopover
-        id="contextMenu"
+        id="toolsControlPopover"
         button={this._renderToolsButton()}
         isOpen={this.state.isPopoverOpen}
         closePopover={this._closePopover}

x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx

@@ -220,7 +220,7 @@ export class TOCEntryActionsPopover extends Component<Props, State> {
   render() {
     return (
       <EuiPopover
-        id="contextMenu"
+        id={this.props.layer.getId()}
         className="mapLayTocActions"
         button={this._renderPopoverToggleButton()}
         isOpen={this.state.isPopoverOpen}