fix: add 'Copied!' feedback to copy-to-clipboard button

src/core/components/copy-to-clipboard-btn.jsx

@@ -8,15 +8,35 @@ import PropTypes from "prop-types"
  * @constructor
  */
 export default class CopyToClipboardBtn extends React.Component {
+  constructor(props) {
+    super(props)
+    this.state = { copied: false }
+    this.handleCopy = this.handleCopy.bind(this)
+  }
+
+  handleCopy() {
+    this.setState({ copied: true })
+    this._timer = setTimeout(() => {
+      this.setState({ copied: false })
+    }, 2000)
+  }
+
+  componentWillUnmount() {
+    if (this._timer) {
+      clearTimeout(this._timer)
+    }
+  }
+
   render() {
     let { getComponent } = this.props
+    const { copied } = this.state
 
     const CopyIcon = getComponent("CopyIcon")
 
     return (
-      <div className="view-line-link copy-to-clipboard" title="Copy to clipboard">
-        <CopyToClipboard text={this.props.textToCopy}>
-          <CopyIcon />
+      <div className="view-line-link copy-to-clipboard" title={copied ? "Copied!" : "Copy to clipboard"}>
+        <CopyToClipboard text={this.props.textToCopy} onCopy={this.handleCopy}>
+          {copied ? <span className="copy-to-clipboard__copied">Copied!</span> : <CopyIcon />}
         </CopyToClipboard>
       </div>
     )

src/style/_buttons.scss

@@ -197,3 +197,10 @@ button {
   height: 26px;
   position: unset;
 }
+
+.copy-to-clipboard__copied {
+  color: #fff;
+  font-size: 11px;
+  font-weight: 600;
+  user-select: none;
+}