From b0687493803eda0e8500a8223c2d34ec01b141ec Mon Sep 17 00:00:00 2001
From: "G.Ambatte" <sean@robertson-family.nz>
Date: Thu, 25 Jul 2024 22:11:14 +1200
Subject: [PATCH] Move copy ID to clipboard to separate button

---
 client/admin/lockTools/lockTools.jsx  |  7 +++++--
 client/admin/lockTools/lockTools.less | 10 +++++++++-
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/client/admin/lockTools/lockTools.jsx b/client/admin/lockTools/lockTools.jsx
index 31520b88c..b5c94399a 100644
--- a/client/admin/lockTools/lockTools.jsx
+++ b/client/admin/lockTools/lockTools.jsx
@@ -207,23 +207,26 @@ const LockTable = createClass({
 				{this.state.result[this.props.resultName] &&
 				<>
 					<p>Total Reviews Waiting: {this.state.result[this.props.resultName].length}</p>
-					<p>Click a row to copy the Share ID to the clipboard</p>
 					<table className='lockTable'>
 						<thead>
 							<tr>
 								{this.props.propertyNames.map((name, idx)=>{
 									return <th key={idx}>{name}</th>;
 								})}
+								<th>clip</th>
+								<th>view</th>
 							</tr>
 						</thead>
 						<tbody>
 							{this.state.result[this.props.resultName].map((result, resultIdx)=>{
-								return <tr key={`${resultIdx}-row`} onClick={()=>{navigator.clipboard.writeText(result.shareId.toString());}}>
+								return <tr className='row' key={`${resultIdx}-row`}>
 									{this.props.propertyNames.map((name, nameIdx)=>{
 										return <td key={`${resultIdx}-${nameIdx}`}>
 											{result[name].toString()}
 										</td>;
 									})}
+									<td className='icon' onClick={()=>{navigator.clipboard.writeText(result.shareId.toString());}}><i className='fa-regular fa-clipboard'></i></td>
+									<td className='icon'><i className='fa-regular fa-circle-right'></i></td>
 								</tr>;
 							})}
 						</tbody>
diff --git a/client/admin/lockTools/lockTools.less b/client/admin/lockTools/lockTools.less
index 82341eddb..5737a32e0 100644
--- a/client/admin/lockTools/lockTools.less
+++ b/client/admin/lockTools/lockTools.less
@@ -39,8 +39,16 @@
     }
 
     .lockTable{
-        td:hover {
+        cursor: default;
+        .row:hover {
+            background-color: #ccc;
+            color: #000;
+        }
+        .icon {
             cursor: pointer;
+            &:hover{
+                text-shadow: 0px 0px 6px black;
+            }
         }
     }