From f8c3947badd66efcc79a9f7d84c7da80946308a2 Mon Sep 17 00:00:00 2001
From: ta264 <ta264@users.noreply.github.com>
Date: Mon, 7 Sep 2020 21:05:01 +0100
Subject: [PATCH] ClipboardButton improvements

Allow overriding CSS, make it work in modals
---
 frontend/src/Components/Link/ClipboardButton.js | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/frontend/src/Components/Link/ClipboardButton.js b/frontend/src/Components/Link/ClipboardButton.js
index b85ab8af1..c2d2ef3a1 100644
--- a/frontend/src/Components/Link/ClipboardButton.js
+++ b/frontend/src/Components/Link/ClipboardButton.js
@@ -17,6 +17,7 @@ class ClipboardButton extends Component {
 
     this._id = getUniqueElememtId();
     this._successTimeout = null;
+    this._testResultTimeout = null;
 
     this.state = {
       showSuccess: false,
@@ -26,7 +27,8 @@ class ClipboardButton extends Component {
 
   componentDidMount() {
     this._clipboard = new Clipboard(`#${this._id}`, {
-      text: () => this.props.value
+      text: () => this.props.value,
+      container: document.getElementById(this._id)
     });
 
     this._clipboard.on('success', this.onSuccess);
@@ -47,6 +49,10 @@ class ClipboardButton extends Component {
     if (this._clipboard) {
       this._clipboard.destroy();
     }
+
+    if (this._testResultTimeout) {
+      clearTimeout(this._testResultTimeout);
+    }
   }
 
   //
@@ -80,6 +86,7 @@ class ClipboardButton extends Component {
   render() {
     const {
       value,
+      className,
       ...otherProps
     } = this.props;
 
@@ -95,7 +102,7 @@ class ClipboardButton extends Component {
     return (
       <FormInputButton
         id={this._id}
-        className={styles.button}
+        className={className}
         {...otherProps}
       >
         <span className={showStateIcon ? styles.showStateIcon : undefined}>
@@ -121,7 +128,12 @@ class ClipboardButton extends Component {
 }
 
 ClipboardButton.propTypes = {
+  className: PropTypes.string.isRequired,
   value: PropTypes.string.isRequired
 };
 
+ClipboardButton.defaultProps = {
+  className: styles.button
+};
+
 export default ClipboardButton;