Added in the admin page

client/admin/admin.jsx

@@ -0,0 +1,38 @@
+var React = require('react');
+var _ = require('lodash');
+var cx = require('classnames');
+
+var HomebrewAdmin = require('./homebrewAdmin/homebrewAdmin.jsx');
+
+var Admin = React.createClass({
+	getDefaultProps: function() {
+		return {
+			url : "",
+			admin_key : "",
+			homebrews : [],
+		};
+	},
+
+	render : function(){
+		var self = this;
+		return(
+			<div className='admin'>
+
+				<header>
+					<div className='container'>
+						<i className='fa fa-rocket' />
+						naturalcrit admin
+					</div>
+				</header>
+
+				<div className='container'>
+					<HomebrewAdmin homebrews={this.props.homebrews} admin_key={this.props.admin_key} />
+				</div>
+
+
+			</div>
+		);
+	}
+});
+
+module.exports = Admin;

client/admin/admin.less

@@ -0,0 +1,39 @@
+@import 'naturalCrit/styles/reset.less';
+@import 'naturalCrit/styles/elements.less';
+@import 'naturalCrit/styles/animations.less';
+@import 'naturalCrit/styles/colors.less';
+@import 'naturalCrit/styles/tooltip.less';
+
+@import 'font-awesome/css/font-awesome.css';
+
+html,body, #reactContainer, .naturalCrit{
+	min-height : 100%;
+}
+
+@sidebarWidth : 250px;
+
+body{
+	background-color : #eee;
+	font-family      : 'Open Sans', sans-serif;
+	color            : #4b5055;
+	font-weight      : 100;
+	text-rendering   : optimizeLegibility;
+	margin           : 0;
+	padding          : 0;
+	height : 100%;
+}
+
+.admin{
+
+	header{
+		background-color : @red;
+		font-size: 2em;
+		padding : 20px 0px;
+		color : white;
+		margin-bottom: 30px;
+		i{
+			margin-right: 30px;
+		}
+	}
+
+}

client/admin/homebrewAdmin/homebrewAdmin.jsx

@@ -0,0 +1,58 @@
+var React = require('react');
+var _ = require('lodash');
+var cx = require('classnames');
+
+var Moment = require('moment')
+
+var HomebrewAdmin = React.createClass({
+
+	getDefaultProps: function() {
+		return {
+			homebrews : [],
+			admin_key : ''
+		};
+	},
+
+	renderBrews : function(){
+		return _.map(this.props.homebrews, (brew)=>{
+			return <tr className={cx('brewRow', {'isEmpty' : brew.text == ""})} key={brew.sharedId}>
+
+				<td>{brew.editId}</td>
+				<td>{Moment(brew.createdAt).fromNow()}</td>
+				<td>{Moment(brew.updatedAt).fromNow()}</td>
+				<td>{Moment(brew.lastViewed).fromNow()}</td>
+				<td>{brew.views}</td>
+
+				<td><a target="_blank" href={'/homebrew/share/' + brew.shareId}>view</a></td>
+				<td><a href={'/homebrew/remove/' + brew.editId +'?admin_key=' + this.props.admin_key}><i className='fa fa-trash' /></a></td>
+			</tr>
+
+		})
+	},
+
+	render : function(){
+		var self = this;
+		return(
+			<div className='homebrewAdmin'>
+				<h2>Homebrews - {this.props.homebrews.length}</h2>
+				<table>
+					<thead>
+						<tr>
+							<th>Edit Id</th>
+							<th>Created At</th>
+							<th>Last Updated</th>
+							<th>Last Viewed</th>
+							<th>Number of Views</th>
+							<th>Preview</th>
+						</tr>
+					</thead>
+					<tbody>
+						{this.renderBrews()}
+					</tbody>
+				</table>
+			</div>
+		);
+	}
+});
+
+module.exports = HomebrewAdmin;

client/admin/homebrewAdmin/homebrewAdmin.less

@@ -0,0 +1,24 @@
+.homebrewAdmin{
+
+	table{
+		max-height: 800px;
+		overflow-y: scroll;
+		th{
+			font-weight: 800;
+			padding: 10px;
+		}
+
+		tr:nth-child(even){
+			background-color: fade(@green, 10%);
+		}
+		tr.isEmpty{
+			background-color: fade(@red, 30%);
+		}
+		td{
+			min-width: 100px;
+			text-align: center;
+			padding: 10px;
+		}
+	}
+
+}