Add Duplicate Tab option (#8485)

* Add `Duplicate Tab` option

Adds an option to duplicate the current tab's setting/content into a new tab. Useful if you're iterating on a query.

* Add test
This commit is contained in:
Paul Vickers
2019-11-04 09:05:10 -08:00
committed by Erik Ritter
parent 51c22900db
commit 5df1fcb7bd
2 changed files with 18 additions and 0 deletions

View File

@@ -162,6 +162,14 @@ describe('TabbedSqlEditors', () => {
expect(wrapper.instance().props.actions.addQueryEditor.getCall(0).args[0].title)
.toContain('Untitled Query');
});
it('should duplicate query editor', () => {
wrapper = getWrapper();
sinon.stub(wrapper.instance().props.actions, 'cloneQueryToNewTab');
wrapper.instance().duplicateQueryEditor(queryEditors[0]);
expect(wrapper.instance().props.actions.cloneQueryToNewTab.getCall(0).args[0])
.toBe(queryEditors[0]);
});
it('should handle select', () => {
wrapper = getWrapper();
sinon.spy(wrapper.instance(), 'newQueryEditor');

View File

@@ -67,6 +67,7 @@ class TabbedSqlEditors extends React.PureComponent {
this.renameTab = this.renameTab.bind(this);
this.toggleLeftBar = this.toggleLeftBar.bind(this);
this.removeAllOtherQueryEditors = this.removeAllOtherQueryEditors.bind(this);
this.duplicateQueryEditor = this.duplicateQueryEditor.bind(this);
}
componentDidMount() {
const query = URI(window.location).search(true);
@@ -182,6 +183,9 @@ class TabbedSqlEditors extends React.PureComponent {
this.props.queryEditors
.forEach(qe => qe !== cqe && this.removeQueryEditor(qe));
}
duplicateQueryEditor(qe) {
this.props.actions.cloneQueryToNewTab(qe);
}
toggleLeftBar() {
this.setState({ hideLeftBar: !this.state.hideLeftBar });
}
@@ -236,6 +240,12 @@ class TabbedSqlEditors extends React.PureComponent {
</div>
{t('Close all other tabs')}
</MenuItem>
<MenuItem eventKey="5" onClick={() => this.duplicateQueryEditor(qe)}>
<div className="icon-container">
<i className="fa fa-files-o" />
</div>
{t('Duplicate tab')}
</MenuItem>
</SplitButton>
);
return (