diff --git a/bfrontend/src/Components/Auth/Create.js b/bfrontend/src/Components/Auth/Create.js new file mode 100644 index 0000000..e9e26d8 --- /dev/null +++ b/bfrontend/src/Components/Auth/Create.js @@ -0,0 +1,95 @@ +import { useState } from 'react'; +import { useHistory } from 'react-router-dom'; + +import Notification from '../UI/Notification'; +import APIRequest from '../../API/APIRequest'; +import { getSignupMessageFromError } from '../../Util/Errors' + +export default function Create() { + const history = useHistory(); + + const [ usernameInput, setUsernameInput ] = useState(); + const [ passwordInput, setPasswordInput ] = useState(); + const [ specialCodeInput, setSpecialCodeInput ] = useState(); + + const [ specialCodePrompt, setSpecialCodePrompt ] = useState(); + + const [ info, setInfo ] = useState(); + + const doCreateAccount = async () => { + const { json, isOK } = await APIRequest('/api/v1/users/account/create', { + method: 'POST', + headers: { + 'Accept': 'application/json', + 'Content-Type': 'application/json' + }, + body: JSON.stringify({ + username: usernameInput, + password: passwordInput, + email: "user@example.com", + specialCode: specialCodeInput + }) + }); + + if (!isOK && json) { + setInfo(getSignupMessageFromError(json)); + return; + } + if (!isOK) { + setInfo('Something went wrong'); + return; + } + + history.push('/login'); + }; + + const handleCreateContinueButton = async () => { + if (!usernameInput || !passwordInput) { + setInfo('One of more fields is not filled in.'); + return; + } + + const { json, isOK } = await APIRequest('/api/v1/users/account/create/info', { + method: 'GET', + headers: { + 'Accept': 'application/json', + } + }); + + if (!json || !isOK) return setInfo('Something went wrong'); + + setSpecialCodePrompt(json.requiresSpecialCode); + + if (!json.requiresSpecialCode) { + await doCreateAccount(); + } + } + + if (specialCodePrompt) return ( +
+

One more thing!

+

You need a special code to sign up here!

+ +
+ setSpecialCodeInput(target.value) } /> + + +
+ ); + + return ( +
+

Create an account

+ +
+ setUsernameInput(target.value) } /> +
+ +
+ setPasswordInput(target.value) } /> +
+ + +
+ ); +} \ No newline at end of file diff --git a/bfrontend/src/Components/Auth/Login.js b/bfrontend/src/Components/Auth/Login.js index 974f3d3..f842e92 100644 --- a/bfrontend/src/Components/Auth/Login.js +++ b/bfrontend/src/Components/Auth/Login.js @@ -50,6 +50,7 @@ export default function Login() { return (
+

Log in


setUsernameInput(target.value) } /> diff --git a/bfrontend/src/Components/Home/Root.js b/bfrontend/src/Components/Home/Root.js index 2c77a17..69e085f 100644 --- a/bfrontend/src/Components/Home/Root.js +++ b/bfrontend/src/Components/Home/Root.js @@ -8,8 +8,9 @@ export default function Root(props) { } else { return (
-

Welcome, - nevermind, you aren't logged in

- +

Welcome back!

+ +
); } diff --git a/bfrontend/src/Components/Main/App.js b/bfrontend/src/Components/Main/App.js index 5c8860d..911de28 100644 --- a/bfrontend/src/Components/Main/App.js +++ b/bfrontend/src/Components/Main/App.js @@ -1,4 +1,5 @@ import Login from '../Auth/Login'; +import Create from '../Auth/Create'; import Root from '../Home/Root'; import Authenticator from '../../API/Authenticator'; import Notification from '../UI/Notification'; @@ -34,6 +35,7 @@ function App({ user }) { + { return ( @@ -44,7 +46,7 @@ function App({ user }) { ); }} /> - + { user && }