refactor: heartbeat

src/js/components/view/heartbeat.js

@@ -6,31 +6,25 @@ const icyLogo = resolve(join(__dirname, '../../../img/ipfs-logo-ice.png'))
 const blackLogo = resolve(join(__dirname, '../../../img/ipfs-logo-black.png'))
 
 export default function Heartbeat (props) {
-  if (props.running === null) {
+  if (props.dead) {
     return (
-      <img src={`file://${icyLogo}`} className='heartbeat' />
+      <img onClick={props.onClickDead} src={`file://${blackLogo}`} />
     )
-  }
-
-  if (props.running) {
+  } else {
     return (
-      <img onClick={props.stopDaemon} src={`file://${icyLogo}`} className='heartbeat-btn heartbeat' />
+      <img onClick={props.onClickAlive} src={`file://${icyLogo}`} className='heartbeat' />
     )
   }
-
-  return (
-    <img onClick={props.startDaemon} src={`file://${blackLogo}`} className='heartbeat-btn ' />
-  )
 }
 
 Heartbeat.propTypes = {
-  running: PropTypes.bool,
-  startDaemon: PropTypes.func,
-  stopDaemon: PropTypes.func
+  dead: PropTypes.bool,
+  onClickAlive: PropTypes.func,
+  onClickDead: PropTypes.func
 }
 
 Heartbeat.defaultProps = {
-  running: null,
-  startDaemon: null,
-  stopDaemon: null
+  dead: false,
+  onClickAlive: () => {},
+  onClickDead: () => {}
 }

src/js/screens/menu/node-info.js

@@ -38,9 +38,9 @@ export default function NodeScreen (props) {
     <div className={`node` + (props.running ? '' : ' translucent')}>
       <Header title='Your Node'>
         <Heartbeat
-          running={props.running}
-          stopDaemon={stopDaemon}
-          startDaemon={startDaemon} />
+          dead={!props.running}
+          onClickAlive={stopDaemon}
+          onClickDead={startDaemon} />
       </Header>
 
       <div className='main'>

src/styles/common.less

@@ -116,7 +116,7 @@ input[type="text"] {
     }
   }
 
-  .heartbeat-btn {
+  .header img {
     cursor: pointer;
     width: 1.15em;
   }