feat: bee provider caching the state of the app and refreshing periodically (#172)

* feat: bee provider caching the state of the app and refreshing periodically

* chore: added error handling

src/pages/status/SetupSteps/ChequebookDeployFund.tsx

@@ -2,22 +2,17 @@ import { Typography } from '@material-ui/core/'
 import EthereumAddress from '../../../components/EthereumAddress'
 import DepositModal from '../../../containers/DepositModal'
 import type { ReactElement } from 'react'
-import type { StatusChequebookHook } from '../../../hooks/status'
 
-interface Props extends StatusChequebookHook {
-  ethereumAddress?: string
+interface Props extends StatusHookCommon {
+  chequebookAddress?: string
 }
 
-const ChequebookDeployFund = ({ isLoading, chequebookAddress, chequebookBalance }: Props): ReactElement | null => {
-  if (isLoading) return null
-
+const ChequebookDeployFund = ({ chequebookAddress, isOk }: Props): ReactElement | null => {
   return (
     <div>
-      <p style={{ marginBottom: '20px', display: 'flex' }}>
-        {chequebookAddress?.chequebookAddress && <DepositModal />}
-      </p>
+      <p style={{ marginBottom: '20px', display: 'flex' }}>{chequebookAddress && <DepositModal />}</p>
       <div style={{ marginBottom: '10px' }}>
-        {!(chequebookAddress?.chequebookAddress && chequebookBalance?.totalBalance.toBigNumber.isGreaterThan(0)) && (
+        {!isOk && (
           <div>
             <span>
               Your chequebook is either not deployed or funded. To run the node you will need xDAI and xBZZ on the xDai
@@ -33,7 +28,7 @@ const ChequebookDeployFund = ({ isLoading, chequebookAddress, chequebookBalance
       <Typography variant="subtitle1" gutterBottom>
         Chequebook Address
       </Typography>
-      <EthereumAddress address={chequebookAddress?.chequebookAddress} />
+      <EthereumAddress address={chequebookAddress} />
     </div>
   )
 }

src/pages/status/SetupSteps/DebugConnectionCheck.tsx

@@ -9,9 +9,7 @@ import { debugApiHost } from '../../../constants'
 
 type Props = StatusHookCommon
 
-export default function NodeConnectionCheck({ isLoading, isOk }: Props): ReactElement | null {
-  if (isLoading) return null
-
+export default function NodeConnectionCheck({ isOk }: Props): ReactElement | null {
   const changeDebugApiUrl = (
     <div style={{ display: 'flex', marginTop: '25px', marginBottom: '25px' }}>
       <span style={{ marginRight: '15px' }}>

src/pages/status/SetupSteps/EthereumConnectionCheck.tsx

@@ -4,9 +4,7 @@ import EthereumAddress from '../../../components/EthereumAddress'
 
 type Props = StatusEthereumConnectionHook
 
-export default function EthereumConnectionCheck({ isLoading, isOk, nodeAddresses }: Props): ReactElement | null {
-  if (isLoading) return null
-
+export default function EthereumConnectionCheck({ isOk, nodeAddresses }: Props): ReactElement | null {
   if (isOk) {
     return (
       <div>

src/pages/status/SetupSteps/NodeConnectionCheck.tsx

@@ -8,9 +8,7 @@ import { apiHost } from '../../../constants'
 
 type Props = StatusHookCommon
 
-export default function NodeConnectionCheck({ isLoading, isOk }: Props): ReactElement | null {
-  if (isLoading) return null
-
+export default function NodeConnectionCheck({ isOk }: Props): ReactElement | null {
   return (
     <div>
       <div style={{ display: 'flex', marginBottom: '25px' }}>

src/pages/status/SetupSteps/PeerConnection.tsx

@@ -3,9 +3,7 @@ import { Typography } from '@material-ui/core/'
 
 type Props = StatusTopologyHook
 
-export default function PeerConnection({ isLoading, isOk, topology }: Props): ReactElement | null {
-  if (isLoading) return null
-
+export default function PeerConnection({ isOk, topology }: Props): ReactElement | null {
   const peers = (
     <div style={{ display: 'flex', marginTop: '15px' }}>
       <div style={{ marginRight: '30px' }}>

src/pages/status/SetupSteps/VersionCheck.tsx

@@ -4,15 +4,7 @@ import CodeBlockTabs from '../../../components/CodeBlockTabs'
 
 type Props = StatusNodeVersionHook
 
-export default function VersionCheck({
-  isLoading,
-  isOk,
-  userVersion,
-  latestVersion,
-  latestUrl,
-}: Props): ReactElement | null {
-  if (isLoading) return null
-
+export default function VersionCheck({ isOk, userVersion, latestVersion, latestUrl }: Props): ReactElement | null {
   const version = (
     <div style={{ display: 'flex' }}>
       <div style={{ marginRight: '30px' }}>