Make entire menuitem clickable for copy query (#1747)

This commit is contained in:
vera-liu 2016-12-05 10:02:23 -08:00 committed by GitHub
parent 76aa9f7e10
commit 89fc9d7c80
3 changed files with 15 additions and 11 deletions

View File

@ -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}
/>

View File

@ -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" />

View File

@ -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>
);
}