fix: blacklist modal up to spec and added address validation

new-lamassu-admin/src/pages/Blacklist/Blacklist.js

@@ -3,6 +3,7 @@ import { Box } from '@material-ui/core'
 import Grid from '@material-ui/core/Grid'
 import { makeStyles } from '@material-ui/core/styles'
 import gql from 'graphql-tag'
+import { utils as coinUtils } from 'lamassu-coins'
 import * as R from 'ramda'
 import React, { useState } from 'react'
 
@@ -120,8 +121,21 @@ const Blacklist = () => {
     deleteEntry({ variables: { cryptoCode, address } })
   }
 
+  const validateAddress = (cryptoCode, address) => {
+    try {
+      console.log(errorMsg)
+      return !R.isNil(coinUtils.parseUrl(cryptoCode, 'main', address))
+    } catch {
+      return false
+    }
+  }
+
   const addToBlacklist = async (cryptoCode, address) => {
     setErrorMsg(null)
+    if (!validateAddress(cryptoCode, address)) {
+      setErrorMsg('Invalid address')
+      return
+    }
     const res = await addEntry({ variables: { cryptoCode, address } })
     if (!res.errors) {
       return setShowModal(false)

new-lamassu-admin/src/pages/Blacklist/Blacklist.styles.js

@@ -1,10 +1,4 @@
-import {
-  spacer,
-  fontPrimary,
-  primaryColor,
-  white,
-  errorColor
-} from 'src/styling/variables'
+import { spacer, white, errorColor } from 'src/styling/variables'
 const styles = {
   grid: {
     flex: 1,
@@ -20,11 +14,7 @@ const styles = {
     margin: [['auto', 0, spacer * 3, 'auto']]
   },
   modalTitle: {
-    lineHeight: '120%',
-    color: primaryColor,
-    fontSize: 14,
-    fontFamily: fontPrimary,
-    fontWeight: 900
+    margin: [['auto', 0, 8.5, 'auto']]
   },
   subtitle: {
     display: 'flex',

new-lamassu-admin/src/pages/Blacklist/BlacklistModal.js

@@ -1,3 +1,4 @@
+import { Box } from '@material-ui/core'
 import { makeStyles } from '@material-ui/core/styles'
 import { Formik, Form, Field } from 'formik'
 import * as R from 'ramda'
@@ -57,7 +58,7 @@ const BlackListModal = ({
           resetForm()
         }}>
         <Form id="address-form">
-          <H3>
+          <H3 className={classes.modalTitle}>
             {selectedCoin.display
               ? `Blacklist ${R.toLower(selectedCoin.display)} address`
               : ''}
@@ -74,9 +75,11 @@ const BlackListModal = ({
         </Form>
       </Formik>
       <div className={classes.footer}>
-        <Link type="submit" form="address-form">
-          Blacklist address
-        </Link>
+        <Box display="flex" justifyContent="flex-end">
+          <Link type="submit" form="address-form">
+            Blacklist address
+          </Link>
+        </Box>
       </div>
     </Modal>
   )