From 7830c7e2eb6bd0fc4e6af5cdac23eee4e5cfc15a Mon Sep 17 00:00:00 2001
From: "G.Ambatte" <sean@robertson-family.nz>
Date: Sat, 8 Jun 2024 19:59:01 +1200
Subject: [PATCH] Add divs for styling of brewsAwaitingReview

---
 client/admin/lockTools/lockTools.jsx | 65 +++++++++++++++-------------
 1 file changed, 36 insertions(+), 29 deletions(-)

diff --git a/client/admin/lockTools/lockTools.jsx b/client/admin/lockTools/lockTools.jsx
index 58829eacf..7f92cdd0e 100644
--- a/client/admin/lockTools/lockTools.jsx
+++ b/client/admin/lockTools/lockTools.jsx
@@ -174,35 +174,42 @@ const LockTable = createClass({
 
 	render : function () {
 		return <>
-			<h2>{this.props.title}</h2>
-			<button onClick={this.clickFn}>
-				<i className={`fas ${!this.state.searching ? 'fa-search' : 'fa-spin fa-spinner'}`} />
-			</button>
-			{this.state.result[this.props.resultName] &&
-            <>
-            	<p>Total Reviews Waiting: {this.state.result[this.props.resultName].length}</p>
-            	<table className='lockTable'>
-            		<thead>
-            			<tr>
-            				{this.props.propertyNames.map((name, idx)=>{
-            					return <th key={idx}>{name}</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());}}>
-            					{this.props.propertyNames.map((name, nameIdx)=>{
-                				return <td key={`${resultIdx}-${nameIdx}`}>
-            							{result[name].toString()}
-            						</td>;
-                			})}
-            				</tr>;
-            			})}
-                	</tbody>
-            	</table>
-            </>
-			}
+			<div className='brewsAwaitingReview'>
+				<div className='brewBlock'>
+					<h2>{this.props.title}</h2>
+					<button onClick={this.clickFn}>
+						REFRESH
+						<i className={`fas ${!this.state.searching ? 'fa-search' : 'fa-spin fa-spinner'}`} />
+					</button>
+				</div>
+				{this.state.result[this.props.resultName] &&
+				<>
+					<p>Total Reviews Waiting: {this.state.result[this.props.resultName].length}</p>
+					<hr />
+					<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>;
+								})}
+							</tr>
+						</thead>
+						<tbody>
+							{this.state.result[this.props.resultName].map((result, resultIdx)=>{
+								return <tr key={`${resultIdx}-row`} onClick={()=>{navigator.clipboard.writeText(result.shareId.toString());}}>
+									{this.props.propertyNames.map((name, nameIdx)=>{
+										return <td key={`${resultIdx}-${nameIdx}`}>
+											{result[name].toString()}
+										</td>;
+									})}
+								</tr>;
+							})}
+						</tbody>
+					</table>
+				</>
+				}
+			</div>
 		</>;
 	}
 });