From 57fab11316398dca09ebae7d3187a26dd1f64463 Mon Sep 17 00:00:00 2001
From: Minesh Mitha <minesh@Mineshs-MacBook-Pro.local>
Date: Tue, 9 Oct 2018 20:55:59 +0100
Subject: [PATCH] Click to copy to work with entire div including icon

---
 client/scss/click-to-copy/_click-to-copy.scss |  2 +-
 client/src/components/ClickToCopy/index.jsx   | 11 +++++++----
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/client/scss/click-to-copy/_click-to-copy.scss b/client/scss/click-to-copy/_click-to-copy.scss
index 3c6bd191..ee630eac 100644
--- a/client/scss/click-to-copy/_click-to-copy.scss
+++ b/client/scss/click-to-copy/_click-to-copy.scss
@@ -2,8 +2,8 @@
   display: flex;
   width: 100%;
   justify-content: space-between;
+  cursor: pointer;
   .click-to-copy {
-    cursor: pointer;
     border: none;
     padding: 0.5em;
     margin: 0;
diff --git a/client/src/components/ClickToCopy/index.jsx b/client/src/components/ClickToCopy/index.jsx
index 9c30d8be..832ce973 100644
--- a/client/src/components/ClickToCopy/index.jsx
+++ b/client/src/components/ClickToCopy/index.jsx
@@ -6,9 +6,10 @@ class ClickToCopy extends React.Component {
     super(props);
     this.copyToClipboard = this.copyToClipboard.bind(this);
   }
-  copyToClipboard (event) {
-    const elementToCopy = event.target.id;
+  copyToClipboard () {
+    const elementToCopy = this.props.id;
     const element = document.getElementById(elementToCopy);
+    console.log(elementToCopy);
     element.select();
     try {
       document.execCommand('copy');
@@ -19,11 +20,13 @@ class ClickToCopy extends React.Component {
   render () {
     const {id, value} = this.props;
     return (
-      <div className='click-to-copy-wrap'>
+      <div
+        className='click-to-copy-wrap'
+        onClick={this.copyToClipboard}
+      >
         <input
           id={id}
           value={value}
-          onClick={this.copyToClipboard}
           type='text'
           className='click-to-copy'
           readOnly