Generalnie mam sobie taki kawałek kodu, który z react-bootstrap generuje mi formularz (react-bootstrap mi odpowiada, bo mój wewnętrzny styleguide jest celowo bazowany na bootstrapie i jego komponentach):

    input_series(keys) {
      return keys.map(key => {
        return (
          <RB.FormGroup key={key} validationState={this.state.error && this.state.error[key] ? 'error' : null}>
            <RB.ControlLabel>{this.LABELS[key]}</RB.ControlLabel>
            <RB.FormControl type="text" value={this.state[key]} onChange={this.onFormChange.bind(this, key)}/>
            {this.state.error && this.state.error[key] ? <RB.HelpBlock>{this.state.error[key]}</RB.HelpBlock> : ''}
          </RB.FormGroup>
        )
      })
    },

Jak widac jest zrobiony w petelce, bo juz mnie wkurwialo robienie 4x dokladnie-kurwa-tego-samego-tylko-ze-zmienionym-name.

Tylko teraz problem mam taki, ze robie drugi formularz i tam juz jest textarea:

                <RB.FormGroup>
                  <RB.ControlLabel>Description</RB.ControlLabel>
                  <RB.FormControl
                    componentClass="textarea"
                    value={this.state.description}
                    onChange={this.onFormChange.bind(this, 'description')}
                    rows="3"/>
                  {this.state.error && this.state.error['description'] ? <RB.HelpBlock>{this.state.error['description']}</RB.HelpBlock> : ''}
                </RB.FormGroup>

I w sumie moje pytanie brzmi: wrapujesz sobie takie rzeczy w prostsze helpery, zostawiasz takie i masz 9000 linii kodu czy calkiem jestem debilem i jest na to jakis prosty sposob?