Merge pull request #273 from pointnetwork/PD-211

Add a restart button for node and show an alert if node is not running

src/dashboard/ui/App.tsx

@@ -13,6 +13,7 @@ import DashboardTitle from './components/DashboardTitle'
 import WalletInfo from './components/WalletInfo'
 import UpdateProgress from './components/UpdateProgress'
 import DefaultLoader from './components/DefaultLoader'
+import NodeRestartAlert from './components/NodeRestartAlert'
 import Typography from '@mui/material/Typography'
 
 export default function App() {
@@ -234,6 +235,7 @@ export default function App() {
       </Box>
       <TopBar isLoading={isLoading} />
       <DashboardUpdateAlert />
+      <NodeRestartAlert isNodeRunning={!!nodeVersion} />
 
       <Box px="3.5%" pt="3%">
         <DashboardTitle
@@ -290,9 +292,12 @@ export default function App() {
           <ResourceItemCard
             title="Point Node"
             status={!!nodeVersion}
+            onClick={window.Dashboard.launchNode}
             icon={<PointLogo />}
-            buttonLabel="Check Status"
-            isLoading={isLoading || isNodeUpdating || isFirefoxUpdating}
+            buttonLabel="Restart Node"
+            isLoading={
+              isLoading || isNodeUpdating || isFirefoxUpdating || !!nodeVersion
+            }
             version={nodeVersion}
           />
         </Box>

src/dashboard/ui/components/NodeRestartAlert.tsx

@@ -0,0 +1,34 @@
+import { useState, ReactEventHandler, useEffect } from 'react'
+import Alert from '@mui/material/Alert'
+import Typography from '@mui/material/Typography'
+
+const NodeRestartAlert = ({ isNodeRunning }: { isNodeRunning: boolean }) => {
+  const [showAlert, setShowAlert] = useState<boolean>(false)
+
+  useEffect(() => {
+    setShowAlert(!isNodeRunning)
+  }, [isNodeRunning])
+
+  const handleCloseAlert: ReactEventHandler = () => setShowAlert(false)
+
+  return showAlert ? (
+    <Alert
+      sx={{
+        position: 'absolute',
+        right: 12,
+        top: 36,
+        zIndex: 999999,
+        maxWidth: '360px',
+      }}
+      severity="error"
+      onClose={handleCloseAlert}
+    >
+      <Typography fontWeight="bold">Point Node is not running</Typography>
+      <Typography>
+        Try restarting the Point Node by clicking the 'Restart Node' button
+      </Typography>
+    </Alert>
+  ) : null
+}
+
+export default NodeRestartAlert