From 89fc9d7c80564e2f02949ed33113a63fc1e898e4 Mon Sep 17 00:00:00 2001
From: vera-liu <vera.liu@airbnb.com>
Date: Mon, 5 Dec 2016 10:02:23 -0800
Subject: [PATCH] Make entire menuitem clickable for copy query (#1747)

---
 .../SqlLab/components/CopyQueryTabUrl.jsx        |  6 +++++-
 .../SqlLab/components/TabbedSqlEditors.jsx       |  4 +---
 .../javascripts/components/CopyToClipboard.jsx   | 16 +++++++++-------
 3 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/superset/assets/javascripts/SqlLab/components/CopyQueryTabUrl.jsx b/superset/assets/javascripts/SqlLab/components/CopyQueryTabUrl.jsx
index 4b5cc0c7dd9..0891d4cd20a 100644
--- a/superset/assets/javascripts/SqlLab/components/CopyQueryTabUrl.jsx
+++ b/superset/assets/javascripts/SqlLab/components/CopyQueryTabUrl.jsx
@@ -39,7 +39,11 @@ export default class CopyQueryTabUrl extends React.PureComponent {
       <CopyToClipboard
         inMenu
         text={this.state.shortUrl}
-        copyNode={<span>share query</span>}
+        copyNode={(
+          <div>
+            <i className="fa fa-clipboard" /> <span>share query</span>
+          </div>
+        )}
         tooltipText="copy URL to clipboard"
         shouldShowText={false}
       />
diff --git a/superset/assets/javascripts/SqlLab/components/TabbedSqlEditors.jsx b/superset/assets/javascripts/SqlLab/components/TabbedSqlEditors.jsx
index b7416905949..77613320403 100644
--- a/superset/assets/javascripts/SqlLab/components/TabbedSqlEditors.jsx
+++ b/superset/assets/javascripts/SqlLab/components/TabbedSqlEditors.jsx
@@ -150,9 +150,7 @@ class TabbedSqlEditors extends React.PureComponent {
               <i className="fa fa-i-cursor" /> rename tab
             </MenuItem>
             {qe &&
-              <MenuItem eventKey="3">
-                <i className="fa fa-clipboard" /> <CopyQueryTabUrl queryEditor={qe} />
-              </MenuItem>
+              <CopyQueryTabUrl queryEditor={qe} />
             }
             <MenuItem eventKey="4" onClick={this.toggleLeftBar.bind(this)}>
               <i className="fa fa-cogs" />
diff --git a/superset/assets/javascripts/components/CopyToClipboard.jsx b/superset/assets/javascripts/components/CopyToClipboard.jsx
index 88b1b98f105..5badfb69828 100644
--- a/superset/assets/javascripts/components/CopyToClipboard.jsx
+++ b/superset/assets/javascripts/components/CopyToClipboard.jsx
@@ -1,5 +1,5 @@
 import React, { PropTypes } from 'react';
-import { Tooltip, OverlayTrigger } from 'react-bootstrap';
+import { Tooltip, OverlayTrigger, MenuItem } from 'react-bootstrap';
 
 const propTypes = {
   copyNode: PropTypes.node,
@@ -99,12 +99,14 @@ export default class CopyToClipboard extends React.Component {
   renderInMenu() {
     return (
       <OverlayTrigger placement="top" overlay={this.renderTooltip()} trigger={['hover']}>
-        <span
-          onClick={this.copyToClipboard}
-          onMouseOut={this.onMouseOut}
-        >
-          {this.props.copyNode}
-        </span>
+        <MenuItem>
+          <span
+            onClick={this.copyToClipboard}
+            onMouseOut={this.onMouseOut}
+          >
+            {this.props.copyNode}
+          </span>
+        </MenuItem>
       </OverlayTrigger>
     );
   }