From d547ea8b3acffa30fa44e0715661490d066bf580 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Mon, 15 Jun 2020 16:51:04 +0300 Subject: feat: create logIn function and get access token --- src/pages/AuthPage/AuthPage.tsx | 6 +++--- src/pages/AuthPage/SignInForm.tsx | 22 +++++++++------------- 2 files changed, 12 insertions(+), 16 deletions(-) (limited to 'src/pages/AuthPage') diff --git a/src/pages/AuthPage/AuthPage.tsx b/src/pages/AuthPage/AuthPage.tsx index 82d468d..b694c5d 100644 --- a/src/pages/AuthPage/AuthPage.tsx +++ b/src/pages/AuthPage/AuthPage.tsx @@ -3,12 +3,12 @@ import { User } from '../../types'; import SignInForm from './SignInForm'; interface PropTypes { - setUser: (newUser: User | undefined) => void; + logIn: (name: string, password: string) => void; navigate: (prefix: string, id: string) => void; } -const AuthPage: React.FC = ({ setUser, navigate }) => { - return ; +const AuthPage: React.FC = ({ logIn, navigate }) => { + return ; }; export default AuthPage; diff --git a/src/pages/AuthPage/SignInForm.tsx b/src/pages/AuthPage/SignInForm.tsx index b7696e7..a83af57 100644 --- a/src/pages/AuthPage/SignInForm.tsx +++ b/src/pages/AuthPage/SignInForm.tsx @@ -6,7 +6,7 @@ import { User } from '../../types'; import { get } from '../../requests'; interface PropTypes { - setUser: (newUser: User) => void; + logIn: (name: string, password: string) => void; navigate: (prefix: string, id: string) => void; } @@ -23,27 +23,23 @@ const useStyles = makeStyles(theme => ({ } })); -const SignInForm: React.FC = ({ setUser, navigate }) => { +const SignInForm: React.FC = ({ logIn, navigate }) => { const classes = useStyles(); - const inputRef = useRef(); + const nameRef = useRef(); + const passwordRef = useRef(); const onClick = () => { - const username = inputRef.current?.value; - if (username) { - get(`/users?name=${username}`).then(response => { - const user = response.data[0]; - setUser(user); - localStorage.setItem('userId', user._id); - navigate('profile', user._id); - }); - } + const name = nameRef.current?.value; + const password = passwordRef.current?.value; + if (name && password) logIn(name, password); }; return (

Sign In

- + Date: Mon, 15 Jun 2020 17:27:11 +0300 Subject: feat: invalidate from on error --- src/pages/AuthPage/AuthPage.tsx | 8 +++----- src/pages/AuthPage/SignInForm.tsx | 28 ++++++++++++++++++---------- 2 files changed, 21 insertions(+), 15 deletions(-) (limited to 'src/pages/AuthPage') diff --git a/src/pages/AuthPage/AuthPage.tsx b/src/pages/AuthPage/AuthPage.tsx index b694c5d..72733f0 100644 --- a/src/pages/AuthPage/AuthPage.tsx +++ b/src/pages/AuthPage/AuthPage.tsx @@ -1,14 +1,12 @@ import React from 'react'; -import { User } from '../../types'; import SignInForm from './SignInForm'; interface PropTypes { - logIn: (name: string, password: string) => void; - navigate: (prefix: string, id: string) => void; + logIn: (name: string, password: string) => Promise; } -const AuthPage: React.FC = ({ logIn, navigate }) => { - return ; +const AuthPage: React.FC = ({ logIn }) => { + return ; }; export default AuthPage; diff --git a/src/pages/AuthPage/SignInForm.tsx b/src/pages/AuthPage/SignInForm.tsx index a83af57..1d4ce0e 100644 --- a/src/pages/AuthPage/SignInForm.tsx +++ b/src/pages/AuthPage/SignInForm.tsx @@ -1,13 +1,10 @@ -import React, { useRef } from 'react'; +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 { User } from '../../types'; -import { get } from '../../requests'; interface PropTypes { - logIn: (name: string, password: string) => void; - navigate: (prefix: string, id: string) => void; + logIn: (name: string, password: string) => Promise; } const useStyles = makeStyles(theme => ({ @@ -23,24 +20,34 @@ const useStyles = makeStyles(theme => ({ } })); -const SignInForm: React.FC = ({ logIn, navigate }) => { +const SignInForm: React.FC = ({ logIn }) => { + const [error, setError] = useState(false); const classes = useStyles(); const nameRef = useRef(); const passwordRef = useRef(); - const onClick = () => { + const onClick = async () => { const name = nameRef.current?.value; const password = passwordRef.current?.value; - if (name && password) logIn(name, password); + if (name && password) { + logIn(name, password).then(success => { + if (!success) setError(true); + }); + } }; return (

Sign In

- + @@ -50,3 +57,4 @@ const SignInForm: React.FC = ({ logIn, navigate }) => { }; export default SignInForm; + -- cgit v1.2.3