feat: add user management screen

feat: login screen

fix: login routing and layout

feat: add users migration

feat: passport login strategy

fix: users migration

feat: simple authentication

fix: request body

feat: JWT authorization

feat: 2fa step on login

feat: 2fa flow

feat: add rememberme to req body

fix: hide 2fa secret from jwt

fix: block login access to logged in user

fix: rerouting to wizard

refactor: login screen

feat: setup 2fa state on login

feat: 2fa secret qr code

fix: remove jwt from 2fa secret

fix: wizard redirect after login

fix: 2fa setup flow

fix: user id to uuid

feat: user roles

feat: user sessions and db persistence

feat: session saving on DB and cookie

refactor: unused code

feat: cookie auto renew on request

feat: get user data endpoint

fix: repeated requests

feat: react routing

fix: private routes

refactor: auth

feat: sessions aware of ua and ip

feat: sessions on gql

feat: session management screen

feat: replace user_tokens usage for users

feat: user deletion also deletes active sessions

feat: remember me alters session cookie accordingly

feat: last session by all users

fix: login feedback

fix: page loading UX

feat: routes based on user role

feat: header aware of roles

feat: reset password

fix: reset password endpoint

feat: handle password change

feat: reset 2FA

feat: user role on management screen

feat: change user role

fix: user last session query

fix: context

fix: destroy own session

feat: reset password now resets sessions

feat: reset 2fa now resets sessions

refactor: user data

refactor: user management screen

feat: user enable

feat: schema directives

fix: remove schema directive temp

feat: create new users

feat: register endpoint

feat: modals for reset links

fix: directive Date errors

feat: superuser directive

feat: create user url modal

fix: user management layout

feat: confirmation modals

fix: info text

feat: 2fa input component

feat: code input on 2fa state

feat: add button styling

feat: confirmation modal on superuser action

feat: rework 2fa setup screen

feat: rework reset 2fa screen

fix: session management screen

fix: user management screen

fix: blacklist roles

chore: migrate old customer values to new columns

fix: value migration

fix: value migration

refactor: remove old code

new-lamassu-admin/src/pages/Authentication/LoginState.js

@@ -0,0 +1,130 @@
+import { makeStyles } from '@material-ui/core/styles'
+import axios from 'axios'
+import React, { useState } from 'react'
+
+import { Button } from 'src/components/buttons'
+import { Checkbox, TextInput } from 'src/components/inputs/base'
+import { Label2, P } from 'src/components/typography'
+
+import styles from './Login.styles'
+
+const url =
+  process.env.NODE_ENV === 'development' ? 'https://localhost:8070' : ''
+
+const useStyles = makeStyles(styles)
+
+const LoginState = ({
+  clientField,
+  onClientChange,
+  passwordField,
+  onPasswordChange,
+  rememberMeField,
+  onRememberMeChange,
+  STATES,
+  handleLoginState
+}) => {
+  const classes = useStyles()
+
+  const [invalidLogin, setInvalidLogin] = useState(false)
+
+  const handleClientChange = event => {
+    onClientChange(event.target.value)
+    setInvalidLogin(false)
+  }
+
+  const handlePasswordChange = event => {
+    onPasswordChange(event.target.value)
+    setInvalidLogin(false)
+  }
+
+  const handleRememberMeChange = () => {
+    onRememberMeChange(!rememberMeField)
+  }
+
+  const handleLogin = () => {
+    axios({
+      method: 'POST',
+      url: `${url}/api/login`,
+      data: {
+        username: clientField,
+        password: passwordField,
+        rememberMe: rememberMeField
+      },
+      options: {
+        withCredentials: true
+      },
+      headers: {
+        'Content-Type': 'application/json'
+      }
+    })
+      .then((res, err) => {
+        if (err) return
+        if (res) {
+          const status = res.status
+          const message = res.data.message
+          if (status === 200 && message === 'INPUT2FA')
+            handleLoginState(STATES.INPUT_2FA)
+          if (status === 200 && message === 'SETUP2FA')
+            handleLoginState(STATES.SETUP_2FA)
+        }
+      })
+      .catch(err => {
+        if (err.response && err.response.data) {
+          if (err.response.status === 403) setInvalidLogin(true)
+        }
+      })
+  }
+
+  return (
+    <>
+      <Label2 className={classes.inputLabel}>Client</Label2>
+      <TextInput
+        className={classes.input}
+        error={invalidLogin}
+        name="client-name"
+        autoFocus
+        id="client-name"
+        type="text"
+        size="lg"
+        onChange={handleClientChange}
+        value={clientField}
+      />
+      <Label2 className={classes.inputLabel}>Password</Label2>
+      <TextInput
+        className={classes.input}
+        error={invalidLogin}
+        name="password"
+        id="password"
+        type="password"
+        size="lg"
+        onChange={handlePasswordChange}
+        value={passwordField}
+      />
+      <div className={classes.rememberMeWrapper}>
+        <Checkbox
+          className={classes.checkbox}
+          id="remember-me"
+          onChange={handleRememberMeChange}
+          value={rememberMeField}
+        />
+        <Label2 className={classes.inputLabel}>Keep me logged in</Label2>
+      </div>
+      <div className={classes.footer}>
+        {invalidLogin && (
+          <P className={classes.errorMessage}>
+            Invalid login/password combination.
+          </P>
+        )}
+        <Button
+          onClick={() => {
+            handleLogin()
+          }}
+          buttonClassName={classes.loginButton}>
+          Login
+        </Button>
+      </div>
+    </>
+  )
+}
+
+export default LoginState