diff --git a/twistter-frontend/src/pages/user.js b/twistter-frontend/src/pages/user.js
index 63a418a..3340b47 100644
--- a/twistter-frontend/src/pages/user.js
+++ b/twistter-frontend/src/pages/user.js
@@ -102,6 +102,7 @@ class user extends Component {
render() {
let authenticated = this.props.user.authenticated;
let classes = this.props;
+
let profileMarkup = this.state.profile ? (
@{this.state.profile} {this.state.verified ? (): (null)}
@@ -169,7 +170,36 @@ class user extends Component {
onClick={this.handleAddCircle}
/>
- {authenticated && }
+
+
+ {
+ authenticated &&
+ }
+
+
+ {
+ authenticated &&
+ this.state.profile === 'Admin' &&
+ }
+
+
{postMarkup}
diff --git a/twistter-frontend/src/pages/verify.js b/twistter-frontend/src/pages/verify.js
new file mode 100644
index 0000000..b0c6583
--- /dev/null
+++ b/twistter-frontend/src/pages/verify.js
@@ -0,0 +1,153 @@
+import React, { Component } from "react";
+import axios from "axios";
+import PropTypes from "prop-types";
+// TODO: Add a read-only '@' in the left side of the handle input
+// TODO: Add a cancel button, that takes the user back to their profile page
+
+// Material-UI stuff
+import Button from "@material-ui/core/Button";
+import { Link } from 'react-router-dom';
+import CircularProgress from "@material-ui/core/CircularProgress";
+import Grid from "@material-ui/core/Grid";
+import TextField from "@material-ui/core/TextField";
+import Typography from "@material-ui/core/Typography";
+import withStyles from "@material-ui/core/styles/withStyles";
+
+const styles = {
+ form: {
+ textAlign: "center"
+ },
+ textField: {
+ marginBottom: 30
+ },
+ pageTitle: {
+ // marginTop: 20,
+ marginBottom: 40
+ },
+ button: {
+ positon: "relative",
+ marginBottom: 10
+ },
+ progress: {
+ position: "absolute"
+ }
+};
+
+export class verify extends Component {
+
+ // Constructor for the state
+ constructor() {
+ super();
+ this.state = {
+ handle: "",
+ loading: false,
+ errors: {}
+ };
+ }
+
+// // Runs whenever the submit button is clicked.
+ handleSubmit = (event) => {
+ event.preventDefault();
+ this.setState({
+ loading: true
+ });
+ const verifyHandle = {
+ user: this.state.handle
+ };
+
+ axios
+ .post("/verifyUser", verifyHandle)
+ .then((res) => {
+ console.log(res);
+ this.setState({
+ loading: false
+ });
+ // this.props.history.push('/');
+ // TODO: Need to redirect user to their profile page
+ })
+ .catch((err) => {
+ console.log(err);
+ this.setState({
+ errors: err.response.data,
+ loading: false
+ });
+ });
+ };
+
+ // Updates the state whenever one of the textboxes changes.
+ // The key is the name of the textbox and the value is the
+ // value in the text box.
+ // Also sets errors to null of textboxes that have been edited
+ handleChange = (event) => {
+ this.setState({
+ [event.target.name]: event.target.value,
+ errors: {
+ [event.target.name]: null
+ }
+ });
+ };
+
+ render() {
+ const { classes } = this.props;
+ const { errors, loading } = this.state;
+
+ return (
+
+
+
+
+ Verify Users
+
+
+
+
+
+ );
+ }
+}
+
+verify.propTypes = {
+ classes: PropTypes.object.isRequired
+};
+
+export default withStyles(styles)(verify);