insomnia/packages/insomnia-app/app/ui/components/base/copy-button.js
2018-12-12 12:36:11 -05:00

74 lines
1.6 KiB
JavaScript

import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import autobind from 'autobind-decorator';
const { clipboard } = require('electron');
@autobind
class CopyButton extends PureComponent {
constructor(props) {
super(props);
this.state = {
showConfirmation: false,
};
}
async _handleClick(e) {
e.preventDefault();
e.stopPropagation();
const content =
typeof this.props.content === 'string' ? this.props.content : await this.props.content();
if (content) {
clipboard.writeText(content);
}
this.setState({ showConfirmation: true });
this._triggerTimeout = setTimeout(() => {
this.setState({ showConfirmation: false });
}, 2000);
}
componentWillUnmount() {
clearTimeout(this._triggerTimeout);
}
render() {
const {
content, // eslint-disable-line no-unused-vars
children,
title,
confirmMessage,
...other
} = this.props;
const { showConfirmation } = this.state;
const confirm = typeof confirmMessage === 'string' ? confirmMessage : 'Copied';
return (
<button {...other} title={title} onClick={this._handleClick}>
{showConfirmation ? (
<span>
{confirm} <i className="fa fa-check-circle-o" />
</span>
) : (
children || 'Copy to Clipboard'
)}
</button>
);
}
}
CopyButton.propTypes = {
// Required
content: PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.func.isRequired]).isRequired,
// Optional
children: PropTypes.node,
title: PropTypes.string,
confirmMessage: PropTypes.string,
};
export default CopyButton;