From 5ba6455b2aa6c75c336628bda59e70b46e3b1d6b Mon Sep 17 00:00:00 2001 From: eug-vs Date: Fri, 7 Aug 2020 22:42:50 +0300 Subject: refactor: separate Auth pages --- src/pages/RegistrationPage/RegistrationPage.tsx | 75 +++++++++++++++++++++++++ 1 file changed, 75 insertions(+) create mode 100644 src/pages/RegistrationPage/RegistrationPage.tsx (limited to 'src/pages/RegistrationPage') diff --git a/src/pages/RegistrationPage/RegistrationPage.tsx b/src/pages/RegistrationPage/RegistrationPage.tsx new file mode 100644 index 0000000..e283a0e --- /dev/null +++ b/src/pages/RegistrationPage/RegistrationPage.tsx @@ -0,0 +1,75 @@ +import React, { useState, useRef } from 'react'; +import { makeStyles } from '@material-ui/core/styles'; +import TextField from '@material-ui/core/TextField'; +import Button from '@material-ui/core/Button'; +import { post } from '../../requests'; +import { useAuth } from '../../hooks/useAuth'; +import { useNavigate } from '../../hooks/useNavigate'; + + +const useStyles = makeStyles(theme => ({ + root: { + '& > *': { + margin: theme.spacing(1), + width: theme.spacing(35) + }, + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + textAlign: 'center' + }, + formHeader: { + textAlign: 'center', + fontSize: 25 + } +})); + +const RegistrationPage: React.FC = () => { + const [error, setError] = useState(false); + const classes = useStyles(); + const usernameRef = useRef(); + const emailRef = useRef(); + const passwordRef = useRef(); + const { login } = useAuth(); + const { navigate } = useNavigate(); + + const onClick = () => { + const username = usernameRef.current?.value; + const password = passwordRef.current?.value; + const email = emailRef.current?.value; + if (username && password) { + post('/users', { username, password, email }) + .then(() => login(username, password)) + .then(() => navigate('profile')); + } else setError(true); + }; + + // TODO: add login redirect + + return ( + <> +
Sign Up
+
+ + + + + + + ); +}; + +export default RegistrationPage; -- cgit v1.2.3 From 6a0b6ec911c39989a1af4322e2a32d75fddbb274 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Sat, 8 Aug 2020 09:42:16 +0300 Subject: feat: complete router navigation --- src/pages/RegistrationPage/RegistrationPage.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'src/pages/RegistrationPage') diff --git a/src/pages/RegistrationPage/RegistrationPage.tsx b/src/pages/RegistrationPage/RegistrationPage.tsx index e283a0e..9e081ca 100644 --- a/src/pages/RegistrationPage/RegistrationPage.tsx +++ b/src/pages/RegistrationPage/RegistrationPage.tsx @@ -1,10 +1,10 @@ import React, { useState, useRef } from 'react'; +import { useHistory } from 'react-router-dom'; import { makeStyles } from '@material-ui/core/styles'; import TextField from '@material-ui/core/TextField'; import Button from '@material-ui/core/Button'; import { post } from '../../requests'; import { useAuth } from '../../hooks/useAuth'; -import { useNavigate } from '../../hooks/useNavigate'; const useStyles = makeStyles(theme => ({ @@ -31,7 +31,7 @@ const RegistrationPage: React.FC = () => { const emailRef = useRef(); const passwordRef = useRef(); const { login } = useAuth(); - const { navigate } = useNavigate(); + const history = useHistory(); const onClick = () => { const username = usernameRef.current?.value; @@ -40,7 +40,7 @@ const RegistrationPage: React.FC = () => { if (username && password) { post('/users', { username, password, email }) .then(() => login(username, password)) - .then(() => navigate('profile')); + .then(() => history.push(`/profile/${username}`)); } else setError(true); }; -- cgit v1.2.3 From f55374d5328f672dbce47e8d452ce17d02ced9f8 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Sat, 8 Aug 2020 11:13:00 +0300 Subject: feat: add redirect tips to auth pages --- src/pages/RegistrationPage/RegistrationPage.tsx | 27 ++++++++++++++++++++++--- 1 file changed, 24 insertions(+), 3 deletions(-) (limited to 'src/pages/RegistrationPage') diff --git a/src/pages/RegistrationPage/RegistrationPage.tsx b/src/pages/RegistrationPage/RegistrationPage.tsx index 9e081ca..8936c2d 100644 --- a/src/pages/RegistrationPage/RegistrationPage.tsx +++ b/src/pages/RegistrationPage/RegistrationPage.tsx @@ -21,6 +21,15 @@ const useStyles = makeStyles(theme => ({ formHeader: { textAlign: 'center', fontSize: 25 + }, + formTransfer: { + display: 'flex', + justifyContent: 'center' + }, + transferButton: { + marginLeft: 10, + color: 'green', + cursor: 'pointer' } })); @@ -33,7 +42,7 @@ const RegistrationPage: React.FC = () => { const { login } = useAuth(); const history = useHistory(); - const onClick = () => { + const handleSubmit = () => { const username = usernameRef.current?.value; const password = passwordRef.current?.value; const email = emailRef.current?.value; @@ -44,7 +53,9 @@ const RegistrationPage: React.FC = () => { } else setError(true); }; - // TODO: add login redirect + const handleLogin = () => { + history.push('/login'); + }; return ( <> @@ -66,8 +77,18 @@ const RegistrationPage: React.FC = () => { error={error} helperText={error && 'This field is required!'} /> - + +
+
{'Already have an account?'}
+ + Log in + +
); }; -- cgit v1.2.3 From f0a53feb38c5bbec8a94bbf4440a1ce184876013 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Sat, 8 Aug 2020 11:23:13 +0300 Subject: feat: lowercase all username inputs --- src/pages/RegistrationPage/RegistrationPage.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/pages/RegistrationPage') diff --git a/src/pages/RegistrationPage/RegistrationPage.tsx b/src/pages/RegistrationPage/RegistrationPage.tsx index 8936c2d..829211d 100644 --- a/src/pages/RegistrationPage/RegistrationPage.tsx +++ b/src/pages/RegistrationPage/RegistrationPage.tsx @@ -43,7 +43,7 @@ const RegistrationPage: React.FC = () => { const history = useHistory(); const handleSubmit = () => { - const username = usernameRef.current?.value; + const username = usernameRef.current?.value?.toLowerCase(); const password = passwordRef.current?.value; const email = emailRef.current?.value; if (username && password) { -- cgit v1.2.3 From 104c658fc411536e09931191721411de448f964f Mon Sep 17 00:00:00 2001 From: eug-vs Date: Sat, 8 Aug 2020 11:24:49 +0300 Subject: fix: remove unnecessary curlybrackets --- src/pages/RegistrationPage/RegistrationPage.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/pages/RegistrationPage') diff --git a/src/pages/RegistrationPage/RegistrationPage.tsx b/src/pages/RegistrationPage/RegistrationPage.tsx index 829211d..18a9379 100644 --- a/src/pages/RegistrationPage/RegistrationPage.tsx +++ b/src/pages/RegistrationPage/RegistrationPage.tsx @@ -80,7 +80,7 @@ const RegistrationPage: React.FC = () => {
-
{'Already have an account?'}
+
Already have an account?