Implemented username reserve feature

client/components/app.jsx

@@ -43,6 +43,7 @@ const App = props => {
 					<LazyRoute path='/signup' component={() => import('./pages/signup')} />
 					<LazyRoute path='/login' component={() => import('./pages/login')} />
 					<LazyRoute path='/account' component={() => import('./pages/account')} />
+					<LazyRoute path='/chat' component={() => import('./pages/chat')} />
 
 					<LazyRoute path='/admin' component={() => import('./pages/admin')} />
 

client/components/pages/chat.jsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import { Redirect } from 'react-router-dom';
+import { useCookies } from 'react-cookie';
+
+import Chat from '../panels/chat';
+
+//Temporary chat page
+const ChatPage = props => {
+	const [cookies, setCookie] = useCookies();
+
+	//check for logged in redirect
+	if (!cookies['loggedin']) {
+		return <Redirect to='/' />;
+	}
+
+	return (
+		<div className='page'>
+			<Chat uri={process.env.CHAT_URI} />
+		</div>
+	);
+};
+
+export default ChatPage;

client/components/pages/homepage.jsx

@@ -3,7 +3,6 @@ import React from 'react';
 import NewsFeed from '../panels/news-feed';
 
 const HomePage = props => {
-	//TODO: move the URIs into the config files
 	return (
 		<div className='page'>
 			<p>This is the MERN template homepage.</p>

client/components/panels/chat.jsx

@@ -0,0 +1,32 @@
+import React from 'react';
+import { useCookies } from 'react-cookie';
+
+const Chat = props => {
+	requestPseudonym();
+
+	return (
+		<div className='chat'>
+			<p>Chat URI: {props.uri}</p>
+			<p>Chat Paragraph TODO</p>
+		</div>
+	);
+};
+
+const requestPseudonym = () => {
+	const [cookies, setCookie] = useCookies();
+
+	//if your username hasn't been reserved
+	if (!cookies['pseudonym']) {
+		fetch('/api/chat/reserve', { method: 'POST' })
+			.then(msg => msg.json())
+			.then(json => {
+				if (!json.ok) { //I don't like doing this
+					console.error(json.error);
+				}
+			})
+			.catch(e => console.error(e))
+		;
+	}
+};
+
+export default Chat;