showModalBody()

in source/web-ui/src/views/overview/Overview.tsx [396:454]
57 lines of code
3 McCabe index (conditional complexity)

    showModalBody() {
        if (!this.state.machines || this.state.machines.length === 0) {
            return null;
        }

        const delim = this.state.machineIdDelimiter;
        const sampleMachineId = this.state.machines[0].id;
        const sampleMachineIdTokens = sampleMachineId.split(delim);
        sampleMachineIdTokens.pop(); // Remove the machine name

        return (
            <Modal.Body key="config-machine-modal-body">
                <Row key="config-machine-grouping-modal-sample-row" className="config-machine-grouping-modal-sample-row">
                    <Col key="config-machine-grouping-modal-sample-col">
                        {`${I18n.get('modal.configGrouping.sampleMachineLabel')}`}: {sampleMachineId}
                    </Col>
                </Row>
                <Row key="config-machine-grouping-modal-location-row">
                    <Col key="config-machine-grouping-modal-location-select-col">
                        <Form.Group controlId="locationSelections">
                            <Form.Label><strong className="machine-config-label">{`${I18n.get('modal.configGrouping.machineLocationSelectionLabel')}`}</strong></Form.Label>
                            {Object.keys(sampleMachineIdTokens).map(idx => (
                                <Form.Check className="grouping-select-checkbox" checked={this.state.newLocationUIReferenceMapping.has(idx)} disabled={this.state.isMutating} onChange={this.onChangeUIReferenceMapping} type="checkbox" id={`location-${idx}`} key={`location-check-${idx}`} label={sampleMachineIdTokens[parseInt(idx, 10)]} />
                            ))}
                        </Form.Group>
                    </Col>
                </Row>
                <Row key="config-machine-grouping-modal-line-row">
                    <Col key="config-machine-grouping-modal-line-select-col">
                        <Form.Group controlId="lineSelections">
                            <Form.Label><strong className="machine-config-label">{`${I18n.get('modal.configGrouping.machineLineSelectionLabel')}`}</strong></Form.Label>
                            {Object.keys(sampleMachineIdTokens).map(idx => (
                                <Form.Check className="grouping-select-checkbox" checked={this.state.newLineUIReferenceMapping.has(idx)} disabled={this.state.isMutating} onChange={this.onChangeUIReferenceMapping} type="checkbox" id={`line-${idx}`} key={`line-check-${idx}`} label={sampleMachineIdTokens[parseInt(idx, 10)]} />
                            ))}
                        </Form.Group>
                    </Col>
                </Row>
                <Row key="config-machine-grouping-modal-location-preview-row">
                    <Col key="config-machine-grouping-modal-location-preview-col" md="5" lg="5" xl="5">
                        <strong className="machine-config-label">{`${I18n.get('modal.configGrouping.locationPreviewLabel')}`}:</strong>
                    </Col>
                    <Col key="config-machine-grouping-modal-location-preview-value-col">
                        {Array.from(this.state.newLocationUIReferenceMapping)
                            .map(key => (sampleMachineIdTokens[parseInt(key, 10)]))
                            .join(delim)}
                    </Col>
                </Row>
                <Row key="config-machine-grouping-modal-line-preview-row">
                    <Col key="config-machine-grouping-modal-line-preview-col" md="5" lg="5" xl="5">
                        <strong className="machine-config-label">{`${I18n.get('modal.configGrouping.linePreviewLabel')}`}:</strong>
                    </Col>
                    <Col key="config-machine-grouping-modal-line-preview-value-col">
                        {Array.from(this.state.newLineUIReferenceMapping)
                            .map(key => (sampleMachineIdTokens[parseInt(key, 10)]))
                            .join(delim)}
                    </Col>
                </Row>
            </Modal.Body>);
    }