Prologue

I came across Electric UI during the recent live-stream by CCS Technologies. It can be used to make cross-platform user interface for real time hardware visualization and control. I did the quick setup and went on to read their documentation. While going through the basics, I stumbled upon several questions embedded within the texts. They required us to have an understanding of ReactJS as well as ElectricUI's core components. There were no clue around, so the readers were left to find the solutions themselves. After a lot of WTHs and pulling my hair out, I figured them out one by one. Through this post, I wanted to document my solutions.

Q&As

Try adding another Switch, or a Checkbox component to manually set the led_state variable to 0 or 1 while led_blink is disabled. [From Blink Mode Control]

Solution -

import { useHardwareState } from '@electricui/components-core'

...

const isBlinking = useHardwareState('led_blink')

{
    (!isBlinking)? 
    (
      <Switch
        unchecked = {0}
        checked = {1}
        accessor={state => state.led_state}
        writer={(state, value) => {
          state.led_state = value
        }}

      >
        Manually toggle LED state
      </Switch>
    ):null
}