Merge pull request #832 from gre/vis-ops-per-sec

add a way to see operations per second (ping the process)

src/components/KeyboardContent.js

@@ -0,0 +1,47 @@
+// @flow
+// Toggle something after a sequence of keyboard
+
+import { Component } from 'react'
+
+class KeyboardContent extends Component<
+  {
+    sequence: string,
+    children?: *,
+  },
+  { enabled: boolean },
+> {
+  state = {
+    enabled: false,
+  }
+
+  componentDidMount() {
+    window.addEventListener('keypress', this.onKeyPress)
+  }
+
+  componentWillUnmount() {
+    window.removeEventListener('keypress', this.onKeyPress)
+  }
+
+  seqIndex = -1
+  onKeyPress = (e: *) => {
+    const { sequence } = this.props
+    const next = sequence[this.seqIndex + 1]
+    if (next && next === e.key) {
+      this.seqIndex++
+    } else {
+      this.seqIndex = -1
+    }
+    if (this.seqIndex === sequence.length - 1) {
+      this.seqIndex = -1
+      this.setState(({ enabled }) => ({ enabled: !enabled }))
+    }
+  }
+
+  render() {
+    const { children } = this.props
+    const { enabled } = this.state
+    return enabled ? children : null
+  }
+}
+
+export default KeyboardContent

src/components/PerfIndicator.js

@@ -0,0 +1,57 @@
+// @flow
+import React, { PureComponent } from 'react'
+import styled from 'styled-components'
+import ping from 'commands/ping'
+
+const Indicator = styled.div`
+  opacity: 0.8;
+  border-radius: 3px;
+  background-color: white;
+  position: fixed;
+  font-size: 10px;
+  padding: 3px 6px;
+  bottom: 0;
+  left: 0;
+  z-index: 999;
+  pointer-events: none;
+`
+
+class PerfIndicator extends PureComponent<{}, { opsPerSecond: number }> {
+  state = {
+    opsPerSecond: 0,
+  }
+  componentDidMount() {
+    let count = 0
+    const loop = () => {
+      ++count
+      if (this.finished) return
+      this.sub = ping.send().subscribe({
+        complete: loop,
+      })
+    }
+    loop()
+    setInterval(() => {
+      this.setState({ opsPerSecond: count })
+      count = 0
+    }, 1000)
+  }
+  componentWillUnmount() {
+    if (this.sub) {
+      this.sub.unsubscribe()
+      this.finished = true
+    }
+  }
+  sub: *
+  interval: *
+  finished = false
+  render() {
+    return (
+      <Indicator>
+        {this.state.opsPerSecond}
+        {' ops/s'}
+      </Indicator>
+    )
+  }
+}
+
+export default PerfIndicator

src/components/layout/Default.js

@@ -18,6 +18,8 @@ import DashboardPage from 'components/DashboardPage'
 import ManagerPage from 'components/ManagerPage'
 import ExchangePage from 'components/ExchangePage'
 import SettingsPage from 'components/SettingsPage'
+import KeyboardContent from 'components/KeyboardContent'
+import PerfIndicator from 'components/PerfIndicator'
 import LibcoreBusyIndicator from 'components/LibcoreBusyIndicator'
 import DeviceBusyIndicator from 'components/DeviceBusyIndicator'
 import TriggerAppReady from 'components/TriggerAppReady'
@@ -106,6 +108,9 @@ class Default extends Component<Props> {
 
           <LibcoreBusyIndicator />
           <DeviceBusyIndicator />
+          <KeyboardContent sequence="BJBJBJ">
+            <PerfIndicator />
+          </KeyboardContent>
         </IsUnlocked>
       </Fragment>
     )