Проблемы со значением init в поле select с Redux-формами и compose

Question

После попытки использовать способ, аналогичный описанному в [https://codesandbox.io/s/MQnD536Km] [1] , безуспешно в моем коде. Я пробовал это в грубой форме без значения состояния

´´´

const mapStateToProps = (state) => {
  return {
    initialValues: {
      [slot.name + "_type"]: "Texto",
    }
  }
}

´´´

Возможно, это проблема с orden в моей функции compose ? Я полностью дезориентирован, что не так в моем коде? (Все остальные значения загрузки из БД, сохранить, и т. Д. c отлично работает

```
import React from 'react';
import { Map } from 'immutable';
import { compose } from 'redux';
import PropTypes from 'prop-types';
import isEqual from 'lodash/isEqual';
import { connect } from 'react-redux';
import styled from 'styled-components';
import FlexRow from 'components/FlexRow';
import injectSaga from 'utils/injectSaga';
import Expansion from 'components/Expansion';
import injectReducer from 'utils/injectReducer';
import { Checkbox, TextField, Select, SelectField } from 'redux-form-material-ui';
import {
  Button,
  // Divider,
  Typography,
  CircularProgress,
  Tooltip,
} from '@material-ui/core';
import {
  arrayPush,
  Field,
  FieldArray,
  getFormValues,
  reduxForm,
  formValueSelector,
} from 'redux-form/immutable';

import MenuItem from 'material-ui/MenuItem';
import saga from './saga';
import reducer from './reducer';
// import Webhook from './form/webhook';
import validate from './form/validate';
import { saveSlot, load as loadAccount } from './actions';

const CATEGORICAL = "Categorical";



export class EditSlot extends React.PureComponent {
  // eslint-disable-line react/prefer-stateless-function

  data = {
    [this.props.slot.name + "_type"]: 'Texto',
  };

  state = {
    valuesFieldDisabled: '',
    labelValues: '',
  };




  componentDidMount() {
    console.log("this.props.slot: ", this.props.slot);
    this.setState({ valuesFieldDisabled: true });
    this.setState({ labelValues: this.props.slot.values });
    // this.props.load(data);
    console.log("|| PRECARGA DE DATOS : ", this.data);

  }

  componentDidUpdate(prevProps) {
    console.log("componentDidUpdate");

  }

  handleSelectChange(e) {
    console.log("cambiando el valor del select ", this.props.slot.values);
    //this.setState({ labelValues: slot.values });
  }



  miFuncion(e, value) {
    if (value === "Categorical") {
      this.setState({ valuesFieldDisabled: false });


    } else {
      //inicializar el valor de values
      this.setState({ labelValues: '' });
      //this.setState({ valuesFieldDisabled: true });

    }

  }

  myUpdateSlot() {
    this.props.slot.values = this.state.labelValues;
  }

  render() {
    const {
      dispatch,
      values,
      OtroSlot_types,
      OtroSlot_name,
      handleSubmit,
      handleSelectChange,
      miFuncion,
      invalid,
      submitting,
      submitFailed,
      headNode,
      slot,
      load,
      onChange,
    } = this.props;

    const types = ['Texto', 'Booleano', 'Categorical']

    return (

      <form key="slotForm"
        onSubmit={handleSubmit(() => { this.myUpdateSlot(); dispatch(saveSlot({ slot })) })}
        >
        <Expansion
          key={slot.name}
          name={slot.name}
          help="Use slots to extract details from a request."
        >
          <React.Fragment>
            <FlexRow
              key={slot.name}
              style={{
                flexWrap: 'wrap',

                justifyContent: "space-between"
              }}
            >
              <Field
                name={slot.name + "_name"}
                component={TextField}
                fullWidth
                placeholder="Nombre del slot"
                label={slot.name}
                type="text"
                style={{ flexBasis: "48%" }}

              />

              <Field
                onChange={(e, value) => this.miFuncion(e, value)}
                // {this.handleSelectChange}

                name={slot.name + "_type"}
                component="select"
                fullWidth
                label="Texto"
                type="text"
                style={{ flexBasis: "48%" }}
              >
                <option value="">Selecciona un tipo...</option>

                {types.map(typesOption => (

                  <option value={typesOption} key={typesOption} selected>
                    {typesOption}
                  </option>
                ))}



              </Field>


              <Field
                name={slot.name + "_values"}
                component={TextField}
                disabled={this.state.valuesFieldDisabled}
                fullWidth
                label={this.state.labelValues}
                values={this.state.labelValues}
                type="text"
                onclick
                style={{ flexBasis: "48%" }}
              />

            </FlexRow>
          </React.Fragment>
          <React.Fragment>


            <Button
              name={slot.name + "Submit"}
              type="submit"
              variant="outlined"
              disabled={(invalid && submitFailed) || submitting}
              size="small"
            >
              GUARDAR
                </Button>
          </React.Fragment>
        </Expansion>

      </form>


    );

  }
}

EditSlot.propTypes = {
  dispatch: PropTypes.func.isRequired,
  slot: PropTypes.object,
  handleSubmit: PropTypes.func,
  load: PropTypes.func,
  handleSelectChange: PropTypes.func,
  miFuncion: PropTypes.func,
  dirty: PropTypes.bool,
  valid: PropTypes.bool,
  invalid: PropTypes.bool,
  submitting: PropTypes.bool,
  submitFailed: PropTypes.bool,
}

const mapStateToProps = (state) => {
  return {
    initialValues: {
      [slot.name + "_type"]: "Texto",
    }
  }
}


function mapDispatchToProps(dispatch) {
  return {
    dispatch,
    load: loadAccount,
  };
}

const withForm = reduxForm({
  form: 'slotForm',
  enableReinitialize: true
  });

const withConnect = connect(
  mapStateToProps,
  mapDispatchToProps,

);
const withReducer = injectReducer({ key: 'slotForm', reducer });
const withSaga = injectSaga({ key: 'slotForm', saga });


export default compose(
  withReducer,
  withSaga,
  withForm,
  withConnect
)(EditSlot);