aboutsummaryrefslogtreecommitdiff
path: root/src/pages/AuthPage
diff options
context:
space:
mode:
Diffstat (limited to 'src/pages/AuthPage')
-rw-r--r--src/pages/AuthPage/AuthPage.tsx11
-rw-r--r--src/pages/AuthPage/SignInForm.tsx15
-rw-r--r--src/pages/AuthPage/SignUpForm.tsx15
3 files changed, 19 insertions, 22 deletions
diff --git a/src/pages/AuthPage/AuthPage.tsx b/src/pages/AuthPage/AuthPage.tsx
index d2c2eec..ad93463 100644
--- a/src/pages/AuthPage/AuthPage.tsx
+++ b/src/pages/AuthPage/AuthPage.tsx
@@ -3,11 +3,6 @@ import { makeStyles } from '@material-ui/core/styles';
import SignInForm from './SignInForm';
import SignUpForm from './SignUpForm';
-
-interface PropTypes {
- logIn: (name: string, password: string, remember?: boolean) => Promise<boolean>;
-}
-
const useStyles = makeStyles({
formTransfer: {
display: 'flex',
@@ -20,7 +15,7 @@ const useStyles = makeStyles({
}
});
-const AuthPage: React.FC<PropTypes> = ({ logIn }) => {
+const AuthPage: React.FC = () => {
const [auth, setAuth] = useState<'signIn' | 'signUp'>('signIn');
const classes = useStyles();
@@ -35,8 +30,8 @@ const AuthPage: React.FC<PropTypes> = ({ logIn }) => {
return (
<>
- {auth === 'signIn' && <SignInForm logIn={logIn} />}
- {auth === 'signUp' && <SignUpForm logIn={logIn} />}
+ {auth === 'signIn' && <SignInForm />}
+ {auth === 'signUp' && <SignUpForm />}
<div className={classes.formTransfer}>
<div>{footerInfo[auth][0]}</div>
<span
diff --git a/src/pages/AuthPage/SignInForm.tsx b/src/pages/AuthPage/SignInForm.tsx
index 1dad153..e68483b 100644
--- a/src/pages/AuthPage/SignInForm.tsx
+++ b/src/pages/AuthPage/SignInForm.tsx
@@ -6,10 +6,8 @@ import {
FormControlLabel,
Switch
} from '@material-ui/core';
-
-interface PropTypes {
- logIn: (name: string, password: string, remember?: boolean) => Promise<boolean>;
-}
+import { useAuth } from '../../hooks/useAuth';
+import { useNavigate } from '../../hooks/useNavigate';
const useStyles = makeStyles(theme => ({
root: {
@@ -28,12 +26,14 @@ const useStyles = makeStyles(theme => ({
}
}));
-const SignInForm: React.FC<PropTypes> = ({ logIn }) => {
+const SignInForm: React.FC = () => {
const [error, setError] = useState<boolean>(false);
const [remember, setRemember] = useState<boolean>(true);
const classes = useStyles();
const nameRef = useRef<HTMLInputElement>();
const passwordRef = useRef<HTMLInputElement>();
+ const { login } = useAuth();
+ const { navigate } = useNavigate();
const handleCheck = () => {
setRemember(!remember);
@@ -43,8 +43,9 @@ const SignInForm: React.FC<PropTypes> = ({ logIn }) => {
const name = nameRef.current?.value;
const password = passwordRef.current?.value;
if (name && password) {
- logIn(name, password, remember).then(success => {
- if (!success) setError(true);
+ login(name, password, remember).then(success => {
+ if (success) navigate('profile');
+ else setError(true);
});
}
};
diff --git a/src/pages/AuthPage/SignUpForm.tsx b/src/pages/AuthPage/SignUpForm.tsx
index 25b79ff..1dacd45 100644
--- a/src/pages/AuthPage/SignUpForm.tsx
+++ b/src/pages/AuthPage/SignUpForm.tsx
@@ -3,10 +3,9 @@ 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';
-interface PropTypes {
- logIn: (name: string, password: string) => Promise<boolean>;
-}
const useStyles = makeStyles(theme => ({
root: {
@@ -25,21 +24,23 @@ const useStyles = makeStyles(theme => ({
}
}));
-const SignUpForm: React.FC<PropTypes> = ({ logIn }) => {
+const SignUpForm: React.FC = () => {
const [error, setError] = useState<boolean>(false);
const classes = useStyles();
const usernameRef = useRef<HTMLInputElement>();
const emailRef = useRef<HTMLInputElement>();
const passwordRef = useRef<HTMLInputElement>();
+ 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);
- });
+ post('/users', { username, password, email })
+ .then(() => login(username, password))
+ .then(() => navigate('profile'));
} else setError(true);
};