title: looped return inside forOwn inside map inside render react Componennt
body: <p>I'm not sure if i'm doing well sending inside a lot of returns inside a forOwn (lodash), i try to indent the code accord  ( {{ ( etc, but I'dont see where is my error
  I'm using reactv16</p>
  
  <pre><code>  return (
      &lt;div className="formSection"&gt;
        &lt;button type="button" onClick={() =&gt; rowsChildrenValues.push({})}&gt;
          Add Member
        &lt;/button&gt;
        {submitFailed &amp;&amp; error &amp;&amp; &lt;span&gt;{error}&lt;/span&gt;}
        {rowsChildrenValues.map((rowValues, index) =&gt; {
  
          return (
            forOwn(Tables[tableCrud].fields[fieldParentKey].subfields, function (fields, fieldKey) {
  
              return (
                &lt;div className="formSection" key={fieldKey}&gt;
                  &lt;button
                    type="button"
                    title="D"
                    onClick={() =&gt; fields.remove(index)}
                  /&gt;
                  &lt;Field
                    name={fieldKey}
                    type="text"
                    component={FormField}
                    label={fieldKey}
                  /&gt;
                &lt;/div&gt;   
              );
            });   // Here is the error
          );
        })}
      &lt;/div&gt;
    );
  </code></pre>
  
  <p>I get this error:</p>
  
  <pre><code>./src/components/FormField.js
  Syntax error: Unexpected token, expected , (201:12)
  
    199 |               &lt;/div&gt;
    200 |             );
  &gt; 201 |           });
        |             ^
    202 |         );
    203 |       })}
    204 |     &lt;/div&gt;
  </code></pre>
  
  <p>Plese if someone can see more the error about the right way to indent this bucle and if sending return like this is correct</p>
  
  <p>UPDATE
  I've delete the semicolon and now I get:</p>
  
  <p>Invariant Violation: Objects are not valid as a React child (found: object with keys {type, phone}). If you meant to render a collection of children, use an array instead. in div</p>
  
  <pre><code> return (
      &lt;div className="formSection"&gt;  &lt;-- 176 line
  </code></pre>
  
  <p>2 try:
  I've modified my code:</p>
  
  <p>{rowsChildrenValues.map((rowValues, index) =>
        forOwn(Tables[tableCrud].fields[fieldParentKey].subfields, function (fields, fieldKey) {</p>
  
  <pre><code>    return (
        &lt;div className="formSection" key={fieldKey}&gt;
          &lt;button
            type="button"
            title="D"
            onClick={() =&gt; fields.remove(index)}
          /&gt;
          &lt;Field
            name={fieldKey}
            type="text"
            component={FormField}
            label={fieldKey}
          /&gt;
        &lt;/div&gt;
      );
    })
  </code></pre>
  
  <p>})}</p>
  
  <p>but I get:</p>
  
  <pre><code>./src/components/FormArrayField.js
  Syntax error: Unexpected token, expected , (49:6)
  
    47 |             );
    48 |           })
  &gt; 49 |       })}
       |       ^
    50 |     &lt;/div&gt;
    51 |   );
    52 | }
  </code></pre>