ci: added commit lint, build check, test and release (#31)

* ci: added commit lint, build check, test and release

* refactor: fix compilation errors

* ci: add checkout to the tests

* test: resolved issues with running tests

* chore: addressed PR comments

* chore: renamed package-name in release-please

src/pages/peers/PeerTable.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 import { makeStyles } from '@material-ui/core/styles';
 import { Table, TableBody, TableCell, TableContainer, TableRow, TableHead, Button, Paper, Tooltip, Container, CircularProgress } from '@material-ui/core';
-import { Cancel, Autorenew } from '@material-ui/icons';
+import { Autorenew } from '@material-ui/icons';
 
 import { beeDebugApi } from '../../services/bee';
 
@@ -16,7 +16,6 @@ function PeerTable(props: any) {
     const classes = useStyles();
 
     const [peerLatency, setPeerLatency] = useState([{ peerId: '', rtt: '', loading: false }]);
-    const [removingPeer, setRemovingPeer] = useState(false);
 
     const PingPeer = async (peerId: string) => {
         
@@ -30,21 +29,6 @@ function PeerTable(props: any) {
         })
     }
 
-    const removePeer = (peerId: string) => {
-        setRemovingPeer(true)
-        beeDebugApi.connectivity.removePeer(peerId)
-        .then(res => {
-            window.location.reload()
-            setRemovingPeer(false)
-        })
-        .catch(error => {
-            console.log(error)
-        })
-        .finally(() => {
-            setRemovingPeer(false)
-        })
-    }
-
     return (
         <div>
             {props.loading ? 
@@ -77,12 +61,6 @@ function PeerTable(props: any) {
                                 <Autorenew />}
                                 </Button>
                             </Tooltip>
-                            
-                            {/* <Tooltip title="Remove peer">
-                                <Button color="primary" onClick={() => removePeer(peer.address)} >
-                                    <Cancel />
-                                </Button>
-                            </Tooltip> */}
                         </TableCell>
                         </TableRow>
                     ))}

src/pages/status/NodeSetupWorkflow.tsx

@@ -55,45 +55,47 @@ function getStepContent(step: number, props: any) {
 }
 
 export default function NodeSetupWorkflow(props: any) {
+  const {nodeHealth, nodeApiHealth, nodeAddresses, chequebookAddress, chequebookBalance, beeRelease, nodeTopology, setStatusChecksVisible} = props
   const classes = useStyles();
   const [activeStep, setActiveStep] = useState(0);
   const [completed, setCompleted] = useState<{ [k: number]: boolean }>({});
   const steps = getSteps();
 
-  const evaluateNodeStatus = () => {
-    if (props.nodeHealth?.status === 'ok' && props.nodeApiHealth) {
-      handleComplete(0)
-      setActiveStep(1)
-    }
-
-    if (props.beeRelease && props.beeRelease.name === `v${props.nodeHealth?.version?.split('-')[0]}`) {
-      handleComplete(1)
-      setActiveStep(2)
-    }
-
-    if (props.nodeAddresses?.ethereum) {
-      handleComplete(2)
-      setActiveStep(3)
-    }
-
-    if (props.chequebookAddress?.chequebookaddress && props.chequebookBalance.totalBalance > 0) {
-      handleComplete(3)
-      setActiveStep(4)
-    }
-
-    if (props.nodeTopology.connected && props.nodeTopology.connected > 0) {
-      handleComplete(4)
-      setActiveStep(5)
-    }
-  }
-
   useEffect(() => {
-    evaluateNodeStatus()
-  }, [])
+    const handleComplete = (index: number) => {
+      const newCompleted = completed;
+      newCompleted[index] = true;
+      setCompleted(newCompleted);
+    };
 
-  useEffect(() => {
+    const evaluateNodeStatus = () => {
+      if (nodeHealth?.status === 'ok' && nodeApiHealth) {
+        handleComplete(0)
+        setActiveStep(1)
+      }
+
+      if (beeRelease && beeRelease.name === `v${nodeHealth?.version?.split('-')[0]}`) {
+        handleComplete(1)
+        setActiveStep(2)
+      }
+
+      if (nodeAddresses?.ethereum) {
+        handleComplete(2)
+        setActiveStep(3)
+      }
+
+      if (chequebookAddress?.chequebookaddress && chequebookBalance.totalBalance > 0) {
+        handleComplete(3)
+        setActiveStep(4)
+      }
+
+      if (nodeTopology.connected && nodeTopology.connected > 0) {
+        handleComplete(4)
+        setActiveStep(5)
+      }
+    }
     evaluateNodeStatus()
-  }, [props])
+  }, [nodeHealth, nodeApiHealth, nodeAddresses, chequebookAddress, beeRelease, chequebookBalance, nodeTopology, completed])
 
   const handleNext = () => {
     setActiveStep((prevActiveStep) => prevActiveStep + 1);
@@ -104,13 +106,7 @@ export default function NodeSetupWorkflow(props: any) {
   };
 
   const handleSetupComplete = () => {
-    props.setStatusChecksVisible(false)
-  };
-
-  const handleComplete = (index: number) => {
-    const newCompleted = completed;
-    newCompleted[index] = true;
-    setCompleted(newCompleted);
+    setStatusChecksVisible(false)
   };
 
   return (

src/pages/status/SetupSteps/ChequebookDeployFund.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { Typography } from '@material-ui/core/';
 import { CheckCircle, Warning } from '@material-ui/icons/';
 import EthereumAddress from '../../../components/EthereumAddress';
@@ -26,7 +25,7 @@ export default function ChequebookDeployFund(props: any) {
                 :
                 <div>
                     <Warning style={{color:'#ff9800', marginRight: '7px', height: '18px'}} />
-                    <span>Your chequebook is either not deployed or funded. Run the below commands to get your address and deposit ETH. Then visit the BZZaar here <a href='#'>https://bzz.ethswarm.org/?transaction=buy&amount=10&slippage=30&receiver=[ENTER_ADDRESS_HERE]</a> to get BZZ</span>
+                    <span>Your chequebook is either not deployed or funded. Run the below commands to get your address and deposit ETH. Then visit the BZZaar here <Typography variant='button'>https://bzz.ethswarm.org/?transaction=buy&amount=10&slippage=30&receiver=[ENTER_ADDRESS_HERE]</Typography> to get BZZ</span>
                     <CodeBlockTabs
                     showLineNumbers
                     linux={`bee-get-addr`}

src/pages/status/SetupSteps/NodeConnectionCheck.tsx

@@ -16,13 +16,13 @@ export default function NodeConnectionCheck(props: any) {
               :
               <Error style={{color:'#c9201f', marginRight: '7px', height: '18px'}} />
             }
-            <span style={{marginRight:'15px'}}>Node API  (<a href='#'>{props.apiHost}</a>)</span>
+            <span style={{marginRight:'15px'}}>Node API  (<Typography variant="button">{props.apiHost}</Typography>)</span>
             <ConnectToHost hostName='api_host' defaultHost={props.apiHost} />
           </div>
           <div>
           { !props.nodeApiHealth ? 
             <Typography component="div" variant="body2" gutterBottom style={{margin: '15px'}}>
-              We cannot connect to your nodes API at <a href='#'>{props.apiHost}</a>. Please check the following to troubleshoot your issue.
+              We cannot connect to your nodes API at <Typography variant="button">{props.apiHost}</Typography>. Please check the following to troubleshoot your issue.
               <Accordion style={{marginTop:'20px'}}>
                   <AccordionSummary
                     expandIcon={<ExpandMoreSharp />}
@@ -67,13 +67,13 @@ export default function NodeConnectionCheck(props: any) {
                 :
                 <Error style={{color:'#c9201f', marginRight: '7px', height: '18px'}} />
               }
-              <span style={{marginRight:'15px'}}>Debug API  (<a href='#'>{props.debugApiHost}</a>)</span>
+              <span style={{marginRight:'15px'}}>Debug API  (<Typography variant="button">{props.debugApiHost}</Typography>)</span>
               <ConnectToHost hostName={'debug_api_host'} defaultHost={props.debugApiHost} />
             </div>
             <div>
             { props.nodeHealth?.status !== 'ok' ? 
               <Typography component="div" variant="body2" gutterBottom style={{margin: '15px'}}>
-                We cannot connect to your nodes debug API at <a href='#'>{props.debugApiHost}</a>. Please check the following to troubleshoot your issue.
+                We cannot connect to your nodes debug API at <Typography variant="button">{props.debugApiHost}</Typography>. Please check the following to troubleshoot your issue.
                 <Accordion style={{marginTop:'20px'}}>
                   <AccordionSummary
                     expandIcon={<ExpandMoreSharp />}

src/pages/status/StatusCard.tsx

@@ -120,7 +120,7 @@ function StatusCard(props: IProps) {
                                 props.loadingBeeRelease ?
                                 '' 
                                 :
-                                <a href='#'>update</a>
+                                <Typography variant="button">update</Typography>
                             }
                         </Typography>
                         <Typography component="div" variant="subtitle2" gutterBottom>