Add login endpoint and generate a valid token

webapp/src/client.js

@@ -5,7 +5,13 @@ export class Client {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({ username, password })
-    }).then(r => r.text()).then(token => {
+    }).then(r => {
+      if (r.status === 200) {
+        return r.text()
+      }
+      console.error("INVALID")
+      throw new Error("invalid credentials")
+    }).then(token => {
       localStorage.setItem('token', token)
       return token
     })

webapp/src/pages/login.js

@@ -18,12 +18,17 @@ const Login = () => {
 
   const [username, setUsername] = useState("")
   const [password, setPassword] = useState("")
+  const [error, setError] = useState("")
 
   const handleSubmit = (e) => {
     e.preventDefault()
-    client.login(username, password).then(token => {
-      setToken(token)
-    })
+    client.login(username, password)
+      .then(token => {
+        setToken(token)
+      })
+      .catch(e => {
+        setError(e.toString())
+      })
   }
 
   const handleChange = (setFn) => {
@@ -52,6 +57,8 @@ const Login = () => {
         onChange={handleChange(setPassword)}
       />
 
+      {error !== "" && <p style={{color: 'red'}}>{error}</p>}
+
       <Button variant="contained" color="primary" onClick={handleSubmit}>Login</Button>
     </Box>
   )