renderControls()

in src/header.tsx [109:152]
42 lines of code
7 McCabe index (conditional complexity)

    renderControls() {
        const dataProviderProps: React.ClassAttributes<DataProviderComponentClass> & DataProviderProps = {
            ref: this.dataProviderRef,
            persistentState: this.props.persistentState,
            loadStatus: this.props.loadStatus,
            hasFocus: this.state.isTextareaFocused,
            onFocusChange: (hasFocus: boolean) => this.setState({isTextareaFocused: hasFocus}),
            onLoadExperiment: this.props.onLoadExperiment,
        };
        return (
        <React.Fragment>
            {React.createElement(this.props.dataProvider, dataProviderProps)}

            {this.props.loadStatus == HiPlotLoadStatus.Loaded && !this.state.isTextareaFocused &&
                <React.Fragment>
                    <div className={style.controlGroup}>
                        <RestoreDataBtn {...this.props} />
                        <KeepDataBtn {...this.props} />
                        <ExcludeDataBtn {...this.props} />
                        {this.dataProviderRef.current && this.dataProviderRef.current.refresh &&
                            <button title="Refresh" className="btn btn-sm btn-light" onClick={this.onRefresh.bind(this)}>Refresh</button>
                        }
                        <ExportDataCSVBtn {...this.props} />
                        <button title="Start HiPlot tutorial" className="btn btn-sm btn-light" onClick={this.onToggleTutorial.bind(this)}>Help</button>

                        <div style={{clear:'both'}}></div>
                    </div>
                    <div className={style.controlGroup}>
                        <div style={{"fontFamily": "monospace", "fontSize": "14px"}}>
            Selected: <strong style={{"minWidth": "4em", "textAlign": "right", "display": "inline-block"}}>{this.props.rows_selected.length}</strong>
                    /<strong style={{"minWidth": "4em", "textAlign": "left", "display": "inline-block"}}>{this.props.rows_filtered.length}</strong> (
                        {!this.props.weightColumn &&
                            <React.Fragment><span style={{"minWidth": "3em", "textAlign": "right", "display": "inline-block"}}>{this.state.selectedPct}</span>%</React.Fragment>
                        }
                        {this.props.weightColumn &&
                            <React.Fragment><span style={{"minWidth": "3em", "textAlign": "right", "display": "inline-block"}}>{this.state.selectedPctWeighted}</span>% weighted</React.Fragment>
                        }
                        )
                        </div>
                    </div>
                </React.Fragment>
            }
        </React.Fragment>);
    }