render()

in karavan-designer/src/designer/route/property/ExpressionField.tsx [101:148]
48 lines of code
2 McCabe index (conditional complexity)

    render() {
        const property: PropertyMeta = this.props.property;
        const value = this.getExpressionValue();
        const dslLanguage = Languages.find((l: [string, string, string]) => l[0] === this.getValueLanguage());
        const selectOptions: JSX.Element[] = []
        Languages.forEach((lang: [string, string, string]) => {
            const s = <SelectOption key={lang[0]} value={lang[0]} description={lang[2]}/>;
            selectOptions.push(s);
        })
        return (
            <div>
                <label className="pf-c-form__label" htmlFor="expression">
                    <span className="pf-c-form__label-text">Language</span>
                    <span className="pf-c-form__label-required" aria-hidden="true"> *</span>
                </label>
                <Select
                    variant={SelectVariant.typeahead}
                    aria-label={property.name}
                    onToggle={isExpanded => {
                        this.openSelect(isExpanded)
                    }}
                    onSelect={(e, lang, isPlaceholder) => {
                        this.expressionChanged(lang.toString(), value);
                    }}
                    selections={dslLanguage}
                    isOpen={this.state.selectIsOpen}
                    aria-labelledby={property.name}
                    direction={SelectDirection.down}
                >
                    {selectOptions}
                </Select>
                <FormGroup
                    key={property.name}
                    fieldId={property.name}
                    labelIcon={property.description ?
                        <Popover
                            position={"left"}
                            headerContent={property.displayName}
                            bodyContent={property.description}>
                            <button type="button" aria-label="More info" onClick={e => {
                                e.preventDefault();
                                e.stopPropagation();
                            }}
                                    className="pf-c-form__group-label-help">
                                <HelpIcon noVerticalAlign/>
                            </button>
                        </Popover> : <div></div>
                    }>