Use token var instead of signedIn or user

src/components/SignInForm/index.jsx

@@ -1,7 +1,6 @@
 import React, { useRef } from 'react';
 import { Link as RouterLink } from 'react-router-dom';
-import { Avatar, Button, Container, CssBaseline, Grid, Link, TextField, Typography } from '@material-ui/core';
-import LockOutlinedIcon from '@material-ui/icons/LockOutlined';
+import { Button, Container, CssBaseline, Grid, Link, TextField, Typography } from '@material-ui/core';
 import { useUserContext }  from '../Contexts/UserContext';
 import useStyles from '../Styles';
 
@@ -16,8 +15,10 @@ export default function SignInForm() {
         const username = emailEl.current.value;
         const password = passwordEl.current.value;
         const result = await signIn(username, password);
+        debugger;
       }
       catch (e) {
+        debugger;
         setError(e.message);
       }
     };
@@ -26,9 +27,6 @@ export default function SignInForm() {
       <Container component="main" maxWidth="xs">
         <CssBaseline />
         <div className={classes.paper}>
-          <Avatar className={classes.avatar}>
-            <LockOutlinedIcon />
-          </Avatar>
           <Typography component="h1" variant="h5">
             Sign in
           </Typography>
@@ -66,7 +64,7 @@ export default function SignInForm() {
               className={classes.submit}
               onClick={onSubmit}
             >
-              Sign In
+              { fetching ? "Signing In..." : "Sign In" }
             </Button>
             <Grid container>
               <Grid item>