From 9b51d1ad3575b0c063d87ee0d5d73679984a93a1 Mon Sep 17 00:00:00 2001
From: Nathan Reese <reese.nathan@gmail.com>
Date: Thu, 16 Apr 2020 12:49:18 -0600
Subject: [PATCH 1/5] [Maps] disable edit layer button to avoid user data loss

---
 .../public/components/layer_toc_actions.js    |   1 +
 .../layer_toc/toc_entry/index.js              |  37 +--
 .../toc_entry_actions_popover/index.ts        |  50 ++++
 .../toc_entry_actions_popover.tsx             | 236 ++++++++++++++++++
 .../layer_control/layer_toc/toc_entry/view.js |  33 +--
 5 files changed, 303 insertions(+), 54 deletions(-)
 create mode 100644 x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/index.ts
 create mode 100644 x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx

diff --git a/x-pack/legacy/plugins/maps/public/components/layer_toc_actions.js b/x-pack/legacy/plugins/maps/public/components/layer_toc_actions.js
index d79eda16037cb..50cdfce41022c 100644
--- a/x-pack/legacy/plugins/maps/public/components/layer_toc_actions.js
+++ b/x-pack/legacy/plugins/maps/public/components/layer_toc_actions.js
@@ -174,6 +174,7 @@ export class LayerTocActions extends Component {
   }
 
   render() {
+    console.log('render');
     return (
       <EuiPopover
         id="contextMenu"
diff --git a/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/index.js b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/index.js
index 588445d0b4992..6ff3047951ecc 100644
--- a/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/index.js
+++ b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/index.js
@@ -4,36 +4,33 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import _ from 'lodash';
 import { connect } from 'react-redux';
 import { TOCEntry } from './view';
 // eslint-disable-next-line @kbn/eslint/no-restricted-paths
 import { FLYOUT_STATE } from '../../../../../../../../../plugins/maps/public/reducers/ui';
 import { updateFlyout, hideTOCDetails, showTOCDetails } from '../../../../../actions/ui_actions';
-import { getIsReadOnly, getOpenTOCDetails } from '../../../../../selectors/ui_selectors';
-import {
-  fitToLayerExtent,
-  setSelectedLayer,
-  toggleLayerVisible,
-  removeTransientLayer,
-  cloneLayer,
-  removeLayer,
-} from '../../../../../actions/map_actions';
-
 import {
+  getMapZoom,
   hasDirtyState,
   getSelectedLayer,
-  isUsingSearch,
 } from '../../../../../selectors/map_selectors';
+import {
+  getIsReadOnly,
+  getOpenTOCDetails,
+  getFlyoutDisplay,
+} from '../../../../../selectors/ui_selectors';
+import { setSelectedLayer, removeTransientLayer } from '../../../../../actions/map_actions';
 
 function mapStateToProps(state = {}, ownProps) {
+  const flyoutDisplay = getFlyoutDisplay(state);
   return {
     isReadOnly: getIsReadOnly(state),
-    zoom: _.get(state, 'map.mapState.zoom', 0),
+    zoom: getMapZoom(state),
     selectedLayer: getSelectedLayer(state),
     hasDirtyStateSelector: hasDirtyState(state),
     isLegendDetailsOpen: getOpenTOCDetails(state).includes(ownProps.layer.getId()),
-    isUsingSearch: isUsingSearch(state),
+    isEditButtonDisabled:
+      flyoutDisplay !== FLYOUT_STATE.NONE && flyoutDisplay !== FLYOUT_STATE.LAYER_PANEL,
   };
 }
 
@@ -44,18 +41,6 @@ function mapDispatchToProps(dispatch) {
       await dispatch(setSelectedLayer(layerId));
       dispatch(updateFlyout(FLYOUT_STATE.LAYER_PANEL));
     },
-    toggleVisible: layerId => {
-      dispatch(toggleLayerVisible(layerId));
-    },
-    fitToBounds: layerId => {
-      dispatch(fitToLayerExtent(layerId));
-    },
-    cloneLayer: layerId => {
-      dispatch(cloneLayer(layerId));
-    },
-    removeLayer: layerId => {
-      dispatch(removeLayer(layerId));
-    },
     hideTOCDetails: layerId => {
       dispatch(hideTOCDetails(layerId));
     },
diff --git a/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/index.ts b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/index.ts
new file mode 100644
index 0000000000000..284bca4cbeb8b
--- /dev/null
+++ b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/index.ts
@@ -0,0 +1,50 @@
+/*
+ * 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';
+// eslint-disable-next-line @kbn/eslint/no-restricted-paths
+import { MapStoreState } from '../../../../../../plugins/maps/public/reducers/store';
+import {
+  fitToLayerExtent,
+  toggleLayerVisible,
+  cloneLayer,
+  removeLayer,
+} from '../../../../../../actions/map_actions';
+import { getMapZoom, isUsingSearch } from '../../../../../../selectors/map_selectors';
+import { getIsReadOnly } from '../../../../../../selectors/ui_selectors';
+import { TOCEntryActionsPopover } from './toc_entry_actions_popover';
+
+function mapStateToProps(state: MapStoreState) {
+  return {
+    isReadOnly: getIsReadOnly(state),
+    isUsingSearch: isUsingSearch(state),
+    zoom: getMapZoom(state),
+  };
+}
+
+function mapDispatchToProps(dispatch: Dispatch<AnyAction>) {
+  return {
+    cloneLayer: (layerId: string) => {
+      dispatch(cloneLayer(layerId));
+    },
+    fitToBounds: (layerId: string) => {
+      dispatch(fitToLayerExtent(layerId));
+    },
+    removeLayer: (layerId: string) => {
+      dispatch(removeLayer(layerId));
+    },
+    toggleVisible: (layerId: string) => {
+      dispatch(toggleLayerVisible(layerId));
+    },
+  };
+}
+
+const connectedTOCEntryActionsPopover = connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(TOCEntryActionsPopover);
+export { connectedTOCEntryActionsPopover as TOCEntryActionsPopover };
diff --git a/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx
new file mode 100644
index 0000000000000..f767b46e9cc92
--- /dev/null
+++ b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx
@@ -0,0 +1,236 @@
+/*
+ * 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, { Component, Fragment } from 'react';
+
+import { EuiButtonEmpty, EuiPopover, EuiContextMenu, EuiIcon, EuiToolTip } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+// eslint-disable-next-line @kbn/eslint/no-restricted-paths
+import { ILayer } from '../../../../../../../../../../plugins/maps/public/layers/layer';
+
+interface Props {
+  cloneLayer: (layerId: string) => void;
+  displayName: string;
+  editLayer: () => void;
+  escapedDisplayName: string;
+  fitToBounds: (layerId: string) => void;
+  isEditButtonDisabled: boolean;
+  isReadOnly: boolean;
+  isUsingSearch: boolean;
+  layer: ILayer;
+  removeLayer: (layerId: string) => void;
+  toggleVisible: (layerId: string) => void;
+  zoom: number;
+}
+
+interface State {
+  isPopoverOpen: boolean;
+  supportsFitToBounds: boolean;
+}
+
+export class TOCEntryActionsPopover extends Component<Props, State> {
+  state = {
+    isPopoverOpen: false,
+    supportsFitToBounds: false,
+  };
+
+  componentDidMount() {
+    this._isMounted = true;
+    this._loadSupportsFitToBounds();
+  }
+
+  componentWillUnmount() {
+    this._isMounted = false;
+  }
+
+  async _loadSupportsFitToBounds() {
+    const supportsFitToBounds = await this.props.layer.supportsFitToBounds();
+    if (this._isMounted) {
+      this.setState({ supportsFitToBounds });
+    }
+  }
+
+  _togglePopover = () => {
+    this.setState(prevState => ({
+      isPopoverOpen: !prevState.isPopoverOpen,
+    }));
+  };
+
+  _closePopover = () => {
+    this.setState(() => ({
+      isPopoverOpen: false,
+    }));
+  };
+
+  _cloneLayer = () => {
+    this.props.cloneLayer(this.props.layer.getId());
+  };
+
+  _fitToBounds = () => {
+    this.props.fitToBounds(this.props.layer.getId());
+  };
+
+  _removeLayer = () => {
+    this.props.fitToBounds(this.props.layer.getId());
+  };
+
+  _toggleVisible = () => {
+    this.props.toggleVisible(this.props.layer.getId());
+  };
+
+  _renderPopoverToggleButton() {
+    const { icon, tooltipContent, footnotes } = this.props.layer.getIconAndTooltipContent(
+      this.props.zoom,
+      this.props.isUsingSearch
+    );
+
+    const footnoteIcons = footnotes.map((footnote, index) => {
+      return (
+        <Fragment key={index}>
+          {''}
+          {footnote.icon}
+        </Fragment>
+      );
+    });
+    const footnoteTooltipContent = footnotes.map((footnote, index) => {
+      return (
+        <div key={index}>
+          {footnote.icon} {footnote.message}
+        </div>
+      );
+    });
+
+    return (
+      <EuiToolTip
+        anchorClassName="mapLayTocActions__tooltipAnchor"
+        position="top"
+        title={this.props.displayName}
+        content={
+          <Fragment>
+            {tooltipContent}
+            {footnoteTooltipContent}
+          </Fragment>
+        }
+      >
+        <EuiButtonEmpty
+          className="mapTocEntry__layerName eui-textLeft"
+          size="xs"
+          flush="left"
+          color="text"
+          onClick={this._togglePopover}
+          data-test-subj={`layerTocActionsPanelToggleButton${this.props.escapedDisplayName}`}
+        >
+          <span className="mapTocEntry__layerNameIcon">{icon}</span>
+          {this.props.displayName} {footnoteIcons}
+        </EuiButtonEmpty>
+      </EuiToolTip>
+    );
+  }
+
+  _getActionsPanel() {
+    const actionItems = [
+      {
+        name: i18n.translate('xpack.maps.layerTocActions.fitToDataTitle', {
+          defaultMessage: 'Fit to data',
+        }),
+        icon: <EuiIcon type="search" size="m" />,
+        'data-test-subj': 'fitToBoundsButton',
+        toolTipContent: this.state.supportsFitToBounds
+          ? null
+          : i18n.translate('xpack.maps.layerTocActions.noFitSupportTooltip', {
+              defaultMessage: 'Layer does not support fit to data',
+            }),
+        disabled: !this.state.supportsFitToBounds,
+        onClick: () => {
+          this._closePopover();
+          this._fitToBounds();
+        },
+      },
+      {
+        name: this.props.layer.isVisible()
+          ? i18n.translate('xpack.maps.layerTocActions.hideLayerTitle', {
+              defaultMessage: 'Hide layer',
+            })
+          : i18n.translate('xpack.maps.layerTocActions.showLayerTitle', {
+              defaultMessage: 'Show layer',
+            }),
+        icon: <EuiIcon type={this.props.layer.isVisible() ? 'eye' : 'eyeClosed'} size="m" />,
+        'data-test-subj': 'layerVisibilityToggleButton',
+        onClick: () => {
+          this._closePopover();
+          this._toggleVisible();
+        },
+      },
+    ];
+
+    if (!this.props.isReadOnly) {
+      actionItems.push({
+        disabled: this.props.isEditButtonDisabled,
+        name: i18n.translate('xpack.maps.layerTocActions.editLayerTitle', {
+          defaultMessage: 'Edit layer',
+        }),
+        icon: <EuiIcon type="pencil" size="m" />,
+        'data-test-subj': 'editLayerButton',
+        onClick: () => {
+          this._closePopover();
+          this.props.editLayer();
+        },
+      });
+      actionItems.push({
+        name: i18n.translate('xpack.maps.layerTocActions.cloneLayerTitle', {
+          defaultMessage: 'Clone layer',
+        }),
+        icon: <EuiIcon type="copy" size="m" />,
+        'data-test-subj': 'cloneLayerButton',
+        onClick: () => {
+          this._closePopover();
+          this._cloneLayer();
+        },
+      });
+      actionItems.push({
+        name: i18n.translate('xpack.maps.layerTocActions.removeLayerTitle', {
+          defaultMessage: 'Remove layer',
+        }),
+        icon: <EuiIcon type="trash" size="m" />,
+        'data-test-subj': 'removeLayerButton',
+        onClick: () => {
+          this._closePopover();
+          this._removeLayer();
+        },
+      });
+    }
+
+    return {
+      id: 0,
+      title: i18n.translate('xpack.maps.layerTocActions.layerActionsTitle', {
+        defaultMessage: 'Layer actions',
+      }),
+      items: actionItems,
+    };
+  }
+
+  render() {
+    return (
+      <EuiPopover
+        id="contextMenu"
+        className="mapLayTocActions"
+        button={this._renderPopoverToggleButton()}
+        isOpen={this.state.isPopoverOpen}
+        closePopover={this._closePopover}
+        panelPaddingSize="none"
+        withTitle
+        anchorPosition="leftUp"
+        anchorClassName="mapLayTocActions__popoverAnchor"
+      >
+        <EuiContextMenu
+          initialPanelId={0}
+          panels={[this._getActionsPanel()]}
+          data-test-subj={`layerTocActionsPanel${this.props.escapedDisplayName}`}
+        />
+      </EuiPopover>
+    );
+  }
+}
diff --git a/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/view.js b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/view.js
index fe56523fb2580..c0ce24fef9cd8 100644
--- a/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/view.js
+++ b/x-pack/legacy/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/view.js
@@ -8,7 +8,7 @@ import React from 'react';
 import classNames from 'classnames';
 
 import { EuiIcon, EuiOverlayMask, EuiButtonIcon, EuiConfirmModal } from '@elastic/eui';
-import { LayerTocActions } from '../../../../../components/layer_toc_actions';
+import { TOCEntryActionsPopover } from './toc_entry_actions_popover';
 import { i18n } from '@kbn/i18n';
 
 function escapeLayerName(name) {
@@ -124,6 +124,7 @@ export class TOCEntry extends React.Component {
     return (
       <div className="mapTocEntry__layerIcons">
         <EuiButtonIcon
+          isDisabled={this.props.isEditButtonDisabled}
           iconType="pencil"
           aria-label={i18n.translate('xpack.maps.layerControl.tocEntry.editButtonAriaLabel', {
             defaultMessage: 'Edit layer',
@@ -191,17 +192,7 @@ export class TOCEntry extends React.Component {
   }
 
   _renderLayerHeader() {
-    const {
-      removeLayer,
-      cloneLayer,
-      isReadOnly,
-      layer,
-      zoom,
-      toggleVisible,
-      fitToBounds,
-      isUsingSearch,
-    } = this.props;
-
+    const { layer, zoom } = this.props;
     return (
       <div
         className={
@@ -210,26 +201,12 @@ export class TOCEntry extends React.Component {
             : 'mapTocEntry-notVisible'
         }
       >
-        <LayerTocActions
+        <TOCEntryActionsPopover
           layer={layer}
-          isUsingSearch={isUsingSearch}
-          fitToBounds={() => {
-            fitToBounds(layer.getId());
-          }}
-          zoom={zoom}
-          toggleVisible={() => {
-            toggleVisible(layer.getId());
-          }}
           displayName={this.state.displayName}
           escapedDisplayName={escapeLayerName(this.state.displayName)}
-          cloneLayer={() => {
-            cloneLayer(layer.getId());
-          }}
           editLayer={this._openLayerPanelWithCheck}
-          isReadOnly={isReadOnly}
-          removeLayer={() => {
-            removeLayer(layer.getId());
-          }}
+          isEditButtonDisabled={this.props.isEditButtonDisabled}
         />
 
         {this._renderLayerIcons()}

From eff9c298e70b43ccd9609045512172686c0b0d72 Mon Sep 17 00:00:00 2001
From: Nathan Reese <reese.nathan@gmail.com>
Date: Wed, 22 Apr 2020 12:58:25 -0600
Subject: [PATCH 2/5] remove layer_toc_actions

---
 .../public/components/layer_toc_actions.js    | 198 ------------------
 .../toc_entry_actions_popover.test.tsx.snap}  |   8 +-
 .../toc_entry_actions_popover.test.tsx}       |  10 +-
 3 files changed, 10 insertions(+), 206 deletions(-)
 delete mode 100644 x-pack/plugins/maps/public/components/layer_toc_actions.js
 rename x-pack/plugins/maps/public/{components/__snapshots__/layer_toc_actions.test.js.snap => connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/__snapshots__/toc_entry_actions_popover.test.tsx.snap} (96%)
 rename x-pack/plugins/maps/public/{components/layer_toc_actions.test.js => connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.test.tsx} (83%)

diff --git a/x-pack/plugins/maps/public/components/layer_toc_actions.js b/x-pack/plugins/maps/public/components/layer_toc_actions.js
deleted file mode 100644
index 50cdfce41022c..0000000000000
--- a/x-pack/plugins/maps/public/components/layer_toc_actions.js
+++ /dev/null
@@ -1,198 +0,0 @@
-/*
- * 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, { Component, Fragment } from 'react';
-
-import { EuiButtonEmpty, EuiPopover, EuiContextMenu, EuiIcon, EuiToolTip } from '@elastic/eui';
-import { i18n } from '@kbn/i18n';
-
-export class LayerTocActions extends Component {
-  state = {
-    isPopoverOpen: false,
-    supportsFitToBounds: false,
-  };
-
-  componentDidMount() {
-    this._isMounted = true;
-    this._loadSupportsFitToBounds();
-  }
-
-  componentWillUnmount() {
-    this._isMounted = false;
-  }
-
-  async _loadSupportsFitToBounds() {
-    const supportsFitToBounds = await this.props.layer.supportsFitToBounds();
-    if (this._isMounted) {
-      this.setState({ supportsFitToBounds });
-    }
-  }
-
-  _togglePopover = () => {
-    this.setState(prevState => ({
-      isPopoverOpen: !prevState.isPopoverOpen,
-    }));
-  };
-
-  _closePopover = () => {
-    this.setState(() => ({
-      isPopoverOpen: false,
-    }));
-  };
-
-  _renderPopoverToggleButton() {
-    const { icon, tooltipContent, footnotes } = this.props.layer.getIconAndTooltipContent(
-      this.props.zoom,
-      this.props.isUsingSearch
-    );
-
-    const footnoteIcons = footnotes.map((footnote, index) => {
-      return (
-        <Fragment key={index}>
-          {''}
-          {footnote.icon}
-        </Fragment>
-      );
-    });
-    const footnoteTooltipContent = footnotes.map((footnote, index) => {
-      return (
-        <div key={index}>
-          {footnote.icon} {footnote.message}
-        </div>
-      );
-    });
-
-    return (
-      <EuiToolTip
-        anchorClassName="mapLayTocActions__tooltipAnchor"
-        position="top"
-        title={this.props.displayName}
-        content={
-          <Fragment>
-            {tooltipContent}
-            {footnoteTooltipContent}
-          </Fragment>
-        }
-      >
-        <EuiButtonEmpty
-          className="mapTocEntry__layerName eui-textLeft"
-          size="xs"
-          flush="left"
-          color="text"
-          onClick={this._togglePopover}
-          data-test-subj={`layerTocActionsPanelToggleButton${this.props.escapedDisplayName}`}
-        >
-          <span className="mapTocEntry__layerNameIcon">{icon}</span>
-          {this.props.displayName} {footnoteIcons}
-        </EuiButtonEmpty>
-      </EuiToolTip>
-    );
-  }
-
-  _getActionsPanel() {
-    const actionItems = [
-      {
-        name: i18n.translate('xpack.maps.layerTocActions.fitToDataTitle', {
-          defaultMessage: 'Fit to data',
-        }),
-        icon: <EuiIcon type="search" size="m" />,
-        'data-test-subj': 'fitToBoundsButton',
-        toolTipContent: this.state.supportsFitToBounds
-          ? null
-          : i18n.translate('xpack.maps.layerTocActions.noFitSupportTooltip', {
-              defaultMessage: 'Layer does not support fit to data',
-            }),
-        disabled: !this.state.supportsFitToBounds,
-        onClick: () => {
-          this._closePopover();
-          this.props.fitToBounds();
-        },
-      },
-      {
-        name: this.props.layer.isVisible()
-          ? i18n.translate('xpack.maps.layerTocActions.hideLayerTitle', {
-              defaultMessage: 'Hide layer',
-            })
-          : i18n.translate('xpack.maps.layerTocActions.showLayerTitle', {
-              defaultMessage: 'Show layer',
-            }),
-        icon: <EuiIcon type={this.props.layer.isVisible() ? 'eye' : 'eyeClosed'} size="m" />,
-        'data-test-subj': 'layerVisibilityToggleButton',
-        onClick: () => {
-          this._closePopover();
-          this.props.toggleVisible();
-        },
-      },
-    ];
-
-    if (!this.props.isReadOnly) {
-      actionItems.push({
-        name: i18n.translate('xpack.maps.layerTocActions.editLayerTitle', {
-          defaultMessage: 'Edit layer',
-        }),
-        icon: <EuiIcon type="pencil" size="m" />,
-        'data-test-subj': 'editLayerButton',
-        onClick: () => {
-          this._closePopover();
-          this.props.editLayer();
-        },
-      });
-      actionItems.push({
-        name: i18n.translate('xpack.maps.layerTocActions.cloneLayerTitle', {
-          defaultMessage: 'Clone layer',
-        }),
-        icon: <EuiIcon type="copy" size="m" />,
-        'data-test-subj': 'cloneLayerButton',
-        onClick: () => {
-          this._closePopover();
-          this.props.cloneLayer();
-        },
-      });
-      actionItems.push({
-        name: i18n.translate('xpack.maps.layerTocActions.removeLayerTitle', {
-          defaultMessage: 'Remove layer',
-        }),
-        icon: <EuiIcon type="trash" size="m" />,
-        'data-test-subj': 'removeLayerButton',
-        onClick: () => {
-          this._closePopover();
-          this.props.removeLayer();
-        },
-      });
-    }
-
-    return {
-      id: 0,
-      title: i18n.translate('xpack.maps.layerTocActions.layerActionsTitle', {
-        defaultMessage: 'Layer actions',
-      }),
-      items: actionItems,
-    };
-  }
-
-  render() {
-    console.log('render');
-    return (
-      <EuiPopover
-        id="contextMenu"
-        className="mapLayTocActions"
-        button={this._renderPopoverToggleButton()}
-        isOpen={this.state.isPopoverOpen}
-        closePopover={this._closePopover}
-        panelPaddingSize="none"
-        withTitle
-        anchorPosition="leftUp"
-        anchorClassName="mapLayTocActions__popoverAnchor"
-      >
-        <EuiContextMenu
-          initialPanelId={0}
-          panels={[this._getActionsPanel()]}
-          data-test-subj={`layerTocActionsPanel${this.props.escapedDisplayName}`}
-        />
-      </EuiPopover>
-    );
-  }
-}
diff --git a/x-pack/plugins/maps/public/components/__snapshots__/layer_toc_actions.test.js.snap b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/__snapshots__/toc_entry_actions_popover.test.tsx.snap
similarity index 96%
rename from x-pack/plugins/maps/public/components/__snapshots__/layer_toc_actions.test.js.snap
rename to x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/__snapshots__/toc_entry_actions_popover.test.tsx.snap
index af836ceffa4b7..26bca6913fb06 100644
--- a/x-pack/plugins/maps/public/components/__snapshots__/layer_toc_actions.test.js.snap
+++ b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/__snapshots__/toc_entry_actions_popover.test.tsx.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`LayerTocActions is rendered 1`] = `
+exports[`TOCEntryActionsPopover is rendered 1`] = `
 <EuiPopover
   anchorClassName="mapLayTocActions__popoverAnchor"
   anchorPosition="leftUp"
@@ -89,6 +89,7 @@ exports[`LayerTocActions is rendered 1`] = `
             },
             Object {
               "data-test-subj": "editLayerButton",
+              "disabled": undefined,
               "icon": <EuiIcon
                 size="m"
                 type="pencil"
@@ -123,7 +124,7 @@ exports[`LayerTocActions is rendered 1`] = `
 </EuiPopover>
 `;
 
-exports[`LayerTocActions should disable fit to data when supportsFitToBounds is false 1`] = `
+exports[`TOCEntryActionsPopover should disable fit to data when supportsFitToBounds is false 1`] = `
 <EuiPopover
   anchorClassName="mapLayTocActions__popoverAnchor"
   anchorPosition="leftUp"
@@ -212,6 +213,7 @@ exports[`LayerTocActions should disable fit to data when supportsFitToBounds is
             },
             Object {
               "data-test-subj": "editLayerButton",
+              "disabled": undefined,
               "icon": <EuiIcon
                 size="m"
                 type="pencil"
@@ -246,7 +248,7 @@ exports[`LayerTocActions should disable fit to data when supportsFitToBounds is
 </EuiPopover>
 `;
 
-exports[`LayerTocActions should not show edit actions in read only mode 1`] = `
+exports[`TOCEntryActionsPopover should not show edit actions in read only mode 1`] = `
 <EuiPopover
   anchorClassName="mapLayTocActions__popoverAnchor"
   anchorPosition="leftUp"
diff --git a/x-pack/plugins/maps/public/components/layer_toc_actions.test.js b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.test.tsx
similarity index 83%
rename from x-pack/plugins/maps/public/components/layer_toc_actions.test.js
rename to x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.test.tsx
index c3a8f59c4c736..52f54a4db4f4f 100644
--- a/x-pack/plugins/maps/public/components/layer_toc_actions.test.js
+++ b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.test.tsx
@@ -7,7 +7,7 @@
 import React from 'react';
 import { shallowWithIntl } from 'test_utils/enzyme_helpers';
 
-import { LayerTocActions } from './layer_toc_actions';
+import { TOCEntryActionsPopover } from './toc_entry_actions_popover';
 
 let supportsFitToBounds;
 const layerMock = {
@@ -39,13 +39,13 @@ const defaultProps = {
   isUsingSearch: true,
 };
 
-describe('LayerTocActions', () => {
+describe('TOCEntryActionsPopover', () => {
   beforeEach(() => {
     supportsFitToBounds = true;
   });
 
   test('is rendered', async () => {
-    const component = shallowWithIntl(<LayerTocActions {...defaultProps} />);
+    const component = shallowWithIntl(<TOCEntryActionsPopover {...defaultProps} />);
 
     // Ensure all promises resolve
     await new Promise(resolve => process.nextTick(resolve));
@@ -56,7 +56,7 @@ describe('LayerTocActions', () => {
   });
 
   test('should not show edit actions in read only mode', async () => {
-    const component = shallowWithIntl(<LayerTocActions {...defaultProps} isReadOnly={true} />);
+    const component = shallowWithIntl(<TOCEntryActionsPopover {...defaultProps} isReadOnly={true} />);
 
     // Ensure all promises resolve
     await new Promise(resolve => process.nextTick(resolve));
@@ -68,7 +68,7 @@ describe('LayerTocActions', () => {
 
   test('should disable fit to data when supportsFitToBounds is false', async () => {
     supportsFitToBounds = false;
-    const component = shallowWithIntl(<LayerTocActions {...defaultProps} />);
+    const component = shallowWithIntl(<TOCEntryActionsPopover {...defaultProps} />);
 
     // Ensure all promises resolve
     await new Promise(resolve => process.nextTick(resolve));

From c4877a0318db8a3e15855ece101698437ee9a4af Mon Sep 17 00:00:00 2001
From: Nathan Reese <reese.nathan@gmail.com>
Date: Thu, 23 Apr 2020 06:10:32 -0600
Subject: [PATCH 3/5] fix tslint errors

---
 .../maps/public/actions/map_actions.d.ts      |  8 +++
 .../toc_entry_actions_popover.test.tsx.snap   | 13 ++++-
 .../toc_entry_actions_popover.test.tsx        | 57 +++++++++++++++----
 .../toc_entry_actions_popover.tsx             |  6 ++
 x-pack/plugins/maps/public/layers/layer.tsx   | 10 +++-
 .../maps/public/selectors/map_selectors.d.ts  |  2 +
 6 files changed, 79 insertions(+), 17 deletions(-)

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 c8db284a5c4f1..38c56405787eb 100644
--- a/x-pack/plugins/maps/public/actions/map_actions.d.ts
+++ b/x-pack/plugins/maps/public/actions/map_actions.d.ts
@@ -74,3 +74,11 @@ export function updateMapSetting(
   settingKey: string,
   settingValue: string | boolean | number
 ): AnyAction;
+
+export function cloneLayer(layerId: string): AnyAction;
+
+export function fitToLayerExtent(layerId: string): AnyAction;
+
+export function removeLayer(layerId: string): AnyAction;
+
+export function toggleLayerVisible(layerId: string): AnyAction;
diff --git a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/__snapshots__/toc_entry_actions_popover.test.tsx.snap b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/__snapshots__/toc_entry_actions_popover.test.tsx.snap
index 26bca6913fb06..b8c652909408a 100644
--- a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/__snapshots__/toc_entry_actions_popover.test.tsx.snap
+++ b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/__snapshots__/toc_entry_actions_popover.test.tsx.snap
@@ -86,16 +86,18 @@ exports[`TOCEntryActionsPopover is rendered 1`] = `
               />,
               "name": "Hide layer",
               "onClick": [Function],
+              "toolTipContent": null,
             },
             Object {
               "data-test-subj": "editLayerButton",
-              "disabled": undefined,
+              "disabled": false,
               "icon": <EuiIcon
                 size="m"
                 type="pencil"
               />,
               "name": "Edit layer",
               "onClick": [Function],
+              "toolTipContent": null,
             },
             Object {
               "data-test-subj": "cloneLayerButton",
@@ -105,6 +107,7 @@ exports[`TOCEntryActionsPopover is rendered 1`] = `
               />,
               "name": "Clone layer",
               "onClick": [Function],
+              "toolTipContent": null,
             },
             Object {
               "data-test-subj": "removeLayerButton",
@@ -114,6 +117,7 @@ exports[`TOCEntryActionsPopover is rendered 1`] = `
               />,
               "name": "Remove layer",
               "onClick": [Function],
+              "toolTipContent": null,
             },
           ],
           "title": "Layer actions",
@@ -210,16 +214,18 @@ exports[`TOCEntryActionsPopover should disable fit to data when supportsFitToBou
               />,
               "name": "Hide layer",
               "onClick": [Function],
+              "toolTipContent": null,
             },
             Object {
               "data-test-subj": "editLayerButton",
-              "disabled": undefined,
+              "disabled": false,
               "icon": <EuiIcon
                 size="m"
                 type="pencil"
               />,
               "name": "Edit layer",
               "onClick": [Function],
+              "toolTipContent": null,
             },
             Object {
               "data-test-subj": "cloneLayerButton",
@@ -229,6 +235,7 @@ exports[`TOCEntryActionsPopover should disable fit to data when supportsFitToBou
               />,
               "name": "Clone layer",
               "onClick": [Function],
+              "toolTipContent": null,
             },
             Object {
               "data-test-subj": "removeLayerButton",
@@ -238,6 +245,7 @@ exports[`TOCEntryActionsPopover should disable fit to data when supportsFitToBou
               />,
               "name": "Remove layer",
               "onClick": [Function],
+              "toolTipContent": null,
             },
           ],
           "title": "Layer actions",
@@ -334,6 +342,7 @@ exports[`TOCEntryActionsPopover should not show edit actions in read only mode 1
               />,
               "name": "Hide layer",
               "onClick": [Function],
+              "toolTipContent": null,
             },
           ],
           "title": "Layer actions",
diff --git a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.test.tsx b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.test.tsx
index 52f54a4db4f4f..b873119fd7d13 100644
--- a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.test.tsx
+++ b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.test.tsx
@@ -3,21 +3,45 @@
  * or more contributor license agreements. Licensed under the Elastic License;
  * you may not use this file except in compliance with the Elastic License.
  */
+/* eslint-disable max-classes-per-file */
 
 import React from 'react';
 import { shallowWithIntl } from 'test_utils/enzyme_helpers';
+import { AbstractLayer, ILayer } from '../../../../../../layers/layer';
+import { AbstractSource, ISource } from '../../../../../../layers/sources/source';
+import { AbstractStyle, IStyle } from '../../../../../../layers/styles/style';
 
 import { TOCEntryActionsPopover } from './toc_entry_actions_popover';
 
-let supportsFitToBounds;
-const layerMock = {
-  supportsFitToBounds: () => {
+let supportsFitToBounds: boolean;
+
+class MockSource extends AbstractSource implements ISource {}
+
+class MockStyle extends AbstractStyle implements IStyle {}
+
+class LayerMock extends AbstractLayer implements ILayer {
+  constructor() {
+    const sourceDescriptor = {
+      type: 'mySourceType',
+    };
+    const source = new MockSource(sourceDescriptor);
+    const style = new MockStyle({ type: 'myStyleType' });
+    const layerDescriptor = {
+      id: 'testLayer',
+      sourceDescriptor,
+    };
+    super({ layerDescriptor, source, style });
+  }
+
+  async supportsFitToBounds(): Promise<boolean> {
     return supportsFitToBounds;
-  },
-  isVisible: () => {
+  }
+
+  isVisible() {
     return true;
-  },
-  getIconAndTooltipContent: (zoom, isUsingSearch) => {
+  }
+
+  getIconAndTooltipContent(zoom: number, isUsingSearch: boolean) {
     return {
       icon: <span>mockIcon</span>,
       tooltipContent: `simulated tooltip content at zoom: ${zoom}`,
@@ -28,15 +52,22 @@ const layerMock = {
         },
       ],
     };
-  },
-};
+  }
+}
 
 const defaultProps = {
+  cloneLayer: () => {},
   displayName: 'layer 1',
+  editLayer: () => {},
   escapedDisplayName: 'layer1',
-  zoom: 0,
-  layer: layerMock,
+  fitToBounds: () => {},
+  isEditButtonDisabled: false,
+  isReadOnly: false,
   isUsingSearch: true,
+  layer: new LayerMock(),
+  removeLayer: () => {},
+  toggleVisible: () => {},
+  zoom: 0,
 };
 
 describe('TOCEntryActionsPopover', () => {
@@ -56,7 +87,9 @@ describe('TOCEntryActionsPopover', () => {
   });
 
   test('should not show edit actions in read only mode', async () => {
-    const component = shallowWithIntl(<TOCEntryActionsPopover {...defaultProps} isReadOnly={true} />);
+    const component = shallowWithIntl(
+      <TOCEntryActionsPopover {...defaultProps} isReadOnly={true} />
+    );
 
     // Ensure all promises resolve
     await new Promise(resolve => process.nextTick(resolve));
diff --git a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx
index ff6b3cbcc4e7c..5aa2eacb2e1a8 100644
--- a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx
+++ b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx
@@ -31,6 +31,8 @@ interface State {
 }
 
 export class TOCEntryActionsPopover extends Component<Props, State> {
+  private _isMounted: boolean = false;
+
   state = {
     isPopoverOpen: false,
     supportsFitToBounds: false,
@@ -158,6 +160,7 @@ export class TOCEntryActionsPopover extends Component<Props, State> {
             }),
         icon: <EuiIcon type={this.props.layer.isVisible() ? 'eye' : 'eyeClosed'} size="m" />,
         'data-test-subj': 'layerVisibilityToggleButton',
+        toolTipContent: null,
         onClick: () => {
           this._closePopover();
           this._toggleVisible();
@@ -173,6 +176,7 @@ export class TOCEntryActionsPopover extends Component<Props, State> {
         }),
         icon: <EuiIcon type="pencil" size="m" />,
         'data-test-subj': 'editLayerButton',
+        toolTipContent: null,
         onClick: () => {
           this._closePopover();
           this.props.editLayer();
@@ -183,6 +187,7 @@ export class TOCEntryActionsPopover extends Component<Props, State> {
           defaultMessage: 'Clone layer',
         }),
         icon: <EuiIcon type="copy" size="m" />,
+        toolTipContent: null,
         'data-test-subj': 'cloneLayerButton',
         onClick: () => {
           this._closePopover();
@@ -194,6 +199,7 @@ export class TOCEntryActionsPopover extends Component<Props, State> {
           defaultMessage: 'Remove layer',
         }),
         icon: <EuiIcon type="trash" size="m" />,
+        toolTipContent: null,
         'data-test-subj': 'removeLayerButton',
         onClick: () => {
           this._closePopover();
diff --git a/x-pack/plugins/maps/public/layers/layer.tsx b/x-pack/plugins/maps/public/layers/layer.tsx
index ce48793e1481b..c197fa523b526 100644
--- a/x-pack/plugins/maps/public/layers/layer.tsx
+++ b/x-pack/plugins/maps/public/layers/layer.tsx
@@ -45,7 +45,7 @@ export interface ILayer {
   supportsFitToBounds(): Promise<boolean>;
   getAttributions(): Promise<Attribution[]>;
   getLabel(): string;
-  getCustomIconAndTooltipContent(): IconAndTooltipContent;
+  getCustomIconAndTooltipContent(): CustomIconAndTooltipContent;
   getIconAndTooltipContent(zoomLevel: number, isUsingSearch: boolean): IconAndTooltipContent;
   renderLegendDetails(): ReactElement<any> | null;
   showAtZoomLevel(zoom: number): boolean;
@@ -88,7 +88,11 @@ export type Footnote = {
 export type IconAndTooltipContent = {
   icon?: ReactElement<any> | null;
   tooltipContent?: string | null;
-  footnotes?: Footnote[] | null;
+  footnotes: Footnote[];
+};
+export type CustomIconAndTooltipContent = {
+  icon: ReactElement<any> | null;
+  tooltipContent?: string | null;
   areResultsTrimmed?: boolean;
 };
 
@@ -213,7 +217,7 @@ export class AbstractLayer implements ILayer {
     return this._descriptor.label ? this._descriptor.label : '';
   }
 
-  getCustomIconAndTooltipContent(): IconAndTooltipContent {
+  getCustomIconAndTooltipContent(): CustomIconAndTooltipContent {
     return {
       icon: <EuiIcon size="m" type={this.getLayerTypeIconName()} />,
     };
diff --git a/x-pack/plugins/maps/public/selectors/map_selectors.d.ts b/x-pack/plugins/maps/public/selectors/map_selectors.d.ts
index fed344b7744fe..a12ff17700c0c 100644
--- a/x-pack/plugins/maps/public/selectors/map_selectors.d.ts
+++ b/x-pack/plugins/maps/public/selectors/map_selectors.d.ts
@@ -20,3 +20,5 @@ export function getQueryableUniqueIndexPatternIds(state: MapStoreState): string[
 export function getMapSettings(state: MapStoreState): MapSettings;
 
 export function hasMapSettingsChanges(state: MapStoreState): boolean;
+
+export function isUsingSearch(state: MapStoreState): boolean;

From 92ed162833c4d7b5270da6c2047168a2a8bfb28e Mon Sep 17 00:00:00 2001
From: Nathan Reese <reese.nathan@gmail.com>
Date: Thu, 23 Apr 2020 11:50:16 -0600
Subject: [PATCH 4/5] update jest snapshots

---
 .../toc_entry/__snapshots__/view.test.js.snap | 36 +++----------------
 1 file changed, 5 insertions(+), 31 deletions(-)

diff --git a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/__snapshots__/view.test.js.snap b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/__snapshots__/view.test.js.snap
index 27ea52bfed044..f1cb1a8864753 100644
--- a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/__snapshots__/view.test.js.snap
+++ b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/__snapshots__/view.test.js.snap
@@ -9,12 +9,10 @@ exports[`TOCEntry is rendered 1`] = `
   <div
     className="mapTocEntry-visible"
   >
-    <LayerTocActions
-      cloneLayer={[Function]}
+    <Connect(TOCEntryActionsPopover)
       displayName="layer 1"
       editLayer={[Function]}
       escapedDisplayName="layer_1"
-      fitToBounds={[Function]}
       layer={
         Object {
           "getDisplayName": [Function],
@@ -26,9 +24,6 @@ exports[`TOCEntry is rendered 1`] = `
           "showAtZoomLevel": [Function],
         }
       }
-      removeLayer={[Function]}
-      toggleVisible={[Function]}
-      zoom={0}
     />
     <div
       className="mapTocEntry__layerIcons"
@@ -76,12 +71,10 @@ exports[`TOCEntry props Should shade background when not selected layer 1`] = `
   <div
     className="mapTocEntry-visible"
   >
-    <LayerTocActions
-      cloneLayer={[Function]}
+    <Connect(TOCEntryActionsPopover)
       displayName="layer 1"
       editLayer={[Function]}
       escapedDisplayName="layer_1"
-      fitToBounds={[Function]}
       layer={
         Object {
           "getDisplayName": [Function],
@@ -93,9 +86,6 @@ exports[`TOCEntry props Should shade background when not selected layer 1`] = `
           "showAtZoomLevel": [Function],
         }
       }
-      removeLayer={[Function]}
-      toggleVisible={[Function]}
-      zoom={0}
     />
     <div
       className="mapTocEntry__layerIcons"
@@ -143,12 +133,10 @@ exports[`TOCEntry props Should shade background when selected layer 1`] = `
   <div
     className="mapTocEntry-visible"
   >
-    <LayerTocActions
-      cloneLayer={[Function]}
+    <Connect(TOCEntryActionsPopover)
       displayName="layer 1"
       editLayer={[Function]}
       escapedDisplayName="layer_1"
-      fitToBounds={[Function]}
       layer={
         Object {
           "getDisplayName": [Function],
@@ -160,9 +148,6 @@ exports[`TOCEntry props Should shade background when selected layer 1`] = `
           "showAtZoomLevel": [Function],
         }
       }
-      removeLayer={[Function]}
-      toggleVisible={[Function]}
-      zoom={0}
     />
     <div
       className="mapTocEntry__layerIcons"
@@ -210,13 +195,10 @@ exports[`TOCEntry props isReadOnly 1`] = `
   <div
     className="mapTocEntry-visible"
   >
-    <LayerTocActions
-      cloneLayer={[Function]}
+    <Connect(TOCEntryActionsPopover)
       displayName="layer 1"
       editLayer={[Function]}
       escapedDisplayName="layer_1"
-      fitToBounds={[Function]}
-      isReadOnly={true}
       layer={
         Object {
           "getDisplayName": [Function],
@@ -228,9 +210,6 @@ exports[`TOCEntry props isReadOnly 1`] = `
           "showAtZoomLevel": [Function],
         }
       }
-      removeLayer={[Function]}
-      toggleVisible={[Function]}
-      zoom={0}
     />
   </div>
   <span
@@ -261,12 +240,10 @@ exports[`TOCEntry props should display layer details when isLegendDetailsOpen is
   <div
     className="mapTocEntry-visible"
   >
-    <LayerTocActions
-      cloneLayer={[Function]}
+    <Connect(TOCEntryActionsPopover)
       displayName="layer 1"
       editLayer={[Function]}
       escapedDisplayName="layer_1"
-      fitToBounds={[Function]}
       layer={
         Object {
           "getDisplayName": [Function],
@@ -278,9 +255,6 @@ exports[`TOCEntry props should display layer details when isLegendDetailsOpen is
           "showAtZoomLevel": [Function],
         }
       }
-      removeLayer={[Function]}
-      toggleVisible={[Function]}
-      zoom={0}
     />
     <div
       className="mapTocEntry__layerIcons"

From 49e36cdb5110dd7c9d128bdd23494f864fb4a5a8 Mon Sep 17 00:00:00 2001
From: Nathan Reese <reese.nathan@gmail.com>
Date: Tue, 28 Apr 2020 15:30:00 -0600
Subject: [PATCH 5/5] review feedback

---
 .../toc_entry_actions_popover.tsx                | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx
index 5aa2eacb2e1a8..d628cca61de11 100644
--- a/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx
+++ b/x-pack/plugins/maps/public/connected_components/widget_overlay/layer_control/layer_toc/toc_entry/toc_entry_actions_popover/toc_entry_actions_popover.tsx
@@ -66,21 +66,21 @@ export class TOCEntryActionsPopover extends Component<Props, State> {
     }));
   };
 
-  _cloneLayer = () => {
+  _cloneLayer() {
     this.props.cloneLayer(this.props.layer.getId());
-  };
+  }
 
-  _fitToBounds = () => {
+  _fitToBounds() {
     this.props.fitToBounds(this.props.layer.getId());
-  };
+  }
 
-  _removeLayer = () => {
+  _removeLayer() {
     this.props.fitToBounds(this.props.layer.getId());
-  };
+  }
 
-  _toggleVisible = () => {
+  _toggleVisible() {
     this.props.toggleVisible(this.props.layer.getId());
-  };
+  }
 
   _renderPopoverToggleButton() {
     const { icon, tooltipContent, footnotes } = this.props.layer.getIconAndTooltipContent(