render()

in frontend/src/components/Telemetry.js [277:353]
72 lines of code
5 McCabe index (conditional complexity)

    render() {
        const options = []
        this.props.things.map(thing => {
            var thingName = thing.thingName.S
            options.push( { key: thingName, text: thingName, value: thingName } );
        });

        const positiveMessage = this.props.positiveMessage;
        var headerMessage = `Successfully Subscribed to ${this.props.selected} Telemetry`

        let positiveMessageComponent;
 
        if (positiveMessage) {
            positiveMessageComponent = 
            <div>
                <Message positive icon>
                    <Icon name='rss'  />
                    <Message.Content>
                        <Message.Header>{headerMessage}</Message.Header>
                        {positiveMessage}
                    </Message.Content>
                </Message>
                <Divider hidden/>
            </div>
        }


        return(
            <div>
                <div>
                    <Form>
                        <Form.Group inline>
                            <Form.Field inline>
                                <label>Thing name</label>
                                    <Dropdown 
                                        loading={this.props.searching}
                                        disabled={this.props.searching}
                                        placeholder='Select'
                                        search
                                        selection
                                        options={options}
                                        onChange={this.handleChange}
                                    />
                            </Form.Field>
                            <Form.Field inline>
                                <Button
                                    primary
                                    onClick={this.handleSubscribeRequested}
                                    disabled={!this.props.selected || this.props.connected}
                                >
                                    {this.props.subscribing ? 'Subscribing' : 'Subscribe'}
                                </Button>
                                <Button
                                    onClick={this.handleDisconnectRequested}
                                    disabled={!this.props.connected}
                                    color='red'
                                >
                                    {this.props.unsibscribing ? 'Unsubscribing' : 'Unsubscribe'}
                                </Button>
                            </Form.Field>
                            <Form.Field>
                                <CmdCtrlPopup
                                    thing={this.props.selected}
                                    onCmdsPopupOpen={this.handleCmdsPopupOpen}
                                    onCmdsPopupClose={this.handleCmdsPopupClose}
                                    open={this.state.cmdsPopupOpen}
                                />
                            </Form.Field>
                        </Form.Group>
                    </Form>
                </div>
                <div>
                    {positiveMessageComponent}
                </div>
            </div>
        )
    }