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/UserManagement/modals/CreateUserModal.js

@@ -0,0 +1,156 @@
+import { makeStyles } from '@material-ui/core/styles'
+import axios from 'axios'
+import React, { useState } from 'react'
+
+import Modal from 'src/components/Modal'
+import { Button } from 'src/components/buttons'
+import { RadioGroup } from 'src/components/inputs'
+import { TextInput } from 'src/components/inputs/base'
+import { H1, H2, H3, Info3, Mono } from 'src/components/typography'
+import CopyToClipboard from 'src/pages/Transactions/CopyToClipboard'
+
+import styles from '../UserManagement.styles'
+
+const url =
+  process.env.NODE_ENV === 'development' ? 'https://localhost:8070' : ''
+
+const useStyles = makeStyles(styles)
+
+const CreateUserModal = ({ showModal, toggleModal }) => {
+  const classes = useStyles()
+
+  const [usernameField, setUsernameField] = useState('')
+  const [roleField, setRoleField] = useState('')
+  const [createUserURL, setCreateUserURL] = useState(null)
+  const [invalidUser, setInvalidUser] = useState(false)
+
+  const radioOptions = [
+    {
+      code: 'user',
+      display: 'Regular user'
+    },
+    {
+      code: 'superuser',
+      display: 'Superuser'
+    }
+  ]
+
+  const handleUsernameChange = event => {
+    if (event.target.value === '') {
+      setInvalidUser(false)
+    }
+    setUsernameField(event.target.value)
+  }
+
+  const handleRoleChange = event => {
+    setRoleField(event.target.value)
+  }
+
+  const handleClose = () => {
+    setUsernameField('')
+    setRoleField('')
+    setInvalidUser(false)
+    setCreateUserURL(null)
+    toggleModal()
+  }
+
+  const handleCreateUser = () => {
+    const username = usernameField.trim()
+
+    if (username === '') {
+      setInvalidUser(true)
+      return
+    }
+    axios({
+      method: 'POST',
+      url: `${url}/api/createuser`,
+      data: {
+        username: username,
+        role: roleField
+      },
+      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) setInvalidUser(true)
+          if (status === 200 && !message) {
+            const token = res.data.token
+            setCreateUserURL(`https://localhost:3001/register?t=${token.token}`)
+          }
+        }
+      })
+      .catch(err => {
+        if (err) console.log('error')
+      })
+  }
+
+  return (
+    <>
+      {showModal && !createUserURL && (
+        <Modal
+          closeOnBackdropClick={true}
+          width={600}
+          height={400}
+          handleClose={handleClose}
+          open={true}>
+          <H1 className={classes.modalTitle}>Create new user</H1>
+          <H3 className={classes.modalLabel1}>User login</H3>
+          <TextInput
+            error={invalidUser}
+            name="username"
+            autoFocus
+            id="username"
+            type="text"
+            size="lg"
+            width={338}
+            onChange={handleUsernameChange}
+            value={usernameField}
+          />
+          <H3 className={classes.modalLabel2}>Role</H3>
+          <RadioGroup
+            name="userrole"
+            value={roleField}
+            options={radioOptions}
+            onChange={handleRoleChange}
+            className={classes.radioGroup}
+            labelClassName={classes.radioLabel}
+          />
+          <div className={classes.footer}>
+            <Button onClick={handleCreateUser}>Finish</Button>
+          </div>
+        </Modal>
+      )}
+      {showModal && createUserURL && (
+        <Modal
+          closeOnBackdropClick={true}
+          width={600}
+          height={215}
+          handleClose={handleClose}
+          open={true}>
+          <H2 className={classes.modalTitle}>Creating {usernameField}...</H2>
+          <Info3 className={classes.info}>
+            Safely share this link with {usernameField} to finish the
+            registration process.
+          </Info3>
+          <div className={classes.addressWrapper}>
+            <Mono className={classes.address}>
+              <strong>
+                <CopyToClipboard buttonClassname={classes.copyToClipboard}>
+                  {createUserURL}
+                </CopyToClipboard>
+              </strong>
+            </Mono>
+          </div>
+        </Modal>
+      )}
+    </>
+  )
+}
+
+export default CreateUserModal