From f66664a3e2b6d065dd5107c73e1282d9ae99cf5b Mon Sep 17 00:00:00 2001
From: "G.Ambatte" <sean@robertson-family.nz>
Date: Wed, 4 Jan 2023 22:49:38 +1300
Subject: [PATCH] Tabify Admin page, add Notification tab

---
 client/admin/admin.jsx                        | 22 ++++++++++++++++++-
 .../notificationUtils/notificationUtils.jsx   | 12 ++++++++++
 2 files changed, 33 insertions(+), 1 deletion(-)
 create mode 100644 client/admin/notificationUtils/notificationUtils.jsx

diff --git a/client/admin/admin.jsx b/client/admin/admin.jsx
index a84af6f44..f2ee241f2 100644
--- a/client/admin/admin.jsx
+++ b/client/admin/admin.jsx
@@ -3,12 +3,28 @@ const React = require('react');
 const createClass = require('create-react-class');
 
 const BrewUtils = require('./brewUtils/brewUtils.jsx');
+const NotificationUtils = require('./notificationUtils/notificationUtils.jsx');
+
+const tabGroups = ['brew', 'notifications'];
 
 const Admin = createClass({
 	getDefaultProps : function() {
 		return {};
 	},
 
+	getInitialState : function(){
+		return ({
+			currentTab : 'brew'
+		});
+	},
+
+	handleClick : function(newTab){
+		if(this.state.currentTab === newTab) return;
+		this.setState({
+			currentTab : newTab
+		});
+	},
+
 	render : function(){
 		return <div className='admin'>
 
@@ -19,7 +35,11 @@ const Admin = createClass({
 				</div>
 			</header>
 			<div className='container'>
-				<BrewUtils />
+				<div className='tabs'>
+					{tabGroups.map((tab)=>{ return <button onClick={()=>{ return this.handleClick(tab); }}>{tab.toUpperCase()}</button>; })}
+				</div>
+				{this.state.currentTab==='brew' && <BrewUtils />}
+				{this.state.currentTab==='notifications' && <NotificationUtils />}
 			</div>
 		</div>;
 	}
diff --git a/client/admin/notificationUtils/notificationUtils.jsx b/client/admin/notificationUtils/notificationUtils.jsx
new file mode 100644
index 000000000..9c7b4cbe3
--- /dev/null
+++ b/client/admin/notificationUtils/notificationUtils.jsx
@@ -0,0 +1,12 @@
+const React = require('react');
+const createClass = require('create-react-class');
+
+const NotificationUtils = createClass({
+	render : function(){
+		return <>
+			<div>Notifications</div>
+		</>;
+	}
+});
+
+module.exports = NotificationUtils;