render()

in frontend/src/components/Telemetry.js [143:241]
97 lines of code
3 McCabe index (conditional complexity)

    render() {
        
        const options = [
            {
                text: 'otaUpdate 1.0',
                value: JSON.stringify({cmd: "otaUpdate", version: "1.0"}),
            },
            {
                text: 'otaUpdate 2.0',
                value: JSON.stringify({cmd: "otaUpdate", version: "2.0"}),
            },
            {
                text: 'startWork',
                value: JSON.stringify({cmd: "startWork"}),
            },
            {
                text: 'standBy',
                value: JSON.stringify({cmd: "standby"}),
            },
            {
                text: 'enableAutoCharging',
                value: JSON.stringify({cmd: "enableAutoCharging"}),
            },
            {
                text: 'disableAutoCharging',
                value: JSON.stringify({cmd: "disableAutoCharging"}),
            },
        ];
        let cmdContent;
        var cmd = this.state.cmd;
        if (this.state.sentAt) {
            cmdContent =
            <div>
                {cmd}
                <Divider />
                Last sent at: <Label>{moment(this.state.sentAt).format('HH:mm:ss.SSS')}</Label>
            </div>;
        } else {
            cmdContent =
            <p>
                {cmd}
            </p>;            
        }
        let respContent;
        var resp = this.state.resp;
        if (this.state.receivedAt) {
            respContent =
            <div>
                {resp}
                <Divider />
                Last received at: 
                <Label>{moment(this.state.receivedAt).format('HH:mm:ss.SSS')}</Label>   Latency: <Label>{this.state.receivedAt-this.state.sentAt}</Label> ms.
            </div>;
        } else {
            respContent =
            <p>
                {resp}
            </p>;            
        }
        return (
            <Popup
                flowing
                trigger={<Button icon='comments' content='Send Command' disabled={!this.props.thing} />}
                content={
                    <div>
                        <Dropdown 
                            placeholder='Select Cmd' 
                            fluid 
                            selection 
                            options={options}
                            onChange={this.handleChange}
                        />

                        <Message>
                            <Message.Header><Icon name='arrow right' />myThings/{this.props.thing}/cmds</Message.Header>
                            <Divider />
                            {cmdContent}
                        </Message>
                        <Message>
                            <Message.Header><Icon name='arrow left' />myThings/{this.props.thing}/cmds/ack</Message.Header>
                            <Divider />
                            {respContent}
                        </Message>                        
                        <Button 
                            onClick={this.handleSendCmd}
                            primary 
                            content='Send'
                            disabled={!this.state.cmd}
                        />
                        <Button onClick={this.handleCmdsPopupClose} content='Close'  />
                    </div>
                }
                on='click'
                open={this.props.open}
                onOpen={this.handleCmdsPopupOpen}
                position='top right'
            />
        )
    }