From d547ea8b3acffa30fa44e0715661490d066bf580 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Mon, 15 Jun 2020 16:51:04 +0300
Subject: feat: create logIn function and get access token

---
 src/pages/AuthPage/SignInForm.tsx | 22 +++++++++-------------
 1 file changed, 9 insertions(+), 13 deletions(-)

(limited to 'src/pages/AuthPage/SignInForm.tsx')

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<PropTypes> = ({ setUser, navigate }) => {
+const SignInForm: React.FC<PropTypes> = ({ logIn, navigate }) => {
   const classes = useStyles();
-  const inputRef = useRef<HTMLInputElement>();
+  const nameRef = useRef<HTMLInputElement>();
+  const passwordRef = useRef<HTMLInputElement>();
 
   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 (
     <form className={classes.root} noValidate autoComplete="off">
       <h1>Sign In</h1>
-      <TextField inputRef={inputRef} id="standard-basic" label="Login" />
+      <TextField inputRef={nameRef} id="standard-basic" label="Login" />
       <TextField
+        inputRef={passwordRef}
         id="standard-password-input"
         label="Password"
         type="password"
-- 
cgit v1.2.3


From dd0c6babb832772cb017171476b2629ef00ee147 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Mon, 15 Jun 2020 17:27:11 +0300
Subject: feat: invalidate from on error

---
 src/pages/AuthPage/SignInForm.tsx | 28 ++++++++++++++++++----------
 1 file changed, 18 insertions(+), 10 deletions(-)

(limited to 'src/pages/AuthPage/SignInForm.tsx')

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<boolean>;
 }
 
 const useStyles = makeStyles(theme => ({
@@ -23,24 +20,34 @@ const useStyles = makeStyles(theme => ({
   }
 }));
 
-const SignInForm: React.FC<PropTypes> = ({ logIn, navigate }) => {
+const SignInForm: React.FC<PropTypes> = ({ logIn }) => {
+  const [error, setError] = useState<boolean>(false);
   const classes = useStyles();
   const nameRef = useRef<HTMLInputElement>();
   const passwordRef = useRef<HTMLInputElement>();
 
-  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 (
     <form className={classes.root} noValidate autoComplete="off">
       <h1>Sign In</h1>
-      <TextField inputRef={nameRef} id="standard-basic" label="Login" />
+      <TextField
+        inputRef={nameRef}
+        error={error}
+        label="Login"
+      />
       <TextField
         inputRef={passwordRef}
-        id="standard-password-input"
+        error={error}
+        helperText={error && 'Invalid credentials'}
         label="Password"
         type="password"
       />
@@ -50,3 +57,4 @@ const SignInForm: React.FC<PropTypes> = ({ logIn, navigate }) => {
 };
 
 export default SignInForm;
+
-- 
cgit v1.2.3

