Reaccionar JSX: renderizar matrices anidadas de objetos

Tengo un componente con el siguiente render:

  render() {
    const { policy } = this.props;
    let deployment = policy.Deployment;
    let value = policy.value;
    let policyLegend = deployment.policyLegend;
    let policyObj = this.valueToPolicy(policyLegend, value);
    console.log(policy);
    console.log(deployment);
    console.log(value);
    console.log(policyLegend);
    console.log(policyObj);
    return(
      <div>
        <Form onSubmit={ (event) => this.handleSubmit(event, this.props) }>
          {
            policyLegend.map(function(policy) {
              <div>
                <h3 key={ policy.id }>{ policy.displayName }</h3>
                {
                  policy.values.map(value => {
                    return(
                      <Form.Field key={ value.name }>
                        <label>{ value.displayName }</label>
                        <Checkbox toggle />
                      </Form.Field>
                    );
                  })
                }
              </div>
            })
          }
          <Button name={ 'Submit' } type='submit'>Submit</Button>
          <Button onClick={ this.props.onCancel }>Cancel</Button>
        </Form>
      </div>
    )
  }
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

policyLegend es una matriz de objetos con una matriz de 'valores' dentro de cada objeto.

Cuando se compila mi aplicación, no recibo ningún error, pero no aparece nada en la página de mi componente. No estoy seguro de dónde me estoy equivocando y agradecería cualquier consejo, gracias.

Respuestas a la pregunta(2)

Su respuesta a la pregunta