React + Bootstrap + Redux value not working in form

I'm defining a form in React with Bootstrap and Redux with the following code:

import React from 'react';
import { FormGroup, ControlLabel, FormControl, HelpBlock, Button } from 'react-bootstrap';
import { coect } from 'react-redux';

import './actions';

const _c = component => coect(s => s)(component);

const FieldGroup = ({ id, label, help, ...props }) => {
  return (
    <FormGroup controlId={id}>
      <ControlLabel>{label}</ControlLabel>
      <FormControl {...props} />
      {help && <HelpBlock>{help}</HelpBlock>}
    </FormGroup>
  );
};

const LoginForm = _c(React.createClass({
  render() {
    return (
      <form>
        <FieldGroup
          id="loginText"
          type="text"
          label="Text"
          placeholder="Email"
          value={this.props.user.email ? this.props.user.email[0] : ''}
        />
        <FieldGroup
          id="loginPassword"
          label="Password"
          type="password"
        />
        <Button bsStyle="primary" bsSize="large">Login</Button>
      </form>
    );
  }
}));

This works, and the value appears in the "Username" field, but it's not editable. I tried changing value={this.props.user.email ? this.props.user.email[0] : ''} to defaultValue={this.props.user.email ? this.props.user.email[0] : ''} and that makes it editable, but the default value never appears. What am I doing wrong?